/*
 *    COMPONENT: CARD
 *
 *    Table of contents
 *
 *    - Default styles
 *    - Variation: without image
 *    - Variation: without description
 *    - Variation: is horizontal layout
 *    - Variation: is centre align
 *    - Variation: has call-to-action
 */

.gpc-card {
	position: relative;
}

.gpc-card__inner {
	display: grid;
	grid-auto-rows: max-content;
}

.gpc-card__heading a::after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 1;
}

.gpc-card__term-list {
	display: flex;
	flex-wrap: wrap;
	list-style: none;
	padding-left: 0;
	gap: 0.2rem 1rem;
}

.gpc-card__inner .gpc-card__term-list li {
	padding: 0.25rem 1rem;
	border-radius: 50rem;
	background-color: #f2f2f2;
	position: relative;
	z-index: 2;
}

.gpc-card__image {
	grid-row: 1;
	margin-bottom: 1rem;
}

/* Parent class required for specificity bump in Block Editor */
.gpc-card__inner .gpc-card__image img {
	width: 100%;
	aspect-ratio: 4/3;
	object-fit: cover;
	object-position: center;
}

.gpc-card--has-square-image .gpc-card__inner .gpc-card__image img {
	aspect-ratio: 1;
}

.gpc-card--has-standard-image .gpc-card__inner .gpc-card__image img {
	aspect-ratio: 4/3;
}

.gpc-card--has-wide-image .gpc-card__inner .gpc-card__image img {
	aspect-ratio: 16/9;
}

.gpc-card--has-original-shape .gpc-card__inner .gpc-card__image img {
	border-radius: 0;
}

.gpc-card--has-circle-shape .gpc-card__inner .gpc-card__image img,
.gpc-card--has-circle-shape .gpc-card__inner .gpc-card__image div /* Block Editor */ {
	border-radius: 100%;
	height: auto !important; /* !important overrides inline Block Editor styles */
}

.gpc-card--has-cover-image-size .gpc-card__inner .gpc-card__image img {
	object-fit: cover;
}

.gpc-card--has-contain-image-size .gpc-card__inner .gpc-card__image img {
	object-fit: contain;
}

.gpc-card__cta {
	display: none;
	position: relative;
	z-index: 1;
}

.gpc-card__icon {
	display: none;
}

/*--------------------------------------------------------------
 Variation: without image
--------------------------------------------------------------*/

/* Only applies to Block Editor because element isn't output on frontend */
.gpc-card--without-image .gpc-card__image {
	display: none;
}

/*--------------------------------------------------------------
 Variation: use colour scheme
--------------------------------------------------------------*/
.gpc-card--use-colour-scheme .gpc-card__inner .gpc-card__term-list li {
	background-color: var(--gpc-card-background-color);
}

/*--------------------------------------------------------------
 Variation: without description
--------------------------------------------------------------*/

/* Only applies to Block Editor because element isn't output on frontend */
.gpc-card--without-description .gpc-card__description {
	display: none;
}


/*--------------------------------------------------------------
 Variation: is horizontal layout
--------------------------------------------------------------*/

.gpc-card--is-horizontal-layout .gpc-card__inner {
	grid-template-columns: auto auto;
	column-gap: var(--gpc-card-column-gap, 1.5rem);
}

.gpc-card--is-horizontal-layout .gpc-card__image {
	grid-row: 1 / span 5;
	grid-column: 1;
	margin-bottom: 0;
}


/*--------------------------------------------------------------
 Variation: is centre align
--------------------------------------------------------------*/

.gpc-card--is-centre-align {
	text-align: center;
}

.gpc-card--is-centre-align img,
.gpc-card--is-centre-align figure div /* Block Editor */ {
	margin-right: auto;
	margin-left: auto;
}


/*--------------------------------------------------------------
 Variation: has call-to-action
--------------------------------------------------------------*/

.gpc-card--has-cta .gpc-card__cta {
	display: block;
	align-self: start;
}

.gpc-card .wp-block-button__link {
	margin-bottom: 0;
}

.gpc-card--has-cta-icon .gpc-card__cta {
	z-index: unset;
	display: flex;
	justify-content: end;
	align-items: start;
}

.gpc-card--is-centre-align.gpc-card--has-cta-icon .gpc-card__cta {
	justify-content: center;
}

.gpc-card--has-cta-icon-inline {
	display: grid;
	grid-template-columns: 1fr var(--gpc-card-icon-background-size, 40px);
	gap: var(--gpc-card-column-gap, 1.5rem);
}

.gpc-card--has-cta-icon .gpc-card__cta a {
	display: none;
}

.gpc-card--has-cta-icon .gpc-card__icon {
	display: grid;
	align-items: center;
	justify-content: center;
	width: var(--gpc-card-icon-background-size, 40px);
	height: var(--gpc-card-icon-background-size, 40px);
	border-radius: 50%;
	background-color: var(--gpc-card-icon-background-color, lightgrey);
	color: var(--gpc-card-icon-color, currentColor);
}

.gpc-card__icon svg {
	width: var(--gpc-card-icon-width, 17px);
	height: var(--gpc-card-icon-height, 12px);
}