*, *::before, *::after {
box-sizing: border-box;
margin: 0;
padding: 0;
}
:root {
--np-primary: #0052cc;
--np-primary-dark: #003d99;
--np-primary-light: #e8f0fe;
--np-secondary: #ff6b00;
--np-secondary-dark: #e55b00;
--np-red: #e31837;
--np-red-light: #fff0f2;
--np-green: #00a651;
--np-orange: #ff9800;
--np-yellow: #ffc107;
--np-text: #27272a;
--np-text-secondary: #71717a;
--np-text-light: #a1a1aa;
--np-border: #e4e4e7;
--np-border-light: #f4f4f5;
--np-bg: #f5f5f5;
--np-bg-white: #ffffff;
--np-bg-blue: #ebf2ff;
--np-shadow: 0 2px 8px rgba(0,0,0,0.08);
--np-shadow-md: 0 4px 16px rgba(0,0,0,0.12);
--np-shadow-lg: 0 8px 32px rgba(0,0,0,0.16);
--np-radius: 8px;
--np-radius-sm: 4px;
--np-radius-lg: 12px;
--np-transition: all 0.25s ease;
--np-font: 'Segoe UI', 'Roboto', 'Helvetica Neue', Arial, 'Noto Sans', sans-serif;
--np-header-height: 64px;
--np-container: 1280px;
}
html {
font-size: 16px;
scroll-behavior: smooth;
}
body {
font-family: var(--np-font);
font-size: 14px;
line-height: 1.6;
color: var(--np-text);
background-color: var(--np-bg);
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
a {
color: var(--np-primary);
text-decoration: none;
transition: var(--np-transition);
}
a:hover {
color: var(--np-primary-dark);
}
img {
max-width: 100%;
height: auto;
display: block;
}
ul, ol {
list-style: none;
}
input, textarea, select, button {
font-family: var(--np-font);
font-size: 14px;
}
button {
cursor: pointer;
border: none;
background: none;
} .np-container {
max-width: var(--np-container);
margin: 0 auto;
padding: 0 16px;
}
.np-row {
display: flex;
flex-wrap: wrap;
margin: 0 -8px;
}
.np-col {
padding: 0 8px;
} h1, h2, h3, h4, h5, h6 {
font-weight: 600;
line-height: 1.3;
color: var(--np-text);
}
.section-title {
font-size: 20px;
font-weight: 700;
color: var(--np-text);
padding-bottom: 12px;
border-bottom: 3px solid var(--np-primary);
margin-bottom: 20px;
position: relative;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.section-title span {
color: var(--np-primary);
}
.section-header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 16px;
padding-bottom: 12px;
border-bottom: 2px solid var(--np-border);
}
.section-header .title {
font-size: 18px;
font-weight: 700;
color: var(--np-text);
display: flex;
align-items: center;
gap: 8px;
}
.section-header .title::before {
content: '';
width: 4px;
height: 20px;
background: var(--np-primary);
border-radius: 2px;
display: inline-block;
}
.section-header .view-all {
font-size: 13px;
color: var(--np-primary);
font-weight: 500;
white-space: nowrap;
}
.section-header .view-all:hover {
text-decoration: underline;
} .np-btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 6px;
padding: 10px 20px;
border-radius: var(--np-radius-sm);
font-size: 14px;
font-weight: 600;
transition: var(--np-transition);
cursor: pointer;
border: 2px solid transparent;
text-decoration: none;
white-space: nowrap;
line-height: 1.4;
}
.np-btn-primary {
background: var(--np-primary);
color: #fff;
border-color: var(--np-primary);
}
.np-btn-primary:hover {
background: var(--np-primary-dark);
border-color: var(--np-primary-dark);
color: #fff;
transform: translateY(-1px);
box-shadow: 0 4px 12px rgba(0,82,204,0.3);
}
.np-btn-secondary {
background: var(--np-secondary);
color: #fff;
border-color: var(--np-secondary);
}
.np-btn-secondary:hover {
background: var(--np-secondary-dark);
border-color: var(--np-secondary-dark);
color: #fff;
}
.np-btn-outline {
background: transparent;
color: var(--np-primary);
border-color: var(--np-primary);
}
.np-btn-outline:hover {
background: var(--np-primary);
color: #fff;
}
.np-btn-danger {
background: var(--np-red);
color: #fff;
border-color: var(--np-red);
}
.np-btn-danger:hover {
background: #c41430;
color: #fff;
}
.np-btn-lg {
padding: 14px 28px;
font-size: 16px;
}
.np-btn-sm {
padding: 6px 14px;
font-size: 12px;
}
.np-btn-block {
width: 100%;
display: flex;
} .np-badge {
display: inline-block;
padding: 2px 8px;
border-radius: 3px;
font-size: 11px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.np-badge-sale {
background: var(--np-red);
color: #fff;
}
.np-badge-new {
background: var(--np-green);
color: #fff;
}
.np-badge-hot {
background: var(--np-orange);
color: #fff;
}
.np-badge-soluongnhieu {
background: var(--np-primary);
color: #fff;
} .np-card {
background: var(--np-bg-white);
border-radius: var(--np-radius);
box-shadow: var(--np-shadow);
overflow: hidden;
transition: var(--np-transition);
}
.np-card:hover {
box-shadow: var(--np-shadow-md);
transform: translateY(-2px);
} .np-input {
width: 100%;
padding: 10px 14px;
border: 1.5px solid var(--np-border);
border-radius: var(--np-radius-sm);
font-size: 14px;
color: var(--np-text);
background: #fff;
transition: var(--np-transition);
outline: none;
}
.np-input:focus {
border-color: var(--np-primary);
box-shadow: 0 0 0 3px rgba(0,82,204,0.1);
}
.np-input::placeholder {
color: var(--np-text-light);
} .np-stars {
display: inline-flex;
gap: 2px;
color: var(--np-yellow);
font-size: 14px;
}
.np-stars .star { color: #e4e4e7; }
.np-stars .star.filled { color: var(--np-yellow); } .np-trust-bar {
background: var(--np-primary);
color: #fff;
padding: 8px 0;
}
.np-trust-bar .items {
display: flex;
align-items: center;
justify-content: space-around;
flex-wrap: wrap;
gap: 8px;
}
.np-trust-bar .item {
display: flex;
align-items: center;
gap: 8px;
font-size: 12px;
font-weight: 500;
padding: 4px 0;
}
.np-trust-bar .item svg,
.np-trust-bar .item i {
font-size: 18px;
opacity: 0.9;
} .np-countdown {
display: inline-flex;
align-items: center;
gap: 4px;
}
.np-countdown .unit {
background: var(--np-red);
color: #fff;
padding: 2px 8px;
border-radius: 4px;
font-size: 18px;
font-weight: 700;
min-width: 36px;
text-align: center;
font-variant-numeric: tabular-nums;
}
.np-countdown .sep {
color: var(--np-red);
font-weight: 700;
font-size: 18px;
} .np-pagination {
display: flex;
align-items: center;
justify-content: center;
gap: 6px;
padding: 24px 0;
}
.np-pagination a,
.np-pagination span {
display: inline-flex;
align-items: center;
justify-content: center;
width: 36px;
height: 36px;
border-radius: var(--np-radius-sm);
font-size: 14px;
font-weight: 500;
border: 1.5px solid var(--np-border);
color: var(--np-text);
transition: var(--np-transition);
}
.np-pagination a:hover {
background: var(--np-primary);
border-color: var(--np-primary);
color: #fff;
}
.np-pagination .current {
background: var(--np-primary);
border-color: var(--np-primary);
color: #fff;
} .np-breadcrumb {
padding: 10px 0;
font-size: 13px;
color: var(--np-text-secondary);
}
.np-breadcrumb a {
color: var(--np-text-secondary);
}
.np-breadcrumb a:hover {
color: var(--np-primary);
}
.np-breadcrumb .sep {
margin: 0 6px;
opacity: 0.5;
}
.np-breadcrumb .current {
color: var(--np-text);
font-weight: 500;
} .np-section {
padding: 24px 0;
}
.np-section-sm {
padding: 16px 0;
}
.np-section-lg {
padding: 40px 0;
} .np-sidebar .widget {
background: #fff;
border-radius: var(--np-radius);
padding: 16px;
margin-bottom: 16px;
box-shadow: var(--np-shadow);
}
.np-sidebar .widget-title {
font-size: 15px;
font-weight: 700;
color: var(--np-text);
margin-bottom: 12px;
padding-bottom: 10px;
border-bottom: 2px solid var(--np-primary);
text-transform: uppercase;
} .np-spinner {
width: 24px;
height: 24px;
border: 3px solid var(--np-border);
border-top-color: var(--np-primary);
border-radius: 50%;
animation: np-spin 0.8s linear infinite;
}
@keyframes np-spin {
to { transform: rotate(360deg); }
} .admin-bar .np-header-sticky {
top: 32px !important;
} #np-scroll-top {
position: fixed;
bottom: 80px;
right: 20px;
width: 44px;
height: 44px;
background: var(--np-primary);
color: #fff;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
opacity: 0;
visibility: hidden;
transition: var(--np-transition);
z-index: 999;
box-shadow: var(--np-shadow-md);
border: none;
font-size: 18px;
}
#np-scroll-top.visible {
opacity: 1;
visibility: visible;
}
#np-scroll-top:hover {
background: var(--np-primary-dark);
transform: translateY(-3px);
} .np-float-contact {
position: fixed;
bottom: 20px;
right: 20px;
display: flex;
flex-direction: column;
gap: 8px;
z-index: 998;
}
.np-float-btn {
width: 50px;
height: 50px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 22px;
box-shadow: 0 4px 12px rgba(0,0,0,0.2);
transition: var(--np-transition);
text-decoration: none;
animation: np-pulse 2s ease-in-out infinite;
}
.np-float-btn:hover {
transform: scale(1.1);
}
.np-float-btn.phone {
background: var(--np-green);
color: #fff;
}
.np-float-btn.zalo {
background: #0068ff;
color: #fff;
}
.np-float-btn.fb {
background: #1877f2;
color: #fff;
}
@keyframes np-pulse {
0%, 100% { box-shadow: 0 4px 12px rgba(0,0,0,0.2); }
50% { box-shadow: 0 4px 20px rgba(0,82,204,0.4); }
} .np-hide-mobile { display: block; }
.np-show-mobile { display: none; }
@media (max-width: 768px) {
.np-hide-mobile { display: none; }
.np-show-mobile { display: block; }
}
.np-text-center { text-align: center; }
.np-text-left { text-align: left; }
.np-text-right { text-align: right; }
.np-mt-1 { margin-top: 8px; }
.np-mt-2 { margin-top: 16px; }
.np-mt-3 { margin-top: 24px; }
.np-mb-1 { margin-bottom: 8px; }
.np-mb-2 { margin-bottom: 16px; }
.np-mb-3 { margin-bottom: 24px; }.np-topbar {
background: #1a1a2e;
color: rgba(255,255,255,0.8);
font-size: 11px;
padding: 4px 0;
}
.np-topbar__inner { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:4px; }
.np-topbar__left, .np-topbar__right { display:flex; align-items:center; gap:12px; }
.np-topbar__right a { color:rgba(255,255,255,0.8); display:flex; align-items:center; gap:4px; }
.np-topbar__right a:hover { color:#fff; }
.np-topbar .sep { opacity:0.3; } .np-header { background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.08); position:relative; z-index:100; }
.np-header-sticky { position:sticky; top:0; z-index:1000; }
.np-header__inner { display:flex; align-items:center; gap:14px; padding:8px 0; } .np-header__logo { flex-shrink:0; }
.np-logo-link { text-decoration:none; display:inline-flex; align-items:center; }
.np-logo-text { display:flex; align-items:center; gap:10px; }
.np-logo-icon { flex-shrink:0; line-height:0; }
.np-logo-icon svg { display:block; border-radius:10px; box-shadow:0 2px 10px rgba(0,82,204,.3); transition:transform .3s ease; }
.np-logo-link:hover .np-logo-icon svg { transform:scale(1.05); }
.np-logo-name { display:flex; flex-direction:column; }
.np-logo-name .logo-main { font-size:20px; font-weight:800; color:var(--np-primary); line-height:1.1; letter-spacing:-0.3px; }
.np-logo-name .logo-sub { font-size:10px; color:var(--np-text-secondary); font-weight:500; letter-spacing:0.8px; text-transform:uppercase; margin-top:1px; }
.np-header__logo img { max-height:52px; width:auto; } .np-header__search { flex:1; max-width:640px; position:relative; }
.np-search-form { width:100%; }
.np-search-inner { display:flex; border:2px solid var(--np-primary); border-radius:6px; overflow:hidden; }
.np-search-cat { border:none; border-right:1px solid var(--np-border); padding:0 10px; font-size:12px; color:var(--np-text); background:#f8f9fa; min-width:90px; cursor:pointer; outline:none; }
.np-search-input { flex:1; border:none; padding:8px 12px; font-size:13px; color:var(--np-text); outline:none; background:#fff; }
.np-search-btn { background:var(--np-primary); color:#fff; padding:0 20px; border:none; cursor:pointer; font-size:16px; transition:var(--np-transition); }
.np-search-btn:hover { background:var(--np-primary-dark); }
.np-search-suggestions { position:absolute; top:100%; left:0; right:0; background:#fff; border:1px solid var(--np-border); border-top:none; border-radius:0 0 6px 6px; box-shadow:var(--np-shadow-md); z-index:200; display:none; max-height:380px; overflow-y:auto; }
.np-search-suggestions.show { display:block; }
.np-suggestion-item { display:flex; align-items:center; gap:10px; padding:10px 14px; cursor:pointer; transition:var(--np-transition); }
.np-suggestion-item:hover { background:var(--np-bg); }
.np-suggestion-item img { width:40px; height:40px; object-fit:cover; border-radius:4px; }
.np-suggestion-item .s-name { font-size:13px; color:var(--np-text); font-weight:500; }
.np-suggestion-item .s-price { font-size:12px; color:var(--np-red); font-weight:600; } .np-header__meta { display:flex; align-items:center; gap:8px; }
.np-header-meta-item { display:flex; align-items:center; gap:7px; padding:5px 10px; border-radius:var(--np-radius-sm); cursor:pointer; text-decoration:none; transition:var(--np-transition); }
.np-header-meta-item:hover { background:var(--np-bg); }
.meta-icon { position:relative; font-size:20px; color:var(--np-primary); }
.meta-text { display:flex; flex-direction:column; }
.meta-text .label { font-size:10px; color:var(--np-text-secondary); }
.meta-text .value { font-size:12px; font-weight:700; color:var(--np-text); }
.np-cart-icon-wrap { position:relative; }
.np-cart-count { position:absolute; top:-8px; right:-8px; background:var(--np-red); color:#fff; font-size:10px; font-weight:700; width:18px; height:18px; border-radius:50%; display:flex; align-items:center; justify-content:center; }
.np-hotline .meta-text .value { color:var(--np-red); } .np-menu-toggle { display:none; flex-direction:column; gap:5px; padding:6px; background:none; border:none; cursor:pointer; margin-left:auto; }
.np-menu-toggle span { display:block; width:24px; height:2px; background:var(--np-text); border-radius:2px; transition:var(--np-transition); } .np-nav { background:var(--np-primary); }
.np-nav__inner { display:flex; align-items:stretch; } .np-nav__allcats { position:relative; }
.np-allcats-btn { display:flex; align-items:center; gap:7px; padding:9px 14px; background:rgba(0,0,0,.15); color:#fff; font-size:13px; font-weight:600; cursor:pointer; border:none; white-space:nowrap; height:100%; transition:var(--np-transition); }
.np-allcats-btn:hover { background:rgba(0,0,0,.25); }
.np-allcats-btn .fa-chevron-down { font-size:11px; transition:var(--np-transition); }
.np-nav__allcats:hover .fa-chevron-down { transform:rotate(180deg); } .np-mega-menu { position:absolute; top:100%; left:0; width:240px; background:#fff; box-shadow:var(--np-shadow-lg); z-index:500; display:none; border-radius:0 0 var(--np-radius) var(--np-radius); }
.np-nav__allcats:hover .np-mega-menu { display:block; }
.np-mega-menu__list { padding:8px 0; }
.np-mega-menu__item { position:relative; }
.np-mega-menu__item > a { display:flex; align-items:center; gap:10px; padding:10px 16px; font-size:13px; color:var(--np-text); transition:var(--np-transition); }
.np-mega-menu__item > a:hover { background:var(--np-bg); color:var(--np-primary); }
.np-mega-menu__item > a i:first-child { width:18px; color:var(--np-primary); font-size:15px; }
.np-mega-menu__item .arrow { margin-left:auto; font-size:10px; color:var(--np-text-secondary); }
.np-mega-menu__sub { position:absolute; left:100%; top:0; width:220px; background:#fff; box-shadow:var(--np-shadow-md); display:none; border-radius:0 var(--np-radius) var(--np-radius) 0; z-index:501; padding:8px 0; }
.np-mega-menu__item:hover .np-mega-menu__sub { display:block; }
.np-mega-menu__sub li a { display:block; padding:8px 16px; font-size:13px; color:var(--np-text); transition:var(--np-transition); }
.np-mega-menu__sub li a:hover { background:var(--np-bg); color:var(--np-primary); } .np-nav__menu { flex:1; }
.np-menu-list { display:flex; align-items:stretch; }
.np-menu-list > li { position:relative; }
.np-menu-list > li > a { display:flex; align-items:center; padding:9px 12px; color:rgba(255,255,255,.9); font-size:13px; font-weight:600; white-space:nowrap; transition:var(--np-transition); height:100%; text-decoration:none; }
.np-menu-list > li > a:hover,
.np-menu-list > li.current-menu-item > a,
.np-menu-list > li.current-menu-ancestor > a { color:#fff; background:rgba(0,0,0,.15); }
.np-menu-list > li .sub-menu { position:absolute; top:100%; left:0; min-width:200px; background:#fff; box-shadow:var(--np-shadow-md); border-radius:0 0 var(--np-radius) var(--np-radius); z-index:400; display:none; padding:8px 0; }
.np-menu-list > li:hover .sub-menu { display:block; }
.np-menu-list .sub-menu li a { display:block; padding:8px 16px; font-size:13px; color:var(--np-text); transition:var(--np-transition); text-decoration:none; }
.np-menu-list .sub-menu li a:hover { background:var(--np-bg); color:var(--np-primary); padding-left:20px; } .np-nav__promo { display:flex; align-items:center; gap:4px; padding:0 8px; }
.np-promo-link { display:flex; align-items:center; gap:4px; padding:5px 10px; border-radius:20px; font-size:11px; font-weight:700; color:#fff; background:rgba(255,255,255,.15); text-decoration:none; transition:var(--np-transition); }
.np-promo-link:hover { background:rgba(255,255,255,.3); color:#fff; }
.np-promo-link.new { background:var(--np-secondary); }
.np-promo-link i { color:#ffd700; } .np-mobile-overlay { position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:1099; display:none; }
.np-mobile-overlay.open { display:block; }
.np-mobile-menu { position:fixed; top:0; left:-100%; width:80%; max-width:320px; height:100vh; background:#fff; z-index:1100; overflow-y:auto; transition:left .3s ease; box-shadow:var(--np-shadow-lg); }
.np-mobile-menu.open { left:0; }
.np-mobile-menu__header { display:flex; justify-content:space-between; align-items:center; padding:16px; background:var(--np-primary); color:#fff; }
.np-mobile-menu__header span { font-size:16px; font-weight:700; }
#np-mobile-close { background:none; border:none; color:#fff; font-size:20px; cursor:pointer; padding:4px 8px; }
.np-mobile-menu__body { padding:8px 0; }
.np-mobile-menu-list li a { display:block; padding:12px 20px; font-size:14px; color:var(--np-text); border-bottom:1px solid var(--np-border-light); text-decoration:none; transition:var(--np-transition); }
.np-mobile-menu-list li a:hover { background:var(--np-bg); color:var(--np-primary); }
.np-mobile-menu-list .sub-menu { background:var(--np-bg); }
.np-mobile-menu-list .sub-menu li a { padding-left:36px; font-size:13px; } .np-hero-section { background:#fff; padding:16px 0; }
.np-hero-layout { display:grid; grid-template-columns:220px 1fr 160px; gap:12px; align-items:stretch; } .np-hero-cats { background:#fff; border:1px solid var(--np-border); border-radius:var(--np-radius); overflow:visible; }
.np-cat-menu { padding:4px 0; }
.np-cat-menu__item { position:relative; }
.np-cat-menu__item > a { display:flex; align-items:center; gap:8px; padding:9px 14px; font-size:13px; color:var(--np-text); text-decoration:none; transition:var(--np-transition); border-left:3px solid transparent; }
.np-cat-menu__item > a:hover { background:var(--np-bg); color:var(--np-primary); border-left-color:var(--np-primary); }
.np-cat-menu__item > a i:first-child { width:16px; text-align:center; color:var(--np-primary); font-size:14px; }
.np-cat-menu__item .arrow { margin-left:auto; font-size:10px; color:var(--np-text-secondary); }
.np-cat-sub { position:absolute; left:100%; top:0; width:220px; background:#fff; box-shadow:var(--np-shadow-md); z-index:300; display:none; border-radius:0 var(--np-radius) var(--np-radius) 0; pointer-events:none; }
.np-cat-menu__item:hover .np-cat-sub { display:block; pointer-events:all; }
.np-cat-sub ul { padding:8px 0; }
.np-cat-sub li a { display:block; padding:8px 16px; font-size:13px; color:var(--np-text); text-decoration:none; transition:var(--np-transition); }
.np-cat-sub li a:hover { background:var(--np-bg); color:var(--np-primary); } .np-hero-slider { overflow:hidden; border-radius:var(--np-radius); min-height:440px; position:relative; }
.np-banner-swiper { border-radius:var(--np-radius); min-height:inherit; position:relative; width:100%; }
.np-banner-swiper .swiper-wrapper { min-height:inherit; }
.np-banner-swiper .swiper-slide { min-height:inherit; width:100% !important; }
.np-banner-slide { display:flex; align-items:center; justify-content:space-between; padding:32px 40px; min-height:inherit; border-radius:var(--np-radius); overflow:hidden; position:relative; width:100%; }
.np-banner-content { flex:1; }
.np-banner-content h2 { font-size:26px; font-weight:800; color:var(--np-text); margin-bottom:8px; line-height:1.2; }
.np-banner-content p { font-size:15px; color:var(--np-text-secondary); margin-bottom:20px; }
.np-banner-image { flex-shrink:0; width:280px; }
.np-banner-image img { width:100%; height:260px; object-fit:contain; }
.np-banner-icon-bg { position:absolute; right:40px; top:50%; transform:translateY(-50%); font-size:200px; opacity:.08; pointer-events:none; z-index:1; }
.np-slider-prev,
.np-slider-next { position:absolute; top:50%; transform:translateY(-50%); width:36px; height:36px; background:rgba(255,255,255,.9); border-radius:50%; box-shadow:var(--np-shadow); z-index:20; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:var(--np-transition); font-size:14px; color:var(--np-text); }
.np-slider-prev:hover,
.np-slider-next:hover { background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.2); }
.np-slider-prev { left:12px; }
.np-slider-next { right:12px; }
.np-banner-swiper .swiper-pagination-bullet-active { background:var(--np-primary); } .np-hero-side { display:flex; flex-direction:column; gap:8px; }
.np-side-banner { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; padding:20px 12px; border-radius:var(--np-radius); text-align:center; text-decoration:none; color:#fff; flex:1; min-height:106px; transition:var(--np-transition); }
.np-side-banner:hover { opacity:.9; transform:translateY(-2px); color:#fff; }
.np-side-banner i { font-size:28px; opacity:.9; }
.np-side-banner span { font-size:12px; font-weight:700; line-height:1.4; } .np-info-badges { display:flex; align-items:center; justify-content:space-around; flex-wrap:wrap; gap:16px; background:#fff; border-radius:var(--np-radius); padding:16px 24px; box-shadow:var(--np-shadow); }
.np-info-badge { display:flex; align-items:center; gap:12px; }
.badge-icon { font-size:28px; }
.badge-text { display:flex; flex-direction:column; }
.badge-text strong { font-size:13px; font-weight:700; color:var(--np-text); }
.badge-text span { font-size:12px; color:var(--np-text-secondary); } .np-flash-sale-section { background:linear-gradient(135deg,#fff0f2 0%,#fff 100%); overflow:hidden; }
.np-flash-sale-header { display:flex; align-items:center; gap:16px; margin-bottom:16px; padding:12px 16px; background:#fff; border-radius:var(--np-radius); box-shadow:var(--np-shadow); flex-wrap:wrap; }
.flash-title { display:flex; align-items:center; gap:8px; }
.flash-title i { font-size:22px; color:var(--np-red); animation:np-flash 1s ease-in-out infinite; }
.flash-title span { font-size:20px; font-weight:800; color:var(--np-red); letter-spacing:1px; }
@keyframes np-flash { 0%,100% { opacity:1; } 50% { opacity:.5; } }
.flash-countdown { display:flex; align-items:center; gap:8px; }
.countdown-label { font-size:13px; color:var(--np-text-secondary); }
.np-countdown .unit { background:var(--np-red); color:#fff; padding:4px 10px; border-radius:4px; font-size:20px; font-weight:800; min-width:44px; text-align:center; font-variant-numeric:tabular-nums; }
.np-countdown .sep { color:var(--np-red); font-weight:800; font-size:22px; }
.view-all-flash { margin-left:auto; font-size:13px; color:var(--np-primary); font-weight:500; text-decoration:none; white-space:nowrap; display:flex; align-items:center; gap:4px; }
.view-all-flash:hover { color:var(--np-primary-dark); }
.np-flash-sale-section .np-container { overflow:hidden; }
.np-sale-swiper { overflow:hidden !important; position:relative; max-width:100%; }
.np-sale-swiper .swiper-wrapper { padding-bottom:4px; }
.np-sale-swiper .swiper-slide { width:220px; flex-shrink:0; max-width:100%; }
.swiper-btn-sm { width:32px; height:32px; }
.swiper-btn-sm::after { font-size:12px; font-weight:900; } .np-product-card { background:#fff; border-radius:var(--np-radius); box-shadow:0 1px 4px rgba(0,0,0,.06); overflow:hidden; transition:var(--np-transition); display:flex; flex-direction:column; height:100%; }
.np-product-card:hover { box-shadow:var(--np-shadow-md); transform:translateY(-3px); }
.np-product-card__image { position:relative; display:block; overflow:hidden; aspect-ratio:1; background:var(--np-bg); }
.np-product-card__image img { width:100%; height:100%; object-fit:cover; transition:transform .4s ease; }
.np-product-card:hover .np-product-card__image img { transform:scale(1.05); }
.np-product-card__badge { position:absolute; top:8px; left:8px; padding:3px 8px; border-radius:3px; font-size:11px; font-weight:700; z-index:2; }
.badge-sale { background:var(--np-red); color:#fff; }
.badge-outstock { background:#999; color:#fff; top:auto; left:0; right:0; bottom:0; text-align:center; border-radius:0; padding:4px; font-size:12px; }
.np-product-card__actions { position:absolute; bottom:8px; right:8px; display:flex; flex-direction:column; gap:6px; opacity:0; transform:translateX(10px); transition:var(--np-transition); z-index:3; }
.np-product-card:hover .np-product-card__actions { opacity:1; transform:translateX(0); }
.np-quick-add, .np-quick-view { width:34px; height:34px; border-radius:50%; background:#fff; border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; box-shadow:var(--np-shadow); color:var(--np-text); font-size:14px; transition:var(--np-transition); text-decoration:none; }
.np-quick-add:hover { background:var(--np-primary); color:#fff; }
.np-quick-view:hover { background:var(--np-primary); color:#fff; }
.np-product-card__body { padding:10px 12px; flex:1; display:flex; flex-direction:column; gap:6px; }
.np-product-card__name { font-size:13px; font-weight:500; color:var(--np-text); line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; text-decoration:none; flex:1; }
.np-product-card__name:hover { color:var(--np-primary); }
.np-product-card__rating { display:flex; align-items:center; gap:4px; }
.np-star-rating { display:inline-flex; gap:1px; }
.np-star-rating .fa-star, .np-star-rating .fa-star-half-alt { color:var(--np-yellow); font-size:12px; }
.np-star-rating .fa-star[class*="far"] { color:var(--np-border); }
.np-product-card__rating .count { font-size:11px; color:var(--np-text-secondary); }
.np-product-card__price { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.np-product-card__price .sale-price { font-size:15px; font-weight:700; color:var(--np-red); }
.np-product-card__price .regular-price { font-size:12px; color:var(--np-text-secondary); text-decoration:line-through; }
.np-btn-add-cart { width:100%; padding:7px 0; background:var(--np-primary); color:#fff; border:none; border-radius:var(--np-radius-sm); font-size:12px; font-weight:600; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:6px; transition:var(--np-transition); }
.np-btn-add-cart:hover { background:var(--np-primary-dark); }
.np-btn-contact { width:100%; padding:7px 0; background:var(--np-secondary); color:#fff; border-radius:var(--np-radius-sm); font-size:12px; font-weight:600; display:flex; align-items:center; justify-content:center; gap:6px; text-decoration:none; transition:var(--np-transition); }
.np-btn-contact:hover { background:var(--np-secondary-dark); color:#fff; } .np-product-grid-5 { display:grid; grid-template-columns:repeat(5,1fr); gap:12px; }
.np-shop-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:12px; }
.np-shop-grid.view-list { grid-template-columns:1fr; }
.np-shop-grid.view-list .np-product-card { flex-direction:row; }
.np-shop-grid.view-list .np-product-card__image { width:200px; flex-shrink:0; aspect-ratio:auto; height:160px; } .np-cat-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(130px, 1fr)); gap:12px; }
.np-cat-card { display:flex; flex-direction:column; align-items:center; text-align:center; padding:16px 8px; background:#fff; border-radius:var(--np-radius); box-shadow:0 1px 4px rgba(0,0,0,.06); text-decoration:none; transition:var(--np-transition); }
.np-cat-card:hover { box-shadow:var(--np-shadow-md); transform:translateY(-3px); }
.np-cat-card__img { width:72px; height:72px; border-radius:var(--np-radius); display:flex; align-items:center; justify-content:center; margin-bottom:8px; overflow:hidden; }
.np-cat-card__img img { width:100%; height:100%; object-fit:cover; }
.np-cat-card__img i { font-size:32px; }
.np-cat-card__name { font-size:12px; font-weight:600; color:var(--np-text); line-height:1.3; }
.np-cat-card__count { font-size:11px; color:var(--np-text-secondary); margin-top:2px; } .np-promo-banners { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.np-promo-banner { display:flex; align-items:center; justify-content:space-between; padding:20px 24px; border-radius:var(--np-radius); text-decoration:none; color:#fff; transition:var(--np-transition); }
.np-promo-banner:hover { opacity:.95; transform:translateY(-2px); box-shadow:var(--np-shadow-md); color:#fff; }
.promo-content { display:flex; align-items:center; gap:14px; }
.promo-icon { font-size:36px; opacity:.9; }
.promo-text { display:flex; flex-direction:column; }
.promo-text strong { font-size:15px; font-weight:700; }
.promo-text span { font-size:12px; opacity:.85; }
.promo-cta { font-size:13px; font-weight:700; background:rgba(255,255,255,.2); padding:6px 14px; border-radius:20px; white-space:nowrap; } .np-why-us { background:var(--np-primary-light); }
.np-why-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:24px; }
.np-why-item { background:#fff; padding:24px; border-radius:var(--np-radius); text-align:center; box-shadow:var(--np-shadow); transition:var(--np-transition); }
.np-why-item:hover { box-shadow:var(--np-shadow-md); transform:translateY(-2px); }
.why-icon { font-size:40px; color:var(--np-primary); margin-bottom:12px; }
.np-why-item h3 { font-size:15px; font-weight:700; color:var(--np-text); margin-bottom:8px; }
.np-why-item p { font-size:13px; color:var(--np-text-secondary); line-height:1.6; } .np-reviews-section { background:#fff; }
.np-review-stats { display:flex; align-items:center; gap:40px; margin-bottom:24px; padding:20px; background:var(--np-bg); border-radius:var(--np-radius); }
.np-overall-rating { text-align:center; flex-shrink:0; }
.big-score { font-size:56px; font-weight:800; color:var(--np-text); line-height:1; }
.stars-big .np-star-rating .fa-star, .stars-big .np-star-rating .fa-star-half-alt { font-size:22px; color:var(--np-yellow); }
.np-overall-rating p { font-size:13px; color:var(--np-text-secondary); margin-top:4px; }
.np-rating-bars { flex:1; display:flex; flex-direction:column; gap:6px; }
.rating-bar-item { display:flex; align-items:center; gap:10px; }
.rating-bar-item .label { font-size:12px; color:var(--np-text-secondary); width:42px; flex-shrink:0; }
.rating-bar-item .bar { flex:1; height:8px; background:var(--np-border); border-radius:4px; overflow:hidden; }
.rating-bar-item .bar .fill { height:100%; background:var(--np-yellow); border-radius:4px; transition:width .6s ease; }
.rating-bar-item .pct { font-size:12px; color:var(--np-text-secondary); width:32px; text-align:right; flex-shrink:0; }
.np-review-card { background:#fff; border:1px solid var(--np-border); border-radius:var(--np-radius); padding:20px; height:100%; box-shadow:0 1px 4px rgba(0,0,0,.04); transition:var(--np-transition); }
.np-review-card:hover { box-shadow:var(--np-shadow); }
.review-top { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.reviewer-avatar { width:40px; height:40px; border-radius:50%; background:var(--np-primary); color:#fff; display:flex; align-items:center; justify-content:center; font-size:16px; font-weight:700; flex-shrink:0; }
.reviewer-info { flex:1; }
.reviewer-info strong { display:block; font-size:14px; color:var(--np-text); }
.reviewer-info .role { font-size:12px; color:var(--np-text-secondary); }
.review-stars { margin-left:auto; }
.review-text { font-size:13px; color:var(--np-text-secondary); line-height:1.6; font-style:italic; margin-bottom:12px; }
.review-meta { display:flex; gap:16px; font-size:12px; color:var(--np-text-secondary); }
.review-meta .product { color:var(--np-primary); }
.np-reviews-swiper { overflow:hidden; }
.np-reviews-pagination { margin-top:16px !important; }
.np-reviews-pagination .swiper-pagination-bullet-active { background:var(--np-primary); } .np-stats-section { background:linear-gradient(135deg, var(--np-primary) 0%, var(--np-primary-dark) 100%); color:#fff; }
.np-stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
.np-stat-item { text-align:center; padding:24px; }
.stat-number { font-size:48px; font-weight:800; line-height:1; margin-bottom:8px; }
.stat-number::after { content:'+'; font-size:32px; }
.stat-label { font-size:14px; opacity:.85; } .np-news-layout { display:grid; grid-template-columns:1fr 360px; gap:20px; }
.np-news-featured { display:flex; flex-direction:column; gap:16px; }
.news-thumb { display:block; overflow:hidden; border-radius:var(--np-radius); position:relative; }
.news-thumb img { width:100%; height:280px; object-fit:cover; transition:transform .4s ease; }
.news-thumb:hover img { transform:scale(1.03); }
.news-cat-badge { position:absolute; top:12px; left:12px; background:var(--np-primary); color:#fff; padding:3px 10px; border-radius:20px; font-size:12px; font-weight:600; }
.news-content .news-meta { display:flex; gap:16px; font-size:12px; color:var(--np-text-secondary); margin-bottom:8px; }
.news-content h3 { font-size:22px; font-weight:700; margin-bottom:10px; line-height:1.3; }
.news-content h3 a { color:var(--np-text); text-decoration:none; }
.news-content h3 a:hover { color:var(--np-primary); }
.news-content p { font-size:14px; color:var(--np-text-secondary); line-height:1.6; margin-bottom:16px; }
.news-content .blog-feat-footer { display:flex; align-items:center; gap:16px; }
.read-time { font-size:12px; color:var(--np-text-secondary); }
.no-thumb-lg { height:280px; background:var(--np-bg); border-radius:var(--np-radius); display:flex; align-items:center; justify-content:center; }
.no-thumb-lg i { font-size:60px; color:var(--np-border); }
.np-news-list { display:flex; flex-direction:column; gap:16px; }
.np-news-small { display:flex; gap:12px; background:#fff; border-radius:var(--np-radius); overflow:hidden; box-shadow:0 1px 4px rgba(0,0,0,.06); transition:var(--np-transition); }
.np-news-small:hover { box-shadow:var(--np-shadow); }
.news-small-thumb { flex-shrink:0; width:100px; overflow:hidden; }
.news-small-thumb img { width:100%; height:80px; object-fit:cover; transition:transform .3s ease; display:block; }
.np-news-small:hover .news-small-thumb img { transform:scale(1.05); }
.no-thumb-sm { width:100px; height:80px; background:var(--np-bg); display:flex; align-items:center; justify-content:center; }
.no-thumb-sm i { font-size:24px; color:var(--np-border); }
.news-small-content { padding:10px 12px; flex:1; display:flex; flex-direction:column; justify-content:center; gap:4px; }
.cat-label { font-size:11px; background:var(--np-primary-light); color:var(--np-primary); padding:2px 8px; border-radius:3px; font-weight:600; display:inline-block; width:fit-content; }
.news-small-content h4 { font-size:13px; font-weight:600; line-height:1.4; margin:0; }
.news-small-content h4 a { color:var(--np-text); text-decoration:none; }
.news-small-content h4 a:hover { color:var(--np-primary); }
.news-small-content .date { font-size:11px; color:var(--np-text-secondary); } .np-cta-section { background:linear-gradient(135deg, #0052cc 0%, #1565c0 100%); }
.np-cta-box { display:flex; align-items:center; justify-content:space-between; gap:32px; padding:40px; border-radius:var(--np-radius-lg); }
.np-cta-content h2 { font-size:28px; font-weight:800; color:#fff; margin-bottom:8px; }
.np-cta-content p { font-size:15px; color:rgba(255,255,255,.85); margin-bottom:16px; }
.np-cta-highlights { display:flex; flex-wrap:wrap; gap:16px; }
.np-cta-highlights span { font-size:13px; color:rgba(255,255,255,.85); display:flex; align-items:center; gap:6px; }
.np-cta-highlights .fa-check-circle { color:#ffd700; }
.np-cta-actions { display:flex; flex-direction:column; gap:10px; flex-shrink:0; } .np-partners-section { background:#fff; border-top:1px solid var(--np-border); }
.np-partners-title { text-align:center; font-size:15px; font-weight:700; color:var(--np-text-secondary); text-transform:uppercase; letter-spacing:1px; margin-bottom:16px; }
.np-partners-list { display:flex; align-items:center; justify-content:center; gap:24px; flex-wrap:wrap; }
.partner-item { padding:10px 24px; border:1px solid var(--np-border); border-radius:6px; }
.partner-item span { font-size:16px; font-weight:700; color:var(--np-text-secondary); } .np-shop-page { padding:16px 0 40px; }
.np-cat-header { display:flex; align-items:center; gap:20px; background:#fff; padding:20px; border-radius:var(--np-radius); margin-bottom:16px; box-shadow:var(--np-shadow); }
.np-cat-header__img { width:80px; height:80px; border-radius:var(--np-radius); overflow:hidden; flex-shrink:0; }
.np-cat-header__img img { width:100%; height:100%; object-fit:cover; }
.np-cat-header__info h1 { font-size:22px; font-weight:700; margin-bottom:4px; }
.np-cat-header__info p { font-size:13px; color:var(--np-text-secondary); }
.np-cat-header__info .product-count { font-size:12px; background:var(--np-primary-light); color:var(--np-primary); padding:3px 10px; border-radius:20px; font-weight:600; display:inline-block; margin-top:6px; }
.np-shop-header { padding:12px 0; }
.np-shop-header h1 { font-size:22px; font-weight:700; display:flex; align-items:center; gap:8px; }
.np-subcats { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:16px; }
.np-subcat-item { display:flex; align-items:center; gap:8px; padding:8px 14px; background:#fff; border:1px solid var(--np-border); border-radius:var(--np-radius-sm); text-decoration:none; font-size:13px; color:var(--np-text); transition:var(--np-transition); }
.np-subcat-item:hover { border-color:var(--np-primary); color:var(--np-primary); background:var(--np-primary-light); }
.np-subcat-item img { width:24px; height:24px; object-fit:cover; border-radius:3px; }
.np-subcat-item i { color:var(--np-primary); }
.np-shop-main { display:grid; grid-template-columns:220px 1fr; gap:16px; }
.np-shop-filter-sidebar .filter-sidebar-inner { background:#fff; border-radius:var(--np-radius); box-shadow:var(--np-shadow); padding:16px; position:sticky; top:80px; }
.filter-title { font-size:13px; font-weight:700; color:var(--np-text); margin-bottom:10px; text-transform:uppercase; letter-spacing:.5px; display:flex; align-items:center; justify-content:space-between; }
.np-filter-section { margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid var(--np-border-light); }
.np-filter-section:last-child { border-bottom:none; margin-bottom:0; padding-bottom:0; }
.price-filter-options, .sort-options { display:flex; flex-direction:column; gap:4px; }
.price-filter-opt, .sort-opt { font-size:13px; color:var(--np-text); padding:6px 10px; border-radius:var(--np-radius-sm); cursor:pointer; text-decoration:none; transition:var(--np-transition); }
.price-filter-opt:hover, .sort-opt:hover { background:var(--np-bg); color:var(--np-primary); }
.price-filter-opt.active, .sort-opt.active { background:var(--np-primary-light); color:var(--np-primary); font-weight:600; }
.np-cat-filter-list { display:flex; flex-direction:column; }
.np-cat-filter-list li a { display:flex; align-items:center; justify-content:space-between; padding:6px 10px; font-size:13px; color:var(--np-text); text-decoration:none; border-radius:var(--np-radius-sm); transition:var(--np-transition); }
.np-cat-filter-list li a:hover { background:var(--np-bg); color:var(--np-primary); }
.np-cat-filter-list li.active > a, .np-cat-filter-list li a.active { background:var(--np-primary-light); color:var(--np-primary); font-weight:600; }
.np-cat-filter-list .count { font-size:11px; background:var(--np-border); color:var(--np-text-secondary); padding:1px 6px; border-radius:10px; }
.np-cat-sub-filter { padding-left:16px; }
.np-cat-sub-filter li a { font-size:12px; }
.np-shop-toolbar { display:flex; align-items:center; justify-content:space-between; background:#fff; border-radius:var(--np-radius-sm); padding:10px 14px; box-shadow:var(--np-shadow); margin-bottom:14px; flex-wrap:wrap; gap:8px; }
.toolbar-left, .toolbar-right { display:flex; align-items:center; gap:10px; }
.result-count { font-size:13px; color:var(--np-text-secondary); }
.view-toggle { display:flex; gap:4px; }
.view-btn { width:32px; height:32px; border-radius:4px; background:none; border:1px solid var(--np-border); cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:14px; color:var(--np-text-secondary); transition:var(--np-transition); }
.view-btn.active { background:var(--np-primary); border-color:var(--np-primary); color:#fff; }
.np-sort-select { padding:6px 12px; border:1px solid var(--np-border); border-radius:var(--np-radius-sm); font-size:13px; color:var(--np-text); background:#fff; cursor:pointer; outline:none; }
.np-sort-select:focus { border-color:var(--np-primary); }
.np-filter-toggle { display:flex; align-items:center; gap:6px; padding:6px 14px; background:var(--np-primary); color:#fff; border:none; border-radius:var(--np-radius-sm); font-size:13px; font-weight:600; cursor:pointer; }
.np-no-products { text-align:center; padding:60px 40px; background:#fff; border-radius:var(--np-radius); }
.no-products-icon { font-size:56px; color:var(--np-border); margin-bottom:16px; }
.np-no-products h3 { font-size:20px; margin-bottom:8px; }
.np-no-products p { color:var(--np-text-secondary); margin-bottom:20px; }
.no-products-actions { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.np-cat-seo-content { margin-top:32px; background:#fff; border-radius:var(--np-radius); padding:24px; box-shadow:var(--np-shadow); }
.np-cat-seo-content .seo-content-inner { max-height:200px; overflow:hidden; position:relative; }
.np-cat-seo-content .seo-content-inner.expanded { max-height:none; }
.np-filter-overlay { position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:499; display:none; }
.np-filter-overlay.show { display:block; } .np-sp { padding:16px 0 40px; background:var(--np-bg); }
.np-sp *, .np-sp *::before, .np-sp *::after { box-sizing:border-box; }
.np-sp-breadcrumb { margin-bottom:12px; } .np-sp-top { display:grid; grid-template-columns:minmax(0, 500px) minmax(0, 1fr); gap:28px; background:#fff; border-radius:var(--np-radius); padding:24px; box-shadow:var(--np-shadow); margin-bottom:24px; } .np-sp-gallery { min-width:0; }
.np-sp-gallery__main { position:relative; margin-bottom:10px; border-radius:var(--np-radius); overflow:hidden; background:var(--np-bg); }
.np-sp-main-swiper { border-radius:var(--np-radius); overflow:hidden; }
.np-sp-main-swiper .swiper-slide { background:#fff; }
.np-sp-img-wrap { display:flex; align-items:center; justify-content:center; height:440px; cursor:crosshair; overflow:hidden; }
.np-sp-img-wrap img { max-width:100%; max-height:100%; object-fit:contain; transition:transform .3s ease; }
.np-sp-img-wrap:hover img { transform:scale(1.5); }
.np-sp-nav { width:36px; height:36px; background:rgba(255,255,255,.9); border-radius:50%; box-shadow:var(--np-shadow); }
.np-sp-nav::after { font-size:13px; color:var(--np-text); font-weight:800; }
.np-sp-badge { position:absolute; top:12px; left:12px; padding:5px 14px; border-radius:4px; font-size:14px; font-weight:800; z-index:3; color:#fff; }
.np-sp-badge--sale { background:var(--np-red); }
.np-sp-badge--out { background:rgba(0,0,0,.6); top:50%; left:50%; transform:translate(-50%,-50%); font-size:18px; padding:10px 20px; border-radius:8px; }
.np-sp-img-count { position:absolute; bottom:12px; right:12px; background:rgba(0,0,0,.55); color:#fff; font-size:12px; padding:3px 10px; border-radius:20px; z-index:3; } .np-sp-gallery__thumbs { margin-bottom:10px; overflow:hidden; }
.np-sp-thumb-swiper .swiper-slide { border-radius:6px; overflow:hidden; border:2px solid transparent; cursor:pointer; transition:var(--np-transition); opacity:.6; }
.np-sp-thumb-swiper .swiper-slide-thumb-active { border-color:var(--np-primary); opacity:1; }
.np-sp-thumb-swiper .swiper-slide img { width:100%; height:72px; object-fit:cover; display:block; } .np-sp-share { display:flex; align-items:center; gap:8px; font-size:13px; color:var(--np-text-secondary); }
.np-sp-share__btn { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; border-radius:50%; font-size:13px; cursor:pointer; text-decoration:none; border:1px solid var(--np-border); color:var(--np-text); transition:var(--np-transition); background:#fff; }
.np-sp-share--fb { background:#1877f2; border-color:#1877f2; color:#fff; }
.np-sp-share--zalo { background:#06c; border-color:#06c; color:#fff; font-size:11px; font-weight:700; }
.np-sp-share--copy:hover { background:var(--np-primary); border-color:var(--np-primary); color:#fff; } .np-sp-info { min-width:0; }
.np-sp-cats { font-size:12px; color:var(--np-text-secondary); margin-bottom:6px; }
.np-sp-cats a { color:var(--np-primary); text-decoration:none; }
.np-sp-title { font-size:24px; font-weight:700; line-height:1.35; margin-bottom:10px; color:var(--np-text); }
.np-sp-meta-row { display:flex; align-items:center; gap:10px; margin-bottom:14px; flex-wrap:wrap; font-size:13px; color:var(--np-text-secondary); }
.np-sp-rating { display:flex; align-items:center; gap:5px; }
.np-sp-rating__num { font-weight:700; color:var(--np-text); }
.np-sp-rating__link { color:var(--np-primary); text-decoration:none; }
.np-sp-sep { color:var(--np-border); }
.np-sp-sold { font-weight:600; }
.np-sp-sku { color:var(--np-text-light); } .np-sp-price-box { background:linear-gradient(135deg,#fff5f5 0%,#ffeaea 100%); border-radius:var(--np-radius); padding:16px 20px; margin-bottom:12px; border:1px solid #ffe0e0; }
.np-sp-price { font-size:32px; font-weight:800; color:var(--np-red); line-height:1.2; }
.np-sp-price--contact { font-size:20px; color:var(--np-primary); display:flex; align-items:center; gap:8px; }
.np-sp-price-old { display:flex; align-items:center; gap:10px; margin-top:4px; flex-wrap:wrap; }
.np-sp-price-org { font-size:15px; color:var(--np-text-secondary); text-decoration:line-through; }
.np-sp-price-save { font-size:13px; color:var(--np-green); font-weight:600; background:#e8f5e9; padding:2px 8px; border-radius:3px; } .np-sp-promo-bar { display:flex; align-items:center; gap:8px; background:linear-gradient(90deg,#fff3cd,#fff8e1); border:1px solid #ffc107; border-radius:6px; padding:8px 14px; font-size:13px; font-weight:600; color:#856404; margin-bottom:12px; animation:np-pulse-bg 2s ease-in-out infinite; }
@keyframes np-pulse-bg { 0%,100% { opacity:1; } 50% { opacity:.8; } }
.np-sp-promo-bar i { color:#ff9800; font-size:16px; } .np-sp-short-desc { font-size:14px; color:var(--np-text-secondary); line-height:1.7; margin-bottom:14px; }
.np-sp-short-desc ul { padding-left:20px; list-style:disc; }
.np-sp-short-desc li { margin-bottom:4px; } .np-sp-trust { display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-bottom:14px; padding:12px; background:var(--np-bg); border-radius:var(--np-radius); }
.np-sp-trust__item { font-size:13px; color:var(--np-text); display:flex; align-items:center; gap:7px; padding:4px 0; }
.np-sp-trust__item i { color:#00a651; font-size:15px; flex-shrink:0; } .np-sp-stock { font-size:13px; font-weight:600; display:flex; align-items:center; gap:6px; margin-bottom:14px; padding:8px 14px; border-radius:6px; }
.np-sp-stock--in { background:#e8f5e9; color:#00a651; border:1px solid #c8e6c9; }
.np-sp-stock--out { background:var(--np-red-light); color:var(--np-red); border:1px solid #ffcdd2; } .np-sp-cart { margin-bottom:14px; }
.np-sp-qty { display:flex; align-items:center; gap:12px; margin-bottom:12px; }
.np-sp-qty label { font-size:13px; font-weight:600; color:var(--np-text); white-space:nowrap; }
.np-sp-qty__box { display:flex; align-items:center; border:1.5px solid var(--np-border); border-radius:6px; overflow:hidden; }
.np-sp-qty__btn { width:38px; height:42px; background:var(--np-bg); border:none; font-size:18px; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:var(--np-transition); color:var(--np-text); user-select:none; }
.np-sp-qty__btn:hover { background:var(--np-primary); color:#fff; }
.np-sp-qty__input { width:56px; height:42px; border:none; border-left:1px solid var(--np-border); border-right:1px solid var(--np-border); text-align:center; font-size:16px; font-weight:600; outline:none; -moz-appearance:textfield; }
.np-sp-qty__input::-webkit-outer-spin-button,.np-sp-qty__input::-webkit-inner-spin-button { -webkit-appearance:none; }
.np-sp-cart__buttons { display:flex; gap:10px; }
.np-sp-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:12px 28px; border-radius:8px; font-size:15px; font-weight:700; cursor:pointer; border:none; text-decoration:none; transition:all .2s ease; flex:1; min-width:0; }
.np-sp-btn--cart { background:var(--np-primary); color:#fff; }
.np-sp-btn--cart:hover { background:var(--np-primary-dark); color:#fff; box-shadow:0 4px 12px rgba(0,82,204,.3); }
.np-sp-btn--buy { background:var(--np-red); color:#fff; }
.np-sp-btn--buy:hover { background:#c41430; color:#fff; box-shadow:0 4px 12px rgba(227,24,55,.3); }
.np-sp-cart-feedback { padding:10px 14px; border-radius:6px; font-size:13px; font-weight:600; margin-top:8px; }
.np-sp-cart-feedback.success { background:#e8f5e9; color:var(--np-green); }
.np-sp-cart-feedback.error { background:var(--np-red-light); color:var(--np-red); } .np-sp-contact-box { margin-bottom:14px; }
.np-sp-contact-box p { font-size:13px; color:var(--np-text-secondary); margin-bottom:10px; display:flex; align-items:flex-start; gap:6px; }
.np-sp-contact-btns { display:flex; gap:10px; flex-wrap:wrap; } .np-sp-proof { display:flex; gap:12px; margin-bottom:14px; flex-wrap:wrap; }
.np-sp-proof__item { display:flex; align-items:center; gap:6px; font-size:12px; color:var(--np-text-secondary); background:var(--np-bg); padding:6px 12px; border-radius:20px; }
.np-sp-proof__item i { color:var(--np-red); } .np-sp-hotline { display:flex; align-items:center; gap:12px; background:var(--np-primary-light); border:1px solid rgba(0,82,204,.2); border-radius:var(--np-radius); padding:14px 18px; }
.np-sp-hotline__icon { font-size:28px; color:var(--np-primary); flex-shrink:0; }
.np-sp-hotline__text { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; font-size:13px; }
.np-sp-hotline__text a { color:var(--np-primary); font-weight:700; font-size:18px; text-decoration:none; }
.np-sp-hotline__text small { color:var(--np-text-secondary); }
.np-sp-hotline__zalo { display:flex; align-items:center; gap:6px; background:var(--np-primary); color:#fff; padding:8px 16px; border-radius:6px; font-size:13px; font-weight:700; text-decoration:none; white-space:nowrap; transition:var(--np-transition); flex-shrink:0; }
.np-sp-hotline__zalo:hover { background:var(--np-primary-dark); color:#fff; } .np-sp-tabs { background:#fff; border-radius:var(--np-radius); box-shadow:var(--np-shadow); margin-bottom:24px; overflow:hidden; }
.np-sp-tabs__nav { display:flex; border-bottom:2px solid var(--np-border); padding:0 20px; gap:4px; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
.np-sp-tabs__nav::-webkit-scrollbar { display:none; }
.np-sp-tab { padding:14px 20px; font-size:14px; font-weight:600; color:var(--np-text-secondary); background:none; border:none; cursor:pointer; border-bottom:3px solid transparent; margin-bottom:-2px; transition:var(--np-transition); white-space:nowrap; display:flex; align-items:center; gap:6px; }
.np-sp-tab:hover { color:var(--np-primary); }
.np-sp-tab.active { color:var(--np-primary); border-bottom-color:var(--np-primary); }
.np-sp-tab__badge { background:var(--np-primary); color:#fff; font-size:11px; padding:1px 6px; border-radius:10px; }
.np-sp-tabs__panel { display:none; padding:24px; overflow:hidden; word-wrap:break-word; overflow-wrap:break-word; }
.np-sp-tabs__panel.active { display:block; }
.np-sp-empty { color:var(--np-text-secondary); font-size:14px; } .np-sp-desc { font-size:14px; line-height:1.8; color:var(--np-text); overflow:hidden; }
.np-sp-desc h2,.np-sp-desc h3 { margin:16px 0 8px; font-size:18px; }
.np-sp-desc ul,.np-sp-desc ol { padding-left:20px; margin:8px 0; }
.np-sp-desc ul { list-style:disc; }
.np-sp-desc ol { list-style:decimal; }
.np-sp-desc img { max-width:100% !important; width:auto !important; height:auto !important; border-radius:var(--np-radius); margin:8px 0; display:block; }
.np-sp-desc table { width:100% !important; max-width:100%; overflow-x:auto; display:block; }
.np-sp-desc iframe, .np-sp-desc video, .np-sp-desc embed { max-width:100%; height:auto; } .np-sp-specs { width:100%; border-collapse:collapse; table-layout:fixed; }
.np-sp-specs td { padding:10px 14px; border:1px solid var(--np-border); font-size:13px; word-wrap:break-word; overflow-wrap:break-word; }
.np-sp-specs td:first-child { font-weight:600; background:var(--np-bg); width:35%; color:var(--np-text); }
.np-sp-specs a { color:var(--np-primary); text-decoration:none; } .np-sp-review-summary { display:flex; align-items:center; justify-content:center; padding:20px; margin-bottom:20px; background:var(--np-bg); border-radius:var(--np-radius); }
.np-sp-review-summary__score { text-align:center; }
.np-sp-review-summary__score .big-score { font-size:48px; font-weight:800; color:var(--np-primary); }
.np-sp-review-summary__score .out-of { font-size:20px; color:var(--np-text-secondary); }
.np-sp-review-summary__score .big-stars { margin:6px 0; }
.np-sp-review-summary__score .total-reviews { font-size:13px; color:var(--np-text-secondary); }
.np-sp-reviews-list { display:flex; flex-direction:column; gap:12px; margin-bottom:20px; }
.np-sp-review { padding:14px; background:var(--np-bg); border-radius:var(--np-radius); }
.np-sp-review__head { display:flex; align-items:center; justify-content:space-between; margin-bottom:6px; }
.np-sp-review__head strong { font-size:14px; }
.np-sp-review__head span { font-size:12px; color:var(--np-text-secondary); }
.np-sp-review p { font-size:13px; line-height:1.6; color:var(--np-text); margin-top:6px; }
.np-sp-review-form h3 { font-size:18px; font-weight:700; margin-bottom:16px; } .np-sp-policy-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.np-sp-policy { display:flex; gap:14px; padding:18px; background:var(--np-bg); border-radius:var(--np-radius); }
.np-sp-policy i { font-size:28px; color:var(--np-primary); flex-shrink:0; margin-top:2px; }
.np-sp-policy h4 { font-size:14px; font-weight:700; margin-bottom:4px; }
.np-sp-policy p { font-size:13px; color:var(--np-text-secondary); line-height:1.5; } .np-sp-related { margin-bottom:24px; overflow:hidden; }
.np-sp-related-swiper { overflow:hidden; }
.np-sp-related-swiper .swiper-slide { width:calc((100% - 48px) / 5); }
.np-sp-related-swiper .np-sp-related-prev,
.np-sp-related-swiper .np-sp-related-next { z-index:20; pointer-events:all; cursor:pointer; } .np-sp-sticky-bar { position:fixed; bottom:0; left:0; right:0; background:#fff; box-shadow:0 -2px 12px rgba(0,0,0,.12); z-index:999; padding:8px 12px; display:none; }
.np-sp-sticky-bar__price { display:none; }
.np-sp-sticky-bar__btns { display:flex; gap:6px; align-items:center; }
.np-sp-sticky-btn { display:flex; align-items:center; justify-content:center; gap:5px; padding:10px 12px; border-radius:8px; font-size:13px; font-weight:700; border:none; cursor:pointer; text-decoration:none; transition:var(--np-transition); white-space:nowrap; }
.np-sp-sticky-btn--zalo { flex:1; background:#0068ff; color:#fff; }
.np-sp-sticky-btn--zalo:hover { background:#0055d4; color:#fff; }
.np-sp-sticky-btn--cart { flex:1; background:var(--np-red); color:#fff; }
.np-sp-sticky-btn--cart:hover { background:#c41430; color:#fff; } .np-cart-page { padding:16px 0 40px; }
.np-page-title { font-size:24px; font-weight:700; margin-bottom:16px; display:flex; align-items:center; gap:10px; }
.np-empty-cart { text-align:center; padding:60px 40px; background:#fff; border-radius:var(--np-radius); box-shadow:var(--np-shadow); }
.empty-cart-icon { font-size:80px; color:var(--np-border); margin-bottom:16px; }
.np-empty-cart h2 { font-size:24px; margin-bottom:8px; }
.np-empty-cart p { color:var(--np-text-secondary); margin-bottom:24px; }
.np-cart-layout { display:grid; grid-template-columns:1fr 360px; gap:24px; align-items:start; }
.np-cart-table { width:100%; border-collapse:collapse; background:#fff; border-radius:var(--np-radius); box-shadow:var(--np-shadow); overflow:hidden; }
.np-cart-table thead { background:var(--np-bg); }
.np-cart-table th { padding:12px 16px; font-size:13px; font-weight:700; color:var(--np-text-secondary); text-align:left; text-transform:uppercase; letter-spacing:.5px; border-bottom:1px solid var(--np-border); }
.np-cart-table td { padding:12px 16px; border-bottom:1px solid var(--np-border-light); vertical-align:middle; }
.np-cart-row:last-child td { border-bottom:none; }
.cart-product-info { display:flex; align-items:center; gap:12px; }
.cart-product-img { flex-shrink:0; }
.cart-product-img img { width:64px; height:64px; object-fit:cover; border-radius:var(--np-radius-sm); }
.cart-product-name { font-size:14px; font-weight:500; color:var(--np-text); text-decoration:none; }
.cart-product-name:hover { color:var(--np-primary); }
.cart-sku { font-size:11px; color:var(--np-text-secondary); display:block; }
.np-cart-qty { width:64px; text-align:center; padding:6px; border:1px solid var(--np-border); border-radius:var(--np-radius-sm); font-size:14px; }
.cart-remove-btn { color:var(--np-text-secondary); font-size:16px; transition:var(--np-transition); }
.cart-remove-btn:hover { color:var(--np-red); }
.cart-actions { display:flex; justify-content:space-between; gap:12px; padding:16px; flex-wrap:wrap; background:#fff; border-radius:0 0 var(--np-radius) var(--np-radius); }
.np-coupon-section { background:#fff; border-radius:var(--np-radius); padding:20px; margin-top:16px; box-shadow:var(--np-shadow); }
.np-coupon-section h4 { font-size:15px; font-weight:700; margin-bottom:12px; display:flex; align-items:center; gap:8px; }
.np-coupon-form { display:flex; gap:10px; align-items:center; }
.np-cart-totals { background:#fff; border-radius:var(--np-radius); padding:20px; box-shadow:var(--np-shadow); margin-bottom:12px; }
.np-cart-totals h3 { font-size:18px; font-weight:700; margin-bottom:16px; padding-bottom:12px; border-bottom:2px solid var(--np-border); }
.cart-total-row { display:flex; justify-content:space-between; align-items:center; padding:8px 0; font-size:14px; }
.cart-total-row.total { padding-top:12px; border-top:2px solid var(--np-border); margin-top:4px; }
.cart-total-row.total span { font-size:16px; font-weight:700; }
.grand-total { font-size:24px !important; font-weight:800 !important; color:var(--np-red) !important; }
.cart-total-row.discount { color:var(--np-green); }
.secure-checkout { text-align:center; font-size:12px; color:var(--np-text-secondary); margin:12px 0; display:flex; align-items:center; justify-content:center; gap:6px; }
.np-payment-icons { display:flex; align-items:center; flex-wrap:wrap; gap:6px; justify-content:center; font-size:12px; color:var(--np-text-secondary); }
.pay-method { background:var(--np-bg); border:1px solid var(--np-border); padding:3px 10px; border-radius:4px; font-size:11px; font-weight:600; }
.np-cart-trust { background:var(--np-bg); border-radius:var(--np-radius); padding:14px; }
.trust-item { display:flex; align-items:center; gap:8px; font-size:13px; color:var(--np-text); padding:6px 0; } .np-co { max-width:100%; }
.np-co-empty { text-align:center; padding:60px 20px; background:#fff; border-radius:var(--np-radius); box-shadow:var(--np-shadow); }
.np-co-empty i { font-size:64px; color:var(--np-border); margin-bottom:16px; display:block; }
.np-co-empty h2 { font-size:22px; font-weight:700; margin-bottom:8px; }
.np-co-empty p { font-size:14px; color:var(--np-text-secondary); margin-bottom:20px; } .np-co-steps { display:flex; align-items:center; justify-content:center; gap:0; margin-bottom:28px; padding:16px 0; }
.np-co-step { display:flex; align-items:center; gap:8px; text-decoration:none; color:var(--np-text-secondary); font-size:14px; }
.np-co-step.done { color:var(--np-green); }
.np-co-step.active { color:var(--np-primary); font-weight:700; }
.np-co-step__num { width:32px; height:32px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:14px; font-weight:700; border:2px solid var(--np-border); color:var(--np-text-secondary); background:#fff; }
.np-co-step.done .np-co-step__num { background:var(--np-green); color:#fff; border-color:var(--np-green); }
.np-co-step.active .np-co-step__num { background:var(--np-primary); color:#fff; border-color:var(--np-primary); }
.np-co-step__line { width:60px; height:2px; background:var(--np-border); margin:0 8px; }
.np-co-step__line.active { background:var(--np-green); } .np-co-grid { display:grid; grid-template-columns:1fr 400px; gap:24px; align-items:start; } .np-co-card { background:#fff; border-radius:var(--np-radius); padding:24px; box-shadow:var(--np-shadow); margin-bottom:16px; }
.np-co-card__title { font-size:17px; font-weight:700; color:var(--np-text); display:flex; align-items:center; gap:10px; margin-bottom:18px; padding-bottom:14px; border-bottom:2px solid var(--np-bg); }
.np-co-card__title i { color:var(--np-primary); font-size:18px; }
.np-co-card__body { } .np-co .woocommerce-billing-fields__field-wrapper,
.np-co .woocommerce-shipping-fields__field-wrapper { display:grid; grid-template-columns:1fr 1fr; gap:0 16px; }
.np-co .form-row { margin-bottom:14px; }
.np-co .form-row-wide { grid-column:1 / -1; }
.np-co .form-row-first { grid-column:1; }
.np-co .form-row-last { grid-column:2; }
.np-co .form-row label { display:block; font-size:13px; font-weight:600; color:var(--np-text); margin-bottom:6px; }
.np-co .form-row label .required { color:var(--np-red); }
.np-co .form-row input[type="text"],
.np-co .form-row input[type="email"],
.np-co .form-row input[type="tel"],
.np-co .form-row input[type="number"],
.np-co .form-row input[type="password"],
.np-co .form-row select,
.np-co .form-row textarea { width:100%; padding:10px 14px; border:1.5px solid var(--np-border); border-radius:6px; font-size:14px; background:#fff; transition:border-color .2s; outline:none; font-family:inherit; }
.np-co .form-row input:focus,
.np-co .form-row select:focus,
.np-co .form-row textarea:focus { border-color:var(--np-primary); box-shadow:0 0 0 3px rgba(0,82,204,.1); }
.np-co .form-row textarea { min-height:80px; resize:vertical; }
.np-co .form-row .select2-container .select2-selection--single { height:42px; border:1.5px solid var(--np-border); border-radius:6px; }
.np-co .form-row .select2-container .select2-selection--single .select2-selection__rendered { line-height:42px; padding-left:14px; font-size:14px; }
.np-co .form-row .select2-container .select2-selection__arrow { height:42px; }
.np-co .woocommerce-invalid input { border-color:var(--np-red) !important; } .np-co-help { display:flex; align-items:flex-start; gap:14px; background:var(--np-primary-light); border:1px solid rgba(0,82,204,.15); border-radius:var(--np-radius); padding:16px 20px; margin-bottom:16px; font-size:13px; line-height:1.6; }
.np-co-help > i { font-size:28px; color:var(--np-primary); flex-shrink:0; margin-top:2px; }
.np-co-help a { color:var(--np-primary); font-weight:700; text-decoration:none; }
.np-co-help small { display:block; color:var(--np-text-secondary); margin-top:2px; } .np-co-item-count { font-size:13px; font-weight:400; color:var(--np-text-secondary); margin-left:auto; } .np-co-sidebar { background:#fff; border-radius:var(--np-radius); padding:24px; box-shadow:var(--np-shadow); position:sticky; top:80px; } .np-co .shop_table.woocommerce-checkout-review-order-table { width:100%; border-collapse:collapse; margin:0 0 16px; border:none; border-spacing:0; }
.np-co .woocommerce-checkout-review-order-table thead th { text-align:left; font-size:13px; font-weight:600; color:var(--np-text-secondary); padding:8px 0; border:none; border-bottom:1px solid var(--np-border); background:transparent; }
.np-co .woocommerce-checkout-review-order-table thead th.product-total { text-align:right; }
.np-co .woocommerce-checkout-review-order-table tbody td { font-size:14px; padding:12px 0; border:none; border-bottom:1px solid var(--np-bg); vertical-align:top; background:transparent; }
.np-co .woocommerce-checkout-review-order-table .product-name { max-width:220px; line-height:1.5; }
.np-co .woocommerce-checkout-review-order-table .product-name .product-quantity { color:var(--np-primary); font-weight:700; }
.np-co .woocommerce-checkout-review-order-table .product-total { text-align:right; font-weight:600; white-space:nowrap; }
.np-co .woocommerce-checkout-review-order-table tfoot th { font-size:14px; color:var(--np-text); padding:10px 0; border:none; border-bottom:1px solid var(--np-bg); background:transparent; text-align:left; }
.np-co .woocommerce-checkout-review-order-table tfoot td { text-align:right; font-weight:600; padding:10px 0; border:none; border-bottom:1px solid var(--np-bg); background:transparent; }
.np-co .woocommerce-checkout-review-order-table tfoot .order-total th,
.np-co .woocommerce-checkout-review-order-table tfoot .order-total td { font-size:18px; font-weight:800; color:var(--np-red); border-top:2px solid var(--np-border); border-bottom:none; padding-top:14px; } .np-co .woocommerce-shipping-methods { list-style:none; padding:0; margin:0; }
.np-co .woocommerce-shipping-methods li { padding:4px 0; font-size:14px; }
.np-co .woocommerce-shipping-methods li label { font-weight:500; cursor:pointer; }
.np-co .woocommerce-shipping-methods li input[type="radio"] { accent-color:var(--np-primary); margin-right:6px; } .np-co #payment { padding-top:16px; border-top:1px solid var(--np-border); margin-top:8px; }
.np-co .wc_payment_methods { list-style:none; padding:0; margin:0 0 16px; }
.np-co .wc_payment_method { margin-bottom:8px; }
.np-co .wc_payment_method > label { display:flex; align-items:center; gap:10px; padding:12px 14px; background:var(--np-bg); border:1.5px solid var(--np-border); border-radius:8px; cursor:pointer; font-size:14px; font-weight:600; transition:var(--np-transition); }
.np-co .wc_payment_method > input[type="radio"] { position:absolute; opacity:0; width:0; height:0; }
.np-co .wc_payment_method > input[type="radio"] + label::before { content:''; display:inline-block; width:18px; height:18px; border:2px solid var(--np-border); border-radius:50%; flex-shrink:0; transition:var(--np-transition); box-sizing:border-box; }
.np-co .wc_payment_method > input[type="radio"]:checked + label::before { border-color:var(--np-primary); border-width:5px; }
.np-co .wc_payment_method > input[type="radio"]:checked + label { border-color:var(--np-primary); background:var(--np-primary-light); }
.np-co .payment_box { padding:12px 14px; font-size:13px; color:var(--np-text-secondary); background:var(--np-bg); border-radius:0 0 8px 8px; margin-top:0; margin-bottom:8px; line-height:1.6; }
.np-co .payment_box p { margin:0 0 4px; }
.np-co .payment_box p:last-child { margin-bottom:0; } .np-co .place-order { padding:0; margin:0; }
.np-co #place_order,
.np-co .woocommerce-checkout-payment .button.alt { width:100%; padding:14px 24px; font-size:16px; font-weight:700; background:var(--np-red) !important; color:#fff !important; border:none; border-radius:8px; cursor:pointer; transition:all .2s ease; text-align:center; line-height:1.4; letter-spacing:.3px; }
.np-co #place_order:hover,
.np-co .woocommerce-checkout-payment .button.alt:hover { background:#c41430 !important; box-shadow:0 4px 12px rgba(227,24,55,.3); }
.np-co .woocommerce-terms-and-conditions-wrapper { margin-bottom:12px; } .np-co-trust { display:grid; grid-template-columns:1fr 1fr; gap:6px; margin-top:16px; padding-top:16px; border-top:1px solid var(--np-border); }
.np-co-trust__item { display:flex; align-items:center; gap:6px; font-size:12px; color:var(--np-text-secondary); padding:4px 0; }
.np-co-trust__item i { color:var(--np-green); font-size:14px; flex-shrink:0; } .np-co-bank { margin-top:14px; padding:14px; background:var(--np-bg); border-radius:var(--np-radius); font-size:13px; }
.np-co-bank h4 { font-size:14px; font-weight:700; margin-bottom:10px; display:flex; align-items:center; gap:8px; color:var(--np-text); }
.np-co-bank h4 i { color:var(--np-primary); }
.np-co-bank__detail { background:#fff; border-radius:6px; padding:10px 14px; margin-bottom:8px; line-height:1.8; }
.np-co-bank small { color:var(--np-text-secondary); } .np-co .woocommerce-error,
.np-co .woocommerce-message,
.np-co .woocommerce-info { border-radius:var(--np-radius); padding:14px 18px; margin-bottom:16px; font-size:14px; } @media (max-width: 992px) {
.np-co-grid { grid-template-columns:1fr; }
.np-co-sidebar { position:static; }
}
@media (max-width: 768px) {
.np-co .woocommerce-billing-fields__field-wrapper,
.np-co .woocommerce-shipping-fields__field-wrapper { grid-template-columns:1fr; }
.np-co .form-row-first,
.np-co .form-row-last { grid-column:1; }
.np-co-card { padding:16px; }
.np-co-sidebar { padding:16px; }
.np-co-steps { gap:0; }
.np-co-step__label { display:none; }
.np-co-step__line { width:30px; }
.np-co-trust { grid-template-columns:1fr; }
} .np-ty { max-width:960px; margin:0 auto; } .np-ty .np-co-steps { margin-bottom:28px; } .np-ty-header { text-align:center; padding:32px 20px 28px; margin-bottom:28px; background:#fff; border-radius:var(--np-radius); box-shadow:var(--np-shadow); }
.np-ty-header h2 { font-size:24px; font-weight:800; color:var(--np-text); margin:0 0 10px; }
.np-ty-header p { font-size:15px; color:var(--np-text-secondary); max-width:500px; margin:0 auto; line-height:1.6; }
.np-ty-icon { margin-bottom:16px; }
.np-ty-icon i { font-size:56px; color:var(--np-green); }
.np-ty-icon--failed i { color:var(--np-red); }
.np-ty-header--failed h2 { color:var(--np-red); } .np-ty-overview { display:grid; grid-template-columns:repeat(4, 1fr); gap:12px; margin-bottom:28px; }
.np-ty-overview__item { background:#fff; border-radius:var(--np-radius); padding:16px 18px; box-shadow:var(--np-shadow); text-align:center; }
.np-ty-overview__label { display:block; font-size:12px; color:var(--np-text-secondary); text-transform:uppercase; letter-spacing:.5px; margin-bottom:6px; }
.np-ty-overview__value { display:block; font-size:16px; color:var(--np-text); }
.np-ty-overview__value--total { color:var(--np-red); font-size:18px; } .np-ty-grid { display:grid; grid-template-columns:1fr 360px; gap:24px; align-items:start; }
.np-ty-left {}
.np-ty-right {} .np-ty-table { width:100%; border-collapse:collapse; }
.np-ty-table thead th { text-align:left; font-size:13px; font-weight:600; color:var(--np-text-secondary); padding:8px 0; border-bottom:1px solid var(--np-border); }
.np-ty-table thead th.text-right { text-align:right; }
.np-ty-table tbody td { padding:12px 0; border-bottom:1px solid var(--np-bg); font-size:14px; vertical-align:top; }
.np-ty-table tbody td a { color:var(--np-text); text-decoration:none; font-weight:500; }
.np-ty-table tbody td a:hover { color:var(--np-primary); }
.np-ty-table .text-right { text-align:right; }
.np-ty-qty { color:var(--np-primary); font-weight:700; margin-left:6px; }
.np-ty-table tfoot th { text-align:left; padding:10px 0; font-size:14px; color:var(--np-text); border-bottom:1px solid var(--np-bg); font-weight:500; }
.np-ty-table tfoot td { padding:10px 0; font-size:14px; font-weight:600; border-bottom:1px solid var(--np-bg); }
.np-ty-table__total th,
.np-ty-table__total td { font-size:17px !important; font-weight:800 !important; color:var(--np-red) !important; border-top:2px solid var(--np-border) !important; border-bottom:none !important; padding-top:14px !important; } .np-ty-customer {}
.np-ty-customer__row { display:flex; align-items:flex-start; gap:12px; padding:10px 0; border-bottom:1px solid var(--np-bg); }
.np-ty-customer__row:last-child { border-bottom:none; }
.np-ty-customer__row > i { color:var(--np-primary); font-size:16px; margin-top:3px; width:18px; text-align:center; flex-shrink:0; }
.np-ty-customer__label { display:block; font-size:12px; color:var(--np-text-secondary); margin-bottom:2px; }
.np-ty-customer__row strong { font-size:14px; font-weight:600; color:var(--np-text); line-height:1.5; }
.np-ty-customer__row strong br { content:''; }
.np-ty-customer__row strong br::after { content:', '; } .np-ty-bank-notice { margin-bottom:16px; padding:16px; background:#fff9e6; border:1px solid #f0d860; border-radius:var(--np-radius); }
.np-ty-bank-notice > h4 { font-size:15px; font-weight:700; color:#8a6d00; margin:0 0 8px; display:flex; align-items:center; gap:8px; }
.np-ty-bank-notice > h4 i { color:#d4a800; font-size:18px; }
.np-ty-bank-notice > p { font-size:13px; color:var(--np-text-secondary); margin:0 0 12px; line-height:1.5; }
.np-ty-bank-notice .np-co-bank { margin-top:0; } .np-ty-next { margin-bottom:16px; padding:16px; background:var(--np-bg); border-radius:var(--np-radius); }
.np-ty-next h4 { font-size:14px; font-weight:700; margin:0 0 10px; display:flex; align-items:center; gap:8px; color:var(--np-text); }
.np-ty-next h4 i { color:var(--np-primary); }
.np-ty-next__list { list-style:none; padding:0; margin:0; }
.np-ty-next__list li { padding:6px 0; font-size:13px; color:var(--np-text-secondary); display:flex; align-items:center; gap:8px; }
.np-ty-next__list li i { color:var(--np-green); font-size:12px; flex-shrink:0; } .np-ty-actions { margin-top:16px; display:flex; gap:10px; flex-wrap:wrap; }
.np-ty-header .np-ty-actions { justify-content:center; margin-top:20px; }
.np-btn-block { width:100%; text-align:center; justify-content:center; }
.np-btn-outline { background:transparent; color:var(--np-primary); border:1.5px solid var(--np-primary); padding:10px 20px; border-radius:8px; font-weight:600; text-decoration:none; display:inline-flex; align-items:center; gap:8px; transition:var(--np-transition); }
.np-btn-outline:hover { background:var(--np-primary); color:#fff; } .np-ty .woocommerce-order-details,
.np-ty .woocommerce-customer-details { display:none; } @media (max-width:992px) {
.np-ty-overview { grid-template-columns:repeat(2, 1fr); }
.np-ty-grid { grid-template-columns:1fr; }
}
@media (max-width:576px) {
.np-ty-overview { grid-template-columns:1fr 1fr; gap:8px; }
.np-ty-overview__item { padding:12px 14px; }
.np-ty-overview__value { font-size:14px; }
.np-ty-header h2 { font-size:20px; }
.np-ty-icon i { font-size:44px; }
} .np-blog-page { padding:16px 0 40px; }
.np-blog-cat-banner, .np-blog-archive-banner, .np-blog-main-banner { padding:32px 40px; border-radius:var(--np-radius); margin-bottom:16px; }
.np-blog-cat-banner { color:#fff; }
.np-blog-cat-banner h1 { font-size:26px; font-weight:800; color:#fff; margin-bottom:6px; }
.np-blog-cat-banner p { color:rgba(255,255,255,.85); margin-bottom:10px; }
.blog-cat-meta { display:flex; gap:12px; }
.blog-cat-meta span { font-size:13px; color:rgba(255,255,255,.8); background:rgba(255,255,255,.15); padding:4px 12px; border-radius:20px; }
.np-blog-main-banner { background:linear-gradient(135deg,#0052cc,#1565c0); color:#fff; }
.np-blog-main-banner h1 { font-size:26px; font-weight:800; color:#fff; margin-bottom:6px; }
.np-blog-main-banner p { color:rgba(255,255,255,.85); }
.np-blog-archive-banner { background:var(--np-bg); }
.np-blog-archive-banner h1 { font-size:22px; font-weight:700; }
.np-blog-cats-tabs { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:20px; }
.blog-cat-tab { padding:7px 16px; border-radius:20px; font-size:13px; font-weight:600; color:var(--np-text-secondary); background:#fff; border:1px solid var(--np-border); text-decoration:none; transition:var(--np-transition); }
.blog-cat-tab:hover { border-color:var(--np-primary); color:var(--np-primary); }
.blog-cat-tab.active { background:var(--np-primary); border-color:var(--np-primary); color:#fff; }
.np-blog-layout { display:grid; grid-template-columns:1fr 300px; gap:24px; }
.np-blog-main { }
.np-blog-featured { margin-bottom:24px; }
.blog-feat-img { display:block; overflow:hidden; border-radius:var(--np-radius); position:relative; margin-bottom:16px; }
.blog-feat-img img { width:100%; height:340px; object-fit:cover; transition:transform .4s ease; }
.blog-feat-img:hover img { transform:scale(1.03); }
.blog-feat-cat { position:absolute; top:12px; left:12px; background:var(--np-primary); color:#fff; padding:4px 12px; border-radius:20px; font-size:12px; font-weight:600; }
.blog-feat-content { }
.post-meta-row { display:flex; gap:16px; font-size:12px; color:var(--np-text-secondary); margin-bottom:8px; flex-wrap:wrap; }
.blog-feat-content h2 { font-size:24px; font-weight:700; line-height:1.3; margin-bottom:10px; }
.blog-feat-content h2 a { color:var(--np-text); text-decoration:none; }
.blog-feat-content h2 a:hover { color:var(--np-primary); }
.blog-feat-content p.excerpt { font-size:14px; color:var(--np-text-secondary); line-height:1.6; margin-bottom:16px; }
.blog-feat-footer { display:flex; align-items:center; gap:16px; }
.np-blog-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; margin-bottom:24px; }
.np-blog-card { background:#fff; border-radius:var(--np-radius); box-shadow:0 1px 4px rgba(0,0,0,.06); overflow:hidden; transition:var(--np-transition); }
.np-blog-card:hover { box-shadow:var(--np-shadow-md); transform:translateY(-2px); }
.blog-card-thumb { display:block; overflow:hidden; position:relative; }
.blog-card-thumb img { width:100%; height:180px; object-fit:cover; transition:transform .4s ease; }
.np-blog-card:hover .blog-card-thumb img { transform:scale(1.03); }
.blog-no-thumb { height:180px; background:var(--np-bg); display:flex; align-items:center; justify-content:center; }
.blog-no-thumb i { font-size:40px; color:var(--np-border); }
.blog-card-cat { position:absolute; top:10px; left:10px; background:var(--np-primary); color:#fff; padding:2px 8px; border-radius:3px; font-size:11px; font-weight:600; }
.blog-card-body { padding:14px; }
.blog-card-meta { font-size:12px; color:var(--np-text-secondary); margin-bottom:6px; }
.blog-card-body h3 { font-size:15px; font-weight:700; margin-bottom:8px; line-height:1.4; }
.blog-card-body h3 a { color:var(--np-text); text-decoration:none; }
.blog-card-body h3 a:hover { color:var(--np-primary); }
.blog-card-body p { font-size:13px; color:var(--np-text-secondary); line-height:1.5; margin-bottom:10px; }
.blog-read-more { font-size:13px; color:var(--np-primary); font-weight:600; text-decoration:none; display:flex; align-items:center; gap:4px; }
.blog-read-more:hover { color:var(--np-primary-dark); }
.np-blog-sidebar { }
.np-blog-widget { background:#fff; border-radius:var(--np-radius); padding:16px; margin-bottom:16px; box-shadow:var(--np-shadow); }
.np-blog-widget .widget-title { font-size:15px; font-weight:700; color:var(--np-text); margin-bottom:14px; padding-bottom:10px; border-bottom:2px solid var(--np-primary); text-transform:uppercase; }
.np-blog-search { display:flex; gap:8px; }
.np-blog-search .np-input { flex:1; }
.widget-cat-list { display:flex; flex-direction:column; }
.widget-cat-list li a { display:flex; align-items:center; justify-content:space-between; padding:8px 10px; font-size:13px; color:var(--np-text); text-decoration:none; border-radius:var(--np-radius-sm); transition:var(--np-transition); }
.widget-cat-list li a:hover { background:var(--np-bg); color:var(--np-primary); }
.widget-cat-list li a.active { background:var(--np-primary-light); color:var(--np-primary); font-weight:600; }
.widget-cat-list .cat-count { background:var(--np-border); color:var(--np-text-secondary); font-size:11px; padding:1px 6px; border-radius:10px; }
.recent-post-item { display:flex; gap:10px; margin-bottom:12px; }
.recent-post-item:last-child { margin-bottom:0; }
.rp-thumb { flex-shrink:0; width:60px; height:60px; border-radius:var(--np-radius-sm); overflow:hidden; }
.rp-thumb img { width:100%; height:100%; object-fit:cover; }
.rp-no-thumb { width:60px; height:60px; background:var(--np-bg); border-radius:var(--np-radius-sm); display:flex; align-items:center; justify-content:center; }
.rp-no-thumb i { font-size:20px; color:var(--np-border); }
.rp-content { display:flex; flex-direction:column; justify-content:center; gap:3px; }
.rp-content a { font-size:13px; font-weight:500; color:var(--np-text); text-decoration:none; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.rp-content a:hover { color:var(--np-primary); }
.rp-content span { font-size:11px; color:var(--np-text-secondary); }
.sidebar-product-item { display:flex; gap:10px; margin-bottom:12px; }
.sidebar-product-item:last-child { margin-bottom:0; }
.sp-img { flex-shrink:0; width:56px; height:56px; border-radius:var(--np-radius-sm); overflow:hidden; }
.sp-img img { width:100%; height:100%; object-fit:cover; }
.sp-info { display:flex; flex-direction:column; justify-content:center; gap:4px; }
.sp-name { font-size:12px; font-weight:500; color:var(--np-text); text-decoration:none; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.sp-name:hover { color:var(--np-primary); }
.sp-price { font-size:13px; font-weight:700; color:var(--np-red); }
.tag-cloud a { display:inline-block; padding:4px 10px; margin:3px; background:var(--np-bg); border:1px solid var(--np-border); border-radius:3px; font-size:12px !important; color:var(--np-text); text-decoration:none; transition:var(--np-transition); }
.tag-cloud a:hover { background:var(--np-primary); border-color:var(--np-primary); color:#fff; }
.np-no-posts { text-align:center; padding:40px; background:#fff; border-radius:var(--np-radius); box-shadow:var(--np-shadow); }
.np-no-posts i { font-size:48px; color:var(--np-border); margin-bottom:16px; display:block; } .np-single-post-page { padding:16px 0 40px; }
.np-article-header { margin-bottom:20px; }
.article-cats { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:10px; }
.article-cat-badge { background:var(--np-primary-light); color:var(--np-primary); padding:3px 12px; border-radius:20px; font-size:12px; font-weight:600; text-decoration:none; transition:var(--np-transition); }
.article-cat-badge:hover { background:var(--np-primary); color:#fff; }
.article-title { font-size:28px; font-weight:800; line-height:1.3; margin-bottom:14px; color:var(--np-text); }
.article-meta { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; padding:12px 0; border-top:1px solid var(--np-border-light); border-bottom:1px solid var(--np-border-light); }
.meta-author { display:flex; align-items:center; gap:10px; }
.author-avatar { border-radius:50%; }
.author-info { display:flex; flex-direction:column; }
.author-name { font-size:14px; font-weight:600; color:var(--np-text); }
.post-date { font-size:12px; color:var(--np-text-secondary); }
.meta-right { display:flex; gap:16px; font-size:12px; color:var(--np-text-secondary); }
.article-thumbnail { margin:20px 0; border-radius:var(--np-radius); overflow:hidden; }
.article-thumbnail img { width:100%; max-height:460px; object-fit:cover; }
.np-article-toc { background:var(--np-bg); border:1px solid var(--np-border); border-radius:var(--np-radius); padding:14px 16px; margin:20px 0; }
.toc-header { display:flex; align-items:center; gap:8px; cursor:pointer; }
.toc-header strong { font-size:14px; font-weight:700; color:var(--np-text); }
.toc-toggle { margin-left:auto; background:none; border:none; cursor:pointer; color:var(--np-text-secondary); font-size:14px; padding:2px 6px; }
#toc-body { margin-top:10px; }
#toc-body ol { padding-left:20px; counter-reset:item; list-style:none; }
#toc-body ol li { counter-increment:item; margin-bottom:6px; }
#toc-body ol li::before { content:counters(item,'.') '. '; font-size:12px; color:var(--np-text-secondary); font-weight:600; }
#toc-body a { font-size:13px; color:var(--np-primary); text-decoration:none; }
#toc-body a:hover { text-decoration:underline; }
.np-article-content { font-size:15px; line-height:1.8; color:var(--np-text); margin:20px 0; }
.np-article-content h2 { font-size:22px; font-weight:700; margin:28px 0 12px; color:var(--np-text); border-left:4px solid var(--np-primary); padding-left:14px; }
.np-article-content h3 { font-size:18px; font-weight:700; margin:20px 0 10px; }
.np-article-content h4 { font-size:16px; font-weight:600; margin:16px 0 8px; }
.np-article-content p { margin-bottom:16px; }
.np-article-content img { max-width:100%; border-radius:var(--np-radius); margin:16px 0; }
.np-article-content ul, .np-article-content ol { padding-left:24px; margin-bottom:16px; }
.np-article-content ul { list-style:disc; }
.np-article-content ol { list-style:decimal; }
.np-article-content li { margin-bottom:6px; }
.np-article-content blockquote { border-left:4px solid var(--np-primary); padding:12px 20px; background:var(--np-primary-light); border-radius:0 var(--np-radius) var(--np-radius) 0; margin:20px 0; font-style:italic; }
.np-article-content table { width:100%; border-collapse:collapse; margin:16px 0; }
.np-article-content table th { background:var(--np-primary); color:#fff; padding:10px 14px; text-align:left; font-size:13px; }
.np-article-content table td { padding:10px 14px; border:1px solid var(--np-border); font-size:13px; }
.np-article-content table tr:nth-child(even) td { background:var(--np-bg); }
.article-tags { display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:16px 0; border-top:1px solid var(--np-border); margin-top:20px; }
.article-tags i { color:var(--np-text-secondary); }
.article-tag { padding:4px 12px; border:1px solid var(--np-border); border-radius:3px; font-size:12px; color:var(--np-text); text-decoration:none; transition:var(--np-transition); }
.article-tag:hover { background:var(--np-primary); border-color:var(--np-primary); color:#fff; }
.article-share { display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:16px 0; border-top:1px solid var(--np-border); }
.share-label { font-size:13px; color:var(--np-text-secondary); font-weight:500; }
.share-btn { padding:6px 14px; border-radius:4px; font-size:13px; font-weight:600; cursor:pointer; text-decoration:none; transition:var(--np-transition); display:inline-flex; align-items:center; gap:6px; border:none; }
.share-fb { background:#1877f2; color:#fff; }
.share-zalo { background:#06c; color:#fff; }
.share-copy { background:var(--np-bg); border:1px solid var(--np-border) !important; color:var(--np-text); }
.share-copy:hover { background:var(--np-primary); color:#fff; border-color:var(--np-primary) !important; }
.np-author-box { display:flex; gap:16px; align-items:flex-start; background:var(--np-bg); border-radius:var(--np-radius); padding:20px; margin:24px 0; }
.author-box-avatar { border-radius:50%; flex-shrink:0; }
.author-box-info h4 { font-size:16px; font-weight:700; margin-bottom:6px; }
.author-box-info p { font-size:13px; color:var(--np-text-secondary); line-height:1.6; }
.np-post-nav { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:24px 0; }
.post-nav-prev, .post-nav-next { background:#fff; border:1px solid var(--np-border); border-radius:var(--np-radius); padding:14px 16px; text-decoration:none; transition:var(--np-transition); }
.post-nav-next { text-align:right; }
.post-nav-prev:hover, .post-nav-next:hover { border-color:var(--np-primary); background:var(--np-primary-light); }
.nav-label { font-size:11px; color:var(--np-text-secondary); text-transform:uppercase; letter-spacing:.5px; display:block; margin-bottom:4px; }
.nav-title { font-size:13px; font-weight:600; color:var(--np-text); display:block; line-height:1.4; }
.np-related-posts { margin:24px 0; }
.related-posts-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.related-post-item { display:flex; gap:12px; background:#fff; border:1px solid var(--np-border); border-radius:var(--np-radius); overflow:hidden; text-decoration:none; transition:var(--np-transition); }
.related-post-item:hover { border-color:var(--np-primary); box-shadow:var(--np-shadow); }
.rel-thumb { flex-shrink:0; width:100px; }
.rel-thumb img { width:100%; height:80px; object-fit:cover; }
.rel-content { padding:10px; }
.rel-content h4 { font-size:13px; font-weight:600; color:var(--np-text); margin-bottom:4px; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.rel-content span { font-size:12px; color:var(--np-text-secondary); }
.np-article-product-cta { background:linear-gradient(135deg,var(--np-primary) 0%,var(--np-primary-dark) 100%); border-radius:var(--np-radius); padding:24px; margin:24px 0; color:#fff; }
.np-article-product-cta h3 { font-size:18px; font-weight:700; margin-bottom:8px; color:#fff; }
.np-article-product-cta p { font-size:14px; color:rgba(255,255,255,.85); margin-bottom:16px; }
.cta-buttons { display:flex; gap:10px; flex-wrap:wrap; }
.np-comments-section { margin-top:24px; }
.sticky-toc { position:sticky; top:80px; }
#np-sidebar-toc { font-size:12px; }
#np-sidebar-toc a { color:var(--np-primary); display:block; padding:3px 0; text-decoration:none; line-height:1.4; border-left:3px solid transparent; padding-left:8px; transition:var(--np-transition); }
#np-sidebar-toc a:hover, #np-sidebar-toc a.active { color:var(--np-primary-dark); border-left-color:var(--np-primary); background:var(--np-primary-light); } .np-404-page { padding:60px 0; }
.np-404-content { text-align:center; max-width:540px; margin:0 auto; }
.not-found-icon { font-size:80px; color:var(--np-primary); opacity:.3; margin-bottom:16px; }
.error-code { font-size:96px; font-weight:800; color:var(--np-primary); line-height:1; margin-bottom:8px; }
.np-404-content h2 { font-size:24px; font-weight:700; margin-bottom:10px; }
.np-404-content p { color:var(--np-text-secondary); margin-bottom:24px; }
.not-found-search { margin:24px 0; }
.not-found-search form { display:flex; gap:8px; }
.not-found-actions { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; } .np-trust-strip { background:#fff; border-top:1px solid var(--np-border); border-bottom:1px solid var(--np-border); }
.np-trust-strip__items { display:flex; align-items:center; justify-content:space-around; flex-wrap:wrap; gap:8px; padding:14px 0; }
.np-trust-item { display:flex; align-items:center; gap:12px; }
.np-trust-item .icon { font-size:28px; }
.np-trust-item .text { display:flex; flex-direction:column; }
.np-trust-item .text strong { font-size:13px; font-weight:700; color:var(--np-text); }
.np-trust-item .text span { font-size:11px; color:var(--np-text-secondary); } .np-footer { background:#1a1a2e; color:rgba(255,255,255,.75); }
.np-footer__main { padding:40px 0 24px; }
.np-footer__grid { display:grid; grid-template-columns:2fr 1.2fr 1.2fr 1.5fr; gap:32px; }
.np-footer__about { }
.footer-logo { margin-bottom:14px; }
.footer-logo-text .logo-main { font-size:24px; font-weight:800; color:#fff; }
.footer-logo-text .logo-sub { font-size:10px; color:rgba(255,255,255,.5); letter-spacing:1px; text-transform:uppercase; }
.np-footer__logo img { max-height:48px; filter:brightness(0) invert(1); }
.footer-desc { font-size:13px; line-height:1.7; margin-bottom:16px; color:rgba(255,255,255,.6); }
.footer-contact-list { display:flex; flex-direction:column; gap:8px; margin-bottom:16px; }
.contact-item { display:flex; align-items:flex-start; gap:10px; font-size:13px; color:rgba(255,255,255,.6); }
.contact-item i { color:var(--np-secondary); width:16px; flex-shrink:0; margin-top:2px; }
.contact-item a { color:rgba(255,255,255,.8); text-decoration:none; }
.contact-item a:hover { color:#fff; }
.footer-social { display:flex; gap:8px; }
.social-btn { width:34px; height:34px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:14px; text-decoration:none; transition:var(--np-transition); }
.social-btn.fb { background:#1877f2; color:#fff; }
.social-btn.zalo { background:#06c; color:#fff; font-size:10px; font-weight:800; }
.social-btn.phone { background:var(--np-green); color:#fff; }
.social-btn.yt { background:#ff0000; color:#fff; }
.social-btn:hover { opacity:.85; transform:translateY(-2px); }
.footer-col-title { font-size:14px; font-weight:700; color:#fff; margin-bottom:14px; padding-bottom:10px; border-bottom:1px solid rgba(255,255,255,.1); text-transform:uppercase; letter-spacing:.5px; }
.footer-links { display:flex; flex-direction:column; gap:6px; }
.footer-links li a { display:flex; align-items:center; gap:8px; font-size:13px; color:rgba(255,255,255,.6); text-decoration:none; padding:3px 0; transition:var(--np-transition); }
.footer-links li a:hover { color:#fff; padding-left:4px; }
.footer-links li a i { font-size:10px; color:var(--np-secondary); opacity:.7; flex-shrink:0; }
.footer-recent-posts { display:flex; flex-direction:column; gap:12px; margin-bottom:16px; }
.footer-post-item { display:flex; gap:10px; }
.footer-post-item .post-thumb { flex-shrink:0; width:56px; height:52px; border-radius:4px; overflow:hidden; }
.footer-post-item .post-thumb img { width:100%; height:100%; object-fit:cover; }
.footer-post-item .no-thumb { width:56px; height:52px; background:rgba(255,255,255,.05); border-radius:4px; display:flex; align-items:center; justify-content:center; }
.footer-post-item .no-thumb i { color:rgba(255,255,255,.2); font-size:18px; }
.footer-post-item .post-info { display:flex; flex-direction:column; justify-content:center; gap:3px; }
.footer-post-item .post-title { font-size:12px; color:rgba(255,255,255,.7); text-decoration:none; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.footer-post-item .post-title:hover { color:#fff; }
.footer-post-item .post-date { font-size:11px; color:rgba(255,255,255,.4); }
.footer-newsletter h5 { font-size:13px; font-weight:600; color:rgba(255,255,255,.8); margin-bottom:8px; }
.newsletter-form { display:flex; gap:6px; }
.newsletter-input { flex:1; padding:9px 12px; border:1px solid rgba(255,255,255,.15); border-radius:var(--np-radius-sm); background:rgba(255,255,255,.08); color:#fff; font-size:13px; outline:none; }
.newsletter-input::placeholder { color:rgba(255,255,255,.3); }
.newsletter-input:focus { border-color:rgba(255,255,255,.4); }
.newsletter-btn { padding:9px 14px; background:var(--np-secondary); color:#fff; border:none; border-radius:var(--np-radius-sm); cursor:pointer; transition:var(--np-transition); }
.newsletter-btn:hover { background:var(--np-secondary-dark); }
.np-footer__delivery { background:rgba(0,0,0,.2); padding:10px 0; }
.np-footer__delivery p { font-size:12px; color:rgba(255,255,255,.5); text-align:center; line-height:1.6; }
.np-footer__delivery strong { color:rgba(255,255,255,.7); }
.np-footer__delivery i { color:var(--np-secondary); }
.np-footer__bottom { background:rgba(0,0,0,.3); padding:14px 0; }
.np-footer__bottom-inner { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.copyright p { font-size:12px; color:rgba(255,255,255,.4); margin-bottom:2px; }
.copyright strong { color:rgba(255,255,255,.6); }
.payment-methods { display:flex; align-items:center; gap:8px; }
.payment-methods span { font-size:12px; color:rgba(255,255,255,.4); }
.payment-methods img { height:24px; opacity:.7; }
.payment-cash { font-size:12px; color:rgba(255,255,255,.6); background:rgba(255,255,255,.1); padding:2px 10px; border-radius:3px; font-weight:700; } .np-breadcrumb-wrap { margin-bottom:12px; }
.np-breadcrumb { font-size:13px; color:var(--np-text-secondary); display:flex; align-items:center; flex-wrap:wrap; gap:2px; }
.np-breadcrumb a { color:var(--np-text-secondary); text-decoration:none; }
.np-breadcrumb a:hover { color:var(--np-primary); }
.np-breadcrumb .sep { margin:0 4px; font-size:10px; opacity:.5; }
.np-breadcrumb .current { color:var(--np-text); } .woocommerce-message, .woocommerce-info, .woocommerce-error {
padding:12px 16px; border-radius:var(--np-radius-sm); margin-bottom:16px; font-size:13px;
display:flex; align-items:center; gap:8px;
}
.woocommerce-message { background:#e8f5e9; border-left:4px solid var(--np-green); color:var(--np-green); }
.woocommerce-info { background:var(--np-primary-light); border-left:4px solid var(--np-primary); color:var(--np-primary); }
.woocommerce-error { background:var(--np-red-light); border-left:4px solid var(--np-red); color:var(--np-red); } @media (max-width: 1200px) {
:root { --np-container: 1040px; }
.np-hero-layout { grid-template-columns:200px 1fr; }
.np-hero-side { display:none; }
.np-product-grid-5, .np-shop-grid { grid-template-columns:repeat(4,1fr); }
.np-cat-grid { grid-template-columns:repeat(auto-fill, minmax(120px, 1fr)); }
.np-related-swiper .swiper-slide { width:calc((100% - 36px) / 4); }
.np-sp-related-swiper .swiper-slide { width:calc((100% - 36px) / 4); }
.np-sp-gallery { min-width:0; }
}
@media (max-width: 992px) {
.np-sp-top { grid-template-columns:1fr; gap:20px; }
.np-sp-img-wrap { height:50vw; max-height:360px; }
.np-sp-gallery { max-width:100%; }
.np-sp-related-swiper .swiper-slide { width:calc((100% - 24px) / 3); }
.np-product-grid-5, .np-shop-grid { grid-template-columns:repeat(3,1fr); }
.np-cat-grid { grid-template-columns:repeat(auto-fill, minmax(110px, 1fr)); }
.np-shop-main { grid-template-columns:1fr; }
.np-shop-filter-sidebar { display:none; position:fixed; top:0; right:-100%; height:100vh; width:300px; z-index:500; overflow-y:auto; transition:right .3s ease; }
.np-shop-filter-sidebar.open { display:block; right:0; }
.np-stats-grid { grid-template-columns:repeat(2,1fr); }
.np-why-grid { grid-template-columns:repeat(2,1fr); }
.np-sp-policy-grid { grid-template-columns:repeat(2,1fr); }
.np-footer__grid { grid-template-columns:repeat(2,1fr); }
.np-news-layout { grid-template-columns:1fr; }
.np-blog-layout { grid-template-columns:1fr; }
.np-blog-sidebar { display:none; }
.np-promo-banners { grid-template-columns:1fr; }
}
@media (max-width: 768px) {
.np-topbar .np-topbar__left { display:none; }
.np-header__inner { flex-wrap:wrap; gap:8px; }
.np-header__search { order:3; width:100%; max-width:100%; margin-top:4px; }
.np-search-input { font-size:16px; }
.np-search-cat { display:none; }
.np-header__meta { gap:8px; }
.meta-text { display:none; }
.np-hotline { display:none; }
.np-menu-toggle { display:flex; }
.np-nav { display:none; }
.np-hero-layout { grid-template-columns:1fr; }
.np-hero-cats { display:none; }
.np-banner-image { display:none; }
.np-product-grid-5, .np-shop-grid { grid-template-columns:repeat(2,1fr); gap:8px; }
.np-cat-grid { grid-template-columns:repeat(auto-fill, minmax(100px, 1fr)); gap:8px; }
.np-cat-card__img { width:56px; height:56px; }
.np-flash-sale-header { flex-wrap:wrap; gap:8px; }
.np-cta-box { flex-direction:column; padding:24px; }
.np-cart-layout { grid-template-columns:1fr; }
.np-cart-items { overflow:visible; }
.np-cart-table { display:block; width:100%; border-radius:0; box-shadow:none; background:transparent; }
.np-cart-table thead { display:none; }
.np-cart-table tbody { display:block; }
.np-cart-row { display:block; background:#fff; border-radius:var(--np-radius); box-shadow:var(--np-shadow); padding:14px; position:relative; margin-bottom:12px; overflow:hidden; }
.np-cart-row td { display:block; padding:0; border:none; }
.np-cart-row .col-product { margin-bottom:10px; padding-right:28px; }
.np-cart-row .col-product .cart-product-info { min-width:0; }
.np-cart-row .col-product .cart-product-name { font-size:13px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.np-cart-row .col-price { display:inline-block; font-size:13px; color:var(--np-red); font-weight:600; margin-right:16px; }
.np-cart-row .col-price::before { content:'Giá: '; font-weight:400; color:var(--np-text-secondary); }
.np-cart-row .col-qty { display:inline-block; vertical-align:middle; }
.np-cart-row .col-total { margin-top:8px; padding-top:8px; border-top:1px solid var(--np-border-light); font-size:14px; text-align:right; }
.np-cart-row .col-total::before { content:'Thành tiền: '; font-weight:400; color:var(--np-text-secondary); }
.np-cart-row .col-remove { position:absolute; top:14px; right:14px; z-index:2; }
.np-cart-row .col-remove .cart-remove-btn { display:flex; align-items:center; justify-content:center; width:28px; height:28px; background:var(--np-bg); border-radius:50%; font-size:13px; }
.cart-product-img img { width:56px; height:56px; }
.np-cart-qty { width:52px; padding:5px; font-size:13px; }
.cart-actions { flex-direction:column; gap:8px; }
.cart-actions .np-btn { width:100%; justify-content:center; text-align:center; }
.np-coupon-form { flex-direction:column; }
.np-coupon-form .np-input { max-width:100% !important; }
.np-post-nav { grid-template-columns:1fr; }
.related-posts-grid { grid-template-columns:1fr; }
.np-footer__grid { grid-template-columns:1fr; }
.np-trust-strip__items { gap:12px; }
.np-trust-item .text span { display:none; }
.np-stats-grid { grid-template-columns:repeat(2,1fr); gap:16px; }
.stat-number { font-size:36px; }
.why-icon { font-size:32px; }
.np-why-grid, .np-sp-policy-grid { grid-template-columns:1fr; }
.np-sp-top { padding:16px; }
.np-sp-title { font-size:20px; }
.np-sp-price { font-size:26px; }
.np-sp-img-wrap { height:55vw; max-height:280px; }
.np-sp-cart__buttons { flex-direction:column; }
.np-sp-btn { min-width:unset; }
.np-sp-trust { grid-template-columns:1fr; }
.np-sp-specs td:first-child { width:40%; }
.np-sp-hotline { flex-wrap:wrap; }
.np-sp-tabs__nav { padding:0 12px; }
.np-sp-tab { padding:12px 14px; font-size:13px; }
.np-sp-tabs__panel { padding:16px; }
.np-sp-related-swiper .swiper-slide { width:calc((100% - 16px) / 2); }
.np-sp-sticky-bar { display:flex; align-items:center; gap:8px; }
.np-sp-sticky-bar__price { display:flex; align-items:baseline; gap:6px; white-space:nowrap; flex-shrink:0; }
.np-sp-sticky-bar__price .s-price { font-size:15px; font-weight:800; color:var(--np-red); }
.np-sp-sticky-bar__price .s-old { font-size:11px; color:var(--np-text-secondary); text-decoration:line-through; font-weight:500; }
body.single-product { padding-bottom:70px; }
.np-review-stats { flex-direction:column; gap:16px; }
.np-blog-grid { grid-template-columns:1fr; }
.np-info-badges { flex-direction:column; align-items:flex-start; gap:12px; }
}
@media (max-width: 480px) {
.np-product-grid-5, .np-shop-grid { grid-template-columns:repeat(2,1fr); gap:6px; }
.np-cat-grid { grid-template-columns:repeat(auto-fill, minmax(90px, 1fr)); }
.np-banner-slide { padding:20px; min-height:240px !important; }
.np-hero-slider { min-height:240px; }
.np-hero-slider .np-banner-swiper { min-height:240px; }
.np-banner-content h2 { font-size:18px; }
.np-sp-img-wrap { height:60vw; max-height:240px; }
.section-header { flex-direction:column; align-items:flex-start; gap:6px; }
.np-promo-banners, .np-footer__delivery p { font-size:11px; }
.article-title { font-size:20px; }
} .np-trust-badges-bar { background:#f0f2f5; padding:16px 0; border-top:1px solid var(--np-border); border-bottom:1px solid var(--np-border); }
.np-section-sm { padding:24px 0; }
.np-product-block { padding:32px 0; }
.np-no-products-msg { text-align:center; padding:32px; color:var(--np-text-secondary); font-size:15px; }
.section-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; padding:0 4px; }
.section-header .title { font-size:20px; font-weight:700; color:var(--np-text); display:flex; align-items:center; gap:10px; }
.section-header .title::before { content:''; display:inline-block; width:4px; height:22px; background:var(--np-primary); border-radius:2px; flex-shrink:0; }
.section-header .title .title-accent { display:inline-block; width:4px; height:24px; border-radius:2px; }
.section-header .view-all { font-size:13px; color:var(--np-primary); text-decoration:none; display:flex; align-items:center; gap:4px; white-space:nowrap; }
.section-header .view-all:hover { color:var(--np-primary-dark); }
.section-title { margin-bottom:32px; }
.section-title h2 { font-size:26px; font-weight:800; color:var(--np-text); margin-bottom:8px; }
.section-title h2 span { color:var(--np-primary); }
.section-title p { color:var(--np-text-secondary); font-size:15px; }
.np-flash-sale-section .section-header, .np-reviews-section .section-title { }
.np-slide-card { height:100%; }
.np-homepage .np-section { padding:40px 0; }.is-small-text{font-size:.875em}.is-regular-text{font-size:1em}.is-large-text{font-size:2.25em}.is-larger-text{font-size:3em}.has-drop-cap:not(:focus):first-letter{float:left;font-size:8.4em;font-style:normal;font-weight:100;line-height:.68;margin:.05em .1em 0 0;text-transform:uppercase}body.rtl .has-drop-cap:not(:focus):first-letter{float:none;margin-left:.1em}p.has-drop-cap.has-background{overflow:hidden}:root :where(p.has-background){padding:1.25em 2.375em}:where(p.has-text-color:not(.has-link-color)) a{color:inherit}p.has-text-align-left[style*="writing-mode:vertical-lr"],p.has-text-align-right[style*="writing-mode:vertical-rl"]{rotate:180deg}h1:where(.wp-block-heading).has-background,h2:where(.wp-block-heading).has-background,h3:where(.wp-block-heading).has-background,h4:where(.wp-block-heading).has-background,h5:where(.wp-block-heading).has-background,h6:where(.wp-block-heading).has-background{padding:1.25em 2.375em}h1.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h1.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h2.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h2.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h3.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h3.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h4.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h4.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h5.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h5.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]),h6.has-text-align-left[style*=writing-mode]:where([style*=vertical-lr]),h6.has-text-align-right[style*=writing-mode]:where([style*=vertical-rl]){rotate:180deg}