/*
 * My account, log-in, registration and passwords of the redesign (P09i, design/ucet/README.md §1 – §10) – instead of
 * login.css / account.css (includes/page-styles.php) while hst_reskin_account = 1. The frame of the page, the card with
 * the stitch, the fields, the notices, the buttons, the pieces and the card "Zaplať prevodom" come from reskin-cart.css
 * and reskin.css (P09h) – here only what the account adds.
 * Namespace hst-my (hst-acc is the accordion of the phone menu, P09g).
 */

/* ---- Head: breadcrumbs on the light background, H1, lead ------------------------------------------------------- */
.hst-reskin .hst-my .hst-crumbs ol {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 2px 8px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 14px;
	line-height: 1.4;
	color: var(--hst-on-light);
}

.hst-reskin .hst-my .hst-crumbs li {
	display: inline-flex;
	align-items: center;
	margin: 0;
}

.hst-reskin .hst-my .hst-crumbs a {
	display: inline-flex;
	align-items: center;
	min-height: 24px;
	color: var(--hst-on-light);
	text-decoration: none;
}

.hst-reskin .hst-my .hst-crumbs a:hover {
	color: var(--hst-ink);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.hst-reskin .hst-my .hst-crumbs [aria-current] {
	color: var(--hst-ink);
}

.hst-reskin .hst-my .hst-crumbs__sep {
	color: var(--hst-on-light);
}

.hst-reskin .hst-my .hst-my__title {
	margin: 22px 0 0;
}

.hst-reskin .hst-my .hst-my__lead {
	max-width: 34em;
	line-height: 1.6;
}

.hst-reskin .hst-my .hst-flow__notices:not(:has(li, .woocommerce-message, .woocommerce-info, .woocommerce-error, .hst-notice, p)) {
	display: none;
}

.hst-reskin .hst-my .hst-flow__notices .woocommerce-notices-wrapper:empty {
	display: none;
}

/* Text links (back, edit, track the parcel …). */
.hst-reskin .hst-my .hst-textlink {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--hst-ink);
	font-family: var(--hst-sans);
	font-size: 15px;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
}

.hst-reskin .hst-my .hst-textlink > span:not(.screen-reader-text) {
	text-decoration: underline;
	text-underline-offset: 4px;
}

.hst-reskin .hst-my .hst-textlink--muted {
	color: var(--hst-on-light);
	font-size: 14px;
	font-weight: 400;
}

.hst-reskin .hst-my .hst-textlink--muted > span:not(.screen-reader-text) {
	text-underline-offset: 3px;
}

.hst-reskin .hst-my :is(a, button):focus-visible {
	outline: 2px solid var(--hst-ink);
	outline-offset: 3px;
}

/* Smaller buttons of the rows and the overview (48 / 44 px). */
body.hst-reskin .hst-my :is(a, button).hst-cbtn {
	min-height: 48px;
	padding: 0 20px;
	font-size: 16px;
}

body.hst-reskin .hst-my :is(a, button).hst-cbtn.hst-cbtn--s {
	min-height: 44px;
}

body.hst-reskin .hst-my :is(a, button).hst-cbtn.hst-cbtn--tall {
	min-height: 56px;
	font-size: 17px;
}

body.hst-reskin .hst-my :is(a, button).hst-cbtn.hst-cbtn--wide {
	width: 100%;
}

body.hst-reskin .hst-my :is(a, button).hst-cbtn[disabled],
body.hst-reskin .hst-my :is(a, button).hst-cbtn.disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

/* Headings of the sections. */
.hst-reskin .hst-my .hst-my-h2 {
	margin: 0;
	font-family: var(--hst-serif);
	font-size: 40px;
	font-weight: 600;
	line-height: 1;
	letter-spacing: 0;
	color: var(--hst-ink);
	text-transform: none;
}

.hst-reskin .hst-my .hst-my-h3 {
	margin: 0;
	font-family: var(--hst-serif);
	font-size: 26px;
	font-weight: 600;
	line-height: 1.1;
	letter-spacing: 0;
	color: var(--hst-ink);
	text-transform: none;
}

.hst-reskin .hst-my .hst-my-section__head {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 4px 16px;
}

.hst-reskin .hst-my .hst-my-section__meta {
	margin: 0;
	font-size: 16px;
	color: var(--hst-on-light);
}

.hst-reskin .hst-my .hst-my-section__lead {
	max-width: 36em;
	margin: 8px 0 0;
	font-size: 16px;
	line-height: 1.6;
	color: var(--hst-on-light);
}

/* Simple panel (README §1: rows, tiles, addresses, the state, cards). */
.hst-reskin .hst-my .hst-panel {
	border: 1px solid rgba(22, 17, 15, 0.14);
	border-radius: 4px;
	background: #f8f3eb;
	color: var(--hst-ink);
}

/* ---- Layout: menu | content ---------------------------------------------------------------------------------- */
.hst-reskin .hst-my__grid {
	display: grid;
	grid-template-columns: 280px minmax(0, 1fr);
	gap: clamp(40px, 5vw, 80px);
	align-items: start;
	margin-top: 40px;
}

.hst-reskin .hst-my .woocommerce-MyAccount-content,
.hst-reskin .hst-my .woocommerce-MyAccount-navigation {
	float: none;
	width: auto;
	margin: 0;
	padding: 0;
}

.hst-reskin .hst-my__content {
	min-width: 0;
}

/* ---- Menu (README §4) ------------------------------------------------------------------------------------------- */
.hst-reskin .hst-my-nav {
	position: sticky;
	top: calc(var(--hst-header-h, 76px) + 24px);
	font-family: var(--hst-sans);
}

.hst-reskin .hst-my-nav__who {
	display: flex;
	align-items: center;
	gap: 14px;
}

.hst-reskin .hst-my-nav__avatar {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: var(--hst-oxblood);
	color: var(--hst-bone);
	font-family: var(--hst-serif);
	font-size: 20px;
	font-weight: 600;
	line-height: 1;
}

.hst-reskin .hst-my-nav__id {
	min-width: 0;
}

.hst-reskin .hst-my .hst-my-nav__name {
	margin: 0;
	font-size: 17px;
	font-weight: 700;
	line-height: 1.3;
}

