/*
 Theme Name:   Bricks Child Theme
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Bricks
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/
/* ------ TABLE OF CONTENTS ------
 * 1. GALLERIES
 * 2. MEDIA AND TEXT
 * 3. SEPERATORS
 * 4. LISTS
 * 5. FILES
 * 6. TABLES
 * 7. BLOCKQUOTES
 * 8. ACCORDIONS
 * 

/* ---- 1.1 GALLERY ONE ---- */
.postid-4244 .wp-block-gallery {
    --wp--style--gallery-gap-default: var(--space-m) !important;
}

/* Target WordPress gallery images */
.postid-4244 .wp-block-gallery .wp-block-image {
  position: relative;
  overflow: hidden;
	border-radius:var(--radius);
}

/* Make images zoom smoothly */
.postid-4244 .wp-block-gallery .wp-block-image img {
  transition: transform 0.5s ease;
  display: block;
}

/* Plus sign */
.postid-4244 .wp-block-gallery .wp-block-image::before {
  content: "+";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 3rem;
  color: white;
  opacity: 0;
  transition: opacity 0.4s ease;
  pointer-events: none;
  z-index: 1; /* make sure it's above the overlay */
}

/* Overlay layer */
.postid-4244 .wp-block-gallery .wp-block-image::after {
  content: "";
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.5s ease;
  pointer-events: none;
}
/* Hover state */
.postid-4244 .wp-block-gallery .wp-block-image:hover::after,
.postid-4244 .wp-block-gallery .wp-block-image:hover::before {
  opacity: 1;
}

/* Alternate overlay colors */
.postid-4244 .wp-block-gallery .wp-block-image:nth-child(3n + 1)::after {
  background: var(--primary-trans-80);
}
.postid-4244 .wp-block-gallery .wp-block-image:nth-child(3n + 2)::after {
  background: var(--secondary-trans-80);
}
.postid-4244 .wp-block-gallery .wp-block-image:nth-child(3n + 3)::after {
  background: var(--tertiary-trans-80);
}

/* Hover state */
.postid-4244 .wp-block-gallery .wp-block-image:hover img {
  transform: scale(1.1);
}


/* ---- 2.1 MEDIA AND TEXT ONE ---- */
.postid-4272 .wp-block-media-text>.wp-block-media-text__media {
	height:100%;
	width: calc(100% - (var(--space-xl) / 2)) !important; /* override inline 50% width */
}
.postid-4272 .wp-block-media-text>.wp-block-media-text__media img {
	height:100%;
	object-fit: cover;
	object-position: center;
}
.postid-4272 .wp-block-media-text>.wp-block-media-text__content {
	aspect-ratio: 1 / 1; /* make them square */
	width: calc(100% - (var(--space-xl) / 2)) !important; /* override inline 50% width */
	background:var(--primary);
	border-radius:var(--radius);
	padding:var(--space-l)!important;
	display:flex;
	flex-direction:column;
	gap:var(--content-gap);
}
.postid-4272 .has-media-on-the-right>.wp-block-media-text__content {
	background:var(--secondary);
}
.postid-4272 .wp-block-media-text__content :is(h1,h2,h3,h4,h5,h6,p) {
	color:var(--white)
}
.postid-4272 .wp-block-media-text > .wp-block-media-text__content p {
	font-size:var(--text-l);
	line-height:var(--text-line-height);
}
.postid-4272 .wp-block-media-text:not(:last-child) {
  margin-top: var(--space-m);
}
@media (max-width: 999px) {
	.wp-block-media-text {
		display:flex!important;
		flex-direction:column;
	}
	.postid-4272 .wp-block-media-text>.wp-block-media-text__media img {
		border-radius:var(--radius) var(--radius) 0 0;
	}
	.postid-4272 .wp-block-media-text>.wp-block-media-text__content {
		aspect-ratio:auto;
		border-radius:0 0 var(--radius) var(--radius)
	}
	.postid-4272 .has-media-on-the-right>.wp-block-media-text__content {
		order:1;
	}
	
}
/* ---- 3. SEPERATORS ---- */
/* ---- 3.1 SEPRATOR ONE ---- */
.postid-4314 hr,
.postid-4314 .wp-block-separator {
	border-top:1px solid var(--secondary);
	margin:2em 0;
}
.postid-4314 hr.wp-block-separator {
  position: relative;
  border: none;
  border-top: 1px solid var(--secondary);
  margin: 2rem 0;
}

