/* ==========================================================================
   Shared storefront styles
   --------------------------------------------------------------------------
   Loaded AFTER the per-page stylesheets on every page, so plain rules here win
   over the equally-specific legacy rules without adding more !important.
   ========================================================================== */

/* The logo block is a link home on every page. */
a.logo-area {
  text-decoration: none;
  color: inherit;
}

/* The search box became a real <form>; keep the original look and cursor. */
form.search-box {
  margin: 0;
}

.search-box button {
  cursor: pointer;
}

/* The navbar now carries real category links, so it must scroll instead of
   clipping on narrow screens. */
.navbar {
  overflow-x: auto;
  scrollbar-width: none;
}

.navbar::-webkit-scrollbar {
  display: none;
}

.navbar-links {
  gap: 24px;
}

.navbar a.active {
  color: #2d9092;
}

/* --- flash messages (rendered by partials/header.html) -------------------- */

.site-messages {
  max-width: 1280px;
  margin: 16px auto 0;
  padding: 0 5%;
  display: grid;
  gap: 8px;
}

.site-message {
  padding: 12px 16px;
  border-radius: 10px;
  border: 1px solid #d8ecec;
  background: #eef8f8;
  color: #216b6b;
  font-size: 14px;
  line-height: 1.8;
}

.site-message.success {
  border-color: #cdebd6;
  background: #f0fbf3;
  color: #1f6b3a;
}

.site-message.warning {
  border-color: #f6e2c0;
  background: #fff8ec;
  color: #8a6116;
}

.site-message.error {
  border-color: #f3cfd5;
  background: #fdf2f4;
  color: #9b2c3f;
}