.sh-pcard{position:relative;min-width:0;display:flex;flex-direction:column;background:#fff;border:1px solid #edf0e9;border-radius:15px;box-shadow:0 2px 5px #1e3d1d09;overflow:hidden;font-family:var(--sh-font);transition:box-shadow .2s,transform .2s;height:100%;box-sizing:border-box}
.sh-pcard:hover{box-shadow:0 8px 20px #1e3d1d14;transform:translateY(-2px)}
.sh-pcard-img{position:relative;display:block;height:139px;padding:14px 12px 6px;background:#fff;overflow:hidden;box-sizing:border-box}
.sh-pcard-img img{display:block;width:100%;height:100%;object-fit:contain;transition:transform .25s}
.sh-pcard:hover .sh-pcard-img img{transform:scale(1.04)}
.sh-pcard-badge{position:absolute;top:8px;right:8px;z-index:1;padding:4px 7px;font-size:10px;font-weight:600;line-height:12px;color:#fff;background:linear-gradient(120deg,#ff6806,#ff8c20);border-radius:8px 8px 0 8px}
.sh-pcard-save{position:absolute;top:8px;left:8px;z-index:1;display:grid;place-items:center;width:26px;height:26px;padding:5px;margin:0;border:0;border-radius:50%;background:#ffffffd9;color:#9aa49a;cursor:pointer;line-height:0;box-sizing:border-box}
.sh-pcard-save svg{width:16px;height:16px}
.sh-pcard-save:hover{color:#ff6f0b}
.sh-pcard-save[aria-pressed=true]{color:#ff6f0b;background:#fff1e5}
.sh-pcard-save[aria-pressed=true] svg{fill:#ff7b14}
.sh-pcard-info{flex:1;display:flex;flex-direction:column;padding:8px 12px 12px;min-width:0}
.sh-pcard-foot{margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 8px}
.sh-pcard-title{margin:0;padding:0;font:inherit;min-width:0}
.sh-pcard a.sh-pcard-name{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:2.7em;font-size:14px;font-weight:600;line-height:1.35;color:#1f3022;text-decoration:none;align-self:start}
.sh-pcard a.sh-pcard-name:hover{color:#ed650c}
.sh-pcard-price{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;margin:6px 0 10px;font-size:17px;font-weight:700;line-height:1.3;color:#ff6909}
.sh-pcard-price ins{order:1;text-decoration:none;color:#ff6909;background:none}
.sh-pcard-price del{order:2;font-size:12px;font-weight:400;color:#777e80}
.sh-pcard-price>span{font-size:15px;color:#ff6909}
.sh-pcard-rating{font-size:12px;color:#808881;white-space:nowrap}
.sh-pcard-rating>span{font-size:16px;color:#ffac00;vertical-align:-1px}
.sh-pcard-btn{margin-left:auto;display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:32px;padding:6px 11px;border:1px solid #44830e;border-radius:16px;background:linear-gradient(165deg,#59961a,#2e690b);box-shadow:inset 0 1px #ffffff1c;color:#fff!important;font-size:12px;font-weight:600;line-height:1.2;white-space:nowrap;text-decoration:none;box-sizing:border-box;cursor:pointer}
.sh-pcard-btn:hover{background:linear-gradient(165deg,#4f8a15,#255a08)}
.sh-pcard-btn .sh-featured-icon{width:16px;height:16px;flex:0 0 16px;color:#fff}
.sh-pcard-btn .sh-icon{font-size:1.1em}
.sh-pcard-btn.loading{opacity:.6;pointer-events:none}
.sh-pcard .added_to_cart{flex-basis:100%;text-align:right;font-size:12px;color:#3d7a14;padding-top:5px;text-decoration:none}
.sh-pcard-btn:focus-visible,.sh-pcard-name:focus-visible,.sh-pcard-save:focus-visible{outline:3px solid #ff981b;outline-offset:2px}
@media(min-width:768px) and (max-width:1199px){
 .sh-pcard-img{height:170px}
}
@media(max-width:767px){
 .sh-pcard-img{height:auto;aspect-ratio:1.1;padding:14px 11px 6px}
 .sh-pcard a.sh-pcard-name{font-size:13px}
 .sh-pcard-info{padding:6px 10px 10px}
 .sh-pcard-foot{flex-direction:column;align-items:stretch;gap:6px}
 .sh-pcard-price{font-size:16px;margin:4px 0 6px}
 .sh-pcard-btn{margin-left:0;min-height:36px}
 .sh-pcard:hover{transform:none}
}
@media(max-width:359px){
 .sh-pcard-price{font-size:15px}
 .sh-pcard-btn{font-size:12px;padding:6px 3px;gap:3px}
 .sh-pcard-btn .sh-featured-icon{width:14px;height:14px;flex-basis:14px}
 .sh-pcard-info{padding-left:8px;padding-right:8px}
}
.sh-cat-products[data-view=list] .sh-pcard{flex-direction:row}
.sh-cat-products[data-view=list] .sh-pcard-img{flex:0 0 125px;height:auto;min-height:125px}
.sh-cat-products[data-view=list] .sh-pcard-info{padding:10px 12px}
@media(max-width:767px){.sh-cat-products[data-view=list] .sh-pcard-img{flex-basis:100px;aspect-ratio:auto;min-height:100px}}
ul.products:has(>.sh-pcard-cell){display:grid!important;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:11px;list-style:none;margin:0 0 24px!important;padding:0!important}
ul.products:has(>.sh-pcard-cell)::before,ul.products:has(>.sh-pcard-cell)::after{display:none!important}
ul.products>li.sh-pcard-cell{float:none!important;width:auto!important;margin:0!important;padding:0!important;list-style:none;min-width:0}
@media(max-width:767px){ul.products:has(>.sh-pcard-cell){grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}}
.shco-recommend-grid:has(.sh-pcard){grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:11px}
@media(max-width:767px){.shco-recommend-grid:has(.sh-pcard){grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}}
.sh-office-products:has(.sh-pcard){align-items:start;height:auto}
.sh-pcard-btn{min-width:10.2em}
@media(max-width:767px){.sh-pcard-btn{min-width:0}}

.sh-pcard-price>.sh-pcard-quote{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;line-height:1.3;color:#31591d}
.sh-pcard-quote svg{width:16px;height:16px;flex:none;color:#7fb342}
.sh-pcard-btn.is-ask{border-color:#ff8a2b;background:#fff;color:#e2580a!important;box-shadow:none}
.sh-pcard-btn.is-ask:hover{background:#ff720b;border-color:#ff720b;color:#fff!important}
.sh-pcard-btn.is-ask svg{width:16px;height:16px;flex:none}

.sh-qs[hidden]{display:none!important}
.sh-qs{position:fixed;inset:0;z-index:100040;display:flex;align-items:center;justify-content:center;padding:24px;font-family:var(--sh-font)}
.sh-qs-backdrop{position:absolute;inset:0;border:0;background:#0d1f1a8c;cursor:pointer}
.sh-qs-panel{position:relative;width:100%;max-width:420px;padding:24px;border-radius:16px;background:#fff;box-shadow:0 20px 50px #0d1f1a40;color:#17222d}
@media(prefers-reduced-motion:no-preference){.sh-qs-panel{animation:sh-qs-in .22s cubic-bezier(.22,1,.36,1)}.sh-qs-backdrop{animation:sh-qs-fade .2s ease}}
@keyframes sh-qs-in{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
@keyframes sh-qs-fade{from{opacity:0}}
.sh-qs-close{position:absolute;top:12px;right:12px;display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;border:0;border-radius:50%;background:#f2f4f3;color:#55626a;cursor:pointer}
.sh-qs-close svg{width:18px;height:18px}
.sh-qs-eyebrow{display:flex;align-items:center;gap:8px;margin:0 0 12px;color:#568c2d;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.sh-qs-eyebrow:before{content:"";width:4px;height:16px;border-radius:2px;background:#ff720b}
.sh-qs-product{display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;align-items:center;margin:0 40px 16px 0}
.sh-qs-product img{width:72px;height:72px;object-fit:contain;border:1px solid #edf0ee;border-radius:12px;background:#fff}
.sh-qs-product strong{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font-size:15px;font-weight:600;line-height:1.4}
.sh-qs-product small{display:block;margin-top:4px;color:#6b7780;font-size:13px}
.sh-qs-note{margin:0 0 16px;padding:12px 16px;border-radius:12px;background:#f3f8ed;color:#3d4838;font-size:14px;line-height:1.55}
.sh-qs-actions{display:grid;gap:8px}
.sh-qs-btn{display:flex;align-items:center;gap:12px;min-height:56px;padding:8px 16px;border:1px solid #e3e9dc;border-radius:12px;background:#fff;color:#17222d;text-decoration:none;cursor:pointer;font:inherit;text-align:left;transition:border-color .15s,background .15s}
.sh-qs-btn:hover{border-color:#9cc56f;background:#fafcf7}
.sh-qs-btn>span:nth-child(2){flex:1;min-width:0}
.sh-qs-btn strong{display:block;font-size:15px;font-weight:600;line-height:1.3}
.sh-qs-btn small{display:block;color:#6b7780;font-size:13px;line-height:1.4}
.sh-qs-btn>svg{width:18px;height:18px;flex:none;color:#b3bbbf}
.sh-qs-ic{display:flex;align-items:center;justify-content:center;width:40px;height:40px;flex:none;border-radius:50%;color:#fff;font-weight:800;font-size:15px}
.sh-qs-ic svg{width:20px;height:20px}
.sh-qs-btn.is-zalo .sh-qs-ic{background:#0068ff}
.sh-qs-btn.is-call .sh-qs-ic{background:#ff720b}
.sh-qs-btn.is-zalo{border-color:#bcd6ff;background:#f4f8ff}
.sh-qs-link{display:inline-flex;align-items:center;gap:4px;margin-top:16px;color:#3f7d1c;font-size:14px;font-weight:600;text-decoration:none}
.sh-qs-link svg{width:16px;height:16px}
.sh-qs-toast{position:absolute;left:50%;bottom:calc(100% + 12px);transform:translateX(-50%);padding:8px 16px;border-radius:999px;background:#17222d;color:#fff;font-size:13px;white-space:nowrap;opacity:0;transition:opacity .2s;pointer-events:none}
.sh-qs-toast.is-on{opacity:1}
body.sh-qs-open{overflow:hidden}
@media(max-width:767px){
 .sh-qs{align-items:flex-end;padding:0}
 .sh-qs-panel{max-width:none;padding:24px 16px calc(16px + env(safe-area-inset-bottom));border-radius:20px 20px 0 0}
 .sh-qs-panel:before{content:"";position:absolute;top:8px;left:50%;width:40px;height:4px;margin-left:-20px;border-radius:2px;background:#dfe4e1}
 @media(prefers-reduced-motion:no-preference){.sh-qs-panel{animation-name:sh-qs-up}}
 .sh-qs-toast{bottom:auto;top:-44px}
}
@keyframes sh-qs-up{from{transform:translateY(100%)}to{transform:none}}

.sh-pcard .sh-pcard-btn:not(.is-ask){border:0;background:linear-gradient(135deg,#5f9d1e,#2f6410);box-shadow:0 3px 8px #2f641033}
.sh-pcard .sh-pcard-btn:not(.is-ask):hover{background:#2f6410}
.sh-pcard .sh-pcard-btn.is-ask{border:0;background:linear-gradient(135deg,#f58a2a,#e8650d);color:#fff!important;box-shadow:0 3px 8px #e8650d33}
.sh-pcard .sh-pcard-btn.is-ask:hover{background:#d9560a}