.postid-4314 hr.wp-block-separator::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: #fff; 
  padding: 0 0.5rem;
  background-image: url("/wp-content/uploads/2025/04/cs-icon.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 60px; 
  height: 60px; 
}
@media only screen and (min-width: 992px) {
	.postid-4314 hr,
.postid-4314 .wp-block-separator,
	hr.wp-block-separator {
	color:var(--secondary);
}
}
/* ---- 4. LISTS ---- */
/* ---- 4.1 LIST ONE ---- */
/* ---------- Configure your colours here ---------- */
:root {
  --bullet-size: 10px;          /* bullet diameter */
  --bullet-gap: 12px;           /* space between bullet and text */
}

/* Remove default bullets */
.postid-4321 ul.wp-block-list {
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}

/* Each list item */
.postid-4321 ul.wp-block-list li {
  position: relative;
  padding-left: calc(var(--bullet-size) + var(--bullet-gap));
	border-bottom:1px solid var(--neutral-light);
	padding-top: 0.3em;
	padding-bottom: 0.3em;
}
.postid-4321 ol.wp-block-list li {
	position: relative;
	border-bottom:1px solid var(--neutral-light);
	padding-top: 0.3em;
	padding-bottom: 0.3em;
}
.postid-4321 .wp-block-list li:last-child {
	border-bottom:0px solid var(--neutral-light);
}

/* Custom circular bullet using SVG mask */
.postid-4321 ul.wp-block-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 20px;
  transform: translateY(-50%);
  width: var(--bullet-size);
  height: var(--bullet-size);
  background-color: var(--primary); /* default, overridden below */
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><circle cx='50' cy='50' r='50' fill='white'/></svg>");
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
  mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><circle cx='50' cy='50' r='50' fill='white'/></svg>");
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  pointer-events: none; /* ensure clicks go through */
  transition: transform .25s ease, background-color .25s ease, opacity .25s ease;
}

/* Hover lift effect (optional) */
.postid-4321 .wp-block-list li:hover::before,
.postid-4321 .wp-block-list li:focus-within::before {
  transform: translateY(-50%) scale(1.08);
}

/* Alternate colours: primary / secondary / tertiary */
.postid-4321 ul.wp-block-list li:nth-child(3n+1)::before {
  background-color: var(--primary);
}
.postid-4321 ul.wp-block-list li:nth-child(3n+2)::before {
  background-color: var(--secondary);
}
.postid-4321 ul.wp-block-list li:nth-child(3n)::before {
  background-color: var(--tertiary);
}
/* ---- 5. FILES ---- */
/* ---- 5.1 FILES: ONE ---- */
/* GUTENBERG FILES: ONE */
.postid-4329 .wp-block-file:not(.wp-element-button) {
    font-size: inherit;
	margin:1em 0;
}
.postid-4329 a[href$=".pdf"],
.postid-4329 a[href$=".doc"],
.postid-4329 a[href$=".docx"],
.postid-4329 a[href$=".xls"],
.postid-4329 a[href$=".xlsx"],
.postid-4329 a[href$=".ppt"],
.postid-4329 a[href$=".pptx"] {
	border-radius:8px;
	border:1px solid var(--bg-light);
	display:flex; 
	margin:3px 0px 3px 50px;
	color:var(--base);
	transition:all 0.5s ease-in-out;
	background-color: var(--bg-ultra-light);
	text-decoration:none;
	align-items: center;
	font-weight:400;
	text-transform: none;
    line-height: 1.7em;
	width:100%;
	font-size:var(--text-m);
	max-width: calc(100% - 50px);
}
.postid-4329 .c-accordion__content a[href$=".pdf"],
.postid-4329 .c-accordion__content a[href$=".doc"],
.postid-4329 .c-accordion__content a[href$=".docx"],
.postid-4329 .c-accordion__content a[href$=".xls"],
.postid-4329 .c-accordion__content a[href$=".xlsx"],
.postid-4329 .c-accordion__content a[href$=".ppt"],
.postid-4329 .c-accordion__content a[href$=".pptx"] {
	background-color:var(--white);
}
.postid-4329 a[href$=".pdf"]:hover {
	background-color:#d33f32;
	color:#FFF!important;
	border:1px solid rgba(0,0,0,0.3);
}

.postid-4329 a[href$=".doc"]:hover,
.postid-4329 a[href$=".docx"]:hover
{
	background-color:#0263d1;
	color:#FFF!important;
	border:1px solid rgba(0,0,0,0.3);
}

.postid-4329 a[href$=".xls"]:hover,
.postid-4329 a[href$=".xlsx"]:hover {
	background-color:#00733b;
	color:#FFF!important;
	border:1px solid rgba(0,0,0,0.3);
}

.postid-4329 a[href$=".ppt"]:hover,
.postid-4329 a[href$=".pptx"]:hover {
	background-color:#e03303;
	color:#FFF!important;
	border:1px solid rgba(0,0,0,0.3);
}

