/**
 * LayoutType=3 — CBS zone grid landing + swipe rail.
 */

.pos-layout-type-3 .pos-layout-root {
    background: var(--mem-cream, #f3e1cf);
}

.pos-layout-type-3 .pos-layout {
    flex: 1 1 auto;
    min-height: 0;
    align-items: stretch;
}

.pos-layout-type-3 .pos-catalog--zone {
    min-height: 0;
    overflow: hidden;
}

.pos-layout-type-3 .pos-catalog--zone-landing {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
}

.pos-layout-type-3 .pos-zone-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: repeat(3, minmax(0, 1fr));
    gap: 0.5rem;
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    overflow: hidden;
    padding: 0;
}

.pos-layout-type-3 .pos-zone-card {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--mem-strand, #d5c7b6);
    border-radius: 2px;
    background: var(--mem-hvid, #ffffff);
    padding: 0;
    text-align: left;
    cursor: pointer;
    overflow: hidden;
    min-height: 0;
    height: 100%;
    transition: box-shadow 0.12s ease;
}

.pos-layout-type-3 .pos-zone-card:hover:not(:disabled) {
    box-shadow: 0 2px 8px rgba(62, 66, 65, 0.12);
}

.pos-layout-type-3 .pos-zone-card--empty,
.pos-layout-type-3 .pos-zone-card:disabled {
    opacity: 0.35;
    cursor: not-allowed;
}

.pos-layout-type-3 .pos-zone-card__header {
    display: flex;
    gap: 0.4rem;
    padding: 0.4rem 0.45rem 0.3rem;
    align-items: flex-start;
    flex-shrink: 0;
}

.pos-layout-type-3 .pos-zone-card__number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.75rem;
    height: 1.75rem;
    padding: 0 0.35rem;
    background: var(--zone-color, #3e4241);
    color: var(--mem-hvid, #ffffff);
    font-weight: 700;
    font-size: 0.85rem;
    flex-shrink: 0;
}

.pos-layout-type-3 .pos-zone-card__titles {
    min-width: 0;
}

.pos-layout-type-3 .pos-zone-card__title {
    margin: 0;
    font-size: clamp(0.72rem, 1.1vw, 0.95rem);
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--mem-sort2025, #3e4241);
    line-height: 1.15;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.pos-layout-type-3 .pos-zone-card__tagline {
    margin: 0.1rem 0 0;
    font-size: clamp(0.52rem, 0.75vw, 0.62rem);
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--mem-aske, #5f513d);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pos-layout-type-3 .pos-zone-card__desc {
    margin: 0.15rem 0 0;
    font-size: clamp(0.58rem, 0.85vw, 0.72rem);
    line-height: 1.3;
    color: var(--mem-aske, #5f513d);
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.pos-layout-type-3 .pos-zone-card__hero {
    width: 100%;
    flex: 1 1 auto;
    min-height: 0;
    object-fit: contain;
    object-position: center;
    display: block;
}

.pos-layout-type-3 .pos-zone-card__footer {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem 0.4rem;
    padding: 0.35rem 0.45rem;
    background: var(--zone-color, #3e4241);
    color: var(--mem-hvid, #ffffff);
    font-size: clamp(0.52rem, 0.7vw, 0.62rem);
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    flex-shrink: 0;
}

.pos-layout-type-3 .pos-zone-card__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.2rem;
}

.pos-layout-type-3 .pos-zone-card__badge-icon {
    width: 0.85rem;
    height: 0.85rem;
    display: inline-block;
    background: currentColor;
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
}

.pos-layout-type-3 .pos-zone-icon--leaf { mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M17 3C10 3 5 8 5 15c0 2 1 3 2 3h1v-2H7c0-5 4-9 9-9V3zm-2 2v2c-4 0-7 3-7 7h2c0-3 2-5 5-5V5z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M17 3C10 3 5 8 5 15c0 2 1 3 2 3h1v-2H7c0-5 4-9 9-9V3zm-2 2v2c-4 0-7 3-7 7h2c0-3 2-5 5-5V5z'/%3E%3C/svg%3E"); }
.pos-layout-type-3 .pos-zone-icon--heart { mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 21s-6.7-4.4-9.2-8.3C.9 9.8 2.5 6 6.2 6c1.8 0 3.2.9 3.8 2.1C10.6 6.9 12 6 13.8 6c3.7 0 5.3 3.8 3.4 6.7C18.7 16.6 12 21 12 21z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 21s-6.7-4.4-9.2-8.3C.9 9.8 2.5 6 6.2 6c1.8 0 3.2.9 3.8 2.1C10.6 6.9 12 6 13.8 6c3.7 0 5.3 3.8 3.4 6.7C18.7 16.6 12 21 12 21z'/%3E%3C/svg%3E"); }
.pos-layout-type-3 .pos-zone-icon--sparkle,
.pos-layout-type-3 .pos-zone-icon--star { mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2l2.4 7.4H22l-6 4.6 2.3 7-6.3-4.7L5.7 21l2.3-7-6-4.6h7.6z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2l2.4 7.4H22l-6 4.6 2.3 7-6.3-4.7L5.7 21l2.3-7-6-4.6h7.6z'/%3E%3C/svg%3E"); }
.pos-layout-type-3 .pos-zone-icon--flame { mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2c1 3 3 5 3 8a3 3 0 1 1-6 0c0-1 .5-2 1-3-1 1-2 3-2 5a5 5 0 1 0 10 0c0-4-3-7-6-10z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2c1 3 3 5 3 8a3 3 0 1 1-6 0c0-1 .5-2 1-3-1 1-2 3-2 5a5 5 0 1 0 10 0c0-4-3-7-6-10z'/%3E%3C/svg%3E"); }
.pos-layout-type-3 .pos-zone-icon--bowl,
.pos-layout-type-3 .pos-zone-icon--cup { mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 10h16v2a6 6 0 0 1-6 6H10a6 6 0 0 1-6-6v-2zm16-2v2h2V8h-2z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 10h16v2a6 6 0 0 1-6 6H10a6 6 0 0 1-6-6v-2zm16-2v2h2V8h-2z'/%3E%3C/svg%3E"); }
.pos-layout-type-3 .pos-zone-icon--pepper,
.pos-layout-type-3 .pos-zone-icon--onion { mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2C8 6 6 9 6 13a6 6 0 1 0 12 0c0-4-2-7-6-11zm0 18a4 4 0 0 1-4-4h8a4 4 0 0 1-4 4z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2C8 6 6 9 6 13a6 6 0 1 0 12 0c0-4-2-7-6-11zm0 18a4 4 0 0 1-4-4h8a4 4 0 0 1-4 4z'/%3E%3C/svg%3E"); }
.pos-layout-type-3 .pos-zone-icon--pot { mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 10h16v8H4V10zm2 2v4h12v-4H6zm-2-4h16v2H4V8z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 10h16v8H4V10zm2 2v4h12v-4H6zm-2-4h16v2H4V8z'/%3E%3C/svg%3E"); }
.pos-layout-type-3 .pos-zone-icon--bread,
.pos-layout-type-3 .pos-zone-icon--bag { mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 7V5a5 5 0 0 1 10 0v2h1a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V9a2 2 0 0 1 2-2h1zm2 0h6V5a3 3 0 0 0-6 0v2z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 7V5a5 5 0 0 1 10 0v2h1a2 2 0 0 1 2 2v10a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V9a2 2 0 0 1 2-2h1zm2 0h6V5a3 3 0 0 0-6 0v2z'/%3E%3C/svg%3E"); }
.pos-layout-type-3 .pos-zone-icon--clock { mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a10 10 0 1 0 10 10A10 10 0 0 0 12 2zm1 11h4v-2h-3V7h-2v6z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a10 10 0 1 0 10 10A10 10 0 0 0 12 2zm1 11h4v-2h-3V7h-2v6z'/%3E%3C/svg%3E"); }
.pos-layout-type-3 .pos-zone-icon--snow { mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2 9 7l-5-1 3 4-4 1 5 2-2 5 4-3 4 3-2-5 5-2-4-1 3-4-5 1-3-5z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2 9 7l-5-1 3 4-4 1 5 2-2 5 4-3 4 3-2-5 5-2-4-1 3-4-5 1-3-5z'/%3E%3C/svg%3E"); }
.pos-layout-type-3 .pos-zone-icon--bolt { mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M13 2 3 14h7l-1 8 10-12h-7l1-8z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M13 2 3 14h7l-1 8 10-12h-7l1-8z'/%3E%3C/svg%3E"); }
.pos-layout-type-3 .pos-zone-icon--sun { mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 4V2m0 20v-2M4 12H2m20 0h-2M5 5l-1.5-1.5M20.5 20.5 19 19M5 19l-1.5 1.5M20.5 3.5 19 5M12 8a4 4 0 1 0 4 4 4 4 0 0 0-4-4z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 4V2m0 20v-2M4 12H2m20 0h-2M5 5l-1.5-1.5M20.5 20.5 19 19M5 19l-1.5 1.5M20.5 3.5 19 5M12 8a4 4 0 1 0 4 4 4 4 0 0 0-4-4z'/%3E%3C/svg%3E"); }
.pos-layout-type-3 .pos-zone-icon--people,
.pos-layout-type-3 .pos-zone-icon--hands { mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M16 11c1.7 0 3-1.3 3-3S17.7 5 16 5s-3 1.3-3 3 1.3 3 3 3zM8 11c1.7 0 3-1.3 3-3S9.7 5 8 5 5 6.3 5 8s1.3 3 3 3zm0 2c-2.7 0-8 1.3-8 4v3h16v-3c0-2.7-5.3-4-8-4z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M16 11c1.7 0 3-1.3 3-3S17.7 5 16 5s-3 1.3-3 3 1.3 3 3 3zM8 11c1.7 0 3-1.3 3-3S9.7 5 8 5 5 6.3 5 8s1.3 3 3 3zm0 2c-2.7 0-8 1.3-8 4v3h16v-3c0-2.7-5.3-4-8-4z'/%3E%3C/svg%3E"); }
.pos-layout-type-3 .pos-zone-icon--bulb { mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 21h6v-2H9v2zm3-19a7 7 0 0 0-4 12.7V17h8v-2.3A7 7 0 0 0 12 2z'/%3E%3C/svg%3E"); -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 21h6v-2H9v2zm3-19a7 7 0 0 0-4 12.7V17h8v-2.3A7 7 0 0 0 12 2z'/%3E%3C/svg%3E"); }

.pos-layout-type-3 .pos-catalog--zone-detail {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    min-height: 0;
    flex: 1 1 auto;
    overflow: hidden;
}

.pos-layout-type-3 .pos-zone-detail-toolbar {
    flex-shrink: 0;
}

.pos-layout-type-3 .pos-zone-rail-wrap {
    display: flex;
    align-items: stretch;
    gap: 0.35rem;
    flex-shrink: 0;
}

.pos-layout-type-3 .pos-zone-rail__nav {
    flex: 0 0 2.25rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--mem-strand, #d5c7b6);
    border-radius: 2px;
    background: var(--mem-hvid, #ffffff);
    color: var(--mem-sort2025, #3e4241);
    cursor: pointer;
    padding: 0;
    align-self: center;
    min-height: 4.5rem;
}

.pos-layout-type-3 .pos-zone-rail__nav:hover {
    background: var(--mem-cream, #f3e1cf);
}

.pos-layout-type-3 .pos-zone-rail__nav-icon {
    width: 1.1rem;
    height: 1.1rem;
    display: block;
    background: currentColor;
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    -webkit-mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-position: center;
}

.pos-layout-type-3 .pos-zone-rail__nav--prev .pos-zone-rail__nav-icon {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M15 6l-6 6 6 6'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M15 6l-6 6 6 6'/%3E%3C/svg%3E");
}

.pos-layout-type-3 .pos-zone-rail__nav--next .pos-zone-rail__nav-icon {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 6l6 6-6 6'/%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 6l6 6-6 6'/%3E%3C/svg%3E");
}

.pos-layout-type-3 .pos-zone-rail {
    display: flex;
    gap: 0.5rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: 0.15rem 0.15rem 0.35rem;
    flex: 1 1 auto;
    min-width: 0;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.pos-layout-type-3 .pos-zone-rail::-webkit-scrollbar {
    display: none;
}

.pos-layout-type-3 .pos-zone-rail__chip {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    flex: 0 0 7.5rem;
    scroll-snap-align: center;
    border: 2px solid var(--mem-strand, #d5c7b6);
    border-radius: 2px;
    background: var(--mem-hvid, #ffffff);
    padding: 0.35rem;
    cursor: pointer;
    text-align: center;
}

.pos-layout-type-3 .pos-zone-rail__chip--active {
    border-color: var(--zone-color, #3e4241);
    box-shadow: inset 0 0 0 1px var(--zone-color, #3e4241);
}

.pos-layout-type-3 .pos-zone-rail__chip:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.pos-layout-type-3 .pos-zone-rail__chip-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.35rem;
    height: 1.35rem;
    padding: 0 0.25rem;
    background: var(--zone-color, #3e4241);
    color: var(--mem-hvid, #ffffff);
    font-size: 0.7rem;
    font-weight: 700;
}

.pos-layout-type-3 .pos-zone-rail__chip-image {
    width: 100%;
    height: 3.25rem;
    object-fit: contain;
    object-position: center;
    border-radius: 1px;
}

.pos-layout-type-3 .pos-zone-rail__chip-title {
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--mem-sort2025, #3e4241);
    line-height: 1.2;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pos-layout-type-3 .pos-catalog--zone-detail .pos-product-grid {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    align-content: start;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
}

.pos-layout-type-3 .pos-catalog--zone-detail .pos-product-tile {
    aspect-ratio: auto;
    min-height: 148px;
    width: 100%;
    height: auto;
    overflow: hidden;
    justify-content: flex-start;
    gap: 0.15rem;
}

.pos-layout-type-3 .pos-catalog--zone-detail .pos-product-tile__image {
    flex: 0 1 auto;
    max-height: 64px;
    width: 100%;
    object-fit: contain;
    margin-bottom: 0.2rem;
}

.pos-layout-type-3 .pos-catalog--zone-detail .pos-product-tile--profile {
    padding: 0;
    justify-content: center;
    align-items: center;
}

.pos-layout-type-3 .pos-catalog--zone-detail .pos-product-tile--profile .pos-product-tile__image {
    flex: none;
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: cover;
    margin: 0;
}

.pos-layout-type-3 .pos-catalog--zone-detail .pos-product-tile__pickup {
    display: block;
    margin-top: 0.2rem;
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1.25;
    opacity: 0.95;
    color: var(--mem-aske, #5f513d);
}