/* =========================================================
   Looks – gallery + single look (Claude Design "Looks galerija", "Look'o puslapis")
   Uses the shared tokens from style.css (--rb-*).
   ========================================================= */
.rb-wine { color: var(--rb-wine); }
.rb-btn--ghost {
	background: transparent !important; color: var(--rb-ink) !important; border: 1px solid var(--rb-ink);
	gap: 12px; min-height: 52px; padding: 0 40px;
}
.rb-btn--ghost:hover { background: var(--rb-ink) !important; color: var(--rb-bg) !important; }

/* ---------- Gallery ---------- */
.rb-lks-head {
	padding: 72px 0 48px; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end;
	gap: 24px 64px; border-bottom: 1px solid var(--rb-line);
}
.rb-lks-head__title { display: flex; flex-direction: column; gap: 16px; }
.rb-lks-title {
	margin: 0; font-family: var(--rb-serif); font-weight: 400; font-size: clamp(56px, 7vw, 112px) !important;
	line-height: .95 !important; letter-spacing: -.01em;
}
.rb-lks-intro { flex: 0 1 440px; display: flex; flex-direction: column; gap: 14px; padding-bottom: 8px; }
.rb-lks-intro p { margin: 0; }
.rb-lks-intro__quote { font-family: var(--rb-serif); font-style: italic; font-size: 24px; line-height: 1.35; }
.rb-lks-intro__text { font-size: 15px; line-height: 1.65; color: var(--rb-muted); }

.rb-lks-bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; padding: 28px 0 40px; }
.rb-lks-filters { display: flex; gap: 8px; overflow-x: auto; flex: 1 1 auto; min-width: 0; scrollbar-width: none; }
.rb-lks-filters::-webkit-scrollbar { display: none; }
.rb-lk-filter {
	flex: 0 0 auto; height: 44px; padding: 0 20px; display: inline-flex; align-items: center; box-sizing: border-box;
	font-size: 13px; letter-spacing: .06em; white-space: nowrap; color: var(--rb-ink);
	border: 1px solid var(--rb-border); background: transparent;
}
.rb-lk-filter:hover { border-color: var(--rb-ink); color: var(--rb-ink); }
.rb-lk-filter[aria-pressed="true"] { background: var(--rb-ink); border-color: var(--rb-ink); color: var(--rb-bg); }
.rb-lks-count { margin: 0; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--rb-muted); }
.rb-lks-empty { padding: 48px 0 120px; font-size: 17px; color: var(--rb-muted); }

.rb-lks-grid { columns: 4 260px; column-gap: 24px; }
.rb-lk-cell { break-inside: avoid; margin-bottom: 44px; }
.rb-lk-cell[hidden] { display: none; }
.rb-lks-more { display: flex; justify-content: center; padding: 32px 0 120px; }
.rb-lks-more [hidden] { display: none !important; }
.rb-lks-more:has([hidden]) { padding-bottom: 80px; }

/* Card */
.rb-lk-card { display: flex; flex-direction: column; gap: 16px; color: var(--rb-ink); }
.rb-lk-card:hover { color: var(--rb-ink); }
.rb-lk-card__media { position: relative; overflow: hidden; background: var(--rb-sand); }
.rb-lk-card__media .rb-ph__label { position: absolute; left: 14px; bottom: 14px; }
.rb-lk-card__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s cubic-bezier(.2,.7,.2,1) !important; }
.rb-lk-badge {
	position: absolute; top: 14px; left: 14px; z-index: 2; background: var(--rb-wine); color: var(--rb-bg);
	font-size: 11px; letter-spacing: .1em; text-transform: uppercase; padding: 7px 10px;
}
.rb-lk-badge__short { display: none; }
.rb-lk-card__dot {
	position: absolute; z-index: 1; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%;
	background: var(--rb-bg); box-shadow: 0 0 0 5px rgba(244, 238, 230, .35), 0 2px 8px rgba(34, 27, 22, .25);
	opacity: 0; transform: scale(.5); transition: opacity .3s ease, transform .3s ease;
}
.rb-lk-card__strip {
	position: absolute; left: 0; right: 0; bottom: 0; z-index: 2; display: flex; align-items: center; gap: 8px;
	padding: 10px 12px; background: rgba(244, 238, 230, .95);
	transform: translateY(101%); transition: transform .35s cubic-bezier(.2,.7,.2,1);
}
.rb-lk-card__thumb { flex: 0 0 auto; width: 34px; height: 44px; object-fit: cover; box-shadow: inset 0 0 0 1px rgba(34, 27, 22, .14); }
.rb-lk-card__go { margin-left: auto; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
@media (hover: hover) {
	.rb-lk-card:hover .rb-lk-card__img { transform: scale(1.03); }
	.rb-lk-card:hover .rb-lk-card__dot, .rb-lk-card:focus-visible .rb-lk-card__dot { opacity: 1; transform: none; }
	.rb-lk-card:hover .rb-lk-card__strip, .rb-lk-card:focus-visible .rb-lk-card__strip { transform: none; }
}
.rb-lk-card__meta { display: flex; flex-direction: column; gap: 6px; }
.rb-lk-card__occ { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--rb-gold-text); min-height: 1em; }
.rb-lk-card__name { font-family: var(--rb-serif); font-size: 24px; line-height: 1.15; }
.rb-lk-card__sum { font-size: 14px; color: var(--rb-muted); }

