/* Organela day tokens + global Elementor/Hello brand shield */

:root {
	color-scheme: light;
	--op-green: #3D8C35;
	--op-green-deep: #2A6C26;
	--op-green-soft: rgba(61, 140, 53, 0.12);
	--op-orange: #FA6619;
	--op-orange-deep: #e05510;
	--op-bg: #ffffff;
	--op-bg-elevated: #ffffff;
	--op-bg-soft: #f7faf6;
	--op-bg-muted: #eef4eb;
	--op-text: #111111;
	--op-text-muted: #5c6b58;
	--op-ink: #1a2418;
	--op-border: rgba(0, 0, 0, 0.1);
	--op-border-strong: rgba(0, 0, 0, 0.14);
	--op-shadow: rgba(0, 0, 0, 0.12);
	--op-overlay: rgba(17, 17, 17, 0.42);
	--op-input-bg: #ffffff;
	--op-danger: #dc2626;
	--op-danger-soft: #fef2f2;
	--op-footer-grad-1: #f7faf6;
	--op-footer-grad-2: #eef4eb;
	--op-footer-grad-3: #e8f0e4;
	--op-card: #ffffff;
	--op-card-border: #f0f0f0;
	--op-font: 'Raleway', sans-serif;
	--op-display: 'Playfair Display', Georgia, serif;

	/* Force Elementor kit tokens to Organela brand (beats Hello pink / old greens) */
	--e-global-color-primary: #3D8C35 !important;
	--e-global-color-secondary: #2A6C26 !important;
	--e-global-color-text: #1a2418 !important;
	--e-global-color-accent: #FA6619 !important;
	--woocommerce: #3D8C35 !important;
	--wc-primary: #3D8C35 !important;
}

html {
	height: 100%;
	background-color: var(--op-bg);
}

body {
	min-height: 100%;
	min-height: 100dvh;
	display: flex;
	flex-direction: column;
	background-color: var(--op-bg) !important;
	color: var(--op-text) !important;
	font-family: var(--op-font) !important;
}

/* Sticky chrome: header top, footer bottom, content fills the middle */
body > .op-header {
	flex: 0 0 auto;
	width: 100%;
}

body > .op-footer {
	flex: 0 0 auto;
	width: 100%;
	margin-top: auto;
}

/* Short pages — grow main surfaces so footer stays at the bottom */
body > main,
body > #content,
body > #page,
body > .site,
body > .elementor,
#op-home,
#op-search,
#op-product,
.op-search.op-home {
	flex: 1 0 auto;
	width: 100%;
}

body > main.site-main,
body > #content.site-main {
	display: flex;
	flex-direction: column;
}

body > main.site-main > .page-content,
body > #content.site-main > .page-content {
	flex: 1 0 auto;
	display: flex;
	flex-direction: column;
	width: 100%;
}

/* Account pages fill remaining chrome; auth (.op-reg) keeps its own full-viewport height */
body > main.site-main .op-acc,
body > #content.site-main .op-acc,
body > main.site-main .op-od,
body > #content.site-main .op-od,
body > main.site-main .op-kontakt,
body > #content.site-main .op-kontakt {
	flex: 1 0 auto;
	width: 100%;
}

/* Login / register — do not crush into sticky-footer flex */
body > main.site-main:has(.op-reg),
body > #content.site-main:has(.op-reg) {
	flex: 0 0 auto;
	display: block;
}

body > main.site-main:has(.op-reg) > .page-content,
body > #content.site-main:has(.op-reg) > .page-content {
	flex: none;
	display: block;
}

/* ========== Global brand shield vs Hello Elementor / Elementor ========== */

/* Kill Hello pink (#c36) + purple hover (#336) */
body a,
body .elementor a,
.elementor-widget a,
.elementor-element a {
	color: var(--op-green) !important;
	text-decoration: none;
}

body a:hover,
body a:focus,
body a:active,
body .elementor a:hover,
body .elementor a:focus,
.elementor-widget a:hover {
	color: var(--op-orange) !important;
}

/* Keep chrome links on local ink */
.op-header a,
.op-footer a,
.op-header__nav a,
.op-cart-drawer a,
.op-header button,
.op-footer button,
.op-reg a.op-reg__brand {
	color: inherit !important;
}

.op-header a:hover,
.op-footer a:hover,
.op-cart-drawer a:hover {
	color: var(--op-green) !important;
}

