/* Start:/bitrix/components/bitrix/sale.personal.section/templates/bootstrap_v4/style.css?17938591534043*/
.sale-personal-section-index-block {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	margin: 15px 0;
	padding: 0;
	height: 87%;
	border-radius: 3px;
	background-size: cover;
	color: #fff;
	text-align: center;
	text-transform: uppercase;
	opacity: .8;
	transition: all 0.3s;
	justify-content: space-around;
	background-color: var(--theme-color-primary, #51cbce);
}

@media (max-width: 992px) {
	.sale-personal-section-index-block {
		margin: 8px 0;
		height: auto;
	}
}

.sale-personal-section-index-block:hover { opacity: 1; }

.sale-personal-section-index-block-link,
.sale-personal-section-index-block-link:hover,
.sale-personal-section-index-block-link:active,
.sale-personal-section-index-block-link:focus,
.sale-personal-section-index-block-link:visited {
	display: block;
	padding: 25px 5px;
	width: 100%;
	color: #fff;
	text-decoration: none;
}

.sale-personal-section-index-block-link { color: #fff; }

.sale-personal-section-index-block-ico { font-size: 64px; }

.sale-personal-section-index-block-name {
	color: #fff;
	font-size: 15px;
	margin: 0;
	padding: 0;
}
/*region Focus ring*/
/* The forms of the entry, the password recovery and the password change come from `main`; the section
 * wraps them, and the rules below reach them only there. One dark band outside the box of the control,
 * as on the other pages of the section: the theme of the landing store draws a white band inside the box
 * and a halo around it, and the stylesheet of the fields drops the ring of a field altogether. The weight
 * outruns `.block-wrapper [tabindex]:not([tabindex="-1"]):focus-visible` (0,4,0) of the theme, which is
 * included after this file. */
.row > .sale-personal-section-auth .bx-authform a:focus-visible,
.row > .sale-personal-section-auth .bx-authform .btn:focus-visible,
.row > .sale-personal-section-auth .bx-authform button:focus-visible,
.row > .sale-personal-section-auth .bx-authform input:focus-visible,
.row > .sale-personal-section-auth .bx-authform select:focus-visible,
.row > .sale-personal-section-auth .bx-authform textarea:focus-visible,
.row > .sale-personal-section-auth .bx-authform [tabindex]:not([tabindex="-1"]):focus-visible {
	outline: var(--ui-focus-outline-width, 2px) solid var(--ui-color-base-1, #333333);
	outline-offset: var(--ui-focus-outline-offset, 2px);
	box-shadow: none;
}

/* The theme animates every property of a button, the ring with them, and a ring that fades in cannot
 * be followed. */
.row > .sale-personal-section-auth .bx-authform .btn {
	transition: all .2s ease, outline 0s, outline-offset 0s, box-shadow 0s;
}

/* `ui.bootstrap4`, brought by the search of the header, paints the fill and the border of a focused
 * button (0,2,0). The resting values are put back, and the hovered ones over a hovered or pressed focused
 * button. */
.row > .sale-personal-section-auth .bx-authform .btn.btn-primary:focus {
	background-color: var(--primary);
	border-color: var(--primary);
	color: #fff;
}

.row > .sale-personal-section-auth .bx-authform .btn.btn-primary:focus:hover,
.row > .sale-personal-section-auth .bx-authform .btn.btn-primary:focus:active {
	background-color: var(--primary-darken-1, var(--primary));
	border-color: var(--primary-darken-1, var(--primary));
	color: #fff;
}

/* One dark band outside the tile instead of the white band the landing store theme draws inside it and
 * its halo. The weight outruns `.block-wrapper [tabindex]:not([tabindex="-1"]):focus-visible` (0,4,0)
 * of the theme, whose stylesheet comes later. */
.row .sale-personal-section-index-block > a.sale-personal-section-index-block-link[href]:focus-visible {
	outline: var(--ui-focus-outline-width, 2px) solid var(--ui-color-base-1, #333333);
	outline-offset: var(--ui-focus-outline-offset, 2px);
	box-shadow: none;
}

/* The translucent tile would pale the ring: the focused tile is opaque, as the hovered one, at once. */
.row .sale-personal-section-index-block:has(> a.sale-personal-section-index-block-link[href]:focus-visible) {
	opacity: 1;
	transition: none;
}
/*endregion*/

/* End */
/* /bitrix/components/bitrix/sale.personal.section/templates/bootstrap_v4/style.css?17938591534043 */