.hst-reskin .hst-my .hst-my-nav__mail {
	margin: 2px 0 0;
	font-size: 14px;
	line-height: 1.4;
	color: var(--hst-on-light);
	overflow-wrap: anywhere;
}

.hst-reskin .hst-my .hst-my-nav__list {
	position: relative;
	margin: 22px 0 0;
	padding: 0;
	list-style: none;
}

.hst-reskin .hst-my .hst-my-nav__item {
	position: relative;
	margin: 0;
	padding: 0;
	border: 0;
}

/* The golden thread: one segment per item (the first starts and the last before "Odhlásiť sa" ends at the knot). */
.hst-reskin .hst-my-nav__item:not(.hst-my-nav__item--out)::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 10px;
	border-left: 1.5px dashed rgba(184, 149, 79, 0.9);
	pointer-events: none;
}

.hst-reskin .hst-my-nav__item:first-child::before {
	top: 10px;
}

.hst-reskin .hst-my-nav__item:nth-last-child(2):not(.hst-my-nav__item--out)::before,
.hst-reskin .hst-my-nav__item:last-child:not(.hst-my-nav__item--out)::before {
	bottom: 10px;
}

.hst-reskin .hst-my-nav__knot {
	position: absolute;
	top: 50%;
	left: 6px;
	width: 10px;
	height: 10px;
	margin-top: -5px;
	border-radius: 50%;
	background: var(--hst-thread);
	opacity: 0;
	pointer-events: none;
}

.hst-reskin .hst-my-nav__item.is-current .hst-my-nav__knot {
	opacity: 1;
}

.hst-thread-off .hst-my-nav__item::before,
.hst-thread-off .hst-my-nav__knot {
	display: none;
}

.hst-reskin .hst-my .hst-my-nav__link {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 50px;
	padding: 0 0 0 30px;
	color: #4d423b;
	font-size: 16px;
	font-weight: 500;
	line-height: 1.3;
	text-decoration: none;
}

.hst-reskin .hst-my .hst-my-nav__link .hst-ico {
	flex: none;
}

.hst-reskin .hst-my .hst-my-nav__link:hover {
	color: var(--hst-ink);
}

.hst-reskin .hst-my .hst-my-nav__link[aria-current] {
	color: var(--hst-ink);
	font-weight: 700;
}

.hst-reskin .hst-my .hst-my-nav__count {
	margin-left: auto;
	font-size: 14px;
	font-weight: 600;
	color: var(--hst-on-light);
}

.hst-reskin .hst-my .hst-my-nav__item--out {
	margin-top: 12px;
	padding-top: 10px;
	border-top: 1px dashed rgba(22, 17, 15, 0.3);
}

.hst-reskin .hst-my .hst-my-nav__item--out .hst-my-nav__link {
	min-height: 48px;
}

/* ---- State of an order: pill, thread, sentence (README §5) ------------------------------------------------------- */
.hst-reskin .hst-opill {
	display: inline-flex;
	flex: none;
	align-items: center;
	gap: 6px;
	min-height: 30px;
	padding: 0 12px;
	border: 1.5px solid currentColor;
	border-radius: 999px;
	font-family: var(--hst-sans);
	font-size: 14px;
	font-weight: 700;
	font-stretch: var(--hst-narrow);
	line-height: 1;
	white-space: nowrap;
}

.hst-reskin .hst-opill--line {
	border-color: var(--hst-oxblood);
	background: transparent;
	color: var(--hst-oxblood);
}

.hst-reskin .hst-opill--dark {
	border-color: var(--hst-ink);
	background: var(--hst-ink);
	color: var(--hst-bone);
}

.hst-reskin .hst-opill--gold {
	border-color: var(--hst-thread);
	background: var(--hst-thread);
	color: var(--hst-ink);
}

.hst-reskin .hst-opill--muted {
	border-color: rgba(22, 17, 15, 0.45);
	background: transparent;
	color: var(--hst-on-light);
}

.hst-reskin .hst-opill--s {
	min-height: 28px;
	font-size: 13px;
}

.hst-reskin .hst-othread {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin: 22px 0 0;
	padding: 0;
	list-style: none;
	font-family: var(--hst-sans);
}

.hst-reskin .hst-othread__step {
	position: relative;
	margin: 0;
	padding-right: 14px;
}

.hst-reskin .hst-othread__line {
	position: absolute;
	top: 16px;
	right: 6px;
	left: 40px;
	border-top: 2px dashed rgba(22, 17, 15, 0.28);
}

.hst-reskin .hst-othread__step.is-done .hst-othread__line {
	border-top-color: var(--hst-thread);
}

.hst-reskin .hst-othread__dot {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border: 1.5px solid rgba(22, 17, 15, 0.55);
	border-radius: 50%;
	background: var(--hst-bone);
	color: var(--hst-on-light);
	font-family: var(--hst-serif);
	font-size: 15px;
	font-weight: 600;
	line-height: 1;
}

.hst-reskin .hst-othread__step.is-done .hst-othread__dot {
	border-color: var(--hst-thread);
	background: var(--hst-thread);
	color: var(--hst-ink);
}

.hst-reskin .hst-othread__step.is-now .hst-othread__dot {
	border-color: var(--hst-ink);
	background: var(--hst-ink);
	color: #f8f3eb;
}

.hst-reskin .hst-my .hst-othread__title {
	margin: 10px 0 0;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.3;
	color: var(--hst-on-light);
}

.hst-reskin .hst-my :is(.is-done, .is-now) > .hst-othread__title {
	color: var(--hst-ink);
}

.hst-reskin .hst-my .is-now > .hst-othread__title {
	font-weight: 700;
}

.hst-reskin .hst-my .hst-othread__text {
	margin: 2px 0 0;
	font-size: 13px;
	line-height: 1.4;
	color: var(--hst-on-light);
}

.hst-reskin .hst-my .hst-state__now {
	position: relative;
	margin-top: 16px;
	padding-top: 14px;
	border-top: 1px dashed rgba(22, 17, 15, 0.3);
}

.hst-reskin .hst-my .hst-state__now > p:first-child {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0;
	font-size: 15px;
	line-height: 1.5;
	color: var(--hst-ink);
}

