/*
 Theme Name:   Hello Elementor Child
 Theme URI:    https://example.com/hello-elementor-child
 Description:  Ein Child-Theme für Hello Elementor
 Author:       Dein Name
 Author URI:   https://example.com
 Template:     hello-elementor
 Version:      1.0.0
 Text Domain:  hello-elementor-child
*/

/* Hier kannst du deine eigenen CSS-Styles hinzufügen */


* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

html {
	overflow-x: hidden !important;
}

body {
	--spacing-large: 2.618rem;
	--spacing-medium: 1.618rem;
	--spacing-small: 1rem;
}

/* Page View Transition
***********************************************************/
@view-transition {
	navigation: auto;
}

::view-transition-group(*) {
	animation-duration: .5s;
}

::view-transition-new(root) {
	animation-name: fade-in;
}

@keyframes fade-in {
	from {
		opacity: 0;
	}
}

/* Custom Scrollbar
***********************************************************/
::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

::-webkit-scrollbar-track {
    background: #D9D9D9;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    background: #000000;
    border-radius: 10px;
    border: 3px solid #D9D9D9;
}

::-webkit-scrollbar-thumb:hover {
    background: #000000;
}

* {
    scrollbar-width: thin;
    scrollbar-color: #000000 #D9D9D9;
}

.scrollable {
    -ms-overflow-style: scrollbar;
}

body:has(#wpadminbar) header {
	top: 32px;
}

body {
	overflow-x: hidden;
}

/* Header
***********************************************************/
body {
	&:not(.page-id-104, .page-id-178772, .woocommerce-cart, .woocommerce-checkout) {
		padding-block-start: var(--hdr-block-size);
		padding-block-start: 132px;
	}
}

header {
	transition: all 0.4s ease-in-out;

	position: fixed;
	inset: 0;
	inset-block-end: auto;
	z-index: 9999;
	background-color: var( --e-global-color-ea6a3f0 );

	.elementor-icon-wrapper,
	.elementor-widget-theme-site-logo a,
	.elementor-menu-cart__wrapper,
	.elementor-menu-cart__toggle {
		display: grid;
	}

	/* Fibo Search */
	.elementor-widget-fibosearch {

		input[type="search"] {
			border-radius: 100vw !important;
			padding-block: 1rem !important;
			height: auto !important;
			font-family: var(--e-global-typography-accent-font-family), serif;
			font-size: var(--e-global-typography-accent-font-size);
			letter-spacing: var(--e-global-typography-accent-letter-spacing);
			font-style: normal;
			background: transparent !important;

			&::placeholder {
				font: inherit !important;
			}
		}

		button[type="submit"] {
			background: transparent !important;

			&::before {
				display: none;
			}
		}
	}
}

