/* ==========================================================================
   Experience detail (view-primary-detail.html.twig)
   Štýly ladené do dizajnu Partizána (primary #BCAB81, Recoleta, ostré rohy)
   ========================================================================== */

/* ---- HERO ---------------------------------------------------------------- */
.event-dedail-intro{
	position: relative;
}
.event-dedail-intro .sec{
	position: relative;
	min-height: 560px;
	display: flex;
	align-items: flex-end;
	overflow: hidden;
}
.event-dedail-intro .bg-img{
	position: absolute;
	inset: 0;
	z-index: 0;
}
.event-dedail-intro .bg-img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.event-dedail-intro .bg-img::after{
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(40,38,32,.85) 0%, rgba(40,38,32,.45) 45%, rgba(40,38,32,.15) 100%);
}
.event-dedail-intro .content{
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: var(--block);
	margin: 0 auto;
	padding: var(--block-padding);
	padding-top: var(--size-xl);
	color: #fff;
}

/* Back link */
.event-dedail-intro .back-to{
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #fff;
	font-size: var(--f-size-xs);
	letter-spacing: 1.5px;
	text-transform: uppercase;
	text-decoration: none;
	margin-bottom: var(--size-md);
	opacity: .9;
	transition: opacity .2s ease;
}
.event-dedail-intro .back-to:hover{ opacity: 1; }
.event-dedail-intro .back-to .back-to-left{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border: 1px solid rgba(255,255,255,.5);
	border-radius: 50%;
}

.event-dedail-intro .content h1{
	font-family: var(--font-secondary);
	font-size: var(--f-size-h1);
	font-weight: 400;
	line-height: 1.1;
	color: #fff;
	margin: 0 0 var(--size-sm);
	max-width: 20ch;
}
.event-dedail-intro .content h2{
	font-family: var(--font-primary);
	font-size: var(--f-size-h6);
	font-weight: 400;
	line-height: 1.5;
	color: rgba(255,255,255,.9);
	margin: 0 0 var(--size-md);
	max-width: 60ch;
}

/* Hero small meta (date/time) */
.event-dedail-intro .bottom-text{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-bottom: var(--size-md);
	color: #fff;
}
.event-dedail-intro .bottom-text .icon{ font-size: 22px; line-height: 1; color: var(--primary-lighter); }
.event-dedail-intro .bottom-text .text{ font-size: var(--f-size-sm); line-height: 1.3; }
.event-dedail-intro .bottom-text .text span{ color: var(--primary-lighter); }

/* ---- BUY BUTTON ("Kúpiť zážitok") --------------------------------------- */
.add-to-cart{
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: var(--primary);
	color: #fff;
	font-size: var(--f-size-sm);
	font-weight: 500;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	padding: 16px 34px;
	cursor: pointer;
	border: 1px solid var(--primary);
	transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
	user-select: none;
}
.add-to-cart:hover{
	background: var(--primary-darker);
	border-color: var(--primary-darker);
}
.add-to-cart i{ font-size: 18px; }
.add-to-cart.bg-gray,
.add-to-cart.cursor-default{
	background: var(--gray-300);
	border-color: var(--gray-300);
	cursor: default;
}
.add-to-cart.bg-gray:hover{ background: var(--gray-300); }
.add-to-cart .spinner-border{ width: 1.1rem; height: 1.1rem; }

/* ---- STICKY SUB-NAV (anchor tabs) --------------------------------------- */
.tabs-wrapper#sticky-subnav{
	background: #fff;
	border-bottom: 1px solid var(--gray-100);
	position: sticky;
	top: 0;
	z-index: 40;
}
.tabs-wrapper#sticky-subnav .main-block{
	max-width: var(--block);
	margin: 0 auto;
	padding: 0 var(--block-padding);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--size-md);
}
.tabs-wrapper .tabs{
	display: flex;
	flex-wrap: wrap;
	gap: var(--size-md);
}
.tabs-wrapper .tabs .item{
	position: relative;
	display: inline-flex;
	align-items: center;
	padding: 20px 0;
	color: var(--gray-400);
	font-size: var(--f-size-sm);
	font-weight: 500;
	letter-spacing: .5px;
	text-decoration: none;
	border-bottom: 2px solid transparent;
	transition: color .2s ease, border-color .2s ease;
	white-space: nowrap;
}
.tabs-wrapper .tabs .item:hover{ color: var(--dark); }
.tabs-wrapper .tabs .item.active{
	color: var(--primary-dark);
	border-bottom-color: var(--primary);
}
.tabs-wrapper .buy-wrapper .add-to-cart{
	padding: 10px 22px;
	font-size: var(--f-size-xs);
}