/* ---------- Single look ---------- */
.rb-lk { display: flex; flex-wrap: wrap; gap: 64px; align-items: flex-start; }
.rb-lk__media { flex: 1.15 1 520px; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.rb-lk__hint { margin: 0; font-size: 13px; color: var(--rb-muted); }
.rb-lk__hint--touch { display: none; }
@media (hover: none) {
	.rb-lk__hint--hover { display: none; }
	.rb-lk__hint--touch { display: inline; }
}

.rb-lk-stage { position: relative; background: var(--rb-sand); }
.rb-lk-stage__clip { position: absolute; inset: 0; overflow: hidden; }
.rb-lk-stage__clip .rb-ph__label { position: absolute; left: 20px; bottom: 20px; }
.rb-lk-stage__img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rb-lk-stage__box {
	position: absolute; pointer-events: none; opacity: 0;
	border: 1px solid rgba(244, 238, 230, .9); box-shadow: 0 0 0 9999px rgba(34, 27, 22, .32);
	transition: opacity .25s ease;
}
.rb-lk-stage__box.is-on { opacity: 1; }

.rb-lk-spot { position: absolute; z-index: 2; width: 44px; height: 44px; margin: -22px 0 0 -22px; }
.rb-lk-spot.is-open { z-index: 5; }
.rb-lk-spot__btn {
	width: 44px; height: 44px; display: flex; align-items: center; justify-content: center;
	background: none; border: 0; padding: 0; cursor: pointer; color: var(--rb-ink);
}
.rb-lk-spot__dot {
	position: relative; width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
	font: 300 20px/1 var(--rb-sans); background: var(--rb-bg); color: var(--rb-ink);
	box-shadow: 0 2px 10px rgba(34, 27, 22, .28); transition: transform .2s ease, background-color .2s ease, color .2s ease;
}
.rb-lk-spot__dot::after {
	content: ""; position: absolute; inset: -6px; border-radius: 50%; border: 1px solid rgba(244, 238, 230, .8);
	animation: rb-lk-pulse 2.4s ease-out infinite;
}
@keyframes rb-lk-pulse { 0% { transform: scale(.8); opacity: .9; } 70%, 100% { transform: scale(1.35); opacity: 0; } }
.rb-lk-spot.is-open .rb-lk-spot__dot { background: var(--rb-ink); color: var(--rb-bg); transform: rotate(45deg); }
.rb-lk-spot.is-open .rb-lk-spot__dot::after { animation: none; opacity: 0; }

.rb-lk-pop { position: absolute; display: none; }
.rb-lk-spot.is-open .rb-lk-pop { display: block; }
.rb-lk-pop--right { left: 44px; padding-left: 8px; }
.rb-lk-pop--left { right: 44px; padding-right: 8px; }
.rb-lk-pop--top { top: 0; }
.rb-lk-pop--bottom { bottom: 0; }
.rb-lk-pop--middle { top: 50%; transform: translateY(-50%); }
.rb-lk-pop__card {
	width: 268px; box-sizing: border-box; display: flex; gap: 14px; align-items: center; padding: 12px;
	background: var(--rb-bg); box-shadow: 0 18px 44px rgba(34, 27, 22, .24);
}
.rb-lk-pop__thumb { flex: 0 0 auto; width: 56px; height: 72px; background: var(--rb-sand); overflow: hidden; }
.rb-lk-pop__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rb-lk-pop__text { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.rb-lk-pop__name { font-family: var(--rb-serif); font-size: 17px; line-height: 1.2; }
.rb-lk-pop__price { font-size: 14px; color: var(--rb-body); }
.rb-lk-pop__price.is-sold { color: var(--rb-wine); }
.rb-lk-pop__go { align-self: flex-start; padding-top: 4px; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; border-bottom: 1px solid var(--rb-gold); }

.rb-lk__info { flex: 1 1 420px; max-width: 560px; display: flex; flex-direction: column; gap: 36px; }
.rb-lk__head { display: flex; flex-direction: column; gap: 16px; }
.rb-lk__head > * { margin: 0; }
.rb-lk__title { font-family: var(--rb-serif); font-weight: 400; font-size: 52px !important; line-height: 1.02 !important; }
.rb-lk__lead { font-size: 16px; line-height: 1.7; color: var(--rb-body); }
.rb-lk__how { font-family: var(--rb-serif); font-style: italic; color: var(--rb-ink); }

.rb-lk-list__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--rb-ink); }
.rb-lk-list__head h2 { margin: 0; font: 500 13px/1.3 var(--rb-sans) !important; letter-spacing: .12em !important; text-transform: uppercase; }
.rb-lk-list__head span { font-size: 13px; color: var(--rb-muted); }

