/*
-------------------------------------------
* BUTTONS
-------------------------------------------
*/
body .wp-block-buttons {
    --button-outline-border-width: 1px;
    --button-border-radius: 4px;

    /* Fill Button */
    --button-fill-background-color: var(--theme-button-background-initial-color);
    --button-fill-background-color-hover: var(--theme-button-background-hover-color);
    --button-fill-text-color: var(--theme-button-text-initial-color);
    --button-fill-text-color-hover: var(--theme-button-text-hover-color);

    /* Outline Button */
    --button-outline-text-color: var(--theme-button-background-initial-color); 
    --button-outline-border-color: var(--theme-button-background-initial-color);
    --button-outline-background-color: transparent;
    --button-outline-text-color-hover: var(--theme-button-text-hover-color);
    --button-outline-background-color-hover: var(--theme-button-background-hover-color);

	column-gap:10px;

}

@media screen and (max-width:768px) {
	.vita-main .wp-block-buttons {
		display:flex;
		flex-wrap:nowrap;
		overflow-x:scroll;
	}
	.vita-main .wp-block-buttons .wp-block-button {
		flex-shrink:0;
	}
}

/* FILL Button Style (default)
------------------------------*/
body .wp-block-button__link {

    /* Default Button Style */
    display: inline-block;
    position:relative;
    min-height:40px;
    line-height:120%;
    font-size:var(--theme-button-font-size);
    font-weight:var(--theme-button-font-weight);
    /*text-transform:uppercase;*/
    text-decoration:none;
    padding: 10px 25px 10px 25px!important;
    transition: background-color 0.3s ease;
    border-radius: 8px;
    box-sizing: border-box;

    /* Fill Button Style */
    background-color: var(--button-fill-background-color);
    color: var(--button-fill-text-color);
    border: none;
}
/* Fill Button Hover */
body .wp-block-button .wp-block-button__link:hover,
body .wp-block-button.is-style-fill-arrow .wp-block-button__link:hover {
    background-color: var(--button-fill-background-color-hover)!important;
    color: var(--button-fill-text-color-hover)!important;
}