/* ---- ANCHOR BADGE (section number) -------------------------------------- */
.anchor.fixed-first{ position: relative; }
.anchor .sec{
	max-width: var(--block);
	margin: 0 auto;
	padding: 0 var(--block-padding);
}
.anchor-hidden{
	position: absolute;
	top: -110px;
}
.anchor-badge-wrap{ padding-top: var(--block-mb-sm); }
.anchor-badge{
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-family: var(--font-secondary);
	font-size: var(--f-size-h4);
	color: var(--dark);
}
.anchor-badge .num{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border: 1px solid var(--primary);
	color: var(--primary-dark);
	border-radius: 50%;
	font-family: var(--font-primary);
	font-size: var(--f-size-main);
	font-weight: 500;
}

/* ---- BODY: two columns (desc + details sidebar) ------------------------- */
.sm-sec .sec{
	max-width: var(--block);
	margin: 0 auto;
	padding: var(--block-mb-sm) var(--block-padding);
}
.columns-details{
	display: flex;
	flex-wrap: wrap;
	gap: var(--size-lg);
}
.columns-details .col-desc{
	flex: 1 1 0;
	min-width: 0;
}
.columns-details .col-details{
	flex: 0 0 340px;
	max-width: 340px;
}

/* desc body */
.col-desc #call-subnav{ display: none; }
.col-desc .tab{
	font-size: var(--f-size-main);
	line-height: 1.7;
	color: var(--gray-400);
}
.col-desc .tab h1,
.col-desc .tab h2,
.col-desc .tab h3{
	font-family: var(--font-secondary);
	color: var(--dark);
	font-weight: 400;
}
.col-desc .tab h3{ font-size: var(--f-size-h5); margin-bottom: var(--size-xs); }
.col-desc .tab .main{
	padding-top: var(--size-md);
	margin-top: var(--size-md);
	border-top: 1px solid var(--gray-100);
}
.col-desc .tab iframe{ border-radius: 0; }
.col-desc .tab img{
	display: block;
	max-width: 100%;
	height: auto;
	margin-top: var(--size-md);
}

/* warning block */
.tip-block.warn{
	margin-top: var(--size-md);
	padding: var(--size-md);
	background: rgba(221,108,108,.06);
	border: 1px solid rgba(221,108,108,.3);
	border-left: 4px solid var(--error);
}
.tip-block.warn h3{
	font-family: var(--font-secondary);
	color: var(--error);
	font-size: var(--f-size-h6);
	margin: 0 0 var(--size-xs);
}
.tip-block.warn .main{ color: var(--gray-400); font-size: var(--f-size-sm); line-height: 1.6; }

/* details sidebar card — reservation-style panel (like package detail) */
.col-details{
	background: var(--light);
	border: 1px solid var(--primary);
	padding: var(--size-md-big);
	align-self: flex-start;
	position: sticky;
	top: 90px;
}

/* Panel head "Rezervácia" */
.col-details .col-details-head{
	display: flex;
	align-items: center;
	gap: 10px;
	padding-bottom: var(--size-sm);
	margin-bottom: var(--size-sm);
	border-bottom: 1px solid var(--gray-200);
}
.col-details .col-details-head i{
	font-size: 24px;
	color: var(--primary);
}
.col-details .col-details-head span{
	font-family: var(--font-secondary);
	font-size: var(--f-size-h5);
	font-weight: 400;
	color: var(--dark);
}

.col-details .item{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 12px;
	padding: var(--size-sm) 0;
	border-bottom: 1px solid var(--gray-200);
}
.col-details .item:last-child{ border-bottom: 0; }