/* Elementor buttons → Organela green */
.elementor-button,
.elementor-button.elementor-size-sm,
.elementor-button.elementor-size-md,
.elementor-button.elementor-size-lg,
.elementor-button.elementor-size-xl,
a.elementor-button,
.elementor-widget-button .elementor-button,
.elementor-widget-button .elementor-button:visited {
	background-color: var(--op-green) !important;
	border-color: var(--op-green) !important;
	color: #fff !important;
	font-family: var(--op-font) !important;
	font-weight: 700 !important;
	border-radius: 14px !important;
	box-shadow: none !important;
	fill: #fff !important;
}

.elementor-button:hover,
.elementor-button:focus,
a.elementor-button:hover,
.elementor-widget-button .elementor-button:hover {
	background-color: var(--op-green-deep) !important;
	border-color: var(--op-green-deep) !important;
	color: #fff !important;
}

.elementor-button.elementor-button-link {
	background: transparent !important;
	color: var(--op-green) !important;
	border-color: transparent !important;
}

.elementor-button.elementor-button-link:hover {
	background: transparent !important;
	color: var(--op-orange) !important;
}

/* Elementor headings / text use brand ink */
.elementor-heading-title,
.elementor-widget-heading .elementor-heading-title,
.elementor-widget-text-editor,
.elementor-widget-text-editor p,
.elementor-icon-box-title,
.elementor-icon-box-description {
	color: var(--op-ink) !important;
	font-family: var(--op-font) !important;
}

.elementor-widget-heading h1.elementor-heading-title,
.elementor-widget-heading h2.elementor-heading-title {
	font-family: var(--op-display) !important;
	color: #000 !important;
}

/* Elementor icons / icon boxes */
.elementor-icon,
.elementor-view-framed .elementor-icon {
	color: var(--op-green) !important;
	fill: var(--op-green) !important;
	border-color: var(--op-green) !important;
}

.elementor-view-stacked .elementor-icon {
	background-color: var(--op-green) !important;
	color: #fff !important;
	fill: #fff !important;
	border-color: var(--op-green) !important;
}

/* Tabs / accordion accents */
.elementor-widget-n-tabs,
.e-n-tabs {
	--n-tabs-color-accent-fallback: #3D8C35 !important;
	--n-tabs-title-color-active: #3D8C35 !important;
}

.elementor-tab-title,
.elementor-accordion-title,
.elementor-toggle-title {
	color: var(--op-ink) !important;
}

.elementor-tab-title.elementor-active,
.elementor-tab-title.elementor-active a,
.elementor-active.elementor-tab-title {
	color: var(--op-green) !important;
	border-color: var(--op-green) !important;
}

/* Forms inside Elementor */
.elementor-field-group .elementor-field,
.elementor-field-textual,
.elementor-form input:not([type="submit"]):not([type="button"]):not([type="checkbox"]):not([type="radio"]),
.elementor-form textarea,
.elementor-form select {
	border-radius: 14px !important;
	border: 1px solid rgba(61, 140, 53, 0.18) !important;
	background: #fff !important;
	color: var(--op-ink) !important;
	font-family: var(--op-font) !important;
	box-shadow: none !important;
}

.elementor-field-group .elementor-field:focus,
.elementor-form input:focus,
.elementor-form textarea:focus,
.elementor-form select:focus {
	border-color: var(--op-green) !important;
	box-shadow: 0 0 0 4px var(--op-green-soft) !important;
	outline: none !important;
}

.elementor-form .elementor-button[type="submit"] {
	background-color: var(--op-green) !important;
	color: #fff !important;
	border-radius: 14px !important;
}

/* Progress bars */
.elementor-progress-bar {
	background-color: var(--op-green) !important;
}

/* Kill leftover Theme Builder chrome if it still prints */
.elementor-location-header,
.elementor-location-footer,
body.has-op-header header.site-header,
body.has-op-footer footer.site-footer {
	display: none !important;
}

/* WooCommerce brand accents */
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #respond input#submit.alt,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
	background-color: var(--op-green) !important;
	border-color: var(--op-green) !important;
	color: #fff !important;
	font-family: var(--op-font) !important;
	border-radius: 12px !important;
}

.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
	background-color: var(--op-orange) !important;
	border-color: var(--op-orange) !important;
	color: #fff !important;
}

.woocommerce span.onsale,
.woocommerce ul.products li.product .onsale,
.single-product div.product span.onsale {
	background-color: var(--op-orange) !important;
	color: #fff !important;
}

.woocommerce-message,
.woocommerce-info {
	border-top-color: var(--op-green) !important;
}

