/* Loading screens (1.73.0): grey placeholder shapes. Colours, speed and corners come from --sk-* on :root. */
:root { --sk-base: rgba(128, 128, 128, .16); --sk-hi: rgba(128, 128, 128, .30); --sk-speed: 1.4s; --sk-radius: 12px; }
[data-bs-theme="dark"] { --sk-base: rgba(255, 255, 255, .08); --sk-hi: rgba(255, 255, 255, .16); }
.sk, .sk-img-wait { background-color: var(--sk-base); border-radius: var(--sk-radius); }
.sk-shimmer .sk, .sk-shimmer img.sk-img-wait {
    background-image: linear-gradient(100deg, transparent 20%, var(--sk-hi) 50%, transparent 80%);
    background-size: 220% 100%; background-repeat: no-repeat; background-position: 160% 0;
    animation: sk-sweep var(--sk-speed) ease-in-out infinite;
}
.sk-pulse .sk, .sk-pulse img.sk-img-wait { animation: sk-beat var(--sk-speed) ease-in-out infinite; }
@keyframes sk-sweep { to { background-position: -60% 0; } }
@keyframes sk-beat { 50% { opacity: .5; } }
@media (prefers-reduced-motion: reduce) {
    .sk-rm .sk, .sk-rm img.sk-img-wait { animation: none !important; background-image: none !important; }
}
img.sk-img-wait { color: transparent; }
.sk-line { height: .9rem; margin: .55rem 0; }
.sk-line.w-30 { width: 30%; } .sk-line.w-50 { width: 50%; } .sk-line.w-70 { width: 70%; } .sk-line.w-90 { width: 90%; }
.sk-title { height: 1.7rem; width: 42%; margin: .4rem 0 1rem; }
.sk-pic { aspect-ratio: 4 / 3; width: 100%; }
.sk-chip { height: 2.1rem; width: 5.5rem; border-radius: 999px; flex: 0 0 auto; }
.sk-thumb { width: 3rem; height: 3rem; flex: 0 0 auto; }
.sk-btn { height: 2.6rem; width: 9rem; }
.sk-hero { height: 9rem; width: 100%; margin-bottom: 1rem; }
.sk-card { padding: .6rem; border: 1px solid var(--sk-base); border-radius: var(--sk-radius); }
.sk-card .sk-pic { margin-bottom: .4rem; }
.sk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 1rem; }
.sk-row { display: flex; align-items: center; gap: .9rem; padding: .8rem; border: 1px solid var(--sk-base); border-radius: var(--sk-radius); margin-bottom: .7rem; }
.sk-row > div { flex: 1 1 auto; min-width: 0; }
.sk-chips { display: flex; gap: .5rem; overflow: hidden; margin-bottom: 1rem; }
/* Over the page while the next one loads. */
.sk-page { position: fixed; left: 0; right: 0; bottom: 0; z-index: 1020; background: var(--bs-body-bg, #fff); overflow: hidden; padding: 1.2rem 0; pointer-events: none; }
.sk-page .container { max-width: 1140px; margin: 0 auto; padding: 0 .75rem; }
.sk-bar { position: fixed; top: 0; left: 0; height: 3px; width: 0; z-index: 2000; background: var(--bs-primary, #b71c2b); box-shadow: 0 0 8px var(--bs-primary, #b71c2b); transition: width 8s cubic-bezier(.1, .8, .2, 1), opacity .3s; pointer-events: none; }
.sk-bar.is-on { width: 85%; }
.sk-bar.is-done { width: 100%; opacity: 0; transition-duration: .2s; }
/* On top of a box that is being refreshed (the basket). */
.sk-cover { position: absolute; inset: 0; z-index: 5; background: var(--bs-body-bg, #fff); padding: 1rem; overflow: hidden; }
.sk-host { position: relative; min-height: 8rem; }
.sk-modal-body { padding: 1.2rem; }
.sk-search .sk-row { border: 0; margin: 0; padding: .45rem .8rem; }
.sk-search .sk-thumb { width: 2.2rem; height: 2.2rem; }
.sk-modal-body .sk-pic { aspect-ratio: 16 / 8; }
