/**
 * PS Base — block-styles.css
 *
 * CSS for all custom block style variations registered in block-styles.php.
 * Loaded on the front end and in the editor via enqueue_block_editor_assets.
 *
 * Class pattern: .is-style-{name} on the block's root element.
 */


/* =============================================================
   BUTTONS
   ============================================================= */

/* Outline / ghost */
.wp-block-button.is-style-outline .wp-block-button__link,
.wp-block-button__link.is-style-outline {
	background: transparent !important;
	border: 2px solid currentColor !important;
	color: inherit !important;
	transition: background 0.25s ease, color 0.25s ease;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	background: currentColor !important;
	color: var(--wp--preset--color--base, #fff) !important;
}

/* Text link — no background, animated underline */
.wp-block-button.is-style-text-link .wp-block-button__link {
	background: transparent !important;
	border: none !important;
	color: inherit !important;
	padding: 0 !important;
	border-radius: 0 !important;
	position: relative;
	text-decoration: none;
}

.wp-block-button.is-style-text-link .wp-block-button__link::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: -2px;
	width: 100%;
	height: 1px;
	background: currentColor;
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.25s ease;
}

.wp-block-button.is-style-text-link .wp-block-button__link:hover::after {
	transform: scaleX(1);
}

/* Pill */
.wp-block-button.is-style-pill .wp-block-button__link {
	border-radius: 50rem !important;
}

/* Square */
.wp-block-button.is-style-square .wp-block-button__link {
	border-radius: 0 !important;
}


/* =============================================================
   IMAGES
   ============================================================= */

/* Card — rounded + shadow */
.wp-block-image.is-style-card img {
	border-radius: 12px;
	box-shadow: 0 8px 30px rgb(0 0 0 / 12%);
}

/* Circle crop */
.wp-block-image.is-style-circle img {
	border-radius: 50%;
	aspect-ratio: 1;
	object-fit: cover;
}

/* Framed — thin border */
.wp-block-image.is-style-framed img {
	border: 3px solid var(--wp--preset--color--accent-1, currentColor);
	padding: 6px;
	border-radius: 4px;
}

/* Tilted — slight decorative rotation */
.wp-block-image.is-style-tilted {
	transform: rotate(-2deg);
	transform-origin: center;
}

.wp-block-image.is-style-tilted img {
	border-radius: 8px;
	box-shadow: 4px 8px 24px rgb(0 0 0 / 15%);
}


/* =============================================================
   SEPARATORS
   ============================================================= */

.wp-block-separator.is-style-wide {
	max-width: 100% !important;
}

.wp-block-separator.is-style-dotted {
	border-style: dotted !important;
	border-width: 3px !important;
}

