/*
 Theme Name:   Gubt
 Theme URI:    https://bricksbuilder.io/
 Description:  Use this child theme to extend Bricks.
 Author:       Jonnywp
 Author URI:   https://jonnywp.com/
 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;
}

/* Scroll offset */
html {
	scroll-padding-top: 144px;
	scroll-behavior: smooth;
}

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

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

/* 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;
}

/* Form captcha */
.form-group.captcha {
	margin-block-end: 1em;
}

.wsf-field iframe {
	min-width: 100%!important;
	width: 100%!important;
}

/** Ws Form **/
.wsf-form .wsf-field-wrapper:last-child {
	margin-bottom: 0;
}

/** product table style **/
.product-table-container {

	--border-width: 1px;
	--table-cell-padding-block: .75em;
	--table-cell-padding-inline: 1em;
	--table-head-bg-color: var(--bg-light);
	--table-head-text-color: var(--text-dark);

	/* 	margin: 0 auto; */
	background-color: white;
	overflow: hidden;

}

.product-table-container table {
	width: 100%;
	border-collapse: collapse;
}

.product-table-container thead {
	background-color: var(--table-head-bg-color, #e0e0e0);
	color: var(--table-head-text-color, #333);
}

.product-table-container th {
	padding: var(--table-cell-padding-block, .75em) var(--table-cell-padding-inline, 1em);
	text-align: left;
	font-weight: 600;
	font-size: var(--text-m, 15px);
	letter-spacing: 0.5px;
	border: var(--border-width, 1px) solid #d0d0d0;
}

.product-table-container tbody tr {
	border-bottom: var(--border-width, 1px) solid #d0d0d0;
	transition: background-color 0.2s;
}

.product-table-container tbody tr:hover {
	background-color: var(--bg-ultra-light, #f8f9fa);
}

.product-table-container td {
	padding: var(--table-cell-padding-block, .75em) var(--table-cell-padding-inline, 1em);
	font-size: var(--text-s, 15px);
	line-height: 1.6;
/* 	color: #333; */
	border: var(--border-width, 1px) solid #d0d0d0;
}

/* Responsive Design */
@media screen and (max-width: 768px) {
	.product-table-container table {
		border: 0;
	}

	.product-table-container table thead {
		display: none;
	}

	.product-table-container table tbody tr {
		display: block;
		margin-bottom: 20px;
		border: var(--border-width, 1px) solid #e0e0e0;
		overflow: hidden;
	}

	.product-table-container table tbody tr:hover {
		background-color: white;
	}

	.product-table-container table td {
		display: grid;
		grid-template-columns: 140px 1fr;
		gap: 1em;
		text-align: left;
		padding: var(--table-cell-padding-block, .75em) var(--table-cell-padding-inline, 1em);
		border-bottom: var(--border-width, 1px) solid #f0f0f0;
	}

/* 	.product-table-container table td:last-child {
		border-bottom: none;
	} */

	.product-table-container table td::before {
		content: attr(data-label);
		font-weight: 600;
		color: #333;
		font-size: var(--text-s, 12px);
		letter-spacing: 0.5px;
		word-wrap: break-word;
	}

	.product-table-container table td:first-child {
		grid-template-columns: 1fr;
		background-color: #e0e0e0;
		color: #333;
		font-weight: 600;
	}

	.product-table-container table td:first-child::before {
		content: none;
	}
}

@media screen and (max-width: 480px) {
	.product-table-container table td {
		gap: 12px;
		padding: var(--table-cell-padding-block, .75em) var(--table-cell-padding-inline, 1em);
		font-size: var(--text-s, 13px);
	}

	.product-table-container table td::before {
		font-size: var(--text-xs, 11px);
	}
}
/** End of product table **/


