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

/*
--bricks-color-vqfvms: #fffae6;
--bricks-color-pfzzdd: #ffeb9a;
--bricks-color-hryokh: #dedb4e; 
--bricks-color-aeioco: #fecc02; //primary
--bricks-color-gyuaej: #eb8f01;
--bricks-color-aoqztg: #855800;
--bricks-color-dyinbf: #eeeae7;
--bricks-color-yftoit: #251d39;

*/

/** 
 * 0. Global
 * */
.font-400 {
	font-weight: 400;
}

strong {
	font-weight: 600;
}


/** 
 * 1. Hero Homepage 
 * */
@media screen and (max-width: 1300px) {
	.hero-image-1,
	.hero-image-4 {
		width: 180px !important;
	}
	.hero-image-2,
	.hero-image-3 {
		width: 160px !important;
	}
	.hero-image-2 {
		left: 8% !important;
	}
	.hero-image-4 {
		right: 6% !important;
	}
}
@media screen and (max-width: 1050px) {
	.hero-image-1,
	.hero-image-4 {
		width: 150px !important;
	}
	.hero-image-2,
	.hero-image-3 {
		width: 130px !important;
	}
	.hero-image-2 {
		left: 4% !important;
	}
	.hero-image-4 {
		right: 2% !important;
	}
}
@media screen and (max-width: 900px) {
	.hero-image-2,
	.hero-image-3 {
		opacity: 0.15
	}
	.hero-image-1,
	.hero-image-4 {
		opacity: 0.25
	}
}


/** 
 * 2. Related Product
 * */
.p-related-products {
	display: flex;
	align-items: center;
	gap: 16px;
	img {
		aspect-ratio: 80 / 100;
		width: 80px;
		height: auto;
		object-fit: scale-down;
	}
	.p-related-products__price {
		margin-top: var(--p-margin-xs);
	}
	.p-related-products__price,
	.p-related-products__name {
		color: var(--bricks-color-dubswq);
	}
	@media screen and (max-width: 1000px) {
		gap: 12px;
		img {
			width: 55px;
		}
		.p-related-products__price,
		.p-related-products__name {
			font-size: 14px;
		}
	}
	@media screen and (max-width: 500px) {
		gap: 12px;
		img {
			width: 40px;
		}
		.p-related-products__price,
		.p-related-products__name {
			font-size: 10px;
		}
	}
}


/** 
 * 3. Reviews
 * */
 .cr-all-reviews-shortcode {
	display: flex;
	flex-wrap: wrap;
	gap: 24px 100px;
	.cr-ajax-search,
	.cr-count-row {
		display: none;
	}
	.cr-review-form-wrap {
		flex: 1;
	}
	.cr-summaryBox-wrap {
		max-width: 226px;
		height: fit-content;
		gap: 64px;
		align-items: flex-start;
		background-color: transparent;
		.cr-overall-rating-wrap,
		.cr-summary-separator-side,
		.cr-summary-separator {
			display: none !important;
		}
		.ivole-summaryBox {
			padding: 0 !important;
			width: 100% !important;
		}
		.cr-add-review-wrap {
			width: 100% !important;
		}
	}
	.commentlist {
		padding: 0 !important;
		flex: 1;
	}
	.cr-all-reviews-add-review,
	.cr-review-form-continue,
	.cr-review-form-submit,
	.cr-review-form-cancel,
	.cr-show-more-button {
		padding-top: 16px !important;
		padding-right: 32px !important;
		padding-bottom: 16px !important;
		padding-left: 32px !important;
		height: auto !important;
		width: 100% !important;
		background-color: var(--bricks-color-tbexoa) !important;
		color: var(--bricks-color-obtfnl) !important;
		line-height: 1.4 !important;
		text-align: center !important;
		border: 1px solid var(--bricks-color-tbexoa) !important;
		border-radius: 100px !important;
		transition: 250ms ease-in-out;
		&:hover {
			color: var(--bricks-color-tbexoa) !important;
			background-color: transparent !important;
		}
	}
	.cr-review-form-cancel {
		color: var(--bricks-color-dubswq) !important;
		background-color: transparent !important;
		border-color: var(--bricks-color-dubswq) !important;
	}
	.ivole-meter {
		height: 7px;
    	box-shadow: none !important;
		background-color: var(--bricks-color-zzeetm);
		border-radius: 24px !important;
	}
	.ivole-meter-bar {
		box-shadow: none !important;
		background-color: var(--bricks-color-twnxln) !important;
		background: var(--bricks-color-twnxln) !important;
	}
	.comment_container {
		padding: 32px !important;
    	background-color: var(--bricks-color-zpjwhh);
		border-color: var(--bricks-color-zzeetm);
		border-radius: 16px;
		box-sizing: border-box;
	}
	.comment-text {
		padding: 0 !important;
		border: none !important;
	}
	.woocommerce-review__author,
	.woocommerce-review__published-date {
		font-weight: 600 !important;
    	color: var(--bricks-color-dubswq) !important;
	}
	.crstar-rating-svg {
		margin: 0;
	}
	.p-comment-rating {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 8px;
	}
	.verified-box {
		margin-left: 16px;
		padding: 10px 24px;
		display: flex;
		align-items: center;
		gap: 12px;
		color: #272727;
		background-color: #FFF;
		border: 1px solid #E8E8E8;
		border-radius: 100px;
		box-sizing: border-box;
	}
	@media screen and (max-width: 600px) {
		.comment_container {
			padding: 16px !important;
		}
		.verified-box {
			margin-left: 0px;
			padding: 5px 14px;
			gap: 8px;
			font-size: 12px;
			svg {
				width: 12px;
				height: auto;
			}
		}
		.review {
			margin-bottom: 14px !important;
		}
		.description {
			font-size: 14px;
		}
		.meta {
			font-size: 14px;
		}
	}
 }

 /** 
 * 4. Cart
 * */
