/* ---------------------------------------------
	Framed image at the bottom of the card
---------------------------------------------- */
.item--framed-image .oneclick__image {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: auto;
	z-index: 0;
	pointer-events: none;
}
.item--framed-image .oneclick__image img {
	width: 100%;
	display: block;
	object-fit: cover;
}
.item--framed-image .oneclick__image > * {
	width: 100%;
	display: block;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 0;
	object-fit: cover;
	pointer-events: none;
}

.oneclick__wrapper > .oneclick__item:nth-of-type(6) .oneclick__image img {
    position: static;
    width: 60%;
    height: auto;
    margin: 0 auto;
    display: block;
}



/* ---------------------------------------------
	Main wrapper for oneclick component
---------------------------------------------- */
.oneclick__wrapper {
	max-width: 350px;
	max-height: 646px;
	padding: 16px;
	border-radius: 20px;
	display: grid;
	background: #fff;
	grid-template-columns: repeat(2, 1fr);
	grid-template-rows: repeat(4, 1fr);
	gap: 10px;
}

/* ---------------------------------------------
	Single card styles
---------------------------------------------- */
.oneclick__item {
	border-radius: 10px;
	padding: 1rem 1rem 1rem 1rem;
	color: #fff;
	text-decoration: none;
	font-style: normal;
	font-weight: 800;
	line-height: 150%;
	position: relative;
	overflow: hidden;
}

/* ---------------------------------------------
	Background image for the card
---------------------------------------------- */
.oneclick__bgr-image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
	object-fit: cover;
	pointer-events: none;
}

/* ---------------------------------------------
	Main content of the card
---------------------------------------------- */
.oneclick__content {
	position: relative;
	z-index: 1;
}

/* ---------------------------------------------
	Specific item rules
---------------------------------------------- */
.oneclick__item:nth-child(3) {
	grid-column: span 2;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.oneclick__item:nth-child(6) {
	grid-column: span 2;
}

/* ---------------------------------------------
	Item colors
---------------------------------------------- */
.item--gray {
    background-color: var(--light-gray);
    color: #2E3032;
}

.item--green {
    background-color: var(--onelick-green);
}

.item--secondary-dark {
    background-color: var(--secondary-dark);
}

.item--alert {
    background-color: var(--secondary);
}