/*
 * Lemurian Bazaar Brand Theme v1.0.0
 * Official logo image is served separately and is not visually altered.
 * Theme colors are derived from the official blue/green brand palette.
 */

:root {
  --lb-blue: #078ed1;
  --lb-blue-deep: #0067aa;
  --lb-blue-soft: #eaf7ff;
  --lb-green: #78be20;
  --lb-green-deep: #4c9d1c;
  --lb-green-soft: #f1fae8;
  --lb-ink: #10233f;
  --lb-muted: #637089;
  --lb-line: #dce7f2;
  --lb-surface: #ffffff;
  --lb-radius: 18px;
  --lb-pill: 999px;
  --lb-shadow: 0 10px 30px rgba(16,35,63,.08);
}

/* Preserve official logo proportions exactly. No filter, mask, recolor or crop. */
.lb-official-logo {
  display: block !important;
  width: auto !important;
  height: 72px !important;
  max-width: 310px !important;
  object-fit: contain !important;
  object-position: left center !important;
  border: 0 !important;
  border-radius: 0 !important;
  filter: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

.lb-brand-text-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* General brand polish */
body {
  color: var(--lb-ink);
}

header,
.topbar,
.site-header,
.marketplace-header {
  background: rgba(255,255,255,.98);
}

.card,
.panel,
.vendor-card,
.product-card,
.checkout-card,
.cart-card {
  border-radius: var(--lb-radius) !important;
  border-color: var(--lb-line) !important;
  box-shadow: var(--lb-shadow);
}

/* Rounded brand controls */
button,
.button,
.btn,
[role="button"],
[role="tab"],
.tab,
.mode-tab,
.channel-tab {
  border-radius: var(--lb-pill) !important;
  transition:
    transform .15s ease,
    box-shadow .15s ease,
    background-color .15s ease,
    border-color .15s ease !important;
}

button:hover,
.button:hover,
.btn:hover,
[role="button"]:hover,
[role="tab"]:hover,
.tab:hover,
.mode-tab:hover,
.channel-tab:hover {
  transform: translateY(-1px);
}

button:focus-visible,
.button:focus-visible,
.btn:focus-visible,
[role="button"]:focus-visible,
[role="tab"]:focus-visible,
.tab:focus-visible {
  outline: 3px solid rgba(7,142,209,.24) !important;
  outline-offset: 2px !important;
}

/* Default primary action = brand blue */
.lb-brand-blue,
button.lb-brand-blue,
a.lb-brand-blue {
  color: #fff !important;
  background: linear-gradient(180deg, #16a6e7 0%, var(--lb-blue) 55%, var(--lb-blue-deep) 100%) !important;
  border-color: var(--lb-blue-deep) !important;
  box-shadow: 0 8px 20px rgba(7,142,209,.20) !important;
}

/* Commerce / fresh / add-to-cart action = brand green */
.lb-brand-green,
button.lb-brand-green,
a.lb-brand-green {
  color: #fff !important;
  background: linear-gradient(180deg, #91d53d 0%, var(--lb-green) 55%, var(--lb-green-deep) 100%) !important;
  border-color: var(--lb-green-deep) !important;
  box-shadow: 0 8px 20px rgba(120,190,32,.20) !important;
}

.lb-brand-blue:hover {
  background: linear-gradient(180deg, #129adb 0%, #087fc0 55%, #005d9a 100%) !important;
}

.lb-brand-green:hover {
  background: linear-gradient(180deg, #84cb33 0%, #68af20 55%, #438d18 100%) !important;
}

/* Ecommerce and Quick Commerce tabs clearly inherit the two brand colors */
.lb-tab-ecommerce {
  color: #fff !important;
  background: linear-gradient(180deg, #16a6e7, var(--lb-blue-deep)) !important;
  border-color: var(--lb-blue-deep) !important;
  box-shadow: 0 7px 18px rgba(7,142,209,.18) !important;
}

.lb-tab-quick {
  color: #fff !important;
  background: linear-gradient(180deg, #91d53d, var(--lb-green-deep)) !important;
  border-color: var(--lb-green-deep) !important;
  box-shadow: 0 7px 18px rgba(120,190,32,.18) !important;
}

/* Secondary controls: white surface with a brand-color ring */
.lb-brand-outline-blue {
  color: var(--lb-blue-deep) !important;
  background: #fff !important;
  border: 1.5px solid rgba(7,142,209,.55) !important;
}

.lb-brand-outline-green {
  color: var(--lb-green-deep) !important;
  background: #fff !important;
  border: 1.5px solid rgba(120,190,32,.62) !important;
}

/* Inputs/search retain a light, clean marketplace appearance */
input,
select,
textarea,
.search-box,
.search-input {
  border-radius: 16px !important;
}

input:focus,
select:focus,
textarea:focus {
  border-color: var(--lb-blue) !important;
  box-shadow: 0 0 0 3px rgba(7,142,209,.10) !important;
  outline: none !important;
}

/* Active/fresh highlights */
.lb-brand-accent-blue {
  color: var(--lb-blue-deep) !important;
}

.lb-brand-accent-green {
  color: var(--lb-green-deep) !important;
}

/* Keep destructive/close controls visually distinct; do not recolor them as primary CTAs. */
button[aria-label*="close" i],
button[title*="close" i],
.lb-no-brand {
  box-shadow: none !important;
}

/* Responsive logo sizing only; the logo artwork itself is untouched. */
@media (max-width: 900px) {
  .lb-official-logo {
    height: 58px !important;
    max-width: 250px !important;
  }
}

@media (max-width: 640px) {
  .lb-official-logo {
    height: 48px !important;
    max-width: 205px !important;
  }

  button,
  .button,
  .btn,
  [role="button"],
  [role="tab"],
  .tab,
  .mode-tab,
  .channel-tab {
    border-radius: 16px !important;
  }
}

/* Respect reduced motion. */
@media (prefers-reduced-motion: reduce) {
  button,
  .button,
  .btn,
  [role="button"],
  [role="tab"],
  .tab,
  .mode-tab,
  .channel-tab {
    transition: none !important;
  }
}