.woocommerce-message::before,
.woocommerce-info::before {
	color: var(--op-green) !important;
}

.woocommerce .star-rating span {
	color: var(--op-orange) !important;
}

.woocommerce nav.woocommerce-pagination ul li span.current,
.woocommerce nav.woocommerce-pagination ul li a:hover {
	background: var(--op-green) !important;
	color: #fff !important;
}

/* Product titles stay dark, not Hello pink/green link color */
ul.products li.product .woocommerce-loop-product__title,
ul.products li.product h2,
ul.products li.product h3,
.woocommerce ul.products li.product a .woocommerce-loop-product__title {
	color: var(--op-text) !important;
}

ul.products li.product a:hover .woocommerce-loop-product__title {
	color: var(--op-green) !important;
}

/* ——— Floating WooCommerce toasts (bottom-right) ——— */
body:not(.woocommerce-checkout) .woocommerce-notices-wrapper:not(.op-wc-toasts) {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	border: 0 !important;
}

body:not(.woocommerce-checkout) .woocommerce-notices-wrapper:not(.op-wc-toasts) .woocommerce-message,
body:not(.woocommerce-checkout) .woocommerce-notices-wrapper:not(.op-wc-toasts) .woocommerce-info,
body:not(.woocommerce-checkout) .woocommerce-notices-wrapper:not(.op-wc-toasts) .woocommerce-error,
body:not(.woocommerce-checkout) > .woocommerce-message,
body:not(.woocommerce-checkout) > .woocommerce-info,
body:not(.woocommerce-checkout) .op-product .woocommerce-message,
body:not(.woocommerce-checkout) .op-product .woocommerce-info,
body:not(.woocommerce-checkout) .op-product .woocommerce-error {
	display: none !important;
}

.op-wc-toasts {
	position: fixed !important;
	right: max(16px, env(safe-area-inset-right));
	bottom: max(16px, env(safe-area-inset-bottom));
	z-index: 2147483600;
	display: flex;
	flex-direction: column-reverse;
	align-items: flex-end;
	gap: 10px;
	width: min(360px, calc(100vw - 32px));
	margin: 0 !important;
	padding: 0 !important;
	pointer-events: none;
}

.op-wc-toast {
	pointer-events: auto;
	display: flex;
	align-items: flex-start;
	gap: 10px;
	width: 100%;
	padding: 12px 12px 12px 14px;
	border-radius: 14px;
	border: 1px solid rgba(26, 36, 24, 0.08);
	background: rgba(255, 255, 255, 0.97);
	box-shadow: 0 12px 36px rgba(26, 36, 24, 0.14);
	color: #1a2418;
	font-family: var(--op-font, 'Raleway', sans-serif);
	font-size: 0.86rem;
	font-weight: 500;
	line-height: 1.4;
	transform: translateY(12px);
	opacity: 0;
	transition: opacity 0.22s ease, transform 0.22s ease;
}

.op-wc-toast.is-in {
	opacity: 1;
	transform: translateY(0);
}

.op-wc-toast.is-out {
	opacity: 0;
	transform: translateY(10px);
}

.op-wc-toast__text {
	flex: 1 1 auto;
	min-width: 0;
}

.op-wc-toast__text a {
	color: var(--op-green, #3d8c35) !important;
	font-weight: 700;
	text-decoration: none !important;
}

.op-wc-toast__text a:hover {
	color: var(--op-orange, #fa6619) !important;
}

.op-wc-toast__text .button,
.op-wc-toast__text .wc-forward {
	display: inline !important;
	margin: 0 0 0 4px !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--op-green, #3d8c35) !important;
	font: inherit !important;
	font-weight: 700 !important;
	line-height: inherit !important;
	min-height: 0 !important;
	height: auto !important;
	text-decoration: none !important;
}

.op-wc-toast__close {
	appearance: none;
	flex: 0 0 auto;
	width: 28px;
	height: 28px;
	margin: -2px -2px 0 0;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: #6b756b;
	font-size: 1.15rem;
	line-height: 1;
	cursor: pointer;
	transition: background 0.15s ease, color 0.15s ease;
}

.op-wc-toast__close:hover {
	background: rgba(0, 0, 0, 0.05);
	color: #111;
}

.op-wc-toast.is-error {
	border-color: rgba(196, 64, 48, 0.18);
}

.op-wc-toast.is-error .op-wc-toast__text a,
.op-wc-toast.is-error .op-wc-toast__text .button {
	color: #c44030 !important;
}