/* RESET */
*{box-sizing:border-box}
body{
  margin:0;
  font-family:Arial,Helvetica,sans-serif;
  background:#ededed;
  color:#333;
  font-size:14px;
}
a{text-decoration:none;color:#333}

/* HEADER */
.header{
  background:#fff;
  border-bottom:1px solid #ddd;
  height:64px;
  display:flex;
  align-items:center;
  padding:0 20px;
  gap:20px;
}
.logo{font-size:22px;font-weight:bold}
.search{flex:1}
.search input{
  width:100%;
  max-width:520px;
  padding:8px 12px;
  border:1px solid #ccc;
}
.header-right{display:flex;gap:15px}
.header-right a{color:#007bff}
.header-right span{font-weight:bold}

/* LAYOUT */
.main{
  max-width:1250px;
  margin:15px auto;
  display:flex;
  gap:15px;
}

/* SIDEBAR */
.sidebar{
  width:230px;
  background:#fff;
  border:1px solid #ddd;
}
.sidebar h3{
  margin:0;
  padding:10px 12px;
  font-size:14px;
  background:#f7f7f7;
  border-bottom:1px solid #ddd;
}
.sidebar ul{list-style:none;margin:0;padding:0}
.sidebar li a{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
}
.sidebar li a:hover{background:#f2f2f2}
.sidebar li.active a{
  background:#e6e6e6;
  font-weight:bold;
}

/* CATEGORY ICON */
.cat-icon{
  width:16px;
  height:16px;
  object-fit:contain;
  flex-shrink:0;
}

/* CONTENT */
.content{
  flex:1;
  background:#fff;
  border:1px solid #ddd;
}

/* TABLE HEAD */
.table-head{
  padding:10px 12px;
  border-bottom:1px solid #ddd;
  display:flex;
  justify-content:space-between;
  color:#666;
}
.table-head a{color:#007bff}
.table-head a:hover{text-decoration:underline}

/* TABLE */
table{
  width:100%;
  border-collapse:collapse;
}
th,td{
  padding:10px;
  border-bottom:1px solid #eee;
}
th{
  background:#fafafa;
  font-weight:normal;
  color:#666;
}
.empty{
  text-align:center;
  color:#888;
}

/* PRODUCT TITLE */
.product-title{
  font-weight:600;
}
.product-title:hover{
  text-decoration:underline;
}

/* BUY BUTTON */
.buy-btn{
  background:#d9534f;
  color:#fff;
  padding:6px 14px;
  border-radius:3px;
  font-size:13px;
}
.buy-btn:hover{background:#c9302c}

/* PAGINATION */
.pagination{
  padding:10px;
  text-align:center;
}
.pagination a,
.pagination b{
  margin:0 5px;
}
.pagination a{color:#007bff}
.pagination a:hover{text-decoration:underline}

/* RESPONSIVE */
@media(max-width:900px){
  .main{flex-direction:column}
  .sidebar{width:100%}
}
/* FORCE FIX CATEGORY ICON SIZE */
.sidebar img,
.sidebar .cat-icon{
  width:16px !important;
  height:16px !important;
  max-width:16px !important;
  max-height:16px !important;
  object-fit:contain !important;
}