.p-cart {
	h2 {
		font-size: 24px;
	}
	.woocommerce-cart-form {
		padding: 48px 32px;
		border-radius: 16px;
		border: 1px solid #E8E8E8;
		background-color: #f9f9f9;
		box-sizing: border-box;
	}
	.cart_totals {
		padding: 48px 32px;
		margin-top: 24px;
		border-radius: 16px;
		border: 1px solid #E8E8E8;
		background-color: #f9f9f9;
		box-sizing: border-box;
		.shop_table {
			border: none;
		}
		td,
		th {
			padding-bottom: 0;
			color: #272727;
		}
	}
	.woocommerce-Price-amount {
		color: #272727;
	}
	.woocommerce-cart-form__contents {
		th,
		td {
			padding-inline: 16px;
		}
	}
	.product-thumbnail {
		padding-right: 16px;
	}
	.actions {
		padding-top: 32px;
	}
	.variation {
		font-size: 12px;
	}
	.action,
	.qty {
		border: none !important;
	}
	.action {
		&:hover {
			color: var(--bricks-color-tbexoa);
		}
	}
	.quantity {
		max-width: 120px;
		background-color: #FFFFFF;
		border: 1px solid #E8E8E8;
		border-radius: 100px;
	}
	.coupon {
		.input-text {
			padding: 8px 16px;
			border-radius: 100px;
			border: 1px solid #E8E8E8;
		}
	}
	.checkout-button {
		font-size: 16px;
	}
	.woocommerce-shipping-totals {
		display: none;
	}
	@media screen and (max-width: 640px) {
		.woocommerce-cart-form {
			padding: 24px 16px;
		}
		.actions {
			padding: 16px 0 0 0 !important;
			.input-text {
				padding: 2px 16px;
			}
		}
		.cart_totals {
			padding: 24px 16px;
		}
	}
}

 /** 
 * 5. Checkout
 * */
 .p-checkout {
	.woocommerce-info {
		margin-bottom: 8px;
	}
	h3,
	h4 {
		margin-bottom: 8px;
		font-size: 24px;
	}
	.woocommerce-checkout {
		margin-top: 48px;
		display: flex;
		gap: 100px;
	}
	.col2-set {
		flex: 1;
		width: 100%;
	}
	.order-review-card {
		flex: 1;
		width: 100%;
		height: fit-content;
		max-width: 480px;
		padding: 48px 32px;
		border-radius: 16px;
		border: 1px solid #E8E8E8;
		background-color: #f9f9f9;
		box-sizing: border-box;
	}
	.woocommerce-checkout-review-order-table {
		border: none;
		thead {
			display: none;
		}
		td {
			padding: 0;
			border: none;
		}
		.product-name {
			padding-top: 16px;
			width: 110px;
		}
		.product-quantity {
			font-size: 12px;
		}
		.attachment-100x100 {
			width: 64px;
			height: 64px;
		}
		.variation {
			display: none;
		}
		.product-total {
			padding-top: 16px;
			color: #272727;
			font-size: 14px;
		}
		.woocommerce-Price-amount {
			font-size: 16px;
			font-weight: 600;
		}
	}
	.cart_item {
		.woocommerce-Price-amount {
			margin-top: 6px;
			display: block;
		}
	}
	.cart-subtotal {
		th,
		td {
			padding: 24px 0 0 0;
			color: #272727;
		}
		td {
			text-align: right;
		}
	}
	.order-total,
	.woocommerce-shipping-totals,
	.cart-discount,
	.fee {
		th,
		td {
			padding: 14px 0 0 0;
			color: #272727;
		}
		td {
			text-align: right;
		}
	}
	tfoot {
		border: none;
	}
	/* tfoot {
		th,
		td {
			padding: 16px 0 0 0;
		}
	} */
	.input-text {
		padding: 4px 16px;
		border-radius: 100px;
	}
	label {
		color: #272727;
		font-weight: 400;
	}
	.woocommerce-billing-fields__field-wrapper {
		margin-top: 24px;
	}
	[type="checkbox"] {
		flex-shrink: 0;
		appearance: none;
		border: none;
		width: 18px;
		height: 18px;
		padding: 0;
		background-image: url('/wp-content/uploads/2025/09/p-checkbox-unchecked.svg');
		&:checked {
			  background-image: url('/wp-content/uploads/2025/09/p-checkbox-checked.svg');
		}
	}
	.woocommerce-account-fields {
		margin-top: 24px;
		.woocommerce-form__label-for-checkbox {
    		display: flex;
			align-items: center;
			gap: 10px;
			line-height: 1.5;
		}
		.woocommerce-form__input {
			transform: translateY(-1px);
		}
	}
	.woocommerce-shipping-fields {
		margin-top: 0px;
		h3 {
			font-size: 16px;
			* {
				font-size: inherit;
			}
		}
		.woocommerce-form__label-for-checkbox {
			display: flex;
			gap: 12px;
		}
		.woocommerce-form__input {
			position: static;
			transform: none;
		}
	}
	.woocommerce-additional-fields {
		margin-top: 24px;
		textarea {
			border-radius: 16px;
		}
	}
	.select2-selection {
		height: 50px;
		border-radius: 100px;
	}
	.select2-selection__rendered {
		padding-inline: 16px;
		height: 50px;
    	line-height: 50px;
		border-radius: 100px;
	}
	.select2-selection__arrow {
		width: 50px;
		background-image: url('/wp-content/uploads/2025/09/ikona-chevron-down.svg');
		background-size: 16px 16px;
		background-position: center;
		background-repeat: no-repeat;
		b {
			display: none;
		}
	}
	.custom-shipping-table,
	.wc_payment_methods {
		th {
			display: none;
		}
		li {
			position: relative;
		}
		label {
			padding: 16px 16px 16px 40px;
			margin: 0;
			text-align: left;
			border-radius: 100px;
			box-sizing: border-box;
			background-color: #f9f9f9;
			border: 1px solid #E8E8E8;
		}
		.shipping_method,
		.input-radio {
			position: absolute;
			top: 28px;
			left: 16px;
			transform: translateY(-50%);
			&:checked {
				+label {
					border-color: var(--bricks-color-tbexoa);
				}
			}
		}
	}
	.custom-checkout-payment {
		margin-top: 24px;
	}
	.woocommerce-checkout-payment {
		margin-top: 14px;
		padding: 0;
		border: none;
	}
	.woocommerce-terms-and-conditions-wrapper {
		margin-top: 14px;
		.woocommerce-form__label {
			display: flex;
			gap: 12px;
		}
		input {
			margin: 0 !important;
		}
	}
	.button {
		margin-top: 24px;
		font-size: 16px;
	}
	.woocommerce-form-login,
	.woocommerce-form-coupon {
		margin-block: 12px;
		padding: 24px;
		background-color: #f9f9f9;
		border: 1px solid #E8E8E8;
		border-radius: 16px;
		box-sizing: border-box;
		.woocommerce-form__label {
			display: flex;
			align-items: center;
			gap: 12px;
		}
		.button {
			margin: 0;
			font-size: 14px;
		}
	}
	.woocommerce-form-coupon {
		display: flex;
		gap: 16px;
		.form-row-first {
			flex: 1;
		}
		.form-row-last {
			width: fit-content;
		}
		.input-text {
			height: 100%;
		}
	}
	@media screen and (max-width: 1000px) {
		.woocommerce-checkout {
			flex-direction: column-reverse;
			gap: 32px;
		}
		.order-review-card {
			max-width: 100%;
		}
	}
	@media screen and (max-width: 450px) {
		.order-review-card {
			padding: 24px 16px;
		}
		.woocommerce-checkout {
			margin-top: 24px;
		}
		.woocommerce-checkout-review-order-table {
			.attachment-100x100 {
				width: 48px;
				height: auto;
			}
			.product-name {
				width: 85px;
			}
			.product-total {
				font-size: 12px;
			}
			.woocommerce-Price-amount {
				font-size: 14px;
			}
		}
		.woocommerce-info {
			display: flex;
			flex-direction: column;
			text-align: center;
		}
		.woocommerce-form-login,
		.woocommerce-form-coupon {
			padding: 16px;
		}
		.woocommerce-form-login {
			.woocommerce-button {
				margin-top: 6px;
			}
		}
		.woocommerce-form-coupon {
			flex-direction: column;
			.form-row-last {
				width: 100%;
			}
			.button {
				width: 100%;
			}
			input {
				height: 50px !important;
			}
		}
	}
}