.hst-reskin .hst-my .hst-state__now > p:first-child .hst-ico {
	flex: none;
	margin-top: 2px;
	color: var(--hst-oxblood);
}

.hst-reskin .hst-my .hst-state__track {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 2px 16px;
	margin: 8px 0 0 28px;
}

.hst-reskin .hst-my .hst-state__parcel {
	font-size: 13px;
	color: var(--hst-on-light);
}

/* Photos of the pieces of an order (overlapping). */
.hst-reskin .hst-thumbs {
	display: flex;
	margin: 0;
	padding: 0 0 0 10px;
	list-style: none;
}

.hst-reskin .hst-thumbs li {
	overflow: hidden;
	flex: none;
	width: 44px;
	height: 55px;
	margin: 0 0 0 -10px;
	border-radius: 3px;
	background: #ddd2c4;
	box-shadow: 0 0 0 2px #f8f3eb;
}

.hst-reskin .hst-thumbs__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ---- Overview (README §5) ------------------------------------------------------------------------------------------ */
.hst-reskin .hst-my .hst-my-latest {
	padding: 28px 30px 26px;
}

.hst-reskin .hst-my-latest__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px 20px;
	padding-right: 34px;
}

.hst-reskin .hst-my .hst-my-latest__title {
	margin: 0;
	padding-right: 34px;
	font-family: var(--hst-serif);
	font-size: 27px;
	font-weight: 600;
	line-height: 1.1;
	color: var(--hst-ink);
	text-transform: none;
}

.hst-reskin .hst-my .hst-my-latest__head .hst-my-latest__title {
	padding-right: 0;
}

.hst-reskin .hst-my .hst-my-latest__meta {
	margin: 6px 0 0;
	font-size: 15px;
	line-height: 1.5;
	color: var(--hst-on-light);
}

.hst-reskin .hst-my .hst-my-latest__text {
	margin: 8px 0 0;
	font-size: 15px;
	line-height: 1.6;
	color: #4d423b;
}

.hst-reskin .hst-my-latest--none .hst-cbtn {
	margin-top: 18px;
}

.hst-reskin .hst-my-latest__foot {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 14px 20px;
	margin-top: 18px;
}

.hst-reskin .hst-my-latest__buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-left: auto;
}

.hst-reskin .hst-my-tiles {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	margin: 24px 0 0;
	padding: 0;
	list-style: none;
}

.hst-reskin .hst-my-tiles li {
	margin: 0;
}

.hst-reskin .hst-my .hst-my-tile {
	display: block;
	height: 100%;
	padding: 20px 22px;
	border: 1px solid rgba(22, 17, 15, 0.14);
	border-radius: 4px;
	background: #f8f3eb;
	color: var(--hst-ink);
	text-decoration: none;
}

.hst-reskin .hst-my .hst-my-tile:hover {
	border-color: rgba(22, 17, 15, 0.45);
	color: var(--hst-ink);
}

.hst-reskin .hst-my-tile__ico {
	display: block;
	color: var(--hst-oxblood);
}

.hst-reskin .hst-my-tile__title {
	display: block;
	margin-top: 12px;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.3;
}

.hst-reskin .hst-my-tile__text {
	display: block;
	margin-top: 4px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--hst-on-light);
	overflow-wrap: anywhere;
}

.hst-reskin .hst-my-tile__more {
	display: inline-block;
	margin-top: 12px;
	font-size: 15px;
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 4px;
}

.hst-reskin .hst-my-care {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 0.85fr);
	overflow: hidden;
	margin-top: 24px;
	border-radius: 4px;
	background: var(--hst-ink);
	color: var(--hst-bone);
}

.hst-reskin .hst-my-care__stitch,
.hst-reskin .hst-my-dark__stitch {
	position: absolute;
	z-index: 1;
	inset: 7px;
	border: 1.5px dashed rgba(184, 149, 79, 0.7);
	border-radius: 2px;
	pointer-events: none;
}

.hst-reskin .hst-my-care__body {
	position: relative;
	padding: 28px 30px 30px;
}

.hst-reskin .hst-my .hst-my-care__title {
	margin: 0;
	font-family: var(--hst-serif);
	font-size: 28px;
	font-weight: 600;
	line-height: 1.1;
	color: var(--hst-bone);
	text-transform: none;
}

.hst-reskin .hst-my .hst-my-care__text {
	margin: 8px 0 18px;
	font-size: 15px;
	line-height: 1.6;
	color: #d8cdc2;
}

.hst-reskin .hst-my-care__photo {
	min-height: 210px;
	background: #2a201d;
}

.hst-reskin .hst-my-care__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ---- Orders (README §6) ------------------------------------------------------------------------------------------- */
.hst-reskin .hst-my-rows {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin: 22px 0 0;
	padding: 0;
	list-style: none;
}

.hst-reskin .hst-my .hst-my-row {
	display: grid;
	grid-template-columns: 112px minmax(0, 1fr) 110px 150px auto;
	grid-template-areas: "thumbs id sum pill buttons";
	gap: 0 18px;
	align-items: center;
	margin: 0;
	padding: 16px 20px;
	border: 1px solid rgba(22, 17, 15, 0.14);
	border-radius: 4px;
	background: #f8f3eb;
}

.hst-reskin .hst-my-row .hst-thumbs {
	grid-area: thumbs;
}

.hst-reskin .hst-my-row__id {
	grid-area: id;
	min-width: 0;
}

.hst-reskin .hst-my .hst-my-row__no {
	margin: 0;
}

.hst-reskin .hst-my .hst-my-row__no a {
	color: var(--hst-ink);
	font-size: 17px;
	font-weight: 700;
	text-decoration: none;
}

.hst-reskin .hst-my .hst-my-row__no a:hover {
	text-decoration: underline;
	text-underline-offset: 3px;
}

.hst-reskin .hst-my .hst-my-row__meta {
	margin: 2px 0 0;
	font-size: 14px;
	color: var(--hst-on-light);
}

.hst-reskin .hst-my .hst-my-row__sum {
	grid-area: sum;
	margin: 0;
	font-family: var(--hst-serif);
	font-size: 22px;
	font-weight: 600;
	line-height: 1;
	text-align: right;
	white-space: nowrap;
}