.rb-lk-row {
	display: grid; grid-template-columns: 20px 64px minmax(0, 1fr); gap: 16px; align-items: start;
	padding: 18px 12px; border-bottom: 1px solid var(--rb-line); transition: background-color .2s ease;
}
.rb-lk-row.is-active { background: var(--rb-soft); }
.rb-lk-row__chk { width: 20px; height: 20px; margin: 32px 0 0; accent-color: var(--rb-ink); cursor: pointer; }
.rb-lk-row__thumb { width: 64px; height: 84px; background: var(--rb-sand); overflow: hidden; }
.rb-lk-row__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.rb-lk-row.is-sold .rb-lk-row__thumb { opacity: .45; }
.rb-lk-row__body { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.rb-lk-row__head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.rb-lk-row__name { font-family: var(--rb-serif); font-size: 19px; line-height: 1.2; cursor: pointer; }
.rb-lk-row.is-sold .rb-lk-row__name { color: var(--rb-muted); cursor: default; }
.rb-lk-row__price { font-size: 15px; white-space: nowrap; }
.rb-lk-row.is-sold .rb-lk-row__price { color: var(--rb-muted); text-decoration: line-through; }
.rb-lk-row__meta { font-size: 13px; color: var(--rb-muted); }
.rb-lk-row__opts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-top: 2px; }
.rb-lk-row__one { font-size: 13px; color: var(--rb-muted); }
.rb-lk-row__go { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; border-bottom: 1px solid var(--rb-border); padding-bottom: 2px; }
.rb-lk-row__go:hover { border-color: var(--rb-ink); }
.rb-lk-sold { font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--rb-wine); border: 1px solid var(--rb-wine); padding: 4px 8px; }
.rb-lk-size {
	height: 40px; min-width: 128px; padding: 0 32px 0 12px; border: 1px solid var(--rb-border); border-radius: 0;
	background: var(--rb-paper) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%23221B16' stroke-width='1.3'%3E%3Cpath d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E") no-repeat right 12px center;
	-webkit-appearance: none; appearance: none; color: var(--rb-ink); font: 14px var(--rb-sans); cursor: pointer;
}
.rb-lk-size:hover { border-color: var(--rb-input); }
.rb-lk-size:focus { border-color: var(--rb-ink); box-shadow: var(--rb-ring); outline: none; }
.rb-lk-size.is-missing { border-color: var(--rb-wine); }

.rb-lk-sum { background: var(--rb-soft); padding: 28px; display: flex; flex-direction: column; gap: 16px; }
.rb-lk-sum__line, .rb-lk-sum__total { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.rb-lk-sum__line { font-size: 15px; color: var(--rb-body); }
.rb-lk-sum__line .is-struck { text-decoration: line-through; color: var(--rb-muted); }
.rb-lk-sum__total { font-size: 15px; }
.rb-lk-sum__total [data-rb-total] { font-family: var(--rb-serif); font-size: 32px; line-height: 1.1; }
.rb-lk-sum.has-discount .rb-lk-sum__total { color: var(--rb-wine); }
.rb-lk-sum__note { margin: 0; font-size: 13px; color: var(--rb-body); }
.rb-lk-sum__note:empty { display: none; }
.rb-lk-sum__note.is-hint { color: var(--rb-wine); }
.rb-lk-sum__live { min-height: 20px; font-size: 14px; }
.rb-lk-sum__live a { border-bottom: 1px solid var(--rb-ink); }
.rb-lk-sum__live .is-error { color: #A1453C; }

.rb-lk-similar { padding: 120px 0 0; }
.rb-lk-similar__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 40px; }
.rb-lk-similar__head h2 { margin: 0; font-size: 40px !important; }
.rb-lk-similar__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 48px 24px; align-items: start; }
.rb-lk-similar__grid .rb-lk-cell { margin: 0; }
.rb-lk-share { display: flex; justify-content: center; padding: 72px 0 120px; }

