/* Hawamech - gift offer bar at the top of every page. Desktop: starts where the site content starts. Phones: one line. */
.hwg-bar { position: relative; z-index: 60; background: var(--theme-palette-color-1, #4d7865); color: #fff; overflow: hidden; font-size: 13.5px; line-height: 1.45; }
.hwg-bar[hidden] { display: none; }
.hwg-bar::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, .16) 50%, transparent 70%); transform: translateX(-100%); animation: hwg-bar-sheen 7s ease-in-out 1.5s infinite; }
.hwg-bar__in { position: relative; box-sizing: border-box; width: var(--theme-container-width, calc(100% - 32px)); max-width: var(--theme-normal-container-max-width, 1290px); margin: 0 auto; padding-block: 8px; padding-inline: 0 40px; display: flex; align-items: center; justify-content: flex-start; gap: 10px; }
.hwg-bar__gift { display: grid; place-items: center; flex: none; color: #f3dfb8; }
.hwg-bar__lid { transform-origin: 12px 7px; transform-box: view-box; animation: hwg-bar-lid 5s ease-in-out 1s infinite; }
.hwg-bar__text { margin: 0; min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-weight: 500; }
.hwg-bar__short { display: none; }
.hwg-bar__days { display: inline-block; padding: 1px 8px; background: rgba(255, 255, 255, .16); border-radius: 2px; font-size: 12px; font-weight: 600; white-space: nowrap; }
.hwg-bar__link { color: #fff; font-weight: 400; text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; white-space: nowrap; }
.hwg-bar__link:hover, .hwg-bar__link:focus { color: #f3dfb8; }
.hwg-bar__close { position: absolute; z-index: 2; top: 50%; inset-inline-end: 0; transform: translateY(-50%); width: 28px; height: 28px; display: grid; place-items: center; background: transparent; border: 0; color: rgba(255, 255, 255, .85); cursor: pointer; border-radius: 2px; padding: 0; }
.hwg-bar__close:hover { background: rgba(255, 255, 255, .12); color: #fff; }
.hwg-bar :focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
@keyframes hwg-bar-sheen { 0% { transform: translateX(-100%); } 35%, 100% { transform: translateX(100%); } }
@keyframes hwg-bar-lid { 0%, 70%, 100% { transform: none; } 76% { transform: translateY(-3px) rotate(-10deg); } 82% { transform: translateY(-1px) rotate(6deg); } 88% { transform: none; } }
/* Phones: one line. Short text + days left; the link's words go and the whole bar becomes the link. */
@media (max-width: 689px) {
	.hwg-bar { font-size: 13px; }
	.hwg-bar__in { width: auto; padding-block: 7px; padding-inline: 16px 44px; gap: 8px; }
	.hwg-bar__gift svg { width: 18px; height: 18px; }
	.hwg-bar__text { flex: 1; flex-wrap: nowrap; gap: 8px; white-space: nowrap; }
	.hwg-bar__long { display: none; }
	.hwg-bar__short { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
	.hwg-bar__days { font-size: 11.5px; }
	.hwg-bar__link { position: absolute; inset: 0; z-index: 1; overflow: hidden; color: transparent; font-size: 0; text-decoration: none; }
	.hwg-bar__close { inset-inline-end: 10px; }
}
@media (prefers-reduced-motion: reduce) {
	.hwg-bar::after, .hwg-bar__lid { animation: none; }
}