.page-id-104,
.page-id-178772 {
	header:not(.sticky) {
		background-color: transparent;
		
		/* Menu Icon */
		.menu-icon {
			:is(svg, path) {
				fill: var( --e-global-color-ea6a3f0 ) !important;
			}
		}
		
		/* Logo */
		.elementor-widget-theme-site-logo {
			filter: brightness(0) invert(1);
		}

		/* Fibo Search */
		.elementor-widget-fibosearch {
			input[type="search"] {
				border-color: var( --e-global-color-ea6a3f0 );
				color: #fff !important;

				&::placeholder {
					color: var( --e-global-color-ea6a3f0 );
				}
			}

			/* Close Button */
			.dgwt-wcas-close :is(svg, path) {
				fill: var( --e-global-color-ea6a3f0 ) !important;
			}

			button[type="submit"] :is(svg, path) {
				fill: var( --e-global-color-ea6a3f0 ) !important;
			}
		}

		/* Wishlist Icon */
		.wishlist {
			:is(svg, path) {
				fill: var( --e-global-color-ea6a3f0 ) !important;
			}
		}

		/* Mini Cart */
		.elementor-widget-woocommerce-menu-cart {
			.elementor-button-icon-qty {
				color: var( --e-global-color-0b66377 ) !important;
				background: var( --e-global-color-ea6a3f0 ) !important;
			}

			:is(svg, path) {
				fill: var( --e-global-color-ea6a3f0 ) !important;
			}
		}
		
		/* Desktop Main Menu */
		.elementor-widget-n-menu {
			ul.e-n-menu-heading > li > .e-n-menu-title {
				a,
				span,
				button span i {
					color: var( --e-global-color-ea6a3f0 ) !important;
				}
			}
		}

		/* Contact Menu */
		.contact-list {
			a span {
				color: var( --e-global-color-ea6a3f0 ) !important;
			}

			:is(svg, path) {
				fill: var( --e-global-color-ea6a3f0 ) !important;
			}
		}
		
		
		&.sticky,
		&:hover,
		&:focus,
		&:focus-within {
			background-color: var( --e-global-color-ea6a3f0 );

			/* Menu Icon */
			.menu-icon {
				:is(svg, path) {
					fill: var( --e-global-color-0b66377 ) !important;
				}
			}

			/* Logo */
			.elementor-widget-theme-site-logo {
				filter: brightness(1) invert(0);
			}

			/* Fibo Search */
			.elementor-widget-fibosearch {
				input[type="search"] {
					border-color: var( --e-global-color-0b66377 );
					color: var( --e-global-color-0b66377 ) !important;

					&::placeholder {
						color: var( --e-global-color-0b66377 );
					}
				}

				/* Close Button */
				.dgwt-wcas-close :is(svg, path) {
					fill: var( --e-global-color-0b66377 ) !important;
				}

				button[type="submit"] :is(svg, path) {
					fill: var( --e-global-color-0b66377 ) !important;
				}
			}

			/* Wishlist Icon */
			.wishlist {
				:is(svg, path) {
					fill: var( --e-global-color-0b66377 ) !important;
				}
			}

			/* Mini Cart */
			.elementor-widget-woocommerce-menu-cart {
				.elementor-button-icon-qty {
					color: var( --e-global-color-ea6a3f0 ) !important;
					background: var( --e-global-color-0b66377 ) !important;
				}

				:is(svg, path) {
					fill: var( --e-global-color-0b66377 ) !important;
				}
			}

			/* Desktop Main Menu */
			.elementor-widget-n-menu {
				ul.e-n-menu-heading > li > .e-n-menu-title {
					a,
					span,
					button span i {
						color: var( --e-global-color-0b66377 ) !important;
					}
				}
			}

			/* Contact Menu */
			.contact-list {
				a span {
					color: var( --e-global-color-0b66377 ) !important;
				}

				:is(svg, path) {
					fill: var( --e-global-color-0b66377 ) !important;
				}
			}
		}
	}
}


.dgwt-wcas-search-wrapp.dgwt-wcas-search-darkoverl-on .dgwt-wcas-search-form {
	background: transparent !important;
}


/* Main
***********************************************************/
main {
	min-block-size: calc(100svh - var(--hdr-block-size, 0px) - var(--ftr-block-size, 0px));
}