/* ---------- Collection page + product page looks ---------- */
.rb-season { padding-bottom: 120px; }
.rb-season__block { padding-top: 80px; }
.rb-pd-looks { padding: 120px 0 0 !important; }
.rb-pd-looks__lead { margin: -24px 0 40px; font-size: 15px; color: var(--rb-muted); }
.rb-pd-looks + .rb-pair { padding-top: 96px !important; }
.rb-pd__looks { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 4px; padding: 14px 16px; background: var(--rb-soft); font-size: 14px; color: var(--rb-ink); }
.rb-pd__looks:hover { background: var(--rb-sand); color: var(--rb-ink); }
.rb-pd__looks strong { font-weight: 500; }
.rb-pd__looks span:last-child { white-space: nowrap; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
@media (max-width: 781px) {
	.rb-season { padding-bottom: 64px; }
	.rb-season__block { padding-top: 48px; }
	.rb-pd-looks { padding-top: 64px !important; }
	.rb-pd-looks__lead { margin: -8px 0 20px; font-size: 14px; }
	.rb-pd-looks .rb-lk-similar__grid, .rb-season .rb-lk-similar__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 12px; }
}

/* Mobile-only pieces stay hidden on desktop */
.rb-lk-sheet, .rb-lk-bar, .rb-lk-toast { display: none; }