.postid-4329 a[href$=".pdf"]:before,
.postid-4329 a[href$=".doc"]:before,
.postid-4329 a[href$=".docx"]:before,
.postid-4329 a[href$=".xls"]:before,
.postid-4329 a[href$=".xlsx"]:before,
.postid-4329 a[href$=".ppt"]:before,
.postid-4329 a[href$=".pptx"]:before {
	display: inline-flex;
	content: ' ';
	background-size: contain;
	min-height: 50px;
	width: 65px;
	background-repeat:no-repeat;
	margin-left:-50px;
}
.postid-4329 a[href$=".pdf"]:before {
	background-image: url('/wp-content/themes/bricks-child/img/pdf.svg');
}

.postid-4329 a[href$=".doc"]:before,
.postid-4329 a[href$=".docx"]:before {
	background-image: url('/wp-content/themes/bricks-child/img/word.svg');
}

.postid-4329 a[href$=".xls"]:before,
.postid-4329 a[href$=".xlsx"]:before {
	background-image: url('/wp-content/themes/bricks-child/img/excel.svg');
}

.postid-4329 a[href$=".ppt"]:before,
.postid-4329 a[href$=".pptx"]:before {
	background-image: url('/wp-content/themes/bricks-child/img/powerpoint.svg');
}
/* ---- 6. TABLES ---- */
/* ---- 6.1 TABLES ONE ---- */
.postid-4348 .wp-block-table {
	border-radius:var(--radius-xl);
	border:1px solid var(--neutral-light)!important;
	border-collapse: separate; /* Important! */
  	border-spacing: 0;         /* Remove gaps */
	overflow-x: auto;
  -webkit-overflow-scrolling: touch; /* smooth scroll on iOS */
}
.postid-4348 .wp-block-table th {
	background-color:var(--primary);
	color:white;
	border:1px solid var(--primary)!important;
	text-align:left;
}
.postid-4348 .wp-block-table thead {
	border-bottom:0px solid var(--primary-dark-trans-50)!important;
}
.postid-4348 .wp-block-table tbody tr:nth-child(odd) {
	background-color:var(--neutral-ultra-light);
}
.postid-4348 .wp-block-table td {
	border-top: 0px!important;
	border-left: 0px!important;
	border-right: 0px!important;
	border-bottom:1px solid var(--neutral-light)!important;
}
.postid-4348 .wp-block-table tfoot {
	border-top:3px solid var(--neutral-light)!important;
}
.postid-4348 .wp-block-table tfoot td {
	font-size:var(--text-xs);
	border-bottom:0px;
}
/* ---- 7. BLOCKQUOTES ---- */
/* ---- 7.1 BLOCKQUOTE ONE ---- */
/* Reset the theme’s default styling */
.postid-4365 .wp-block-quote {
  border: none !important;
  padding: 0 !important;
  margin: 80px auto !important;
  background: transparent !important;
  position: relative;
  text-align: left;
}

/* White masking bar moved here */
.postid-4365 .wp-block-quote::before {
  content: "";
  position: absolute;
  width: 80px;
  border: 6px solid white; /* match page background */
  bottom: 36px;
  left: 58px;
  z-index: 2;
}

/* Main quote text */
.postid-4365 .wp-block-quote p {
  position: relative;
  color: var(--primary);
  font-size: var(--text-l);
  font-weight: normal;
  line-height: 1.2;
  margin: 0;
  font-style: italic;
  border: 2px solid var(--secondary);
  border-radius: 20px;
  padding: var(--space-l) var(--space-l) var(--space-l) 175px; /* space for big opening mark */
  font-family: var(--text-font-family);
  background: transparent;
}

/* Big opening quotation mark */
.postid-4365 .wp-block-quote p::before {
  content: "“";
  position: absolute;
  top: 10px;
  left: 20px;
  font-size: 15rem;
  color: var(--secondary);
  font-family: var(--text-font-family);
  line-height: 1;
  z-index: 1;
}

/* Decorative quarter-circle */
.postid-4365 .wp-block-quote p::after {
  content: "";
  position: absolute;
  border: 2px solid var(--secondary);
  border-radius: 0 100% 0 0;
  width: 60px;
  height: 60px;
  bottom: -60px;
  left: 50px;
  border-bottom: none;
  border-left: none;
  z-index: 3;
}

/* Citation styling */
.postid-4365 .wp-block-quote cite {
  display: block;
  color: var(--secondary);
	font-family:var(--text-font-family);
  font-size: var(--h4);
  font-weight: 600;
  margin-top: 15px;
  margin-left: 150px;
  padding-left: 12px;
  font-style: normal;
	opacity:1;
}
.postid-4365 .wp-block-quote cite:first-letter {
  margin-left: -12px;
}

