/* ============================================================
   Layout fix - kopija kondric.com brez Elementorja
   ============================================================
   Elementor posreduje osnovne flex pravila prek svojega CSS/JS.
   Brez Elementorja manjkajo, zato se .elementor (flex item z
   min-width:auto) raztegne na milijone px. Ta datoteka dopolni
   manjkajoce osnovne pravila, da je layout enak produkciji.
   ============================================================ */

/* --- Elementor osnovni kontejner --- */
.elementor {
	min-width: 0;
	max-width: 100%;
}
.elementor-element,
.e-con,
.e-con-inner {
	min-width: 0;
}

/* --- Flex kontejnerji (Elementor --display:flex) --- */
.elementor-element.e-con,
.elementor .e-con {
	box-sizing: border-box;
}

/* .e-con uporablja var(--width); ce ni definiran, mora biti 100% */
.e-con {
	width: var(--width, 100%);
	max-width: min(100%, var(--width, 100%));
}

/* --- e-con-inner: notranji kontejner --- */
.e-con-inner {
	width: 100%;
	max-width: var(--content-width, 100%);
	margin-left: auto;
	margin-right: auto;
}

/* --- Widget kontejnerji morajo ostati znotraj stolpca --- */
.elementor-widget,
.elementor-widget-container,
.elementor-widget-wrap {
	min-width: 0;
	max-width: 100%;
}

/* --- Elementor kolone v flex sekciji --- */
.elementor-section .e-con,
.elementor-section.elementor-section {
	min-width: 0;
}

/* --- Swiper: container mora biti omejen --- */
.swiper {
	width: 100%;
	max-width: 100%;
	overflow: hidden;
}
.swiper-wrapper {
	width: 100%;
}

/* --- Header/footer Elementor templati --- */
.elementor-location-header .elementor,
.elementor-location-footer .elementor {
	width: 100%;
	max-width: 100%;
}

/* --- Slikarji --- */
.elementor img {
	max-width: 100%;
	height: auto;
}

/* --- Video posoda --- */
.elementor-video-wrapper,
.elementor-background-video {
	max-width: 100%;
}

/* --- Banner karusel (domov, mobilni) ---
   Produkcija ima --min-height:280px, a slajdi se ne raztegnejo,
   zato ostane ~95px praznine med banerjem in naslednjim blokom.
   Slajdi se raztegnejo na polno višino kontejnerja, razmak pa se
   prilagodi vsebini (min-height: auto), da ne ostane prazno. */
@media (max-width: 767px) {
	.elementor-25792070 .elementor-element.elementor-element-d295ba5 {
		min-height: auto !important;
	}
	.elementor-25792070 .elementor-element.elementor-element-d295ba5 .swiper-slide > .elementor-element {
		height: 100%;
	}
	.elementor-25792070 .elementor-element.elementor-element-d295ba5 .swiper,
	.elementor-25792070 .elementor-element.elementor-element-d295ba5 .swiper-wrapper,
	.elementor-25792070 .elementor-element.elementor-element-d295ba5 .swiper-slide {
		height: auto;
	}
	.elementor-25792070 .elementor-element.elementor-element-d295ba5 img {
		width: 100%;
		height: auto;
		object-fit: contain;
	}
}

/* --- Iskalna stran / shop toolbar ---
   Produkcija ima to v wp-custom-css (vstavljen prek Customizerja),
   ki ga kopija nima. Brez njega je spustni meni za razvrscanje ozek,
   besedilo je odrezano, sivi blok pa nima zaobljenih robov.

   Pravilo iz produkcije:
     .woocommerce .woocommerce-ordering, .woocommerce-page .woocommerce-ordering {
       float:none; margin-bottom:2em; background:#e9e9e9;
       border-radius:30px; padding:5px 10px; width:100%!important;
     }
   Plus spustni meni, ki mora zapolniti blok, da besedilo ni odrezano.
*/
.woocommerce .woocommerce-ordering,
.woocommerce-page .woocommerce-ordering {
	float: none;
	margin-bottom: 2em;
	background: #e9e9e9;
	border-radius: 30px;
	padding: 5px 10px;
	width: 100% !important;
}
.woocommerce .woocommerce-ordering select,
.woocommerce-page .woocommerce-ordering select {
	width: 100%;
	max-width: 100%;
	height: auto;
	padding: .5em 2em .5em .5em;
	background-color: transparent;
	border: transparent;
	border-radius: 0;
	line-height: 1.5;
	text-overflow: ellipsis;
}
.woocommerce .woocommerce-ordering select:focus,
.woocommerce-page .woocommerce-ordering select:focus {
	outline: none;
}

/* --- Shop/iskana mreza na mobilnem ---
   Preneseni prod CSS vsebuje pravilo
     .woocommerce ul.products{display:block!important}
   ki je v produkciji omejeno na Elementor shop blok, v kopiji pa velja
   za VSE strani (iskanje, kategorije, trgovina) in s tem uniči mrežo:
   produkti se izpišemo en pod drugim (1 kolona) namesto v 2 kolonah.

   Produkcija na mobilnem uporablja 2 koloni (body class mobile-columns-2
   + grid-template-columns:repeat(2,minmax(0,1fr))). Tu obnovimo mrežo
   in odstranimo 'display:block' za iskalno/kategorijsko/trgovinsko stran.
*/
@media (max-width: 767px) {
	.woocommerce.archive ul.products,
	.woocommerce-page ul.products,
	.woocommerce ul.products:not(.elementor-grid) {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		column-gap: 20px !important;
	}
	/* Slika zaseda celo širino stolpca, tekst pa je pod njo */
	.woocommerce.archive ul.products li.product,
	.woocommerce-page ul.products li.product,
	.woocommerce ul.products:not(.elementor-grid) li.product {
		width: 100% !important;
		flex-direction: column !important;
		align-items: stretch !important;
		gap: 0 !important;
		margin-bottom: 10px !important;
		padding: 0 0 10px 0 !important;
		border-bottom: 1px solid #ececec !important;
	}
	.woocommerce.archive ul.products li.product a.woocommerce-LoopProduct-link,
	.woocommerce-page ul.products li.product a.woocommerce-LoopProduct-link {
		display: block !important;
		width: 100% !important;
	}
	.woocommerce.archive ul.products li.product img,
	.woocommerce-page ul.products li.product img {
		width: 100% !important;
		max-width: 100% !important;
		height: auto !important;
		margin: 0 0 .8em !important;
		flex-shrink: 1 !important;
	}
	.woocommerce.archive ul.products li.product .astra-shop-summary-wrap,
	.woocommerce-page ul.products li.product .astra-shop-summary-wrap {
		text-align: left !important;
		flex: none !important;
		width: auto !important;
		min-width: 0 !important;
	}
}

/* --- Oznake izdelka (product tags) ---
   Produkcija prikaze oznake v Elementor widgetu
   'woocommerce-product-meta' (razred .detail-container / .tagged_as).
   V kopiji ni uvozene Elementor predloge, zato meta blok izpisuje
   privzeti WooCommerce single-product/meta.php z razredom .tagged_as.

   Oznake skrijemo (vizualno) - uporabnik jih ne potrebuje, dolg seznam
   (18 oznak) pa zasede veliko prostora na mobilnem.
   Podatki oznak ostanejo v bazi, sitemapih in arhivih (/oznaka-izdelka/).
 */
.product_meta .tagged_as,
.elementor-widget-woocommerce-product-meta .tagged_as {
	display: none !important;
}
