/* Shared merchant dashboard presentation. Saved merchant branding is not overridden. */
.dashboard-christmas-banner { display: none; }

html[data-season="christmas"] body[data-ui="dashboard"] {
  background:
    radial-gradient(ellipse at 95% 0, #DEC48E14, transparent 38rem),
    radial-gradient(ellipse at 25% 0, #89B79812, transparent 42rem),
    var(--canvas);
}

html[data-season="christmas"] .dashboard-christmas-banner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 152px;
  margin: 0 0 24px;
  padding: 24px 32px;
  border: 1px solid #DCE6D9;
  border-radius: 18px;
  background:
    radial-gradient(circle at 91% 20%, #F3E6BF80, transparent 36%),
    linear-gradient(110deg, #F7FAF3, #FBFAF4);
  box-shadow: 0 5px 20px #24453506;
  overflow: hidden;
}

.dashboard-christmas-message { position: relative; z-index: 1; flex: 1; min-width: 0; }
.dashboard-christmas-message h2 {
  max-width: 620px;
  margin: 0;
  color: #244D3C;
  font-size: clamp(20px, 2vw, 27px);
  line-height: 1.3;
  font-weight: 650;
  letter-spacing: -.65px;
  text-wrap: balance;
}
.dashboard-christmas-message p { margin: 10px 0 0; color: #617063; font-size: 12px; line-height: 1.65; }
.dashboard-christmas-art { display: block; width: 220px; height: 130px; flex: 0 0 auto; margin: -14px -8px -10px 0; pointer-events: none; user-select: none; }

html[data-season="christmas"] body[data-ui="dashboard"] .workspace-bar { position: relative; }
html[data-season="christmas"] body[data-ui="dashboard"] :is(.workspace-bar, .topbar)::after {
  content: "";
  position: absolute;
  inset: auto 0 -6px;
  height: 7px;
  border-top: 1px solid #69856C33;
  background:
    radial-gradient(ellipse 2.5px 3.5px at 20px 3px, #B95164 96%, transparent),
    radial-gradient(ellipse 2.5px 3.5px at 60px 3px, #72A28C 96%, transparent),
    radial-gradient(ellipse 2.5px 3.5px at 100px 3px, #D4AE68 96%, transparent);
  background-size: 120px 7px;
  pointer-events: none;
}

html[data-season="christmas"] body[data-ui="dashboard"] .profile-mark { position: relative; }
html[data-season="christmas"] body[data-ui="dashboard"] .profile-mark::after {
  content: "";
  position: absolute;
  width: 27px;
  height: 24px;
  top: -12px;
  right: -5px;
  background: url('/assets/christmas-hat.svg') center / contain no-repeat;
  pointer-events: none;
  transform: rotate(14deg);
}

@media (max-width: 1024px) {
  html[data-season="christmas"] .dashboard-christmas-banner { padding: 22px 24px; gap: 18px; }
  .dashboard-christmas-art { width: 175px; height: 115px; }
}
@media (max-width: 600px) {
  html[data-season="christmas"] .dashboard-christmas-banner { min-height: 125px; padding: 20px 16px; gap: 8px; margin-bottom: 18px; border-radius: 14px; }
  .dashboard-christmas-message h2 { font-size: 19px; letter-spacing: -.45px; }
  .dashboard-christmas-message p { margin-top: 7px; font-size: 11px; }
  .dashboard-christmas-art { width: 88px; height: 100px; margin: -5px -8px -5px 0; }
}
@media (forced-colors: active) {
  html[data-season="christmas"] .dashboard-christmas-banner { background: Canvas; border-color: CanvasText; }
  .dashboard-christmas-message :is(h2, p) { color: CanvasText; }
}
@media print {
  html[data-season="christmas"] .dashboard-christmas-banner,
  html[data-season="christmas"] body[data-ui="dashboard"] :is(.workspace-bar, .topbar, .profile-mark)::after { display: none; }
}