.hst-reskin .hst-my-row__pill {
	grid-area: pill;
}

.hst-reskin .hst-my-row__buttons {
	grid-area: buttons;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 8px;
}

.hst-reskin .hst-my .hst-my-row__actions {
	display: flex;
	flex-basis: 100%;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 0 14px;
	margin: 0;
}

.hst-reskin .hst-my .hst-my-row__action {
	display: inline-flex;
	align-items: center;
	min-height: 32px;
	color: var(--hst-ink);
	font-size: 14px;
	font-weight: 600;
	text-underline-offset: 3px;
}

.hst-reskin .hst-my-pages {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 8px 24px;
	margin: 18px 0 0;
}

.hst-reskin .hst-my .hst-my-empty {
	margin-top: 22px;
	padding: 22px 24px;
}

.hst-reskin .hst-my .hst-my-empty p {
	margin: 0 0 14px;
	font-size: 15px;
	line-height: 1.6;
	color: #4d423b;
}

.hst-reskin .hst-my .hst-my-empty p:last-child {
	margin-bottom: 0;
}

/* ---- Detail (README §7) ------------------------------------------------------------------------------------------ */
.hst-reskin .hst-my-detail__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 18px;
	margin-top: 8px;
}

.hst-reskin .hst-my .hst-my-detail__meta {
	margin: 8px 0 0;
	font-size: 15px;
	line-height: 1.5;
	color: var(--hst-on-light);
}

.hst-reskin .hst-my-detail > .hst-pay-card {
	margin-top: 22px;
	padding: 26px 28px;
}

.hst-reskin .hst-my .hst-pay-card .hst-pay-card__title {
	font-size: 26px;
}

.hst-reskin .hst-my .hst-state {
	margin-top: 22px;
	padding: 24px 26px;
}

.hst-reskin .hst-my .hst-state__title {
	margin: 0;
	font-family: var(--hst-serif);
	font-size: 24px;
	font-weight: 600;
	line-height: 1.1;
	color: var(--hst-ink);
	text-transform: none;
}

.hst-reskin .hst-my .hst-state .hst-othread {
	margin-top: 18px;
}

.hst-reskin .hst-my .hst-state .hst-state__now {
	margin-top: 14px;
}

.hst-reskin .hst-my .hst-my-detail__pay {
	margin: 16px 0 0;
}

.hst-reskin .hst-my-order {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 340px;
	gap: 32px;
	align-items: start;
	margin-top: 28px;
}

.hst-reskin .hst-my-order__main {
	min-width: 0;
}

.hst-reskin .hst-my .hst-my-hooks {
	margin: 18px 0 0;
	font-size: 15px;
	line-height: 1.55;
}

/* Pieces in the size "account": photo 80 × 100, the add-on 60 × 60 on the thread, the options as a list. */
.hst-reskin .hst-cart-list--account {
	margin: 8px 0 0;
	border-top: 1px dashed rgba(22, 17, 15, 0.3);
}

.hst-reskin .hst-ci.hst-ci--account {
	grid-template-columns: 80px minmax(0, 1fr) auto;
	grid-template-areas: "photo main sum";
	gap: 0 18px;
	padding: 20px 0;
}

.hst-reskin .hst-ci--account.hst-ci--parent {
	padding-bottom: 14px;
}

.hst-reskin .hst-ci--account .hst-ci__photo {
	width: 80px;
	height: 100px;
}

.hst-reskin .hst-ci.hst-ci--account.hst-ci--hangs {
	grid-template-columns: 60px minmax(0, 1fr) auto;
	padding: 0 0 20px 64px;
}

.hst-reskin .hst-ci--account.hst-ci--hangs .hst-ci__photo,
.hst-reskin .hst-ci--account .hst-ci__photo--square {
	width: 60px;
	height: 60px;
}

.hst-reskin .hst-ci--account.hst-ci--hangs .hst-ci__thread {
	top: -12px;
	left: 39px;
	width: 22px;
	height: 42px;
}

.hst-reskin .hst-ci--account .hst-ci__name {
	font-size: 16px;
	font-weight: 600;
}

.hst-reskin .hst-ci--account .hst-ci__opts {
	font-size: 14px;
}

.hst-reskin .hst-ci--account .hst-ci__swatch,
.hst-reskin .hst-ci--account .hst-ci__metal {
	width: 15px;
	height: 15px;
}

.hst-reskin .hst-ci--account .hst-ci__price {
	display: block;
	font-size: 16px;
}

.hst-reskin .hst-ci--account .hst-ci__each {
	margin-top: 2px;
	font-size: 13px;
}

.hst-reskin .hst-my-notes {
	margin-top: 30px;
}

.hst-reskin .hst-my .hst-my-notes__list {
	position: relative;
	margin: 14px 0 0;
	padding: 0 0 0 28px;
	list-style: none;
}

.hst-reskin .hst-my .hst-my-notes__list::before {
	content: "";
	position: absolute;
	top: 10px;
	bottom: 14px;
	left: 4px;
	border-left: 1.5px dashed rgba(184, 149, 79, 0.9);
}

.hst-reskin .hst-my .hst-my-notes__item {
	position: relative;
	margin: 0;
	padding: 0 0 14px;
}

.hst-reskin .hst-my-notes__knot {
	position: absolute;
	top: 6px;
	left: -28px;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: var(--hst-thread);
}

.hst-reskin .hst-my .hst-my-notes__date {
	margin: 0;
	font-size: 13px;
	line-height: 1.4;
	color: var(--hst-on-light);
}

.hst-reskin .hst-my .hst-my-notes__text {
	max-width: 36em;
	margin: 2px 0 0;
	font-size: 15px;
	line-height: 1.55;
}

.hst-reskin .hst-my .hst-my-notes__text p {
	margin: 0 0 6px;
}

.hst-reskin .hst-my .hst-my-notes__text p:last-child {
	margin-bottom: 0;
}

/* Summary – the card with the stitch, sticky on the computer. */
.hst-reskin .hst-my .hst-my-sum {
	position: sticky;
	top: calc(var(--hst-header-h, 76px) + 24px);
	padding: 24px 26px 26px;
}

