/*
 Theme Name:   Ovation
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Chen Jun
 Author URI:   https://bricksbuilder.io/
 Template:     bricks
 Version:      1.1
 Text Domain:  bricks
*/

@layer {
	/* Link style */
	body a:where(:not([class*= btn--])) {
		color: var(--link-color, var(--clr-primary));
		font-weight: var(--link-weight, inherit);
		-webkit-text-decoration: var(--link-decoration, inherit);
		text-decoration: var(--link-decoration, inherit);
		text-underline-offset: var(--link-underline-offset, 0.25em);
		transition: var(--link-transition, var(--transition));
	}

	/* 	body.bricks-is-frontend :focus-visible {
	box-shadow: 0 0 0 var(--focus-width, .1rem) var(--focus-color);
} */

	/* Hover style */
	@media (hover: hover) and (pointer: fine) {
		body a:where(:not([class*= button])):hover {
			color: var(--link-color-hover, var(--clr-primary-hover));
			-webkit-text-decoration: var(--link-decoration-hover, underline);
			text-decoration: var(--link-decoration-hover, underline);
			text-decoration-thickness: var(--link-underline-thickness, 1.5px);
		}
	}
}

/* Foucus style */
body.bricks-is-frontend.bricks-is-frontend :focus-visible {
	outline-style: solid;
	outline-color: var(--focus-color);
	outline-width: var(--focus-width);
	outline-offset: var(--focus-offset);
/* 	background-color: var(--focus-color); */
/* 	color: var(--text-dark); */
}

/* Reset figure margin */
figure {
	margin: 0;
}

/* Primary button hover */
:root .bricks-button[class*="primary"]:not(.outline):hover {
	background-color: var(--clr-primary-dark);
}

/* Primary button outline hover */
:root .bricks-button[class*="primary"].outline:hover {
	background-color: var(--clr-primary);
	color: var(--text-light);
}

/* Dark button hover */
:root .bricks-button[class*="dark"]:not(.outline):hover {
	background-color: var(--clr-black-trans-80);
	color: var(--text-light);
}

/* Dark button outline hover */
:root .bricks-button[class*="dark"].outline:hover {
	background-color: var(--clr-black);
	color: var(--text-light);
}

/* Light button hover */
:root .bricks-button[class*="light"]:not(.outline):not(.bricks-lightbox):hover {
    background-color: var(--clr-primary);
	color: var(--text-light);
	border-color: var(--clr-white);
}

/* Light button outline hover */
:root .bricks-button[class*="light"].outline:hover {
	background-color: var(--clr-white);
	color: var(--text-dark);
}

/* Hidden accessible */
.hidden-accessible {
  position: absolute !important;
  inline-size: 1px !important;
  block-size: 1px !important;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: rect(0, 0, 0, 0);
  white-space: nowrap;
  /* added line */
  border: 0;
}

.bricks-area .hidden-accessible {
  position: relative !important;
  inline-size: 2ch !important;
  block-size: 2ch !important;
  margin: 0;
  line-height: 1;
  visibility: hidden;
}
.bricks-area .hidden-accessible::before {
  content: "A";
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  position: absolute;
  background: #111;
  color: #f5f5f5;
  font-size: max(60%, 13px);
  padding: 0.5em;
  inset-block-start: 0;
  inset-inline-start: 0;
  inline-size: 20px;
  block-size: 20px;
  visibility: visible;
  border-radius: 50%;
}

/* Global light box */
.pswp.brx .pswp__img {
  background-color: var(--bg-ultra-light);
}

.pswp__thumbnail-nav > * {
  background-color: var(--bg-ultra-light);
}

/* Fix sticky not working when enable click on expand */
body:has(.wp-lightbox-overlay) #brx-content {
    overflow: initial;
}