:root {
  --pnq-primary: #0f4c81;
  --pnq-primary-dark: #0b385f;
  --pnq-accent: #ff8a3d;
  --pnq-success: #2f9e6d;
  --pnq-ink: #1f2a37;
  --pnq-muted: #66758a;
  --pnq-soft: #eef6ff;
  --pnq-card: #ffffff;
  --pnq-border: #d9e6f5;
  --pnq-shadow: 0 10px 24px rgba(14, 38, 66, 0.08);

  --bs-primary: var(--pnq-primary);
  --bs-primary-rgb: 15, 76, 129;
  --bs-link-color: #0d5fa3;
  --bs-link-hover-color: #0b4f88;
}

body {
  min-height: 100vh;
  color: var(--pnq-ink);
  background:
    radial-gradient(circle at 12% 8%, rgba(112, 118, 130, 0.24), transparent 32%),
    radial-gradient(circle at 95% 4%, rgba(88, 94, 106, 0.20), transparent 30%),
    linear-gradient(180deg, #e2e5eb 0%, #c7ccd5 100%);
}

.navbar.bg-white {
  background: linear-gradient(120deg, #ffffff 0%, #f8fbff 100%) !important;
  border-bottom-color: #d6e4f4 !important;
}

.navbar-brand {
  color: var(--pnq-primary) !important;
  letter-spacing: 0.2px;
}

.nav-link {
  color: var(--pnq-ink) !important;
  font-weight: 500;
}

.nav-link:hover {
  color: var(--pnq-primary) !important;
}

.btn {
  border-radius: 0.7rem;
}

.btn-primary {
  background: linear-gradient(140deg, var(--pnq-primary) 0%, #1b6eb0 100%);
  border-color: var(--pnq-primary);
}

.btn-primary:hover,
.btn-primary:focus {
  background: linear-gradient(140deg, var(--pnq-primary-dark) 0%, #165b90 100%);
  border-color: var(--pnq-primary-dark);
}

.btn-success {
  background: linear-gradient(140deg, var(--pnq-success) 0%, #239368 100%);
  border-color: #27895f;
}

.hero-banner {
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.98) 0%, #f0f7ff 45%, #ddeeff 100%);
  border: 1px solid var(--pnq-border);
  box-shadow: var(--pnq-shadow);
}

.hero-banner h1,
.hero-banner .h4 {
  color: var(--pnq-primary-dark);
}

.home-carousel-image {
  height: min(38vh, 260px);
  object-fit: cover;
}

.category-strip {
  scrollbar-width: thin;
}

.category-strip::-webkit-scrollbar {
  height: 6px;
}

.category-strip::-webkit-scrollbar-thumb {
  background: #b9cade;
  border-radius: 999px;
}

.category-strip .btn-outline-primary {
  border-color: #b7d0ea;
  color: #0d588f;
  background: #f8fbff;
}

.card {
  background: var(--pnq-card);
  border: 1px solid #e6eef8;
}

.product-card {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.product-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 14px 28px rgba(17, 49, 83, 0.14);
}

.product-media {
  height: 135px;
  background: linear-gradient(180deg, #f8fbff 0%, #eef4fc 100%);
}

.product-detail-media {
  min-height: 250px;
}

.badge.text-bg-primary {
  background: linear-gradient(140deg, #1965a2 0%, #0f4c81 100%) !important;
}

.badge.text-bg-warning {
  background: linear-gradient(140deg, #ffc16f 0%, #ff9e4d 100%) !important;
  color: #6c3a09 !important;
}

.badge.text-bg-success {
  background: linear-gradient(140deg, #40b07c 0%, #2d9264 100%) !important;
}

.cart-thumb {
  height: 74px;
}

.summary-card {
  top: 88px;
  border: 1px solid #d9e8f7;
}

.list-group-item {
  border-color: #e3edf8;
}

.auth-card {
  border: 1px solid #dbe8f6;
  box-shadow: var(--pnq-shadow);
}

.auth-card input,
.auth-card select,
.auth-card textarea,
form .form-control,
form input[type="text"],
form input[type="email"],
form input[type="password"],
form input[type="number"] {
  border-radius: 0.65rem;
}

.auth-card input,
.auth-card select,
.auth-card textarea,
.card input,
.card select,
.card textarea {
  width: 100%;
  border: 1px solid #d4e2f1;
  background: #fff;
  padding: 0.55rem 0.75rem;
}

.auth-card input:focus,
.auth-card select:focus,
.auth-card textarea:focus,
.card input:focus,
.card select:focus,
.card textarea:focus {
  border-color: #73a9d6;
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgba(15, 76, 129, 0.16);
}

.auth-card .form-check {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}

.auth-card .form-check input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  padding: 0;
  margin: 0;
  flex: 0 0 auto;
}

.auth-card .form-check .form-check-label {
  margin-bottom: 0;
}

.alert {
  border: 1px solid transparent;
}

.alert-info {
  background: #ecf6ff;
  border-color: #cce6ff;
  color: #0f446e;
}

.alert-success {
  background: #ecfbf2;
  border-color: #ccefd9;
}

.alert-warning {
  background: #fff7ea;
  border-color: #ffe0b8;
}

.alert-danger {
  background: #fff1f2;
  border-color: #ffd2d7;
}

.pagination .page-link {
  color: #0d588f;
  border-color: #d2e3f5;
}

.pagination .page-item.active .page-link {
  background: linear-gradient(140deg, #1b6eb0 0%, #0f4c81 100%);
  border-color: #0f4c81;
}

.errorlist {
  list-style: none;
  padding-left: 0;
  margin-top: 0.3rem;
  margin-bottom: 0;
  color: #bf2f43;
  font-size: 0.875rem;
}

@media (min-width: 576px) {
  .product-media {
    height: 165px;
  }
}

@media (min-width: 768px) {
  .home-carousel-image {
    height: min(60vh, 520px);
  }

  .product-media {
    height: 190px;
  }

  .product-detail-media {
    min-height: 360px;
  }

  .cart-thumb {
    height: 92px;
  }
}