/* OUTLINE Buttons Style
------------------------------*/
body .wp-block-button.is-style-outline .wp-block-button__link,
body .wp-block-button.is-style-outline-arrow .wp-block-button__link {
    background-color: var(--button-outline-background-color)!important;
    color: var(--button-outline-text-color)!important;
    /* Requires forcing */
    border-width: 1px!important;
    border-style: solid!important;
    border-color: var(--button-outline-border-color)!important;
}
/* Outline Button Hover */
body .wp-block-button.is-style-outline .wp-block-button__link:hover,
body .wp-block-button.is-style-outline-arrow .wp-block-button__link:hover {
    color: var(--button-outline-text-color-hover)!important;
    border-color: var(--button-outline-background-color-hover)!important;
    background-color: var(--button-outline-background-color-hover)!important;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover,
.wp-block-button.is-style-outline.is-active .wp-block-button__link {
	background-color: var(--button-fill-background-color-hover)!important;
    color: var(--button-fill-text-color-hover)!important;
}


/**
* Homepage cover slider arrows
*/
.hcslider .swiper-button-prev::after,
.hcslider .swiper-button-next::after {
  content: "";
  display: block;
  width: 46px;
  height: 76px;
  background-color: var(--theme-palette-color-8); /* white */
  mask-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="46" height="76" viewBox="0 0 46 76"><path d="M44 74L4 38.1614L44 2" stroke="black" stroke-width="5" fill="none"/></svg>');
  mask-repeat: no-repeat;
  mask-size: contain;
  mask-position: center;
  transition:background-color 0.2s ease-out;
  cursor:pointer;
}

/* flip the next button arrow */
.hcslider .swiper-button-next::after {
  transform: scaleX(-1);
}

/* change color on hover */
.hcslider .swiper-button-prev:hover::after,
.hcslider .swiper-button-next:hover::after {
  background-color: var(--theme-palette-color-2); /* bronze */
}

@media screen and (max-width:768px) {
	.hcslider .swiper-button-prev::after,
	.hcslider .swiper-button-next::after {
	    width: 23px;
	    height: 35.5px;
	}
}



/**
* TERMINE
*/

body.post-type-archive-termin [class*=ct-container] > article {
	padding:0!important;
	text-transform:uppercase;
}
body.post-type-archive-termin ul.wp-block-post-template li:hover {
	background:#2C2723;
}

/* Termine filters */
.filter-row-wrap {
	display:flex;
	align-items:flex-start;
	justify-content:space-between;
	width:calc(100% - 6vw);
	margin:0 auto;
	margin-bottom:30px;
	border:solid 1px #FFFFFF50;
	border-width:0 0 1px 0;
	height:80px;
}

.filter-row-wrap select {
	color:var(--theme-palette-color-8);
	border-color:var(--theme-palette-color-8);
}
.filter-row-wrap select:focus {
	color:var(--theme-palette-color-2);
	border-color:var(--theme-palette-color-2);
}

.termine-date-filter select {
  	appearance: none;
  	-webkit-appearance: none;
  	-moz-appearance: none;
  	
  	background-color: transparent;
  	border: 1px solid rgba(255, 255, 255, 0.3);
  	color: #fff;
  	font-family: inherit;
  	font-size: var(--theme-button-font-size);
  	line-height:100%;
  	padding: 8px 36px 8px 20px;
  	min-width:150px;
  	border-radius: 10px;
  	cursor: pointer;
  	outline: none;
  	transition: border-color 0.2s ease, color 0.2s ease;
}

/* majhna puščica na desni */
.termine-date-filter {
  	position: relative;
  	display: inline-block;
}

.termine-type-filter {
  	display: flex;
  	gap: 10px;
  	flex-wrap: wrap;
}

.filter-btn {
  	display: inline-block;
  	padding: 7px 20px;
  	border: 1px solid rgba(255,255,255,0.3);
  	border-radius: 10px;
  	color: #fff;
  	text-decoration: none;
  	font-size: var(--theme-button-font-size);
  	line-height: 24px;
  	/*letter-spacing: 0.5px;*/
  	transition: all 0.2s ease;
}

.filter-btn:hover {
  border-color: #d79a6f;
  color: #d79a6f;
}

.filter-btn.active {
  background-color: #d79a6f;
  border-color: #d79a6f;
  color: #000;
}


/* Termine List */

@media screen and (min-width:769px) {
	.termine-list {
		
		position: absolute;
		top: 14.62vw;   /* kompenzira padding */
		left: 0;
		right: 0;
		bottom: 0;
		/*background: rgba(255,255,255,0.05);*/
		padding-bottom:100px;
		
		width:100%;
		overflow-y: scroll;      /* omogoči vertikalni scroll */
		scrollbar-width: thin;
		scrollbar-color: #d79a6f transparent; /* Firefox */
		/*background-color:#191919;*/
	  	
	}
	
	
	
	.termine-list {
	  mask-image: linear-gradient(to bottom, #191919 80%, transparent);
	}
	
	/* Chrome / Safari / Edge */
	.termine-list::-webkit-scrollbar {
	  width: 6px;
	  background: transparent; /* brez tracka */
	}
	
	.termine-list::-webkit-scrollbar-thumb {
	  background-color: #d79a6f; /* accent barva */
	  border-radius: 3px;
	}
	
	.termine-list::-webkit-scrollbar-thumb:hover {
	  background-color: #e1ad83; /* malo svetlejši ob hoverju */
	}
	
	.termine-list::-webkit-scrollbar-track {
	  background: transparent; /* odstrani siv trak */
	}
	
	
	.scrollbar-hidden {
	    scrollbar-width: none;   /* Firefox: skrije scrollbar */
	    -ms-overflow-style: none;/* IE & Edge legacy */
	}
	
	/* Chrome, Safari, Opera */
	.scrollbar-hidden::-webkit-scrollbar {
	  display: none;
	}

}

.termin-item {
	display:flex;
	flex-direction:row;
	flex-wrap:nowrap;
	width:calc((100% - 6vw) + 12px); /* kompenzira padding */
	transform: translateX(5px); /* kompenzira padding */
	margin:0 auto;
	color:var(--theme-palette-color-8);
	border:solid 1px #ffffff19;
	border-width:0 0 1px;
}

.termin-item-inner {
	box-sizing: border-box;
	margin:0px 0 0px 0;
	padding:clamp(10px, 2vw, 50px) 0;
	align-items:center;
	justify-content:space-between;
	gap:50px;
	width:100%;
	/*background-color:var(--theme-palette-color-4);*/
	transition: background-color 0.2s ease;
	display:grid;
	  grid-template-columns:
	    170px  /* datum */
	    1fr    /* naslov */
	    1.2fr  /* opis */
	    0.8fr  /* kanal + ura */
	    0.6fr; /* link */
	  
}
@media screen and (max-width:768px) {
	.termin-item-inner {
		padding-top:20px;
		padding-bottom:20px;
		align-items:flex-start;
	}
}
.termin-item-inner .backup {
	display: grid;
	  grid-template-columns:
	    170px  /* datum */
	    1px    /* divider */
	    1fr    /* naslov */
	    1px    /* divider */
	    1.2fr  /* opis */
	    1px    /* divider */
	    0.8fr  /* kanal + ura */
	    1px    /* divider */
	    0.6fr; /* link */
		transition:all 0.2s ease;
}
.termin-item-inner:hover {
	cursor:pointer;
	background-color:rgba(255,255,255,0.05);
}

/* Termin date */
.termin-date {
	display:flex;
	justify-content:center;
	align-items:center;
	flex-direction:column;
	gap:5px;
}

.termin-date .month,
.termin-date .date,
.termin-date .day {
	text-transform:uppercase;
	line-height:100%;
}
.termin-date .month,
.termin-date .date {
	font-size:32px; /* 38px */
	color:var(--theme-palette-color-8);
}
.termin-date .date {
	color: var(--theme-palette-color-2);
}
.termin-date .day {
	display:block;
	text-align:center;
	font-size:16px;
	color:var(--theme-palette-color-8);
}

@media screen and (max-width:768px) {
	.termin-date {
		flex-direction:row;
		align-items: flex-start;
		gap:7px;
	}
	.termin-date .day {
	font-size:14px;
}
}

/* Termin title */
.termin-title,
.termin-title a {
	font-size:1.1em;
	color:var(--theme-palette-color-8); /* white */
	text-decoration:none;
	transition:all 0.2s ease;
}
.termin-item:hover .termin-title a,
.termin-title a:hover,
.termin-item:hover .termin-link a {
	color:var(--theme-palette-color-2); /* bronze */
	/*text-decoration:underline;*/
}
@media screen and (max-width:768px) {
	.termin-title,
	.termin-title a {
		font-size:1.3em;
	}
}

.termin-title-flex {
	display:flex;
	flex-direction:column;
	gap:0px;
}
@media screen and (max-width:768px) {
	.termin-title-flex {
		gap:5px;
	}
}

.dtsub {
	opacity:0.5;
	font-size:0.9em;
}

/* Termin description */
.termin-description {
	text-transform:none;
	color:#FFFFFF85;
}
@media screen and (max-width:768px) {
	.termin-description {
		padding-inline:0;
	}
}

/* Termin link */
@media screen and (min-width:769px) {
	.termin-link {
		display:flex;
		justify-content:flex-end;
		align-items:center;
		padding-inline-end: 20px;
	}
}
.termin-link a,
.termin-link a:hover {
	color:var(--theme-palette-color-2); /* bronze */
	text-decoration:none;
	font-size:0.9em;
}
.termin-link a:hover,
.termin-item:hover .termin-link a {
	text-decoration:none;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;
}

.termin-item::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 1px;
	background-color: var(--theme-palette-color-2);

	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.5s linear;
}

.termin-item:hover::after {
	transform: scaleX(1);
}
/*
.termin-item::after {
	content: '';
	position: absolute;
	left: 0;
	bottom: 0;
	width: 0;
	height: 1px;
	background-color: var(--theme-palette-color-2);
	opacity:0.5;
	transition: width 0.5s linear;
}

.termin-item:hover::after {
	width: 100%;
}
	*/


/* Termin overlay loader spinner */
.loader {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    min-height: 300px;
}

.loader::after {
    content: '';
    width: 48px;
    height: 48px;
    border: 4px solid rgba(0, 0, 0, 0.1);
    border-top-color: var(--theme-palette-color-2);
    border-radius: 50%;
    animation: termin-spin 0.75s linear infinite;
}

@keyframes termin-spin {
    to { transform: rotate(360deg); }
}