:root{
  --cw-red:#e31937;
  --cw-red-dark:#b5122a;
  --cw-bg:#f6f7fb;
  --cw-card:#ffffff;
  --cw-text:#1f2937;
  --cw-muted:#6b7280;
  --cw-border:#e5e7eb;
  --cw-shadow: 0 10px 24px rgba(17,24,39,.08);
}

/* ===============================
   GLOBAL FONT
================================= */

body {
    font-family: 'Kanit', sans-serif;
    font-weight: 400;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Kanit', sans-serif;
    font-weight: 600;
}

button, .btn {
    font-family: 'Kanit', sans-serif;
    font-weight: 500;
}

.navbar, .sidebar, .card, .table {
    font-family: 'Kanit', sans-serif;
}


*{box-sizing:border-box}
body.cw-bg{background:var(--cw-bg); color:var(--cw-text);}

.cw-nav{
  background: linear-gradient(90deg, var(--cw-red), #ff3b3b);
  box-shadow: 0 6px 18px rgba(227,25,55,.25);
}
.cw-logo{
  width:34px;height:34px;border-radius:10px;
  display:inline-flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.25);
  color:#fff;
}
.cw-search .form-control{
  border-radius:999px 0 0 999px;
  border: 0;
  min-width: 280px;
}
.cw-search .btn{
  border-radius:0 999px 999px 0;
  border:0;
}