.hst-reskin .hst-my .hst-my-sum__title {
	margin: 0;
	font-family: var(--hst-serif);
	font-size: 24px;
	font-weight: 600;
	line-height: 1.1;
	color: var(--hst-ink);
	text-transform: none;
}

.hst-reskin .hst-my .hst-my-sum__rows {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 8px 16px;
	margin: 16px 0 0;
	font-size: 15px;
	line-height: 1.4;
}

.hst-reskin .hst-my .hst-my-sum__rows :is(dt, dd) {
	margin: 0;
	font-weight: 400;
}

.hst-reskin .hst-my .hst-my-sum__rows dd {
	font-weight: 700;
	text-align: right;
	white-space: nowrap;
}

.hst-reskin .hst-my .hst-my-sum__total {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 16px;
	margin: 12px 0 0;
	padding-top: 12px;
	border-top: 1px dashed rgba(22, 17, 15, 0.3);
	font-size: 16px;
	font-weight: 700;
}

.hst-reskin .hst-my-sum__amount {
	font-family: var(--hst-serif);
	font-size: 32px;
	font-weight: 600;
	line-height: 1;
	white-space: nowrap;
}

.hst-reskin .hst-my .hst-my-sum__info {
	display: grid;
	gap: 12px;
	margin: 16px 0 0;
	padding-top: 14px;
	border-top: 1px dashed rgba(22, 17, 15, 0.3);
	font-size: 14px;
	line-height: 1.5;
}

.hst-reskin .hst-my .hst-my-sum__info dt {
	font-weight: 700;
}

.hst-reskin .hst-my .hst-my-sum__info dd {
	margin: 2px 0 0;
	color: #4d423b;
	overflow-wrap: anywhere;
}

.hst-reskin .hst-my-sum__buttons {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-top: 18px;
}

body.hst-reskin .hst-my .hst-my-sum__buttons .hst-cbtn--primary {
	min-height: 50px;
}

/* ---- Addresses (README §8) -------------------------------------------------------------------------------------- */
.hst-reskin .hst-my-addresses {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 16px;
	margin-top: 22px;
}

.hst-reskin .hst-my .hst-my-address {
	padding: 22px 24px;
}

.hst-reskin .hst-my .hst-my-address__title {
	margin: 0;
	font-family: var(--hst-sans);
	font-size: 18px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 0;
	color: var(--hst-ink);
	text-transform: none;
}

.hst-reskin .hst-my .hst-my-address__lines {
	margin: 10px 0 0;
	font-size: 15px;
	line-height: 1.65;
	overflow-wrap: anywhere;
}

.hst-reskin .hst-my .hst-my-address__empty {
	margin: 10px 0 0;
	font-size: 15px;
	line-height: 1.6;
	color: #4d423b;
}

.hst-reskin .hst-my .hst-my-address .hst-textlink {
	margin-top: 12px;
}

.hst-reskin .hst-my .hst-my-address .hst-cbtn {
	margin-top: 14px;
}

/* Forms of the account (address, details): the fields of the checkout (reskin-cart.css .hst-fields). */
.hst-reskin .hst-my-form--address,
.hst-reskin .hst-my-form--details {
	max-width: 760px;
	margin-top: 22px;
}

.hst-reskin .hst-my-form--address .hst-my-h3 {
	margin-bottom: 16px;
}

.hst-reskin .hst-my .woocommerce-address-fields:not(:has(#billing_iscomp:checked)) .hst-co-company {
	display: none;
}

.hst-reskin .hst-my .hst-my-form__buttons {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 24px;
	margin: 26px 0 0;
}

body.hst-reskin .hst-my .hst-my-form__buttons .hst-cbtn--tall {
	width: auto;
	min-height: 54px;
	padding: 0 28px;
}

.hst-reskin .hst-my .hst-my-pw {
	min-width: 0;
	margin: 30px 0 0;
	padding: 26px 0 0;
	border: 0;
	border-top: 1px dashed rgba(22, 17, 15, 0.3);
}

.hst-reskin .hst-my .hst-my-pw__legend {
	float: left;
	width: 100%;
	margin: 0;
	padding: 0;
	font-family: var(--hst-serif);
	font-size: 26px;
	font-weight: 600;
	line-height: 1.1;
	color: var(--hst-ink);
}

.hst-reskin .hst-my .hst-my-pw__hint {
	clear: both;
	margin: 0;
	padding-top: 6px;
	font-size: 14px;
	line-height: 1.5;
	color: var(--hst-on-light);
}

.hst-reskin .hst-my .hst-my-pw .hst-fields {
	margin-top: 16px;
}

/* ---- Payment cards (README §10) --------------------------------------------------------------------------------- */
.hst-reskin .hst-my-cards {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin: 20px 0 0;
	padding: 0;
	list-style: none;
}

.hst-reskin .hst-my .hst-my-card {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px 18px;
	margin: 0;
	padding: 16px 20px;
}

.hst-reskin .hst-my-card__ico {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 32px;
	border-radius: 4px;
	background: var(--hst-ink);
	color: var(--hst-bone);
}

.hst-reskin .hst-my-card__id {
	flex: 1;
	min-width: 0;
}

.hst-reskin .hst-my .hst-my-card__name {
	margin: 0;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.3;
}

.hst-reskin .hst-my .hst-my-card__exp {
	margin: 2px 0 0;
	font-size: 14px;
	color: var(--hst-on-light);
}

.hst-reskin .hst-my-card__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 18px;
}

/* ---- Log-in, registration, lost and new password (README §2, §3) -------------------------------------------------- */
/* The forms of WooCommerce without the frame of Kadence (.woocommerce form.login / .register). */
.hst-reskin .hst-my form:is(.login, .register, .lost_reset_password, .edit-account),
.hst-reskin .hst-my .woocommerce form:is(.login, .register) {
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	text-align: left;
}

.hst-reskin .hst-my-login {
	display: grid;
	grid-template-columns: minmax(0, 560px) minmax(0, 1fr);
	gap: clamp(40px, 5vw, 80px);
	align-items: start;
	margin-top: 36px;
}

.hst-reskin .hst-my .hst-my-login__card {
	padding: 32px 34px 30px;
}

