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


/* Ändra färgen på "Privat:" i produkttiteln */
.woocommerce-loop-product__title::first-letter {
  color: inherit; /* se till att inte bara första bokstaven får färg */
}

/* Markera ordet 'Privat:' */
.woocommerce-loop-product__title {
  color: inherit; /* produkttiteln i övrigt */
}

.woocommerce-loop-product__title:before {
  content: "";
}

.woocommerce-loop-product__title {
  display: inline-block;
}

.woocommerce-loop-product__title {
  /* inget här ännu */
}

/* Targeta själva prefixet */
.woocommerce-loop-product__title::before {
  content: "";
}

/* Smart variant med attribute selector */
.woocommerce-loop-product__title:has(> strong) {
  /* backup ifall markup förändras */
}

/* Regex-aktigt trick med CSS only: */
.woocommerce-loop-product__title {
  /* titeln har texten "Privat:" i början */
}

.woocommerce-loop-product__title {
  /* fallback styling */
}

.woocommerce-loop-product__title {
  /* vi byter lösning → enklast med PHP istället */
}

.product-status-private {
  color: var(--secondary);
}



.custom-table {
	border-collapse: collapse;
	width: 100%;
}
.custom-table th, .custom-table td {
	border: 1px solid #d1d1d1; /* Lighter grey borders */
	padding: 10px 20px; /* More padding left & right, less top & bottom */
	text-align: left;
}
.custom-table th {
	background-color: #f2f2f2;
}

.brx-body {
	min-height: 100svh;
}

.woocommerce-product-attributes-item {
	vertical-align: top;
}

.woocommerce-terms-and-conditions h2,
.woocommerce-terms-and-conditions h3 {
	margin-bottom: var(--space-xs);
}

.woocommerce-tabs .wc-tabs .active {
	color: var(--primary);
}


span.shade {
	 background: -webkit-linear-gradient(var(--primary), var(--primary-dark));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.skewed-button {
	border: none; /* No border */
	cursor: pointer; /* Cursor appears as a pointer on hover */
	transform: skew(-10deg); /* Skew the button slightly */
	transition: transform 0.3s ease; /* Smooth transition for hover effect */
	text-transform: uppercase;
}

.skewed-button:hover {
	transform: skew(-10deg) scale(1); /* Slightly increase size on hover */
}



/* Avoid FUC on frontend */
.bricks-is-frontend .animation-trigger{
  opacity:0;
}

.animation-trigger {
    --delay: attr(data-delay number);
}
 
/* Animated Class*/
.animate {
    animation-name: fadeAnimation;
    animation-delay: calc(var(--delay, 1) * 100ms);
    animation-duration: var(--duration, 800ms);
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
}
 
/* Change translate Origin */
.animation--left-to-right{
  --translate: -40px,0,0;
}
.animation--right-to-left{
  --translate: 40px,0,0;
}
.animation--top-to-bottom{
  --translate: 0,-40px,0;
}
.animation--bottom-to-top{
  --translate: 0,40px,0;
}
 
/* Keyframes */
@keyframes fadeAnimation{
  from{
    transform: translate3d(var(--translate));
  }
  to{
    opacity: 1;
    transform: translate3d(0,0,0);
  }
}