.select2-results__option--highlighted {
	background-color: #272727 !important;
}

.p-filter-special {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  [type="checkbox"] {
    display: none;
    +.brx-option-text {
    display: flex;
    align-items: center;
    gap: 12px;
      &:before {
        content: '';
        width: 16px;
        height: 16px;
        background-size: 16px 16px;
        background-size: contain;
        background-repeat: no-repeat;
      }
    }
  }
  label {
    padding: 10px 24px;
    transition: 250ms ease-in-out;
    cursor: pointer;
    border: 1px solid #E8E8E8;
    border-radius: 100px;
    box-sizing: border-box;
    &:hover,
    &.brx-option-active {
      color: white !important;
      background-color: var(--bricks-color-tbexoa) !important;
      border-color: var(--bricks-color-tbexoa) !important;
      .brx-option-text {
        &:before {
          filter: brightness(0) invert(1);
        }
      }
    }
    .brx-option-text {
      transition: 250ms ease-in-out;
    }
  }
  [value="do-biura"] {
    +.brx-option-text {
      &:before {
        background-image: url(https://magiczneperfumy.syhi.pl/wp-content/uploads/2025/09/ikona-do-biura-pop.svg);
      }
    }
  }
  [value="codzienne"] {
    +.brx-option-text {
      &:before {
        background-image: url(https://magiczneperfumy.syhi.pl/wp-content/uploads/2025/09/ikona-codzienne-pop.svg);
      }
    }
  }
  [value="dla-aktywnych"] {
    +.brx-option-text {
      &:before {
        background-image: url(https://magiczneperfumy.syhi.pl/wp-content/uploads/2025/09/ikona-dla-aktywnych-pop.svg);
      }
    }
  }
  [value="na-randke"] {
    +.brx-option-text {
      &:before {
        background-image: url(https://magiczneperfumy.syhi.pl/wp-content/uploads/2025/09/ikona-na-randke-pop.svg);
      }
    }
  }
  [value="na-wieczor"] {
    +.brx-option-text {
      &:before {
        background-image: url(https://magiczneperfumy.syhi.pl/wp-content/uploads/2025/09/ikona-na-wieczor-pop.svg);
      }
    }
  }
  [value="specjalna-okazja"] {
    +.brx-option-text {
      &:before {
        background-image: url(https://magiczneperfumy.syhi.pl/wp-content/uploads/2025/09/ikona-na-wieczor-pop.svg);
      }
    }
  }
}