/*
Theme Name: ShopKit
Description: Giao dien cua hang WooCommerce dung UX Builder. Can theme Flatsome voi giay phep rieng cho moi site.
Author: Ezweb247
Template: flatsome
Version: 1.0.0
Requires PHP: 7.4
Text Domain: shopkit
*/

/* Dau, chan trang: toan site khi ban UX bat. Than trang: chi trang chu (.sk-home). */
:root {
  --sk-ink: #101c2e;
  --sk-muted: #5a6677;
  --sk-line: #dde2e8;
  --sk-paper: #f3f5f7;
  --sk-hi-dark: color-mix(in srgb, var(--sk-hi) 88%, #000);
  --sk-silver: #c8ced6;
  --sk-display: "Barlow Condensed", "Arial Narrow", sans-serif;
  --sk-body: "Be Vietnam Pro", system-ui, sans-serif;
}

/* ---- Dau trang ---- */
.sk-site .header-wrapper, .sk-site .header-wrapper input, .sk-site #footer { font-family: var(--sk-body); }
.sk-site #top-bar { font-size: 13px; }
.sk-site #top-bar .html a { margin-left: 24px; color: #d4dceb; }
.sk-site #top-bar .html a:hover { color: #fff; }
.sk-site #masthead { border-bottom: 1px solid var(--sk-line); }
/* Logo: anh, ten va dong phu dat bang grid vi Flatsome chi xuat anh */
.sk-site #logo a { display: grid; grid-template-columns: auto auto; align-items: center; justify-content: start; column-gap: 12px; width: auto; }
.sk-site #logo img { grid-row: 1 / 3; width: 62px; height: 52px; max-height: 52px; margin: 0; object-fit: contain; border-radius: 4px; }
.sk-site #logo a::before { content: var(--sk-brand); grid-column: 2; align-self: end; color: var(--sk-blue); font: 700 27px/1 var(--sk-display); letter-spacing: .02em; text-transform: uppercase; white-space: nowrap; }
.sk-site #logo a::after { content: var(--sk-tagline); grid-column: 2; align-self: start; justify-self: start; margin-top: 3px; color: var(--sk-muted); font: 400 12px/1.2 var(--sk-body); letter-spacing: 0; text-transform: none; white-space: nowrap; }
.sk-site #logo img.header-logo-dark { display: none; }

/* Tim kiem */
.sk-site #masthead .flex-left { flex: 1 1 auto; }
.sk-site #masthead .header-search-form { width: 100%; max-width: 700px; margin-inline: auto; }
.sk-site #masthead .searchform .flex-row { border: 1.5px solid var(--sk-line); border-radius: 4px; background: #fff; transition: border-color .15s; }
.sk-site #masthead .searchform .flex-row:focus-within { border-color: var(--sk-blue); }
.sk-site #masthead .searchform input[type=search] { height: 46px; padding-inline: 14px; border: 0; background: none; box-shadow: none; color: var(--sk-ink); font-size: 16px; }
.sk-site #masthead .searchform input[type=search]::placeholder { color: var(--sk-muted); }
.sk-site #masthead .searchform .button { width: 50px; height: 46px; margin: 0; border: 0; background: none; box-shadow: none; color: var(--sk-blue); font-size: 18px; }
.sk-site #masthead .searchform .button i { color: var(--sk-blue); }

/* Hotline */
.sk-site #masthead .header-block { width: auto; }

/* Gio hang: nut vuong thay cho tui cam. Trang duoc cache nen chi hien cham bao khi co hang. */
.sk-site .header-cart-link { position: relative; display: grid; place-items: center; width: 46px; height: 46px; padding: 0 !important; border-radius: 4px; background: var(--sk-paper); transition: background-color .15s; }
.sk-site .header-cart-link:hover { background: var(--sk-line); }
.sk-site .header-cart-title { display: none; }
.sk-site .header-cart-link .cart-icon { display: block; width: 24px; height: 24px; margin: 0; background: var(--sk-ink); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4h2.2l2.2 11h10.2l2-8H6'/%3E%3Ccircle cx='9' cy='19.5' r='1.4'/%3E%3Ccircle cx='16.5' cy='19.5' r='1.4'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4h2.2l2.2 11h10.2l2-8H6'/%3E%3Ccircle cx='9' cy='19.5' r='1.4'/%3E%3Ccircle cx='16.5' cy='19.5' r='1.4'/%3E%3C/svg%3E") center / contain no-repeat; }
.sk-site .header-cart-link .cart-icon strong { display: none; }
.sk-site .header-cart-link.has-items::after { content: ""; position: absolute; top: 9px; right: 9px; width: 9px; height: 9px; border-radius: 50%; background: var(--sk-hi); box-shadow: 0 0 0 2px var(--sk-paper); }
.sk-site .header-bottom { background: var(--sk-blue) !important; }
.sk-site .header-bottom-nav > li > a { padding: 12px 18px; color: #fff !important; font: 700 18px/1.3 var(--sk-display); letter-spacing: .04em; text-transform: uppercase; }
.sk-site .header-bottom-nav > li:first-child > a { padding-left: 0; }
.sk-site .header-bottom-nav > li:hover > a, .sk-site .header-bottom-nav > li:focus-within > a { background: var(--sk-deep); }

/* Mega menu San pham */
@media (min-width: 850px) { .sk-site .ux-body-overlay { display: none !important; } }

.sk-site .header-wrapper .container, .sk-site #footer .row { max-width: 1280px; }

/* ---- Chan trang ---- */
.sk-site .sk-footer { padding-block: 48px 24px !important; color: #c7d0dd; font-size: 14px; }
.sk-site .sk-footer h4 { margin-bottom: 14px; color: #fff; font: 600 15px/1.45 var(--sk-body); }
.sk-site .sk-footer p { margin-bottom: 8px; }
.sk-site .sk-footer strong { color: #fff; font-weight: 500; }
.sk-site .sk-footer ul { margin: 0; }
.sk-site .sk-footer li { margin: 0; padding: 3px 0; list-style: none; }
.sk-site .sk-footer a { color: inherit; }
.sk-site .sk-footer a:hover { color: #fff; text-decoration: underline; }

/* ---- Trang chu ---- */
.sk-home #main { background: #fff; color: var(--sk-ink); font: 400 15px/1.6 var(--sk-body); }
.sk-home #main .row:not(.row-full-width) { max-width: 1280px; }
.sk-home #main h1, .sk-home #main h2 { font-family: var(--sk-display); font-weight: 700; text-transform: uppercase; text-wrap: balance; }
.sk-home #main h2 { margin-bottom: 0; color: var(--sk-ink); font-size: clamp(32px, 3.4vw, 44px); line-height: 1.08; }
.sk-home #main .sk-factory h2 { color: #fff; }
.sk-home #main .shelf-panel .more { margin-top: 20px; }
.sk-home #main .eyebrow { margin-bottom: 12px; color: var(--sk-hi); font: 700 18px/1.2 var(--sk-display); letter-spacing: .06em; text-transform: uppercase; }
.sk-home #main .lede { max-width: 54ch; margin: 18px 0 0; color: #d4dceb; font-size: 17px; }
.sk-home #main .more { margin: 0; }
.sk-home #main .more a { font-weight: 600; }
.sk-home #main .button { min-height: 50px; margin: 0 8px 8px 0; padding: 10px 24px; border-radius: 4px; font: 600 15px/30px var(--sk-body); text-transform: none; letter-spacing: 0; }
.sk-home #main .btn-hi { background: var(--sk-hi); border-color: var(--sk-hi); color: var(--sk-ink); }
.sk-home #main .btn-hi:hover { background: var(--sk-hi-dark); box-shadow: none; }
.sk-home #main .btn-line { border: 2px solid rgba(255, 255, 255, .5); background: none; color: #fff; }
.sk-home #main .btn-line:hover { border-color: #fff; background: none; box-shadow: none; }

/* Hero: dai phan quang lam net nhan dien */
.sk-hero .section-content::after, .sk-factory .factory-img::after { content: ""; display: block; height: 12px; background: linear-gradient(var(--sk-hi) 0 25%, var(--sk-silver) 25% 75%, var(--sk-hi) 75%); }
.sk-hero .row { align-items: stretch; }
.sk-hero .hero-copy { align-self: center; padding: 64px 56px 64px max(16px, calc((100vw - 1248px) / 2)) !important; }
.sk-home #main .sk-hero h1 { margin: 0; color: #fff; font-size: clamp(42px, 5vw, 68px); line-height: 1.04; }
.sk-home #main .hero-copy .lede, .sk-home #main .sk-factory .lede { margin-bottom: 30px; }
.sk-hero .hero-img { position: relative; min-height: 460px; padding: 0 !important; }
.sk-hero .hero-img .col-inner, .sk-hero .hero-img .img, .sk-hero .hero-img .img-inner { position: absolute; inset: 0; width: 100% !important; height: 100%; margin: 0; }
.sk-hero .hero-img img { width: 100%; height: 100%; object-fit: cover; object-position: 30% center; }

/* So lieu */
.sk-facts { padding-block: 28px !important; }
.sk-facts .col { padding: 0 24px !important; border-left: 1px solid var(--sk-line); }
.sk-facts .col:first-child { padding-left: 15px !important; border-left: 0; }
.sk-facts p { margin: 0; color: var(--sk-muted); font-size: 14px; }
.sk-home #main .fact-num { color: var(--sk-blue); font: 700 32px/1.1 var(--sk-display); text-transform: uppercase; }

/* Tieu de muc */
.sec-head .text, .sec-head .col-inner > p { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.sk-home .sec-head .more a { color: var(--sk-blue); white-space: nowrap; }
.sk-home .sec-head { padding-bottom: 8px !important; }

/* Danh muc 7 cot: col cua Flatsome duoc dat lai vi tri bang grid */

/* Ke san pham */
.sk-shelf { padding-block: 24px !important; }
.sk-shelf .shelf-panel { padding-bottom: 0 !important; }
.sk-shelf .shelf-panel > .col-inner { position: sticky; top: 140px; padding: 26px 24px; border-radius: 4px; background: var(--sk-blue); box-shadow: inset 0 8px 0 var(--sk-hi); color: #fff; }
.sk-home #main .shelf-panel h2 { margin-top: 6px; color: #fff; font-size: 40px; }
.sk-shelf .shelf-panel p { margin: 12px 0 0; color: #dbe5f5; font-size: 14px; }
.sk-shelf .shelf-subs { margin: 16px 0 0; border-top: 1px solid rgba(255, 255, 255, .22); }
.sk-shelf .shelf-subs li { margin: 0; list-style: none; }
.sk-shelf .shelf-subs a { display: block; padding: 9px 0; border-bottom: 1px solid rgba(255, 255, 255, .22); color: #fff; font-size: 14px; }
.sk-shelf .shelf-subs a:hover { color: color-mix(in srgb, var(--sk-hi) 45%, #fff); }
.sk-shelf .shelf-panel .more { margin-top: 20px; }
.sk-shelf .shelf-panel .more a { color: color-mix(in srgb, var(--sk-hi) 45%, #fff); }

/* The san pham */
:is(.sk-home, .sk-shop, .sk-pd) .product-small .box { display: flex; flex-direction: column; height: 100%; border: 1px solid var(--sk-line); border-radius: 4px; overflow: hidden; background: #fff; transition: border-color .15s, box-shadow .15s; }
:is(.sk-home, .sk-shop, .sk-pd) .product-small .box:hover { border-color: var(--sk-blue); box-shadow: 0 6px 18px color-mix(in srgb, var(--sk-blue) 12%, transparent); }
:is(.sk-home, .sk-shop, .sk-pd) .product-small .box-text { flex: 1; padding: 12px 14px 14px; text-align: left; }
:is(.sk-home, .sk-shop, .sk-pd) .product-small .box-image { aspect-ratio: 1; }
:is(.sk-home, .sk-shop, .sk-pd) .product-small .box-image img { width: 100%; height: 100%; object-fit: contain; }
:is(.sk-home, .sk-shop, .sk-pd) .product-small .name a { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; min-height: 2.8em; color: var(--sk-ink); font: 500 15px/1.4 var(--sk-body); }
:is(.sk-home, .sk-shop, .sk-pd) .product-small .price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; margin-top: 8px; color: var(--sk-blue); }
:is(.sk-home, .sk-shop, .sk-pd) .product-small .price ins { order: -1; text-decoration: none; }
:is(.sk-home, .sk-shop, .sk-pd) .product-small .price .amount { color: var(--sk-blue); font: 700 16px/1.3 var(--sk-body); }
:is(.sk-home, .sk-shop, .sk-pd) .product-small .price del { opacity: 1; }
:is(.sk-home, .sk-shop, .sk-pd) .product-small .price del .amount { color: var(--sk-muted); font-size: 13px; font-weight: 400; }
:is(.sk-home, .sk-shop, .sk-pd) .product-small .screen-reader-text { position: absolute; clip: rect(1px, 1px, 1px, 1px); }
:is(.sk-home, .sk-shop, .sk-pd) .product-small .ux-swatches, :is(.sk-home, .sk-shop, .sk-pd) .product-small .grid-tools, :is(.sk-home, .sk-shop, .sk-pd) .product-small .image-tools, :is(.sk-home, .sk-shop, .sk-pd) .product-small .category { display: none !important; }
:is(.sk-home, .sk-shop, .sk-pd) .product-small .badge-container { margin: 10px 0 0; }
:is(.sk-home, .sk-shop, .sk-pd) .product-small .badge { height: auto; width: auto; }
:is(.sk-home, .sk-shop, .sk-pd) .product-small .badge-inner { height: auto; padding: 2px 9px; border-radius: 0 3px 3px 0; background: var(--sk-hi) !important; color: var(--sk-ink); font: 700 13px/1.5 var(--sk-body); }

/* May theo yeu cau */
/* Anh goc co dai chu xanh tren, duoi: cat chi lay phan anh xuong may */

/* Tin tuc: 1 bai lon, 3 bai nho */
.sk-news { padding-block: 32px 40px !important; }
.sk-news .row-small, .sk-news .row .row { display: grid !important; grid-template-columns: 1.35fr 1fr; gap: 16px 28px; margin: 0 !important; }
.sk-news .post-item { width: auto !important; max-width: none !important; flex: none !important; padding: 0 !important; }
.sk-news .post-item:first-child { grid-row: 1 / 4; }
.sk-news .post-item:not(:first-child) .box { display: flex; gap: 16px; align-items: flex-start; }
.sk-news .post-item:not(:first-child) .box-image { flex: 0 0 150px; width: 150px; }
.sk-news .box-image { border-radius: 4px; overflow: hidden; }
.sk-news .box-text { padding: 12px 0 0 !important; text-align: left; }
.sk-news .post-item:not(:first-child) .box-text { padding-top: 0 !important; }
.sk-news .post-title { color: var(--sk-ink); font: 600 16px/1.4 var(--sk-body); }
.sk-news .post-item:first-child .post-title { font: 700 30px/1.15 var(--sk-display); }
.sk-news .is-divider { display: none; }
.sk-news .post-item:not(:first-child) .from_the_blog_excerpt { display: none; }
.sk-news .from_the_blog_excerpt { margin-top: 8px; color: var(--sk-muted); }
.sk-news .post-meta { color: var(--sk-muted); font-size: 13px; }
.sk-news .badge { display: none; }

/* Lien he */
.sk-contact { padding-block: 36px 28px !important; }
.sk-contact p { margin: 6px 0 0; color: var(--sk-ink); }
.sk-home #main .sk-contact h2 { color: var(--sk-ink); }
.sk-contact .people .col-inner { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.sk-home #main .sk-contact .button { margin: 0; background: var(--sk-ink); border-color: var(--sk-ink); color: #fff; }
.sk-home #main .sk-contact .button:hover { background: var(--sk-deep); box-shadow: none; }

/* Thanh lien he */
.sk-dock { position: fixed; right: 16px; bottom: 16px; z-index: 50; display: flex; gap: 8px; font-family: var(--sk-body); }
.sk-dock a { display: flex; align-items: center; justify-content: center; gap: 8px; height: 46px; padding-inline: 16px; border: 1px solid var(--sk-line); border-radius: 4px; background: #fff; box-shadow: 0 4px 14px rgba(16, 28, 46, .18); color: var(--sk-ink); font-size: 14px; font-weight: 600; }
.sk-dock a:nth-child(n+3) { display: none; }
.sk-dock svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sk-dock .dock-call { border-color: var(--sk-hi); background: var(--sk-hi); }
.sk-dock .dock-zalo { color: var(--sk-blue); }

@media (max-width: 849px) {
  .sk-site #logo a::before { font-size: 23px; }
  .sk-site #logo img { width: 50px; height: 42px; }

  .sk-hero .hero-copy { order: 2; padding: 28px 16px 32px !important; }
  .sk-hero .hero-img { order: 1; min-height: 0; aspect-ratio: 16 / 9; }
  .sk-home #main .sk-hero h1 { font-size: clamp(38px, 11vw, 54px); }
  .sk-home #main .lede { font-size: 16px; }
  .sk-hero .hero-copy .button { display: flex; width: 100%; margin-right: 0; justify-content: center; }
  .sk-hero .hero-copy .button + .button { margin-top: 0; }

  .sk-facts { padding-block: 22px !important; }
  .sk-facts .col { padding: 0 14px 18px !important; }
  .sk-facts .col:nth-child(odd) { padding-left: 15px !important; border-left: 0; }
  .sk-home #main .fact-num { font-size: 26px; }
  .sk-facts p { font-size: 13px; line-height: 1.35; }

  .sec-head .text, .sec-head .col-inner > p { flex-direction: column; align-items: flex-start; gap: 6px; }

  .sk-shelf { padding-block: 16px !important; }
  .sk-shelf .shelf-panel > .col-inner { position: static; padding: 22px 16px 18px; }
  .sk-home #main .shelf-panel h2 { font-size: 34px; }
  .sk-shelf .shelf-subs { display: flex; flex-wrap: wrap; gap: 8px; border: 0; }
  .sk-shelf .shelf-subs a { padding: 5px 12px; border: 1px solid rgba(255, 255, 255, .35); border-radius: 3px; }
  :is(.sk-home, .sk-shop, .sk-pd) .product-small .box-text { padding: 10px; }
  :is(.sk-home, .sk-shop, .sk-pd) .product-small .name a { font-size: 14px; }


  .sk-news .row-small, .sk-news .row .row { grid-template-columns: minmax(0, 1fr); }
  .sk-news .post-item:first-child { grid-row: auto; }
  .sk-news .post-item:not(:first-child) .box-image { flex-basis: 112px; width: 112px; }
  .sk-news .post-item:first-child .post-title { font-size: 26px; }

  .sk-contact .people .col-inner { flex-direction: column; }
  :is(.sk-home, .sk-shop, .sk-pd) #footer { padding-bottom: 60px; }

  .sk-dock { left: 0; right: 0; bottom: 0; gap: 0; border-top: 1px solid var(--sk-line); background: #fff; box-shadow: 0 -2px 10px rgba(16, 28, 46, .1); }
  .sk-dock a, .sk-dock a:nth-child(n+3) { display: flex; flex: 1; flex-direction: column; gap: 2px; height: 58px; padding: 0; border: 0; border-radius: 0; box-shadow: none; font-size: 12px; }
}

/* ---- Danh muc san pham ---- */
.sk-shop #main { background: #fff; color: var(--sk-ink); font-family: var(--sk-body); }
.sk-shop div.shop-page-title { position: relative; border-bottom: 12px solid; border-image: linear-gradient(var(--sk-hi) 0 25%, var(--sk-silver) 25% 75%, var(--sk-hi) 75%) 1; }
.sk-shop .shop-page-title .page-title-inner { max-width: 1280px; padding-block: 32px 28px; align-items: flex-end; }
.sk-shop .shop-page-title h1 { margin: 0 0 6px; color: #fff; font: 700 clamp(36px, 4vw, 54px)/1.05 var(--sk-display); text-transform: uppercase; }
.sk-shop .shop-page-title .breadcrumbs, .sk-shop .shop-page-title .breadcrumbs a { color: #d4dceb; font: 400 14px/1.4 var(--sk-body); letter-spacing: 0; text-transform: none; }
.sk-shop .shop-page-title .breadcrumbs a:hover { color: #fff; }
.sk-shop div.shop-page-title .flex-col.form-flat { display: flex; align-items: center; }
.sk-shop div.shop-page-title .woocommerce-result-count { display: block !important; margin: 0 16px 0 0; color: #d4dceb; font-size: 14px; }
.sk-shop .shop-page-title .woocommerce-ordering { margin: 0; }
.sk-shop .shop-page-title .woocommerce-ordering select { height: 44px; margin: 0; padding-inline: 14px 34px; border: 0; border-radius: 4px; background-color: #fff; box-shadow: none; color: var(--sk-ink); font: 500 14px/1.2 var(--sk-body); }
.sk-shop .category-page-row { max-width: 1280px; padding-top: 28px; }

.sk-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 20px; padding: 0 9.8px; }
.sk-chips li { margin: 0; list-style: none; }
.sk-chips a { display: block; padding: 8px 16px; border: 1px solid var(--sk-line); border-radius: 4px; color: var(--sk-ink); font-size: 14px; font-weight: 500; transition: border-color .15s, background-color .15s, color .15s; }
.sk-chips a:hover { border-color: var(--sk-blue); color: var(--sk-blue); }
.sk-chips a.is-active { border-color: var(--sk-blue); background: var(--sk-blue); color: #fff; }

.sk-shop #shop-sidebar { display: flex; flex-direction: column; }
.sk-shop #shop-sidebar .widget { margin-bottom: 28px; padding-bottom: 0; }
.sk-shop #shop-sidebar .widget-title { display: block; margin-bottom: 4px; padding-bottom: 8px; border-bottom: 2px solid var(--sk-ink); color: var(--sk-ink); font: 700 20px/1.2 var(--sk-display); letter-spacing: .02em; text-transform: uppercase; }
.sk-shop #shop-sidebar .is-divider { display: none; }
.sk-catnav { order: -1; }
.sk-catnav p { margin: 14px 0 2px; color: var(--sk-muted); font-size: 13px; }
.sk-catnav ul { margin: 0; }
.sk-catnav li { margin: 0; list-style: none; }
.sk-shop .sk-catnav a { display: block; padding: 5px 10px; border-radius: 3px; color: var(--sk-ink); font-size: 14px; font-weight: 500; }
.sk-catnav a:hover { background: var(--sk-paper); color: var(--sk-blue); }
.sk-catnav a.is-active { background: color-mix(in srgb, var(--sk-blue) 12%, #fff); color: var(--sk-blue); font-weight: 600; }
.sk-shop .widget_price_filter .ui-slider .ui-slider-handle, .sk-shop .widget_price_filter .ui-slider .ui-slider-range { background: var(--sk-blue); }
.sk-shop .widget_price_filter .button { border-radius: 4px; background: var(--sk-blue); color: #fff; font: 600 13px/28px var(--sk-body); text-transform: none; letter-spacing: 0; }
.sk-shop .widget_recently_viewed_products a { color: var(--sk-ink); font-size: 13px; }

.sk-shop .woocommerce-pagination { margin-top: 24px; }
.sk-shop .woocommerce-pagination .page-numbers { justify-content: center; gap: 6px; }
.sk-shop .woocommerce-pagination .page-number { min-width: 42px; height: 42px; border: 1px solid var(--sk-line); border-radius: 4px; background: #fff; color: var(--sk-ink); font: 600 14px/40px var(--sk-body); }
.sk-shop .woocommerce-pagination .page-number:hover { border-color: var(--sk-blue); background: #fff; color: var(--sk-blue); }
.sk-shop .woocommerce-pagination .page-number.current { border-color: var(--sk-blue); background: var(--sk-blue); color: #fff; }
.sk-shop .term-description { max-width: 800px; margin: 32px auto 0; padding-inline: 15px; color: var(--sk-ink); line-height: 1.7; }

@media (max-width: 849px) {
  .sk-shop .shop-page-title .page-title-inner { padding-block: 20px 16px; }
  .sk-shop .shop-page-title .woocommerce-ordering select { height: 42px; width: 100%; }
  .sk-shop .category-page-row { padding-top: 16px; }
  .sk-chips { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; }
  .sk-chips a { white-space: nowrap; }
}
/* ---- Chi tiet san pham ---- */
.sk-pd #main { background: #fff; color: var(--sk-ink); font-family: var(--sk-body); }
.sk-pd .product-main { padding-top: 24px; }
.sk-pd .product-main > .row, .sk-pd .product-footer > .container, .sk-pd .shop-container > .container { max-width: 1280px; }
.sk-pd .page-title-inner, .sk-pd .page-title .container { max-width: 1280px; }
.sk-pd .breadcrumbs, .sk-pd .breadcrumbs a { color: var(--sk-muted); font: 400 14px/1.4 var(--sk-body); letter-spacing: 0; text-transform: none; }
.sk-pd .breadcrumbs a:hover { color: var(--sk-blue); }

/* Thu vien anh */
.sk-pd .product-gallery .product-images { border: 1px solid var(--sk-line); border-radius: 4px; overflow: hidden; }
.sk-pd .product-thumbnails { margin-top: 10px; }
.sk-pd .product-thumbnails .col a { display: block; border: 1px solid var(--sk-line); border-radius: 4px; overflow: hidden; }
.sk-pd .product-thumbnails .is-nav-selected a { border: 2px solid var(--sk-blue); }
.sk-pd .product-thumbnails img { opacity: 1 !important; transform: none !important; }
.sk-pd .product-images .badge-container { margin: 12px 0 0; }
.sk-pd .product-images .badge { width: auto; height: auto; }
.sk-pd .product-images .badge-inner { height: auto; padding: 4px 12px; border-radius: 0 3px 3px 0; background: var(--sk-hi) !important; color: var(--sk-ink); font: 700 15px/1.4 var(--sk-body); }

/* Thong tin */
.sk-pd .product-info { padding-left: 28px; }
.sk-pd .product-info .product-title { margin-bottom: 12px; color: var(--sk-ink); font: 700 clamp(30px, 3vw, 40px)/1.12 var(--sk-display); letter-spacing: 0; text-transform: none; }
.sk-pd .product-info .is-divider { display: none; }
.sk-pd .product-page-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; margin-bottom: 18px; padding-bottom: 18px; border-bottom: 1px solid var(--sk-line); }
.sk-pd .product-page-price ins { order: -1; text-decoration: none; }
.sk-pd .product-page-price .amount { color: var(--sk-blue); font: 700 30px/1.2 var(--sk-body); }
.sk-pd .product-page-price del { opacity: 1; }
.sk-pd .product-page-price del .amount { color: var(--sk-muted); font-size: 16px; font-weight: 400; }
.sk-pd .single_variation .amount { color: var(--sk-blue); font: 700 24px/1.2 var(--sk-body); }
.sk-pd .product-short-description { margin-bottom: 18px; line-height: 1.7; }

/* Chon size */
.sk-pd table.variations th.label { padding: 0 0 8px; color: var(--sk-ink); font: 600 14px/1.4 var(--sk-body); letter-spacing: 0; text-transform: none; }
.sk-pd table.variations tr { display: block; margin-bottom: 14px; }
.sk-pd table.variations th, .sk-pd table.variations td { display: block; padding: 0; border: 0; text-align: left; }
.sk-pd .ux-swatches { gap: 8px; }
.sk-pd .ux-swatch--label { min-width: 46px; height: 46px; margin: 0; padding: 0 12px; border: 1.5px solid var(--sk-line); border-radius: 4px; background: #fff; box-shadow: none; color: var(--sk-ink); font: 600 15px/43px var(--sk-body); text-align: center; transition: border-color .15s; }
.sk-pd .ux-swatch--label:hover { border-color: var(--sk-blue); }
.sk-pd .ux-swatch--label.selected { border-color: var(--sk-blue); background: var(--sk-blue); color: #fff; }
.sk-pd .ux-swatch--label.disabled { opacity: .4; }
.sk-pd .reset_variations { color: var(--sk-muted); font-size: 13px; }

/* Nut mua */
.sk-pd .variations_button, .sk-pd form.cart:not(.variations_form) { display: flex; flex-wrap: wrap; align-items: stretch; gap: 10px; }
.sk-pd .product-info .ux-quantity { float: none !important; width: auto !important; margin: 0; }
.sk-pd .product-info .ux-quantity input { height: 50px; margin: 0; border-color: var(--sk-line); box-shadow: none; color: var(--sk-ink); }
.sk-pd .product-info .single_add_to_cart_button, .sk-pd .product-info .buy_now_button { float: none !important; flex: 1 1 190px; width: auto !important; min-height: 50px; margin: 0 !important; padding: 8px 18px; border-radius: 4px; font: 600 15px/1.3 var(--sk-body); letter-spacing: 0; text-transform: none; }
.sk-pd .product-info .single_add_to_cart_button { border: 2px solid var(--sk-blue); background: #fff !important; color: var(--sk-blue); }
.sk-pd .product-info .single_add_to_cart_button:hover { background: color-mix(in srgb, var(--sk-blue) 12%, #fff) !important; box-shadow: none; }
.sk-pd .product-info .single_add_to_cart_button.disabled { opacity: .55; }
.sk-pd .product-info .buy_now_button { border: 0; background: var(--sk-hi) !important; color: var(--sk-ink); }
.sk-pd .product-info .buy_now_button:hover { background: var(--sk-hi-dark) !important; box-shadow: none; }

/* Lien he, chinh sach, thong tin them */
.sk-pd-contact { margin: 16px 0; padding: 14px 16px; border-radius: 4px; background: var(--sk-deep); color: #fff; }
.sk-pd-contact p { margin: 0 0 10px; font-size: 14px; font-weight: 500; }
.sk-pd-contact div { display: flex; flex-wrap: wrap; gap: 8px; }
.sk-pd-contact a { flex: 1 1 150px; padding: 8px 12px; border: 1px solid rgba(255, 255, 255, .45); border-radius: 4px; color: #fff; font-size: 14px; font-weight: 600; line-height: 1.4; text-align: center; }
.sk-pd-contact a:hover { border-color: #fff; color: #fff; }
.sk-pd .chinh-sach-mua-hang { margin: 0 0 16px; }
.sk-pd .chinh-sach-mua-hang .col { padding: 0; }
.sk-pd .chinh-sach-mua-hang .col-inner { padding: 16px !important; border-radius: 4px; background: var(--sk-paper) !important; }
.sk-pd .chinh-sach-mua-hang h2 { margin-bottom: 8px; color: var(--sk-ink); font: 700 20px/1.2 var(--sk-display); text-transform: uppercase; }
.sk-pd .chinh-sach-mua-hang li { margin-bottom: 6px; color: var(--sk-ink); font-size: 14px; line-height: 1.5; }
.sk-pd .product_meta { border: 0; color: var(--sk-muted); font-size: 13px; }
.sk-pd .product_meta > span { border: 0; padding: 2px 0; }
.sk-pd .product_meta a { color: var(--sk-blue); }
.sk-pd .product_meta .tagged_as { display: none; }

/* Mo ta */
.sk-pd .woocommerce-tabs { margin-top: 28px; padding: 0; border: 0; }
.sk-pd .woocommerce-tabs .nav { border-bottom: 2px solid var(--sk-line); }
.sk-pd .woocommerce-tabs .nav > li { margin: 0 24px 0 0; }
.sk-pd .woocommerce-tabs .nav > li > a { padding: 12px 0; border: 0; background: none; color: var(--sk-muted); font: 700 19px/1.2 var(--sk-display); letter-spacing: .02em; text-transform: uppercase; }
.sk-pd .woocommerce-tabs .nav > li.active > a, .sk-pd .woocommerce-tabs .nav > li > a:hover { box-shadow: inset 0 -3px 0 var(--sk-blue); color: var(--sk-blue); }
.sk-pd .woocommerce-tabs .panel { max-width: 860px; padding-top: 20px; color: var(--sk-ink); font-size: 16px; line-height: 1.75; }
.sk-pd .woocommerce-tabs .panel h2, .sk-pd .woocommerce-tabs .panel h3 { margin-top: 24px; color: var(--sk-ink); font-family: var(--sk-body); font-weight: 700; line-height: 1.3; }
.sk-pd .woocommerce-tabs .panel img { height: auto; border-radius: 4px; }
.sk-pd .tab-chinhsach { display: flex; flex-wrap: wrap; gap: 8px; margin: 24px 0; }
.sk-pd .tab-chinhsach li { margin: 0; list-style: none; }
.sk-pd .tab-chinhsach a { display: block; padding: 8px 14px; border: 1px solid var(--sk-line); border-radius: 4px; color: var(--sk-ink); font-size: 14px; font-weight: 500; }
.sk-pd .tab-chinhsach a:hover { border-color: var(--sk-blue); color: var(--sk-blue); }

/* San pham tuong tu */
.sk-pd .related { margin-top: 32px; padding-top: 0; border: 0; }
.sk-pd .related .product-section-title { margin-bottom: 16px; color: var(--sk-ink); font: 700 clamp(28px, 3vw, 38px)/1.1 var(--sk-display); letter-spacing: 0; text-transform: uppercase; }
.sk-pd .related .product-section-title::before, .sk-pd .related .product-section-title::after { display: none; }

@media (max-width: 849px) {
  .sk-pd .product-main { padding-top: 12px; }
  .sk-pd .product-info { padding-left: 15px; }
  .sk-pd .product-page-price .amount { font-size: 26px; }
  .sk-pd .product-info .ux-quantity { flex: 0 0 100%; }
  .sk-pd .product-info .single_add_to_cart_button, .sk-pd .product-info .buy_now_button { flex: 1 1 40%; }
  .sk-pd .woocommerce-tabs .nav { flex-wrap: nowrap; gap: 20px; overflow-x: auto; }
  .sk-pd .woocommerce-tabs .nav > li { margin: 0; }
  .sk-pd .woocommerce-tabs .nav > li > a { white-space: nowrap; }
}
/* ---- Phan rieng cua theme: khong phu thuoc du lieu mot cua hang ---- */
.sk-hero.section, .sk-about.section { background: var(--sk-deep) !important; }
.sk-contact.section { background: var(--sk-hi) !important; }
.sk-footer.section { background: var(--sk-ink) !important; }
.sk-hero > .section-bg, .sk-about > .section-bg, .sk-contact > .section-bg, .sk-footer > .section-bg { background: none !important; }
.sk-no-logo #logo img { display: none; }
.sk-no-logo #logo a { grid-template-columns: auto; }
.sk-no-logo #logo a::before, .sk-no-logo #logo a::after { grid-column: 1; }
.sk-hero.no-image .hero-copy { padding-block: 72px !important; }

/* Hotline */
.sk-site #masthead .sk-hotline { display: grid; grid-template-columns: auto auto; align-items: center; column-gap: 10px; color: var(--sk-blue); letter-spacing: 0; line-height: 1.25; text-transform: none; }
.sk-hotline::before { content: ""; grid-row: 1 / 3; width: 24px; height: 24px; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M6.6 3h3l1.6 4.4-2 1.5a12 12 0 0 0 5.9 5.9l1.5-2 4.4 1.6v3A2.6 2.6 0 0 1 18.4 20 15.4 15.4 0 0 1 4 5.6 2.6 2.6 0 0 1 6.6 3Z'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M6.6 3h3l1.6 4.4-2 1.5a12 12 0 0 0 5.9 5.9l1.5-2 4.4 1.6v3A2.6 2.6 0 0 1 18.4 20 15.4 15.4 0 0 1 4 5.6 2.6 2.6 0 0 1 6.6 3Z'/%3E%3C/svg%3E") center / contain no-repeat; }
.sk-hotline small { grid-column: 2; color: var(--sk-muted); font: 400 12px/1.25 var(--sk-body); }
.sk-hotline strong { grid-column: 2; font: 700 23px/1.1 var(--sk-display); }

/* Nhom danh muc */
.sk-cats-sec { padding-block: 40px !important; }
.sk-cats { display: flex; flex-wrap: wrap; gap: 24px 12px; margin-top: 16px; }
.sk-cat-group { flex: var(--n) 1 calc(var(--n) * 150px); min-width: 0; }
.sk-home #main .sk-cat-group h3 { margin: 0 0 10px; padding-bottom: 7px; border-bottom: 2px solid var(--sk-ink); color: var(--sk-ink); font: 600 14px/1.4 var(--sk-body); }
.sk-cat-tiles { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 12px; }
.sk-tile { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; min-height: 124px; padding: 16px 8px; border-radius: 4px; background: var(--sk-paper); color: var(--sk-ink); font-size: 14px; font-weight: 500; line-height: 1.3; text-align: center; transition: background-color .15s, color .15s; }
.sk-tile:hover { background: color-mix(in srgb, var(--sk-blue) 12%, #fff); color: var(--sk-blue); }
.sk-tile img { width: 44px; height: 44px; object-fit: contain; }

/* Mega menu */
.sk-site .header-bottom { position: relative; }
.sk-site .header-bottom .flex-row, .sk-site .header-bottom .flex-col, .sk-site .header-bottom-nav, .sk-site .header-bottom-nav > li.sk-mega-item { position: static; }
.sk-mega-item > .sub-menu, .sk-mega-item > .nav-dropdown { display: none !important; }
.sk-mega { display: none; position: absolute; z-index: 40; left: 0; right: 0; top: 100%; padding: 28px max(16px, calc((100vw - 1248px) / 2)); border-bottom: 4px solid var(--sk-hi); background: #fff; box-shadow: 0 16px 32px rgba(16, 28, 46, .16); color: var(--sk-ink); font: 400 15px/1.6 var(--sk-body); }
.sk-mega-item:hover > .sk-mega, .sk-mega-item:focus-within > .sk-mega { display: block; }
.sk-mega-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 24px; }
.sk-mega p { margin: 0 0 8px; color: var(--sk-muted); font-size: 13px; }
.sk-mega ul { margin: 0; }
.sk-site .sk-mega li { margin: 0 !important; padding: 0; list-style: none; }
.sk-mega li a { display: block; padding: 5px 0; color: var(--sk-ink); font: 500 15px/1.6 var(--sk-body); letter-spacing: 0; text-transform: none; }
.sk-mega li a:hover { color: var(--sk-blue); }
@media (min-width: 850px) { .sk-site .ux-body-overlay { display: none !important; } }

/* Gioi thieu */
.sk-about { margin-block: 32px; }
.sk-about .about-img { margin: 0; width: 100% !important; }
.sk-about .about-img .img-inner { aspect-ratio: 3.57; overflow: hidden; }
.sk-about .about-img img { width: 100%; height: 100%; object-fit: cover; }
.sk-about > .section-content > .row { padding-block: 48px 40px; }
.sk-home #main .sk-about h2 { color: #fff; }
.sk-home #main .sk-about .lede { margin-bottom: 30px; }
.sk-about ul { margin: 0; }
.sk-about .ticks li { position: relative; margin: 0; padding: 11px 0 11px 34px; border-bottom: 1px solid rgba(255, 255, 255, .18); color: #fff; font-weight: 500; list-style: none; }
.sk-about .ticks li::before { content: ""; position: absolute; left: 4px; top: 16px; width: 14px; height: 7px; border: solid var(--sk-hi); border-width: 0 0 2px 2px; transform: rotate(-45deg); }

/* So dien thoai */
.sk-phones { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.sk-phones a { display: grid; min-width: 170px; padding: 12px 18px; border-radius: 4px; background: var(--sk-ink); color: #fff; line-height: 1.25; }
.sk-phones a:hover { background: var(--sk-deep); color: #fff; }
.sk-phones small { color: #c7d0dd; }
.sk-phones b { font: 700 24px/1.15 var(--sk-display); }

@media (max-width: 849px) {
  .sk-cats { gap: 16px 10px; }
  .sk-cat-group { flex: 1 1 100%; }
  .sk-cat-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .sk-tile { flex-direction: row; justify-content: flex-start; min-height: 60px; padding: 8px 10px; font-size: 13px; text-align: left; }
  .sk-tile img { width: 34px; height: 34px; flex: none; }
  .sk-about .about-img .img-inner { aspect-ratio: 16 / 9; }
  .sk-about .button { display: flex; width: 100%; justify-content: center; }
  .sk-phones { flex-direction: column; }
}