.cw-hero{
  background:
    radial-gradient(800px 260px at 20% 20%, rgba(255,255,255,.22), transparent 60%),
    radial-gradient(700px 260px at 80% 40%, rgba(255,255,255,.20), transparent 60%),
    linear-gradient(90deg, var(--cw-red), #ff3b3b);
  color:#fff;
}
.cw-hero__inner{
  padding: 18px 0;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
.cw-hero__title{
  font-size: clamp(20px, 2vw, 28px);
  font-weight:800;
}
.cw-hero__accent{background:rgba(255,255,255,.18); padding:.08rem .55rem; border-radius:999px;}
.cw-hero__subtitle{opacity:.9}

.cw-sticky{ position: sticky; top: 84px; }

.cw-card{
  background:var(--cw-card);
  border:1px solid var(--cw-border);
  border-radius:18px;
  box-shadow: var(--cw-shadow);
  overflow:hidden;
}
.cw-card__header{
  padding: 12px 14px;
  font-weight:700;
  background: linear-gradient(180deg, rgba(227,25,55,.08), rgba(227,25,55,.02));
  border-bottom:1px solid var(--cw-border);
}
.cw-card__body{ padding: 14px; }

.cw-cat{
  padding: 10px 14px;
  display:flex;align-items:center;justify-content:space-between;
  text-decoration:none;
  color:var(--cw-text);
  border-bottom:1px solid var(--cw-border);
}
.cw-cat:hover{background:rgba(227,25,55,.04)}
.cw-cat.active{
  background:rgba(227,25,55,.08);
  font-weight:700;
}
.cw-chev{opacity:.45}

.cw-product{
  border-radius: 18px;
  border:1px solid var(--cw-border);
  box-shadow: var(--cw-shadow);
  overflow:hidden;
  transition: transform .12s ease, box-shadow .12s ease;
}
.cw-product:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 28px rgba(17,24,39,.12);
}
.cw-product__imgwrap{
  position:relative;
  aspect-ratio: 4/3;
  background:#fff;
}
.cw-product__img{
  width:100%;height:100%;
  object-fit:cover;
  display:block;
}
.cw-badge-out{
  position:absolute;
  top:10px; left:10px;
  background: rgba(0,0,0,.65);
  color:#fff;
  padding: 4px 9px;
  border-radius:999px;
  font-size:12px;
}
.cw-product__name{
  font-weight:700;
  line-height:1.25;
  min-height: 2.4em;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.cw-price{
  font-weight:800;
  color: var(--cw-red-dark);
}
.cw-price__sym{font-weight:700; margin-right:2px; opacity:.85}

.cw-cart{
  background:var(--cw-card);
  border:1px solid var(--cw-border);
  border-radius:18px;
  box-shadow: var(--cw-shadow);
  overflow:hidden;
}
.cw-cart__header{
  padding: 12px 14px;
  background: linear-gradient(180deg, rgba(227,25,55,.12), rgba(227,25,55,.04));
  border-bottom:1px solid var(--cw-border);
}
.cw-cart__body{ max-height: 56vh; overflow:auto; padding: 10px 12px; }
.cw-cart__footer{
  padding: 12px 14px;
  border-top:1px solid var(--cw-border);
  background: #fff;
}

.cw-cart-item{
  display:flex; gap:10px;
  padding: 10px 8px;
  border-radius:14px;
}
.cw-cart-item:hover{background: rgba(17,24,39,.03);}
.cw-cart-item__img{
  width:54px;height:54px;border-radius:12px;
  object-fit:cover;border:1px solid var(--cw-border);
}
.cw-cart-item__meta{flex:1; min-width:0;}
.cw-cart-item__name{
  font-weight:700;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.cw-cart-item__price{color:var(--cw-red-dark); font-weight:800; font-size: 13px;}
.cw-cart-item__controls{
  display:flex; align-items:center; gap:6px;
  margin-top:6px;
}
.cw-qty{ width:64px; text-align:center; }
.cw-empty{
  padding: 20px 10px;
  text-align:center;
}
.cw-empty__icon{
  width:54px;height:54px;border-radius:18px;
  display:inline-flex; align-items:center; justify-content:center;
  background: rgba(227,25,55,.08);
  color: var(--cw-red);
  margin-bottom: 10px;
  font-size: 20px;
}
.cw-empty--wide{padding: 30px 10px;}

.btn-danger{
  background: var(--cw-red);
  border-color: var(--cw-red);
}
.btn-danger:hover{ background: var(--cw-red-dark); border-color: var(--cw-red-dark); }

.pagination .page-item.active .page-link{
  background: var(--cw-red);
  border-color: var(--cw-red);
}
.pagination .page-link{ color: var(--cw-red-dark); }


/* Pills & user menu */
.cw-btn-pill{ border-radius:999px; padding: .45rem .9rem; }

/* Member pages */
.cw-page-title{
  font-weight:800;
  font-size: 1.15rem;
  letter-spacing:.2px;
}
.cw-auth-wrap{
  max-width: 520px;
  margin: 0 auto;
}
.cw-form-label{
  font-size:.9rem;
  color: var(--cw-muted);
  margin-bottom:.35rem;
}
.cw-input{
  border-radius:14px;
  border:1px solid var(--cw-border);
  padding:.75rem .9rem;
}
.cw-input:focus{
  border-color: rgba(227,25,55,.55);
  box-shadow: 0 0 0 .25rem rgba(227,25,55,.12);
}
.cw-alert-soft{
  border:1px solid rgba(227,25,55,.18);
  background: rgba(227,25,55,.06);
  color: #7a0c1a;
  border-radius: 14px;
}
.cw-menu{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.cw-menu a{
  text-decoration:none;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid transparent;
  color: var(--cw-text);
}
.cw-menu a:hover{ background:#fff; border-color: var(--cw-border); }
.cw-menu a.active{
  background: rgba(227,25,55,.08);
  border-color: rgba(227,25,55,.25);
  color: #7a0c1a;
}

.cw-avatar{
  width:44px;height:44px;border-radius:16px;
  display:flex;align-items:center;justify-content:center;
  background: linear-gradient(135deg, rgba(227,25,55,.14), rgba(227,25,55,.06));
  border:1px solid rgba(227,25,55,.20);
  color: var(--cw-red-dark);
}


/* --- Sidebar categories with images --- */
.cw-cat--img{gap:10px}
.cw-cat__img{
  width:34px;height:34px;border-radius:10px;
  object-fit:cover;border:1px solid var(--cw-border);
  box-shadow: 0 6px 14px rgba(17,24,39,.06);
}
.cw-cat__thumb{
  width:34px;height:34px;border-radius:10px;
  display:inline-flex;align-items:center;justify-content:center;
  background: rgba(227,25,55,.10);
  color: var(--cw-red);
  border:1px solid rgba(227,25,55,.18);
}

/* --- Cart table layout --- */

.cw-cart-td-qty{width: 180px;}
.cw-cart-table td{vertical-align:middle; padding:10px 8px;}
.cw-cart-item:hover{background: rgba(17,24,39,.03);}
.cw-cart-img{
  width:44px;height:44px;border-radius:12px;
  object-fit:cover;border:1px solid var(--cw-border);
}
.cw-cart-name{
  font-weight:800;
  font-size: 13px;
  line-height:1.2;
  max-width: 220px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.cw-qtygrp .cw-qty{width:56px; text-align:center;}
.cw-cart-td-sum{white-space:nowrap;}