.hst-reskin .hst-my .hst-my-login__card--alone {
	max-width: 560px;
	margin-top: 36px;
	padding: 30px 34px;
}

.hst-reskin .hst-my .hst-my-form .form-row {
	float: none;
	width: auto;
	margin: 0 0 18px;
	padding: 0;
}

.hst-reskin .hst-my .hst-my-login__row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 4px 16px;
	margin: -4px 0 18px;
}

.hst-reskin .hst-my .hst-my-login__row .woocommerce-form__label-for-checkbox {
	display: inline-flex !important;
	align-items: center;
	gap: 12px;
	min-height: 44px;
	margin: 0;
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
}

.hst-reskin .hst-my .hst-my-login__row input[type="checkbox"] {
	flex: none;
	width: 22px;
	height: 22px;
	margin: 0;
	accent-color: var(--hst-ink);
}

.hst-reskin .hst-my .hst-my-login__back {
	position: relative;
	margin: 18px 0 0;
}

.hst-reskin .hst-my .hst-my-form .woocommerce-privacy-policy-text p {
	margin: 0 0 16px;
	font-size: 13px;
	line-height: 1.55;
}

/* Dark panel (registration, "Nemáš ešte účet?"). */
.hst-reskin .hst-my-dark {
	position: relative;
	overflow: hidden;
	border-radius: 4px;
	background: var(--hst-ink);
	color: var(--hst-bone);
	--hst-focus: var(--hst-bone);
}

.hst-reskin .hst-my-dark__photo {
	height: 220px;
	background: #2a201d;
}

.hst-reskin .hst-my-dark__photo--tall {
	height: 300px;
}

.hst-reskin .hst-my-dark__img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: 50% 38%;
}

.hst-reskin .hst-my-dark__body {
	position: relative;
	padding: 26px 30px 30px;
}

.hst-reskin .hst-my .hst-my-dark__title {
	margin: 0;
	font-family: var(--hst-serif);
	font-size: 30px;
	font-weight: 600;
	line-height: 1.1;
	color: var(--hst-bone);
	text-transform: none;
}

.hst-reskin .hst-my .hst-my-dark__text {
	margin: 8px 0 0;
	font-size: 15px;
	line-height: 1.6;
	color: #d8cdc2;
}

.hst-reskin .hst-my .hst-my-dark form.hst-my-form {
	margin-top: 18px;
}

.hst-reskin .hst-my .hst-my-dark .form-row label:not(.checkbox) {
	color: var(--hst-bone);
}

.hst-reskin .hst-my .hst-my-dark .form-row .required {
	color: var(--hst-thread);
}

.hst-reskin .hst-my .hst-my-dark .form-row input.input-text {
	border-color: rgba(239, 230, 218, 0.5);
	background: #f8f3eb;
}

.hst-reskin .hst-my .hst-my-dark .form-row .description,
.hst-reskin .hst-my .hst-my-dark .woocommerce-privacy-policy-text p {
	color: #c4b7a9;
}

.hst-reskin .hst-my .hst-my-dark .woocommerce-privacy-policy-text a {
	color: var(--hst-bone);
	text-underline-offset: 3px;
}

.hst-reskin .hst-my .hst-my-dark :is(a, button, input):focus-visible {
	outline: 2px solid var(--hst-bone);
	outline-offset: 3px;
}

.hst-reskin .hst-my .hst-my-dark__list {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin: 18px 0 22px;
	padding: 0;
	list-style: none;
	font-size: 15px;
	line-height: 1.5;
}

.hst-reskin .hst-my .hst-my-dark__list li {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0;
}

.hst-reskin .hst-my .hst-my-dark__list .hst-ico {
	flex: none;
	margin-top: 1px;
	color: var(--hst-thread);
}

/* Link sent. */
.hst-reskin .hst-my-sent {
	position: relative;
}

.hst-reskin .hst-my-sent__ico {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--hst-thread);
	color: var(--hst-ink);
}

.hst-reskin .hst-my .hst-my-sent__title {
	margin: 14px 0 0;
	font-family: var(--hst-serif);
	font-size: 28px;
	font-weight: 600;
	line-height: 1.1;
	color: var(--hst-ink);
	text-transform: none;
}

.hst-reskin .hst-my .hst-my-sent__text {
	margin: 8px 0 0;
	font-size: 15px;
	line-height: 1.6;
	color: #4d423b;
}

/* ---- The eye of the password (woocommerce.js .show-password-input) and the strength meter -------------------------- */
.hst-reskin .hst-my .password-input {
	position: relative;
	display: block;
	width: 100%;
}

.hst-reskin .hst-my .password-input input.input-text {
	padding-right: 52px;
}

.hst-reskin .hst-my .show-password-input {
	position: absolute;
	top: 3px;
	right: 3px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 3px;
	background: none;
	color: var(--hst-on-light);
	box-shadow: none;
	cursor: pointer;
	transform: none;
	translate: none;
}

.hst-reskin .hst-my .show-password-input::before {
	content: none;
}

.hst-reskin .hst-my .show-password-input::after {
	content: "";
	position: static;
	display: block;
	width: 20px;
	height: 20px;
	margin: 0;
	background: currentColor;
	font-size: 0;
	transform: none;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 12S6 5.5 12 5.5 21.5 12 21.5 12 18 18.5 12 18.5 2.5 12 2.5 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 12S6 5.5 12 5.5 21.5 12 21.5 12 18 18.5 12 18.5 2.5 12 2.5 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E") center / contain no-repeat;
}

.hst-reskin .hst-my .show-password-input.display-password::after {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 12S6 5.5 12 5.5 21.5 12 21.5 12 18 18.5 12 18.5 2.5 12 2.5 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M4 4l16 16'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 12S6 5.5 12 5.5 21.5 12 21.5 12 18 18.5 12 18.5 2.5 12 2.5 12z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M4 4l16 16'/%3E%3C/svg%3E");
}

.hst-reskin .hst-my .show-password-input:hover {
	color: var(--hst-ink);
}

.hst-reskin .hst-my .show-password-input:focus-visible {
	outline: 2px solid var(--hst-ink);
	outline-offset: -2px;
}