/* Ring Size Selector 
***********************************************************/
.wcr-size-selector {
	display: grid;
	gap: 0.75rem;

	>* {
		inline-size: fit-content;
	}

	.wcr-size-selector__field {
		display: grid;
		gap: 0.25rem;
		background: var(--e-global-color-ea6a3f0) !important;
		padding: 1rem;
		box-shadow: 0px 3px 7px 0px rgba(0, 0, 0, 0.11);
	}

	.wcr-size-selector__label {
		font-size: var(--e-global-typography-f90a76f-font-size);
		font-family: var(--e-global-typography-accent-font-family), serif;
		text-transform: var(--e-global-typography-accent-text-transform);
		letter-spacing: var(--e-global-typography-accent-letter-spacing);
		font-weight: var(--e-global-typography-accent-font-weight);
		color: var(--forms-labels-color, #69727d);
		margin-bottom: var(--forms-label-spacing, 3px);
	}

	.wcr-size-selector__info p {
		color: var(--forms-labels-color, #69727d);
		margin-bottom: var(--forms-label-spacing, 3px);
	}

	.wcr-size-selector__select {
		margin-block-start: 0.5rem;
		border: 1px solid var(--e-global-color-dd5352f);
		padding: 10px 12px;
		font-family: var(--e-global-typography-f90a76f-font-family), serif;
		font-size: var(--e-global-typography-f90a76f-font-size);
		font-weight: var(--e-global-typography-f90a76f-font-weight);
		line-height: var(--e-global-typography-f90a76f-line-height);
	}

	.wcr-size-selector__link {
		font-size: 1rem;
		margin-inline-start: 0.25rem;
	}
}

/* Ring Size Variation in Mini-Cart, Cart, Checkout */
.variation:has(.variation-Ringgre) {
	margin-block-start: 0 !important;

	.variation-Ringgre {
		font-size: 10px !important;
		line-height: 1 !important;
	}
}

.variation {
	margin-block-start: 0 !important;

	dt, dd {
		font-size: 10px !important;
		line-height: 1 !important;
	}
}


.woocommerce:where(body:not(.woocommerce-uses-block-theme)) div.product .stock {
    color: #4ad13c !important;
}


.woocommerce-product-details__short-description {
	display: grid;
	gap: 1rem;
}



/* Product Page Wishlist Popup
***********************************************************/
.tinv-wishlist {
	.button {
		font-family: var(--e-global-typography-3cd8348-font-family), serif !important;
		font-size: var(--e-global-typography-3cd8348-font-size) !important;
		text-transform: var(--e-global-typography-3cd8348-text-transform) !important;
		letter-spacing: var(--e-global-typography-3cd8348-letter-spacing) !important;
		background-color: var(--e-global-color-a33b471) !important;
		color: var(--e-global-color-ea6a3f0) !important;
		border-style: solid !important;
		border-width: 1px 1px 1px 1px !important;
		border-color: var(--e-global-color-a33b471) !important;
		border-radius: 0px 0px 0px 0px !important;
		padding: 10px 12px 10px 12px !important;
		

		&:hover,
		:focus {
			background-color: var(--e-global-color-41ec9c7) !important;
		}
	}
}

/* Wishlist Page Table */
.tinv-wishlist .tinvwl-table-manage-list th {
	text-align: start;
}

/* Form
***********************************************************/
input {
	accent-color: var(--e-global-color-f2ccfd0);
}

/* Typographie
***********************************************************/
h1.elementor-heading-title,
.h1 .elementor-heading-title,
h1, .h1,

h2.elementor-heading-title,
.h2 .elementor-heading-title,
h2, .h2,

h3.elementor-heading-title,
.h3 .elementor-heading-title,
h3, .h3,

h4.elementor-heading-title,
.h4 .elementor-heading-title,
h4, .h4,

h5.elementor-heading-title,
.h5 .elementor-heading-title,
h5, .h5,

h6.elementor-heading-title, 
.h6 .elementor-heading-title,
h6, .h6 {
	text-wrap: balance;
	margin-block-start: var(--spacing-medium);
	margin-block-end: var(--spacing-small);
	
	/* Typo Ligaturen entfernen */
	font-variant-ligatures: none;
	-webkit-font-variant-ligatures: none;
	font-feature-settings: "liga" 0, "clig" 0;
}

h1:first-child.elementor-heading-title,
.h1 .elementor-heading-title:first-child,
h1:first-child, .h1:first-child,

h2:first-child.elementor-heading-title,
.h2 .elementor-heading-title:first-child,
h2:first-child, .h2:first-child,

h3:first-child.elementor-heading-title,
.h3 .elementor-heading-title:first-child,
h3:first-child, .h3:first-child,

h4:first-child.elementor-heading-title,
.h4 .elementor-heading-title:first-child,
h4:first-child, .h4:first-child,

h5:first-child.elementor-heading-title,
.h5 .elementor-heading-title:first-child,
h5:first-child, .h5:first-child,

h6:first-child.elementor-heading-title, 
.h6 .elementor-heading-title:first-child,
h6:first-child, .h6:first-child {
	margin-block-start: 0;
}

h1.elementor-heading-title ,
.h1 .elementor-heading-title,
h1, .h1 {
	margin-block-start: var(--spacing-large);
	margin-block-end: var(--spacing-medium);
}

h2.elementor-heading-title ,
.h2 .elementor-heading-title,
h2, .h2 {
	margin-block-start: var(--spacing-large);
	margin-block-end: var(--spacing-medium);
}

h3.elementor-heading-title ,
.h3 .elementor-heading-title,
h3, .h3 {
	margin-block-start: var(--spacing-medium);
	margin-block-end: var(--spacing-small);
}

h4.elementor-heading-title ,
.h4 .elementor-heading-title,
h4, .h4 {
	margin-block-start: var(--spacing-medium);
	margin-block-end: var(--spacing-small);
}

h5.elementor-heading-title ,
.h5 .elementor-heading-title,
h5, .h5 {
	margin-block-start: var(--spacing-small);
	margin-block-end: var(--spacing-small);
}

h6.elementor-heading-title , 
.h6 .elementor-heading-title,
h6, .h6 {
	margin-block-start: var(--spacing-small);
	margin-block-end: var(--spacing-small);
}

p {
	margin-block-end: var(--spacing-small);
	text-wrap: pretty;
}

/* Link */
a[class] {
  text-decoration: none !important;
}

main {
	a.elementor-button {
		margin-block-start: var(--spacing-small);
	}
}

/* Links nur innerhalb von <p> (Underline + Hover-Shift), Underline-Dicke dynamisch */
main p a:not(.elementor-button):not([class*="button"]) {
	display: inline-block;
	text-decoration: underline;
	text-underline-offset: 0.15em;
	text-decoration-thickness: clamp(1px, 0.08em, 2px);
	transition: transform 0.15s ease;
}

/* Hover: 2px nach oben (nur <p>) */
main p a:not(.elementor-button):not([class*="button"]):hover {
	transform: translateY(-2px);
}

/* Sicherheit: Navigation/Footer Links nicht unterstreichen */
header a,
nav a,
.elementor-nav-menu a,
footer a {
	text-decoration: none;
}


/* Unordered List */
ul {

	&:not([class]) {
		--primary-color: var(--e-global-color-9650b82);
		list-style: none;
		--checklist-size: 1em;
		margin-block-end: var(--spacing-small);
		
		li {
			position: relative;
			margin-inline-start: calc(1.5 * var(--checklist-size)) !important;
			
			&::before {
				content: '';
				position: absolute;
				top: 3px;
				background: var(--primary-color);
				aspect-ratio: 1;
				width: var(--checklist-size);
				mask-repeat: no-repeat;
				mask-position: center center;
				margin-inline-start: calc(-1.5 * var(--checklist-size));
				mask-size: 6px;
				mask-image: url(/wp-content/themes/hello-elementor-child/assets/icons/list-icon.svg);
			}
		}
	}
}

/* Ordered List */
ol {
	&.elementor-toc__list-wrapper {
		li .elementor-toc__list-item-text-wrapper::before {
			display: none;
		}
	}
	
	&:not([class]) {
		--primary-color: var(--e-global-color-f2ccfd0);
		--checklist-size: 1em;
		list-style: none;
		counter-reset: list-item;
		margin-block-end: var(--spacing-small);

		li {
			counter-increment: list-item;
			position: relative;
			margin-inline-start: calc(1.5 * var(--checklist-size));

			&::before {
				content: counters(list-item, ".") ". ";
				position: absolute;
				color: var(--primary-color);
				margin-inline-start: calc(-1.5 * var(--checklist-size));
			}

			ol {
				counter-reset: list-item;
			}
		}
	}
}

/* Text selection */
::selection {
	color: #fff;
	background-color: #000000;
}

/*Light Buttons Hover Effect*/
.buttonhover .elementor-button:hover {
  padding: 0.5rem 1rem !important;
}

/*Icon List Hover Effect*/
.hover-shift .elementor-icon-list-item{
  transition: transform 0.3s ease;
}
.hover-shift .elementor-icon-list-item:hover{
  transform: translateX(4px);
}

/* Print CSS Product Page
***********************************************************/
@media print {
	.single-product {
		
		.product-gallery-container,
		.product-gallery-container * {
			all: unset;
		}
		
		.main-hdr .logo-container .menu-icon,
		.main-hdr .logo-container .elementor-widget-off-canvas,
		.main-hdr .search-container,
		.main-hdr .icon-nav-container,
		
		.product-gallery-container .woocommerce-product-gallery__image:not(.flex-active-slide),
		
		.product-gallery-container .flex-control-nav,
		
		.product-content .elementor-widget-breadcrumbs,
		
		.product-content .elementor-widget-icon-list,
		
		.product-content .elementor-widget-woocommerce-product-add-to-cart,
		
		.product-content .elementor-widget-divider,
		
		.product-content .elementor-widget-woocommerce-product-meta,
		
		.product-content .elementor-widget-html,
		
		.product-content .elementor-widget-share-buttons,
		
		.side-cards,
		
		.related-products,
		
		footer .advantages,
		
		footer .copyright-ftr,
		
		footer {
			display: none !important;
		}
		
		.product-gallery-container .woocommerce-product-gallery__image.flex-active-slide {
			max-width: 200px;
		}
	}
}