/* ---------- Tablet & phone ---------- */
@media (max-width: 781px) {
	/* Gallery */
	.rb-lks-head { padding: 36px 0 24px; flex-direction: column; align-items: flex-start; gap: 14px; border-bottom: 0; }
	.rb-lks-head__title { gap: 14px; }
	.rb-lks-title { font-size: 56px !important; }
	.rb-lks-intro { flex: none; gap: 8px; }
	.rb-lks-intro__quote { font-size: 20px; }
	.rb-lks-intro__text { font-size: 14px; }
	.rb-lks-bar { display: block; padding: 0; }
	.rb-lks-filters { margin: 0 calc(-1 * var(--rb-pad)); padding: 0 var(--rb-pad) 4px; }
	.rb-lks-count { padding: 16px 0 20px; font-size: 12px; }
	.rb-lks-grid { columns: 2; column-gap: 12px; }
	.rb-lk-cell { margin-bottom: 28px; }
	.rb-lk-card { gap: 10px; }
	.rb-lk-badge { top: 8px; left: 8px; font-size: 10px; letter-spacing: .08em; padding: 5px 7px; }
	.rb-lk-badge__long { display: none; }
	.rb-lk-badge__short { display: inline; }
	.rb-lk-card__strip, .rb-lk-card__dot { display: none; }
	.rb-lk-card__meta { gap: 4px; }
	.rb-lk-card__occ { font-size: 10px; letter-spacing: .12em; }
	.rb-lk-card__name { font-size: 18px; }
	.rb-lk-card__sum { font-size: 13px; }
	.rb-lks-more { padding: 12px 0 56px; }
	.rb-lks-more .rb-btn { width: 100%; }

	/* Single */
	.rb-look-page { padding-bottom: calc(84px + env(safe-area-inset-bottom)); }
	.rb-lk-main .rb-crumbs { display: none; }
	.rb-lk { gap: 0; }
	.rb-lk__media { flex: 1 1 100%; margin: 0 calc(-1 * var(--rb-pad)); gap: 10px; }
	.rb-lk__hint { padding: 0 var(--rb-pad); font-size: 12px; }
	.rb-lk-pop { display: none !important; }
	.rb-lk__info { flex: 1 1 100%; max-width: none; gap: 24px; padding-top: 24px; }
	.rb-lk__head { gap: 12px; }
	.rb-lk__head .rb-eyebrow { font-size: 11px; letter-spacing: .16em; }
	.rb-lk__title { font-size: 38px !important; line-height: 1.05 !important; }
	.rb-lk__lead { font-size: 15px; line-height: 1.65; }
	.rb-lk-list__head h2 { font-size: 12px !important; }
	.rb-lk-list__head span { font-size: 12px; }
	.rb-lk-row { grid-template-columns: 22px 64px minmax(0, 1fr); gap: 12px; padding: 16px 0; }
	.rb-lk-row__chk { width: 22px; height: 22px; margin-top: 26px; }
	.rb-lk-row__name { font-size: 17px; }
	.rb-lk-row__meta { font-size: 12px; }
	.rb-lk-row__opts { justify-content: space-between; gap: 8px; }
	.rb-lk-row__go { min-height: 44px; display: inline-flex; align-items: center; border: 0; padding: 0; font-size: 11px; }
	.rb-lk-size { height: 44px; min-width: 112px; }
	.rb-lk-sum { padding: 20px; gap: 10px; }
	.rb-lk-sum__line { font-size: 14px; }
	.rb-lk-sum__total { font-size: 14px; }
	.rb-lk-sum__total [data-rb-total] { font-size: 26px; }
	.rb-lk-sum__note { font-size: 12px; }
	.rb-lk-sum > .rb-cta, .rb-lk-sum__live { display: none; }
	.rb-lk-similar { padding-top: 56px; }
	.rb-lk-similar__head { margin-bottom: 20px; }
	.rb-lk-similar__head h2 { font-size: 28px !important; }
	.rb-lk-similar__head .rb-more { display: none; }
	.rb-lk-similar__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 12px; }
	.rb-lk-share { padding: 36px 0 40px; }
	.rb-lk-share .rb-btn { width: 100%; padding: 0 16px; font-size: 12px; }

	.rb-lk-bar {
		display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 70; align-items: center; gap: 14px;
		padding: 14px 16px calc(14px + env(safe-area-inset-bottom)); background: var(--rb-bg); border-top: 1px solid var(--rb-line);
	}
	.rb-lk-bar__sum { flex: 0 0 auto; min-width: 96px; display: flex; flex-direction: column; gap: 2px; }
	.rb-lk-bar__was { font-size: 12px; color: var(--rb-muted); text-decoration: line-through; }
	.rb-lk-bar__was:empty { display: none; }
	.rb-lk-bar__total { font-family: var(--rb-serif); font-size: 22px; line-height: 1.1; }
	.rb-lk-bar.has-discount .rb-lk-bar__total { color: var(--rb-wine); }
	.rb-lk-bar .rb-cta { flex: 1 1 auto; height: 52px; font-size: 12px; letter-spacing: .1em; padding: 0 12px; }

	.rb-lk-sheet:not([hidden]) {
		display: flex; position: fixed; left: 0; right: 0; bottom: calc(80px + env(safe-area-inset-bottom)); z-index: 69;
		gap: 14px; align-items: flex-start; padding: 16px; background: var(--rb-bg);
		border-top: 1px solid var(--rb-line); box-shadow: 0 -14px 36px rgba(34, 27, 22, .18);
		animation: rb-lk-up .25s ease;
	}
	.rb-lk-sheet__body { flex: 1 1 auto; min-width: 0; }
	.rb-lk-sheet__body .rb-lk-pop__card { width: auto; padding: 0; box-shadow: none; background: none; }
	.rb-lk-sheet__body .rb-lk-pop__name { font-size: 18px; }
	.rb-lk-sheet__body .rb-lk-pop__go { min-height: 32px; display: inline-flex; align-items: flex-end; border-bottom-color: var(--rb-ink); }
	.rb-lk-sheet__close { flex: 0 0 auto; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; background: none; border: 0; padding: 0; color: var(--rb-ink); }

	.rb-lk-toast:not([hidden]) {
		display: flex; position: fixed; left: 16px; right: 16px; bottom: calc(96px + env(safe-area-inset-bottom)); z-index: 71;
		justify-content: space-between; align-items: center; gap: 12px; padding: 14px 16px;
		background: var(--rb-ink); color: var(--rb-bg); font-size: 14px; animation: rb-lk-up .25s ease;
	}
	.rb-lk-toast a { color: var(--rb-bg); border-bottom: 1px solid var(--rb-bg); font-size: 13px; }
}
@keyframes rb-lk-up { from { transform: translateY(12px); opacity: 0; } to { transform: none; opacity: 1; } }

@media (prefers-reduced-motion: reduce) {
	.rb-lk-spot__dot::after { animation: none; }
	.rb-lk-card__img, .rb-lk-card__strip, .rb-lk-card__dot { transition: none !important; }
}