/* Meter of WooCommerce: 4 parts (golden by strength), the word and the hint (README §3). */
.hst-reskin .hst-my .woocommerce-password-strength {
	--hst-s1: rgba(22, 17, 15, 0.15);
	--hst-s2: rgba(22, 17, 15, 0.15);
	--hst-s3: rgba(22, 17, 15, 0.15);
	--hst-s4: rgba(22, 17, 15, 0.15);
	margin: 10px 0 0;
	padding: 13px 0 0;
	border: 0;
	/* 4 parts of (100% - 3 × 6 px) / 4 with gaps of 6 px. */
	background: linear-gradient(
		90deg,
		var(--hst-s1) 0 calc(25% - 4.5px),
		transparent calc(25% - 4.5px) calc(25% + 1.5px),
		var(--hst-s2) calc(25% + 1.5px) calc(50% - 3px),
		transparent calc(50% - 3px) calc(50% + 3px),
		var(--hst-s3) calc(50% + 3px) calc(75% - 1.5px),
		transparent calc(75% - 1.5px) calc(75% + 4.5px),
		var(--hst-s4) calc(75% + 4.5px) 100%
	) 0 0 / 100% 5px no-repeat;
	color: var(--hst-ink);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.4;
	text-align: left;
}

.hst-reskin .hst-my .woocommerce-password-strength:is(.short, .bad, .good, .strong) {
	--hst-s1: var(--hst-thread);
}

.hst-reskin .hst-my .woocommerce-password-strength:is(.bad, .good, .strong) {
	--hst-s2: var(--hst-thread);
}

.hst-reskin .hst-my .woocommerce-password-strength:is(.good, .strong) {
	--hst-s3: var(--hst-thread);
}

.hst-reskin .hst-my .woocommerce-password-strength.strong {
	--hst-s4: var(--hst-thread);
}

.hst-reskin .hst-my .woocommerce-password-hint {
	display: block;
	margin: 2px 0 0;
	font-size: 13px;
	line-height: 1.45;
	color: var(--hst-on-light);
}

/* ---- Tablet and phone ---------------------------------------------------------------------------------------- */
@media (max-width: 1100px) {
	.hst-reskin .hst-my .hst-my-row {
		grid-template-columns: 112px minmax(0, 1fr) auto auto;
		grid-template-areas: "thumbs id sum pill" "thumbs buttons buttons buttons";
		gap: 10px 18px;
	}

	.hst-reskin .hst-my-row__buttons {
		justify-content: flex-start;
	}

	.hst-reskin .hst-my .hst-my-row__actions {
		justify-content: flex-start;
	}

	.hst-reskin .hst-my-order {
		grid-template-columns: minmax(0, 1fr);
	}

	.hst-reskin .hst-my .hst-my-sum {
		position: relative;
		top: auto;
	}
}

@media (max-width: 899px) {
	.hst-reskin .hst-my .hst-my__title {
		margin-top: 14px;
	}

	.hst-reskin .hst-my__grid {
		grid-template-columns: minmax(0, 1fr);
		gap: 22px;
		margin-top: 18px;
	}

	/* The menu as a row of pills that scrolls sideways (README §4) – to the edges of the screen. */
	.hst-reskin .hst-my .hst-my-nav.woocommerce-MyAccount-navigation {
		position: static;
		margin: 0 calc(-1 * var(--hst-gutter));
	}

	.hst-reskin .hst-my-nav__who {
		display: none;
	}

	.hst-reskin .hst-my .hst-my-nav__list {
		display: flex;
		gap: 8px;
		margin: 0;
		padding: 0 var(--hst-gutter);
		overflow-x: auto;
		scrollbar-width: none;
	}

	.hst-reskin .hst-my .hst-my-nav__list::-webkit-scrollbar {
		display: none;
	}

	.hst-reskin .hst-my .hst-my-nav__item,
	.hst-reskin .hst-my .hst-my-nav__item--out {
		flex: none;
		margin: 0;
		padding: 0;
		border: 0;
	}

	.hst-reskin .hst-my-nav__item::before,
	.hst-reskin .hst-my-nav__knot {
		display: none;
	}

	.hst-reskin .hst-my .hst-my-nav__link,
	.hst-reskin .hst-my .hst-my-nav__item--out .hst-my-nav__link {
		gap: 6px;
		min-height: 44px;
		padding: 0 16px;
		border: 1.5px solid rgba(22, 17, 15, 0.4);
		border-radius: 999px;
		color: var(--hst-ink);
		font-size: 15px;
		font-weight: 600;
		white-space: nowrap;
	}

	.hst-reskin .hst-my .hst-my-nav__link .hst-ico {
		display: none;
	}

	.hst-reskin .hst-my .hst-my-nav__link[aria-current] {
		border-color: var(--hst-ink);
		background: var(--hst-ink);
		color: var(--hst-bone);
		font-weight: 600;
	}

	.hst-reskin .hst-my .hst-my-nav__count {
		margin-left: 0;
		font-size: 15px;
		font-weight: 500;
		color: inherit;
		opacity: 0.8;
	}

	.hst-reskin .hst-my .hst-my-nav__link:focus-visible {
		outline-offset: 2px;
	}

	.hst-reskin .hst-my-login {
		display: flex;
		flex-direction: column;
		gap: 20px;
		margin-top: 24px;
	}

	.hst-reskin .hst-my .hst-my-login__card,
	.hst-reskin .hst-my .hst-my-login__card--alone {
		width: 100%;
		margin-top: 24px;
		padding: 26px 22px 24px;
	}

	.hst-reskin .hst-my-login .hst-my-login__card {
		margin-top: 0;
	}

	.hst-reskin .hst-my-dark__photo {
		height: 180px;
	}

	.hst-reskin .hst-my-dark__photo--tall {
		height: 220px;
	}

	.hst-reskin .hst-my-dark__body {
		padding: 22px 20px 24px;
	}

	.hst-reskin .hst-my .hst-my-dark__title {
		font-size: 26px;
	}

	.hst-reskin .hst-my-care {
		grid-template-columns: minmax(0, 1fr);
	}

	.hst-reskin .hst-my-care__photo {
		min-height: 0;
		height: 180px;
	}

	.hst-reskin .hst-my-addresses {
		grid-template-columns: minmax(0, 1fr);
	}

	.hst-reskin .hst-my .hst-my-h2 {
		font-size: 32px;
	}
}

