/** Shopify CDN: Minification failed

Line 63:0 All "@import" rules must come first

**/
:root {
  --cart-drawer-width: 420px;
  --cart-drawer-bg: #ffffff;
  --cart-drawer-text: #111111;
  --cart-drawer-border: #e0e0e0;
  --cart-drawer-button-bg: #4a4a4a;
  --cart-drawer-button-text: #ffffff;
}
.cart-drawer { position:fixed;top:0;right:0;width:100%;height:100%;z-index:9999;pointer-events:none; }
.cart-drawer.is-open { pointer-events:auto; }
.cart-drawer__overlay { position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);opacity:0;transition:opacity .3s ease;pointer-events:none; }
.cart-drawer.is-open .cart-drawer__overlay { opacity:1;pointer-events:auto; }
.cart-drawer__panel { position:absolute;top:0;right:0;width:var(--cart-drawer-width);height:100%;background:#fff;display:flex;flex-direction:column;transform:translateX(100%);transition:transform .3s ease;box-shadow:-2px 0 8px rgba(0,0,0,.1); }
.cart-drawer.is-open .cart-drawer__panel { transform:translateX(0); }
.cart-drawer__header { display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid var(--cart-drawer-border);flex-shrink:0; }
.cart-drawer__title { display:flex;align-items:center;gap:10px; }
.cart-drawer__title h2 { margin:0;font-size:18px;font-weight:600; }
.cart-drawer__count { background:var(--cart-drawer-button-bg);color:#fff;border-radius:50%;width:22px;height:22px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600; }
.cart-drawer__close { background:none;border:none;cursor:pointer;padding:8px;color:var(--cart-drawer-text); }
.cart-drawer__items-wrapper { flex:1;overflow-y:auto; }
.cart-drawer__item { display:flex;gap:12px;padding:16px 20px;border-bottom:1px solid #f0f0f0; }
.cart-drawer__item-image { width:80px;height:80px;flex-shrink:0;background:#f5f5f5;border-radius:4px;overflow:hidden; }
.cart-drawer__item-image img { width:100%;height:100%;object-fit:cover; }
.cart-drawer__item-content { flex:1;display:flex;flex-direction:column;gap:6px; }
.cart-drawer__item-title { font-size:14px;font-weight:500;margin:0; }
.cart-drawer__item-variant { font-size:12px;color:#666;margin:0; }
.cart-drawer__item-price { font-size:14px;font-weight:600; }
.cart-drawer__item-controls { display:flex;align-items:center;gap:8px;margin-top:4px; }
.cart-drawer__quantity-control { display:flex;align-items:center;border:1px solid var(--cart-drawer-border);border-radius:4px; }
.cart-drawer__quantity-btn { background:none;border:none;width:28px;height:28px;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center; }
.cart-drawer__quantity-input { width:36px;height:28px;border:none;text-align:center;font-size:14px;background:none; }
.cart-drawer__remove-btn { background:none;border:none;cursor:pointer;color:#999;margin-left:auto;display:flex;align-items:center; }
.cart-drawer__remove-btn:hover { color:#c10100; }
.cart-drawer__discount { padding:16px 20px;border-top:1px solid #f0f0f0;flex-shrink:0; }
.cart-drawer__discount-form { display:flex;gap:8px; }
.cart-drawer__discount-input { flex:1;padding:10px 12px;border:1px solid var(--cart-drawer-border);border-radius:4px;font-size:14px; }
.cart-drawer__discount-btn { width:40px;height:40px;border:1px solid var(--cart-drawer-border);border-radius:4px;background:#fff;cursor:pointer;font-size:18px; }
.cart-drawer__totals { padding:16px 20px;flex-shrink:0; }
.cart-drawer__total-row { display:flex;justify-content:space-between;font-size:15px;font-weight:600;margin-bottom:8px; }
.cart-drawer__tax-notice { font-size:12px;color:#666;margin:0; }
.cart-drawer__terms { padding:12px 20px;flex-shrink:0; }
.cart-drawer__checkbox { display:flex;align-items:flex-start;gap:8px;font-size:12px;cursor:pointer; }
.cart-drawer__checkbox input { margin-top:2px;flex-shrink:0; }
.cart-drawer__checkbox a { color:var(--cart-drawer-button-bg);text-decoration:underline; }
.cart-drawer__checkout { display:block;width:100%;padding:14px;background:var(--cart-drawer-button-bg);color:#fff;text-align:center;text-decoration:none;font-size:14px;font-weight:600;flex-shrink:0; }
.cart-drawer__checkout:hover { opacity:.85; }
.cart-drawer__empty { padding:40px 20px;text-align:center;color:#666; }
.cart-drawer__continue-shopping { display:inline-block;padding:10px 20px;background:var(--cart-drawer-button-bg);color:#fff;text-decoration:none;border-radius:4px;font-size:14px;margin-top:12px; }
@media(max-width:768px){:root{--cart-drawer-width:100%;}}

/* ปิด Quick Cart เก่าของ theme */
.quick-cart,
quick-cart {
  display: none !important;
}

/* Font */
@import url('https://fonts.googleapis.com/css2?family=Host+Grotesk:wght@300;400;500;600&display=swap');

.cart-drawer,
.cart-drawer * {
  font-family: 'Host Grotesk', sans-serif;
}

/* ปุ่ม Checkout — ขาว outline ดำ */
.cart-drawer__checkout {
  background-color: #ffffff;
  color: #111111;
  border: 0.7px solid #111111;
  font-family: 'Host Grotesk', sans-serif;
}

.cart-drawer__checkout:hover {
  background-color: #f5f5f5;
  opacity: 1;
}

/* Order Notes */
.cart-drawer__notes {
  padding: 16px 20px;
  border-top: 1px solid #e0e0e0;
  border-bottom: 1px solid #e0e0e0;
  flex-shrink: 0;
}

.cart-drawer__notes-input {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid #e0e0e0;
  border-radius: 4px;
  font-size: 14px;
  font-family: 'Host Grotesk', sans-serif;
  color: #111111;
  resize: none;
  height: 80px;
  box-sizing: border-box;
}

.cart-drawer__notes-input::placeholder {
  color: #999;
}

.cart-drawer__notes-input:focus {
  outline: none;
  border-color: #111111;
}
/* ปุ่ม Checkout — ความมนและความกว้างเท่า discount input */
.cart-drawer__checkout {
  border-radius: 4px;
  margin: 0 20px 16px 20px;
  width: calc(100% - 40px);
  box-sizing: border-box;
  display: block;
}

/* Placeholder สี placeholder เดียวกันทั้ง discount และ notes */
.cart-drawer__discount-input::placeholder,
.cart-drawer__notes-input::placeholder {
  color: #999999;
}

.cart-drawer__discount-input,
.cart-drawer__notes-input {
  color: #999999;
}

.cart-drawer__discount-input:not(:placeholder-shown),
.cart-drawer__notes-input:not(:placeholder-shown) {
  color: #111111;
}

/* วงกลมจำนวนสินค้า — พื้นหลังสีเดียวกับ placeholder, ตัวเลขสีดำ */
.cart-drawer__count {
  background-color: #e8e8e8;
  color: #111111;
}
/* Checkout button hover — สีดำ ตัวหนังสือขาว */
.cart-drawer__checkout:hover {
  background-color: #111111;
  color: #ffffff;
  border-color: #111111;
  opacity: 1;
}