/* Ornament — diamond in the centre */
.wp-block-separator.is-style-ornament {
	border: none !important;
	text-align: center;
	overflow: visible;
	position: relative;
	height: 1px;
	background: var(--wp--preset--color--accent-1, #ccc);
}

.wp-block-separator.is-style-ornament::after {
	content: "◆";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: var(--wp--preset--color--base, #fff);
	padding: 0 12px;
	color: var(--wp--preset--color--accent-1, currentColor);
	font-size: 0.8rem;
}


/* =============================================================
   QUOTES
   ============================================================= */

/* Minimal — remove the giant quote mark */
.wp-block-quote.is-style-minimal {
	border: none !important;
	padding: 0 !important;
}

.wp-block-quote.is-style-minimal::before {
	display: none !important;
}

.wp-block-quote.is-style-minimal p {
	font-style: italic;
}

/* Border accent — left coloured stripe */
.wp-block-quote.is-style-border-accent {
	border-left: 4px solid var(--wp--preset--color--accent-1, currentColor) !important;
	padding-left: var(--wp--preset--spacing--40, 1.5rem) !important;
	border-top: none !important;
	border-right: none !important;
	border-bottom: none !important;
}

/* Card — full background */
.wp-block-quote.is-style-card {
	background: var(--wp--preset--color--base-2, #f5f5f5);
	border: none !important;
	border-radius: 12px;
	padding: var(--wp--preset--spacing--50, 2rem) !important;
	box-shadow: 0 4px 20px rgb(0 0 0 / 6%);
}

/* Pull quote — large centred */
.wp-block-quote.is-style-pull {
	border: none !important;
	text-align: center;
	padding: var(--wp--preset--spacing--60, 3rem) !important;
}

.wp-block-quote.is-style-pull p {
	font-size: clamp(1.4rem, 3vw, 2rem);
	font-style: italic;
	line-height: 1.4;
}


/* =============================================================
   GROUPS
   ============================================================= */

/* Card */
.wp-block-group.is-style-card {
	background: var(--wp--preset--color--base, #fff);
	border-radius: 16px;
	box-shadow: 0 6px 30px rgb(0 0 0 / 8%);
	overflow: hidden;
}

/* Border top — accent strip */
.wp-block-group.is-style-border-top {
	border-top: 4px solid var(--wp--preset--color--accent-1, currentColor);
}

/* Box — border all round */
.wp-block-group.is-style-box {
	border: 1px solid var(--wp--preset--color--accent-1, #e0e0e0);
	border-radius: 8px;
}

/* Tinted — subtle background wash */
.wp-block-group.is-style-tinted {
	background: var(--wp--preset--color--base-2, #f7f7f7);
}


/* =============================================================
   HEADINGS
   ============================================================= */

/* Underline — thin line below */
.wp-block-heading.is-style-underline {
	padding-bottom: 0.4em;
	border-bottom: 2px solid var(--wp--preset--color--accent-1, currentColor);
	display: inline-block;
}

/* Bar left — vertical accent */
.wp-block-heading.is-style-bar-left {
	padding-left: 0.75em;
	border-left: 4px solid var(--wp--preset--color--accent-1, currentColor);
}

/* Eyebrow — small caps, wide tracking, smaller font */
.wp-block-heading.is-style-eyebrow {
	font-size: clamp(0.7rem, 1.5vw, 0.85rem) !important;
	font-weight: 600 !important;
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: var(--wp--preset--color--accent-1, currentColor);
	margin-bottom: 0.25em;
}


/* =============================================================
   LISTS
   ============================================================= */

/* Check — swap bullets for tick marks */
.wp-block-list.is-style-check {
	list-style: none;
	padding-inline-start: 0.25rem;
}

.wp-block-list.is-style-check li {
	padding-left: 2em;
	position: relative;
	margin-bottom: 0.5em;
}

.wp-block-list.is-style-check li::before {
	content: "✓";
	position: absolute;
	left: 0;
	color: var(--wp--preset--color--accent-1, currentColor);
	font-weight: 700;
}

/* Dot accent — coloured bullets */
.wp-block-list.is-style-dot-accent {
	list-style: none;
	padding-inline-start: 0.25rem;
}

.wp-block-list.is-style-dot-accent li {
	padding-left: 1.5em;
	position: relative;
	margin-bottom: 0.4em;
}

.wp-block-list.is-style-dot-accent li::before {
	content: "•";
	position: absolute;
	left: 0;
	color: var(--wp--preset--color--accent-1, currentColor);
	font-size: 1.2em;
	line-height: 1;
	top: 0.1em;
}

/* Plain — no bullets at all */
.wp-block-list.is-style-plain {
	list-style: none;
	padding-inline-start: 0;
}

.wp-block-list.is-style-plain li {
	margin-bottom: 0.5em;
}


/* =============================================================
   COLUMNS
   ============================================================= */

/* Divided — vertical border between columns */
.wp-block-columns.is-style-divided .wp-block-column + .wp-block-column {
	border-left: 1px solid var(--wp--preset--color--accent-1, #e0e0e0);
	padding-left: var(--wp--preset--spacing--40, 1.5rem);
}

/* Card columns — each column as a card */
.wp-block-columns.is-style-card-cols .wp-block-column {
	background: var(--wp--preset--color--base, #fff);
	border-radius: 12px;
	box-shadow: 0 4px 20px rgb(0 0 0 / 7%);
	padding: var(--wp--preset--spacing--50, 2rem);
}