@media (max-width: 767px) {
	.hst-reskin .hst-my-tiles {
		grid-template-columns: minmax(0, 1fr);
		gap: 12px;
	}

	.hst-reskin .hst-my .hst-my-latest {
		padding: 22px 20px;
	}

	.hst-reskin .hst-my .hst-my-latest__title {
		font-size: 24px;
	}

	/* The thread of the state vertically. */
	.hst-reskin .hst-othread {
		grid-template-columns: minmax(0, 1fr);
		margin-top: 18px;
	}

	.hst-reskin .hst-othread__step {
		display: grid;
		grid-template-columns: 32px minmax(0, 1fr);
		column-gap: 14px;
		padding: 0 0 16px;
	}

	.hst-reskin .hst-othread__step:last-child {
		padding-bottom: 0;
	}

	.hst-reskin .hst-othread__dot {
		grid-row: span 2;
	}

	.hst-reskin .hst-othread__line {
		top: 36px;
		right: auto;
		bottom: 2px;
		left: 15px;
		border-top: 0;
		border-left: 2px dashed rgba(22, 17, 15, 0.28);
	}

	.hst-reskin .hst-othread__step.is-done .hst-othread__line {
		border-left-color: var(--hst-thread);
	}

	.hst-reskin .hst-my .hst-othread__title {
		margin-top: 6px;
	}

	.hst-reskin .hst-my .hst-my-row {
		grid-template-columns: minmax(0, 1fr) auto;
		grid-template-areas: "id pill" "thumbs sum" "buttons buttons";
		gap: 12px;
		padding: 16px;
	}

	.hst-reskin .hst-my-row__pill {
		justify-self: end;
	}

	.hst-reskin .hst-my-row__buttons {
		flex-direction: column;
	}

	body.hst-reskin .hst-my .hst-my-row__buttons .hst-cbtn {
		width: 100%;
	}

	.hst-reskin .hst-my .hst-state {
		padding: 20px;
	}

	.hst-reskin .hst-my .hst-state__track {
		margin-left: 0;
	}

	.hst-reskin .hst-my-detail > .hst-pay-card {
		padding: 22px 20px;
	}

	.hst-reskin .hst-ci.hst-ci--account {
		grid-template-columns: 68px minmax(0, 1fr) auto;
		gap: 0 14px;
		padding: 16px 0;
	}

	.hst-reskin .hst-ci--account .hst-ci__photo {
		width: 68px;
		height: 85px;
	}

	.hst-reskin .hst-ci.hst-ci--account.hst-ci--hangs {
		grid-template-columns: 52px minmax(0, 1fr) auto;
		padding: 0 0 16px 50px;
	}

	.hst-reskin .hst-ci--account.hst-ci--hangs .hst-ci__photo,
	.hst-reskin .hst-ci--account .hst-ci__photo--square {
		width: 52px;
		height: 52px;
	}

	.hst-reskin .hst-ci--account.hst-ci--hangs .hst-ci__thread {
		left: 33px;
		width: 16px;
		height: 38px;
	}

	.hst-reskin .hst-my .hst-my-sum {
		padding: 22px 20px 24px;
	}

	.hst-reskin .hst-my .hst-my-form__buttons {
		flex-direction: column;
		align-items: stretch;
	}

	body.hst-reskin .hst-my .hst-my-form__buttons .hst-cbtn--tall {
		width: 100%;
	}

	.hst-reskin .hst-my .hst-my-form__buttons .hst-textlink {
		justify-content: center;
	}
}

@media (prefers-reduced-motion: reduce) {
	.hst-reskin .hst-my * {
		scroll-behavior: auto;
		transition: none !important;
	}
}

/* ---- Gift vouchers in the account (P10m A) ------------------------------------------------------------------- */
.hst-reskin .hst-gva-row__pic {
	display: block;
	flex: none;
	width: 120px;
}

.hst-reskin .hst-gva-row__img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1748 / 1240;
	border-radius: 3px;
	background: var(--hst-ink);
}

.hst-reskin .hst-gva-row__code {
	font-family: Menlo, Consolas, monospace;
	font-weight: 600;
	letter-spacing: 0.06em;
}

.hst-reskin .hst-gva-row--used .hst-gva-row__img,
.hst-reskin .hst-gva-row--expired .hst-gva-row__img,
.hst-reskin .hst-gva-row--cancelled .hst-gva-row__img {
	opacity: 0.55;
}

.hst-reskin .hst-gva-dash {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 10px;
	margin: 0 0 24px;
	padding: 14px 18px;
	border: 1px dashed var(--hst-thread);
	border-radius: 4px;
	background: rgba(184, 149, 79, 0.08);
	color: var(--hst-ink);
	font-size: 15px;
	line-height: 1.5;
}

.hst-reskin .hst-my .hst-gva-row {
	grid-template-columns: 120px minmax(0, 1fr) auto auto;
	grid-template-areas: "thumbs id pill buttons";
}

.hst-reskin .hst-gva-row .hst-gva-row__pic {
	grid-area: thumbs;
}

.hst-reskin .hst-my .hst-gva-row .hst-my-row__no {
	color: var(--hst-ink);
	font-size: 17px;
	font-weight: 700;
}

.hst-reskin .hst-my .hst-gva-row__origin a {
	color: var(--hst-ink);
	text-decoration: underline;
	text-underline-offset: 3px;
}

@media (max-width: 1100px) {
	.hst-reskin .hst-my .hst-gva-row {
		grid-template-columns: 120px minmax(0, 1fr) auto;
		grid-template-areas: "thumbs id pill" "thumbs buttons buttons";
	}
}

@media (max-width: 767px) {
	.hst-reskin .hst-my .hst-gva-row {
		grid-template-columns: 96px minmax(0, 1fr);
		grid-template-areas: "thumbs pill" "id id" "buttons buttons";
	}

	.hst-reskin .hst-gva-row .hst-gva-row__pic {
		width: 96px;
	}

	.hst-reskin .hst-gva-row .hst-my-row__pill {
		justify-self: end;
	}
}