/*
 * Bag page (master plan §11.5, §11.5.1). Tokens only; loaded on the bag page only.
 * Transactional: conventional layout, no decorative motion. Lines and totals come from components.css.
 */

.v-bag-page__head { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--v-space-2) var(--v-space-5); margin-bottom: var(--v-space-7); }
.v-bag-page__title { margin: 0; }
.v-bag-page__count { margin: 0; color: var(--v-text-muted); font-variant-numeric: tabular-nums; }

/* Items 1.618 : summary 1 from 1024px; one column below (§5 golden split). */
.v-bag-page__grid { display: grid; gap: var(--v-space-8); align-items: start; }
@media (min-width: 1024px) {
	.v-bag-page__grid { grid-template-columns: minmax(0, 1.618fr) minmax(0, 1fr); gap: var(--v-space-10); }
	.v-bag-page__summary { position: sticky; top: calc(var(--v-header-h) + var(--v-space-6)); }
}

.v-bag-page__lines { margin: 0; padding: 0; list-style: none; border-top: var(--v-hairline) solid var(--v-border); }
@media (min-width: 768px) {
	.v-bag-line--page { grid-template-columns: var(--v-line-thumb-lg) minmax(0, 1fr); gap: var(--v-space-6); padding-block: var(--v-space-6); }
	.v-bag-line--page .v-bag-line__name { font-size: var(--v-text-h4); }
}
.v-bag-page__actions { display: flex; flex-wrap: wrap; gap: var(--v-space-3); margin-top: var(--v-space-5); }
.v-bag-page__actions:not(:has(> :not([hidden]):not(input))) { display: none; }

/* Summary */
.v-bag-page__summary { display: grid; gap: var(--v-space-5); padding: var(--v-space-6); background: var(--v-surface-alt); }
.v-bag-page__summary-title { margin: 0; font-family: var(--v-font-body); font-size: var(--v-text-h4); font-weight: var(--v-weight-bold); line-height: var(--v-lh-ui); }
.v-bag-page__summary .v-promise { margin: 0; }
.v-bag-page__note { margin: 0; font-size: var(--v-text-small); color: var(--v-text-muted); }
.v-bag-page__returns { display: grid; gap: var(--v-space-1); margin: 0; padding: 0; list-style: none; font-size: var(--v-text-small); color: var(--v-text-muted); }

.v-bag-page__promo { border-top: var(--v-hairline) solid var(--v-border); padding-top: var(--v-space-2); }
.v-bag-page__promo > summary { display: flex; align-items: center; justify-content: space-between; gap: var(--v-space-3); min-height: var(--v-hit-min); font-weight: var(--v-weight-semibold); cursor: pointer; list-style: none; }
.v-bag-page__promo > summary::-webkit-details-marker { display: none; }
.v-bag-page__promo[open] .v-accordion__icon::after { transform: rotate(0deg); }
.v-bag-page__promo-field { margin-top: var(--v-space-3); }
.v-bag-page__promo-row { display: flex; gap: var(--v-space-2); }
.v-bag-page__promo-row .v-input { flex: 1; min-width: 0; text-transform: uppercase; }

/* Empty bag */
.v-bag-page--empty { display: grid; gap: var(--v-space-7); }
.v-bag-page__empty { padding-block: var(--v-space-9); }
.v-bag-page__empty-title { margin: 0; font-family: var(--v-font-body); font-size: var(--v-text-h4); font-weight: var(--v-weight-bold); color: var(--v-text); }
.v-bag-page__styles { display: flex; flex-wrap: wrap; justify-content: center; gap: var(--v-space-2); margin: 0; padding: 0; list-style: none; }

/* Phones: sticky Checkout bar while the summary button is off screen; never hides focus (2.4.11). */
.v-bag-bar {
	position: fixed;
	inset: auto 0 0 0;
	z-index: var(--v-z-header);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--v-space-4);
	padding: var(--v-space-3) var(--v-gutter) calc(var(--v-space-3) + env(safe-area-inset-bottom, 0px));
	background: var(--v-surface);
	border-top: var(--v-hairline) solid var(--v-border);
}
.v-bag-bar[hidden] { display: none; }
.v-bag-bar__total { display: grid; margin: 0; font-weight: var(--v-weight-bold); font-variant-numeric: tabular-nums; }
.v-bag-bar__total > span:first-child { font-size: var(--v-text-small); font-weight: var(--v-weight-regular); color: var(--v-text-muted); }
html.v-has-bag-bar { scroll-padding-bottom: calc(var(--v-hit-min) + var(--v-space-8)); }
html.v-has-bag-bar body { padding-bottom: calc(var(--v-hit-min) + var(--v-space-8)); }
@media (min-width: 1024px) { .v-bag-bar { display: none; } }