/* ========== TRUST MALL - Amazon-inspired styles ========== */
* { margin:0; padding:0; box-sizing:border-box; }
body {
  font-family: "Amazon Ember", Arial, sans-serif;
  background:#eaeded;
  color:#0f1111;
  font-size:14px;
}
a { text-decoration:none; color:inherit; }
img { max-width:100%; display:block; }

/* ---------- Navbar ---------- */
.navbar { background:#131921; color:#fff; }
.nav-inner {
  display:flex; align-items:center; gap:14px;
  padding:8px 16px; max-width:1500px; margin:0 auto;
}
.logo { font-size:24px; font-weight:bold; padding:6px; border:1px solid transparent; }
.logo:hover { border:1px solid #fff; border-radius:3px; }
.logo-trust { color:#fff; }
.logo-mall { color:#febd69; }

.search-box { flex:1; display:flex; height:40px; border-radius:5px; overflow:hidden; }
.search-box input {
  flex:1; border:none; padding:0 12px; font-size:15px; outline:none;
}
.search-box button {
  width:46px; border:none; background:#febd69; cursor:pointer; font-size:18px;
}
.search-box button:hover { background:#f3a847; }

.nav-actions { display:flex; align-items:center; gap:4px; }
.nav-link, .nav-cart {
  color:#fff; padding:6px 9px; border:1px solid transparent; border-radius:3px;
  display:flex; flex-direction:column; line-height:1.2; white-space:nowrap;
}
.nav-link:hover, .nav-cart:hover { border:1px solid #fff; }
.nav-link small { font-size:12px; color:#ccc; }
.nav-link strong { font-size:13px; }
.nav-cart { flex-direction:row; align-items:flex-end; font-size:20px; }
.nav-cart strong { font-size:14px; margin-left:2px; margin-bottom:2px; }
.cart-badge {
  color:#f08804; font-weight:bold; font-size:16px; margin:0 2px;
}

/* ---------- Category strip ---------- */
.cat-strip {
  background:#232f3e; display:flex; gap:4px; padding:6px 16px;
  max-width:1500px; margin:0 auto; flex-wrap:wrap;
}
.cat-strip a {
  color:#fff; padding:4px 9px; font-size:13px; border:1px solid transparent;
  border-radius:3px;
}
.cat-strip a:hover { border:1px solid #fff; }

/* ---------- Layout ---------- */
.container { max-width:1500px; margin:0 auto; padding:16px; }

/* ---------- Flash ---------- */
.flash {
  max-width:1500px; margin:10px auto; padding:12px 16px; border-radius:5px;
  font-weight:bold;
}
.flash-success { background:#d4f8d4; color:#0a6b0a; border:1px solid #0a6b0a; }
.flash-error   { background:#ffe0e0; color:#b00; border:1px solid #b00; }
.flash-info    { background:#e0f0ff; color:#04567a; border:1px solid #04567a; }

/* ---------- Hero ---------- */
.hero {
  background:linear-gradient(180deg,#a7d6e8,#eaeded);
  padding:40px 20px; text-align:center; border-radius:6px; margin-bottom:18px;
}
.hero h1 { font-size:30px; margin-bottom:8px; }
.hero p { font-size:16px; color:#333; }

/* ---------- Section heading ---------- */
.section-title { font-size:21px; margin:18px 0 12px; }

/* ---------- Product grid ---------- */
.grid {
  display:grid; gap:14px;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
}
.card {
  background:#fff; border-radius:6px; padding:14px; display:flex;
  flex-direction:column; transition:box-shadow .15s;
}
.card:hover { box-shadow:0 2px 14px rgba(0,0,0,.18); }
.card .thumb {
  height:180px; display:flex; align-items:center; justify-content:center;
  overflow:hidden; margin-bottom:10px;
}
.card .thumb img { max-height:180px; width:auto; object-fit:contain; }
.card .pname {
  font-size:14px; line-height:1.35; margin-bottom:6px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  overflow:hidden; min-height:38px;
}
.card .pname:hover { color:#c7511f; }
.stars { color:#ffa41c; font-size:15px; letter-spacing:1px; }
.star-empty { color:#ccc; }
.rating-row { font-size:12px; color:#007185; margin-bottom:6px; }
.price-row { margin-bottom:8px; }
.price { font-size:20px; font-weight:bold; }
.price sup { font-size:12px; }
.old-price { color:#565959; text-decoration:line-through; font-size:13px; margin-left:6px; }
.discount { color:#cc0c39; font-size:13px; margin-left:6px; }
.stock-low { color:#cc0c39; font-size:12px; margin-bottom:6px; }
.stock-ok { color:#007600; font-size:12px; margin-bottom:6px; }

/* ---------- Buttons ---------- */
.btn {
  display:inline-block; text-align:center; cursor:pointer; border:none;
  padding:9px 14px; border-radius:20px; font-size:14px; font-weight:500;
}
.btn-yellow { background:#ffd814; color:#0f1111; }
.btn-yellow:hover { background:#f7ca00; }
.btn-orange { background:#ffa41c; color:#0f1111; }
.btn-orange:hover { background:#fa8900; }
.btn-block { display:block; width:100%; }
.btn-grey { background:#e7e9ec; color:#0f1111; border:1px solid #adb1b8; border-radius:8px; }
.btn-grey:hover { background:#d9dce0; }
.btn-danger { background:#cc0c39; color:#fff; }
.btn-sm { padding:5px 10px; font-size:12px; }

/* ---------- Product detail ---------- */
.detail {
  background:#fff; border-radius:6px; padding:24px;
  display:grid; grid-template-columns:1fr 1fr 280px; gap:28px;
}
.detail .big-thumb {
  display:flex; align-items:center; justify-content:center; max-height:420px;
}
.detail h1 { font-size:24px; margin-bottom:8px; }
.detail .desc { margin:14px 0; line-height:1.6; color:#333; }
.buy-box {
  border:1px solid #d5d9d9; border-radius:8px; padding:16px; height:fit-content;
}
.buy-box .price { font-size:26px; }
.qty-select { padding:6px; border-radius:6px; margin:10px 0; }

/* ---------- Tables ---------- */
table.tbl { width:100%; background:#fff; border-collapse:collapse; border-radius:6px; overflow:hidden; }
table.tbl th, table.tbl td { padding:10px 12px; text-align:left; border-bottom:1px solid #e3e3e3; }
table.tbl th { background:#232f3e; color:#fff; font-size:13px; }
table.tbl tr:hover td { background:#f7f7f7; }

/* ---------- Forms / Auth ---------- */
.auth-wrap { display:flex; justify-content:center; padding:30px 0; }
.auth-card {
  background:#fff; border:1px solid #ddd; border-radius:8px;
  padding:24px; width:350px;
}
.auth-card h2 { font-size:26px; margin-bottom:16px; }
.field { margin-bottom:14px; }
.field label { display:block; font-weight:bold; font-size:13px; margin-bottom:4px; }
.field input, .field textarea, .field select {
  width:100%; padding:8px; border:1px solid #a6a6a6; border-radius:4px;
  font-size:14px; font-family:inherit;
}
.field input:focus { outline:2px solid #e77600; border-color:#e77600; }
.auth-alt { margin-top:16px; font-size:13px; text-align:center; }

/* ---------- Cart ---------- */
.cart-layout { display:grid; grid-template-columns:1fr 300px; gap:18px; }
.cart-items { background:#fff; border-radius:6px; padding:18px; }
.cart-row {
  display:grid; grid-template-columns:90px 1fr auto; gap:14px;
  padding:14px 0; border-bottom:1px solid #e3e3e3; align-items:center;
}
.cart-row .thumb { height:80px; display:flex; align-items:center; }
.cart-summary {
  background:#fff; border-radius:6px; padding:18px; height:fit-content;
}
.cart-summary h3 { margin-bottom:12px; }
.summary-line { display:flex; justify-content:space-between; margin-bottom:8px; }
.summary-total { font-size:18px; font-weight:bold; border-top:1px solid #ddd; padding-top:10px; }

/* ---------- Empty state ---------- */
.empty {
  background:#fff; border-radius:6px; padding:50px; text-align:center;
}
.empty h2 { margin-bottom:10px; }

/* ---------- Admin ---------- */
.admin-wrap { display:grid; grid-template-columns:210px 1fr; min-height:100vh; }
.admin-side { background:#232f3e; color:#fff; padding:18px 0; }
.admin-side h3 { padding:0 18px 14px; border-bottom:1px solid #3a4a5e; }
.admin-side a {
  display:block; padding:12px 18px; color:#ddd; border-left:3px solid transparent;
}
.admin-side a:hover, .admin-side a.active {
  background:#1a2530; color:#fff; border-left:3px solid #febd69;
}
.admin-main { padding:24px; background:#eaeded; }
.stat-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-bottom:24px; }
.stat-card { background:#fff; border-radius:8px; padding:18px; }
.stat-card .num { font-size:28px; font-weight:bold; color:#232f3e; }
.stat-card .lbl { color:#565959; font-size:13px; }
.admin-card { background:#fff; border-radius:8px; padding:20px; margin-bottom:20px; }
.badge { padding:3px 9px; border-radius:12px; font-size:12px; font-weight:bold; }
.badge-pending { background:#fff3cd; color:#856404; }
.badge-processing { background:#cce5ff; color:#004085; }
.badge-shipped { background:#d1ecf1; color:#0c5460; }
.badge-delivered { background:#d4edda; color:#155724; }
.badge-cancelled { background:#f8d7da; color:#721c24; }

/* ---------- Responsive ---------- */
@media (max-width:900px) {
  .detail { grid-template-columns:1fr; }
  .cart-layout { grid-template-columns:1fr; }
  .admin-wrap { grid-template-columns:1fr; }
  .stat-grid { grid-template-columns:repeat(2,1fr); }
  .nav-link small { display:none; }
}
@media (max-width:600px) {
  .nav-inner { flex-wrap:wrap; }
  .search-box { order:3; flex-basis:100%; }
}