/* Larger text on bigger screens */
@media (min-width: 600px) {
  .postid-4365 .wp-block-quote p {
    font-size: 2.6rem;
    line-height: 1.3;
  }
}
@media (max-width: 600px) {
	.postid-4365 .wp-block-quote p::before {
	font-size: 8rem!important;
	top:25px;
	}
	.postid-4365 .wp-block-quote p {
		padding: var(--space-l) var(--space-l) var(--space-l) 105px; /* space for big opening mark */
	}
}
/* ---- 8. ACCORDION ---- */
/* ---- 8.1 ACCORDION ONE ---- */
.postid-4391 .wp-block-pb-accordion-item ul,
.postid-4391 .wp-block-pb-accordion-item p {
	margin-block-start: 1em;
    margin-block-end: 1em;
}
.postid-4391 .c-accordion__content a[href$=".pdf"],
.postid-4391 .c-accordion__content a[href$=".doc"],
.postid-4391 .c-accordion__content a[href$=".docx"],
.postid-4391 .c-accordion__content a[href$=".xls"],
.postid-4391 .c-accordion__content a[href$=".xlsx"],
.postid-4391 .c-accordion__content a[href$=".ppt"],
.postid-4391 .c-accordion__content a[href$=".pptx"] {
	background-color:var(--white);
}
.postid-4391 .c-accordion__item {
	background-color:var(--neutral-ultra-light);
	margin:1em 0;
	border-radius:var(--radius);
	transition: all 0.5s ease-in-out;
} /* The accordion item container */
.postid-4391 .c-accordion__item.is-open,
.postid-4391 .c-accordion__title:hover.is-open {
	background-color:var(--primary)!important;
} /* is-open is added to open accordion items */
.postid-4391 .c-accordion__item.is-read {} /* is-read is added to accordion items that have been opened at least once */
.postid-4391 .c-accordion__title {
	font-size:var(--text-l);
	color:var(--base);
	padding:var(--space-s);
	border-radius:var(--radius-l);
	transition: all 0.5s ease-in-out;
} 
/* .c-accordion__title when opened */
.postid-4391 .c-accordion__item.is-open h2 {
	color:var(--white);
}
/* An accordion item title */
.postid-4391 .c-accordion__title:after {
	right:var(--space-s);
	background:var(--primary);
	color:var(--white);
	border-radius:50%;
	padding:0px 0.3em;
} /* Plus sign at the end of the accordion 
/* .c-accordion__title--button {} /* An accordion item title that is using a `<button>` tag */
.postid-4391 .c-accordion__title:hover {
	background-color:var(--primary);
	color:var(--white);
	border-radius:var(--radius-l);
} /* To modify the style when hovering over an accordion item title */
.postid-4391 .c-accordion__title:focus {} /* To modify the style when an accordion item title currently has broswer focus */
.postid-4391 .c-accordion__content {
	padding:var(--space-s) ;
	background-color:var(--neutral-ultra-light);
	border-radius:0 0 var(--radius) var(--radius);

} /* An accordion item content container */

/* ---- LANDING PAGES ---- */

.childpages {
	display:grid;
}
.childpage {
	transition:all 0.5s ease-in-out;
	border-radius:var(--radius-xl);
}
.childpage:hover {
	background-color:var(--primary);
	box-shadow:none;
}
.childpage a {
	position:relative;
	height:100%;
	width:100%;
	display:block;
	border-radius:var(--radius-xl);
}
.childpage a:hover {
	background-color:var(--primary-trans-80);
	border-radius:var(--radius-xl);
}
.childpage:nth-of-type(4n + 1) a:hover {
	background-color:var(--primary-trans-80);
}
.childpage:nth-of-type(4n + 2) a:hover {
	background-color:var(--secondary-trans-80);
}
.childpage:nth-of-type(4n + 3) a:hover {
	background-color:var(--accent-trans-80);
}
.childpage:nth-of-type(4n + 4) a:hover {
	background-color:var(--action-trans-80);
}
.childpage h3 {
	padding:var(--space-m) var(--space-m) 0 var(--space-m);
	transition:all 0.5s ease-in-out;
	color:var(--white);
	position:absolute;
	bottom:var(--space-m);
}
.childpage-excerpt {
	padding: 0 var(--space-s) var(--space-s) var(--space-s);
	text-wrap:inherit;
	color:var(--base);
	transition:all 0.5s ease-in-out;
}
.childpage-image {
	border-radius:var(--radius-xl);
}
h2.landing-page-title {
	text-align:center;
	margin:var(--space-l) 0 var(--space-l) 0;
	display:none;
}
@media (max-width: 767px) {
	.childpages {
		padding:0px var(--space-l);
	}
}