/* Buy button in panel */
.col-details .col-details-buy{
	margin-top: var(--size-md);
	padding-top: var(--size-md);
	border-top: 1px solid var(--gray-200);
}
.col-details .col-details-buy .add-to-cart{
	display: flex !important;
	width: 100%;
	min-height: 52px;
	justify-content: center;
	align-items: center;
	gap: 10px;
	background: var(--primary);
	color: #fff !important;
	font-size: var(--f-size-sm);
	font-weight: 500;
	letter-spacing: 1.5px;
	text-transform: uppercase;
	cursor: pointer;
	border: 0;
}
.col-details .col-details-buy .add-to-cart:hover{ background: var(--primary-darker); }
.col-details .col-details-buy .add-to-cart i{ font-size: 18px; }
.col-details .item .icon{
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	background: transparent;
	border: 0;
	color: var(--primary);
	font-size: 20px;
	margin-top: 2px;
}
.col-details .item .label{
	flex: 1 1 auto;
	order: 2;
	font-size: var(--f-size-xs);
	text-transform: uppercase;
	letter-spacing: .5px;
	color: var(--gray-300);
	align-self: center;
}
.col-details .item .val{
	flex: 1 1 100%;
	order: 3;
	padding-left: 36px;
	margin-top: 2px;
	font-family: var(--font-secondary);
	font-size: var(--f-size-h6);
	line-height: 1.3;
	color: var(--dark);
}

/* ---- IMAGE CAROUSEL (item gallery) -------------------------------------- */
.slider-simple-img{ position: relative; }
.slider-simple-img .primary-bg{
	position: absolute;
	inset: 0;
	background: var(--primary);
	opacity: .06;
}
.slider-simple-img .slider .item img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ---- MOBILE STICKY BUY BAR ---------------------------------------------- */
.bottom-sticky-details{ display: none; }
.bottom-sticky-buttons{
	display: none;
	position: fixed;
	left: 0; right: 0; bottom: 0;
	z-index: 60;
	background: #fff;
	border-top: 1px solid var(--gray-100);
	box-shadow: 0 -6px 20px rgba(0,0,0,.08);
}
.bottom-sticky-buttons .item{
	flex: 1 1 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 16px 12px;
	font-size: var(--f-size-sm);
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: .5px;
	cursor: pointer;
}
.bottom-sticky-buttons .item.open-details{ color: var(--dark); }
.bottom-sticky-buttons .item.primary{
	background: var(--primary);
	color: #fff;
}
.bottom-sticky-details{
	position: fixed;
	left: 0; right: 0; bottom: 56px;
	z-index: 59;
	background: #fff;
	border-top: 1px solid var(--gray-100);
	padding: var(--size-sm) var(--size-md);
	transform: translateY(110%);
	transition: transform .3s ease;
}
.bottom-sticky-details.active{ transform: translateY(0); }
.bottom-sticky-details .item{
	display: flex;
	align-items: baseline;
	gap: 8px;
	padding: 8px 0;
	border-bottom: 1px solid var(--gray-100);
	font-size: var(--f-size-sm);
}
.bottom-sticky-details .item:last-child{ border-bottom: 0; }
.bottom-sticky-details .item .label{ color: var(--gray-300); min-width: 120px; }
.bottom-sticky-details .item .val{ color: var(--dark); font-weight: 500; }
.bottom-sticky-details .item .icon{ color: var(--primary-dark); }

/* ---- RESPONSIVE --------------------------------------------------------- */
@media (max-width: 991.98px){
	.event-dedail-intro .sec{ min-height: 440px; }
	.event-dedail-intro .content h1{ font-size: var(--f-size-h2); }
	.columns-details{ flex-direction: column; }
	.columns-details .col-details{ flex-basis: auto; max-width: 100%; width: 100%; position: static; }
	.col-details .item .val{ padding-left: 0; }
}

@media (max-width: 767.98px){
	.event-dedail-intro .content{
		padding: var(--size-md);
		padding-top: var(--size-lg);
	}
	.event-dedail-intro .content h1{ font-size: var(--f-size-h3); }
	.event-dedail-intro .content h2{ font-size: var(--f-size-sm); }
	.event-dedail-intro .content .add-to-cart{ display: none; } /* nahradené sticky barom */

	.sm-sec .sec,
	.tabs-wrapper#sticky-subnav .main-block,
	.anchor .sec{ padding-left: var(--size-md); padding-right: var(--size-md); }

	.tabs-wrapper#sticky-subnav .buy-wrapper{ display: none; }
	.tabs-wrapper .tabs{ overflow-x: auto; flex-wrap: nowrap; -webkit-overflow-scrolling: touch; }
	.tabs-wrapper .tabs .item{ padding: 14px 0; }

	.bottom-sticky-buttons{ display: flex; }
}
