/* Shared seasonal decoration for the storefront, workspace and customer pages. */
.diwali-greeting {
  position: sticky; top: 0; z-index: 10; display: flex; align-items: center; justify-content: center;
  gap: 20px; min-height: 48px; padding: 7px 20px; color: #ffe7b5;
  background: radial-gradient(ellipse at 50% 140%, #96512c 0, transparent 65%), #442633;
  font-family: "Segoe UI", sans-serif; text-align: center; border-bottom: 1px solid #d9a252;
}
.diwali-greeting > svg { width: 29px; height: 33px; flex-shrink: 0; }
.diwali-greeting strong { font-family: Georgia, serif; font-size: 21px; font-weight: 400; letter-spacing: .5px; }
.diwali-wish { margin-left: 20px; font-size: 12px; letter-spacing: .4px; }
.diwali-lights {
  position: fixed; top: 48px; left: 0; width: 100%; height: 20px; z-index: 11;
  display: flex; justify-content: space-around; pointer-events: none; overflow: hidden;
  border-top: 1px solid #ad783e;
}
.diwali-lights i { width: 6px; height: 10px; border-radius: 2px 2px 50% 50%; background: #ffd277; box-shadow: 0 1px 11px 3px #ffce6b80; }
.diwali-lights i:nth-child(3n) { height: 16px; background: #f2a15d; }
.diwali-lights i:nth-child(3n + 1) { height: 13px; }
body:has(.diwali-greeting) { background-color: #fff9ee; }
body:has(.diwali-greeting) .opening {
  background: radial-gradient(ellipse at 15% 20%, #f8dba450, transparent 50%), radial-gradient(ellipse at 90% 80%, #edb87935, transparent 45%), #f8f3e9;
  min-height: calc(100svh - 48px);
}
body .opening h1 em { color: #a35d28 !important; }
body .opening-eyebrow { color: #8a4a25 !important; }
body .opening button.opening-primary { background: linear-gradient(135deg, #87412d, #54313a) !important; border-color: #87412d !important; }
body:has(.diwali-greeting) .store-hero { background: radial-gradient(ellipse at 85% 50%, #f4c87945, transparent 60%), #fff7e9; }
body:has(.diwali-greeting) .store-hero h1 em { color: #a35d28 !important; }
body:has(.diwali-greeting) :is(.sidebar, .studio-sidebar) { border-top: 2px solid #d6a04f; }
@media (max-width: 600px) {
  .diwali-greeting { gap: 12px; }
  .diwali-greeting strong { font-size: 19px; }
  .diwali-wish { display: block; margin: 2px 0 0; font-size: 10px; }
  .diwali-greeting > svg { width: 25px; }
}
@media print {
  .diwali-greeting, .diwali-lights { display: none !important; }
}