/* HLAVNE */
:root { --bs-main-rgb: 22, 47, 62; --bs-scnd-rgb: 253, 180, 80; --header-h: 46px; --review-avatar-size: 48px; --safe-top: env(safe-area-inset-top);}
html { scroll-behavior: smooth; scroll-padding-top: 46px; }

/* COOKIES */
#cookieBanner { z-index: 1100 !important; }

/* FARBY POZADIA, BTN A TEXTOV */
.bg-main { background-color: rgba(var(--bs-main-rgb), var(--bs-bg-opacity)); color: white; }
.bg-scnd { background-color: rgba(var(--bs-scnd-rgb), var(--bs-bg-opacity)); color: white; }
.btn-main, .btn-outline-main:focus, .btn-outline-main:hover { background-color: rgb(var(--bs-main-rgb)); border-color: rgb(var(--bs-main-rgb)) !important; color: white; }
.btn-main.active, .btn-main:focus, .btn-main:hover { background-color: rgba(var(--bs-main-rgb), 0.9) !important; color: white; }
.btn-outline-main { border-color: rgb(var(--bs-main-rgb)); color: rgb(var(--bs-main-rgb)); }
.btn-outline-scnd { border-color: rgb(var(--bs-scnd-rgb)); color: rgb(var(--bs-scnd-rgb)); }
.btn-scnd, .btn-outline-scnd:focus, .btn-outline-scnd:hover { background-color: rgb(var(--bs-scnd-rgb)); border-color: rgb(var(--bs-scnd-rgb)) !important; color: white; }
.btn-scnd.active, .btn-scnd:focus, .btn-scnd:hover { background-color: rgba(var(--bs-scnd-rgb), 0.9) !important; color: white; }
.link-main, .text-main { color: rgba(var(--bs-main-rgb), var(--bs-text-opacity)); }
.link-scnd, .text-scnd { color: rgba(var(--bs-scnd-rgb), var(--bs-text-opacity)); }
.text-shadow { text-shadow: 0 2px 8px rgba(0,0,0,.6); }

/* FONTY */
.dm-sans { font-family: "DM Sans", sans-serif; font-optical-sizing: auto; font-style: normal;}

/* IKONY */
.icon-white { filter: brightness(0) invert(1); }

/* MENU */
#mainNav .active { font-weight: 600; }
.navbar-toggler { border: none; box-shadow: none; outline: none; }
.navbar-toggler:focus, .navbar-toggler:active { box-shadow: none; outline: none; }

/* KARTY */
.card:hover { background-color: rgba(var(--bs-scnd-rgb), 0.1) !important; }

/* NADPISY */
.hb { display: inline-block; padding-bottom: 0.6rem; position: relative; text-align: center; }
.hb::after { background-color: rgb(173, 31, 31); bottom: 0; content: ""; height: 5px; left: 50%; position: absolute; transform: translateX(-50%); width: 100%; }

/* OBRAZKOVE POZADIA */
.bg-img { background: url("/content/images/background.jpg") center/cover no-repeat; }

/* RECAPTCHA */
.grecaptcha-badge { visibility: hidden; }

/* ANIMACIE */
@keyframes fadeIn {
	0% { opacity: 0; transform: translateY(20px); }
	100% { opacity: 1; transform: translateY(0); }
}

@keyframes fadeInLeft {
	0% { opacity: 0; transform: translateX(-20px); }
	100% { opacity: 1; transform: translateX(0); }
}

@keyframes flipIn {
	0% { opacity: 0; transform: perspective(600px) rotateY(90deg); }
	100% { opacity: 1; transform: perspective(600px) rotateY(0); }
}

@keyframes pulse {
	0% { transform: scale(1); }
	50% { transform: scale(1.20); }
	100% { transform: scale(1); }
}

@keyframes rotateIn {
	0% { opacity: 0; transform: rotate(-15deg); }
	100% { opacity: 1; transform: rotate(0); }
}

@keyframes slideDown {
	0% { opacity: 0; transform: translateY(-20px); }
	100% { opacity: 1; transform: translateY(0); }
}

@keyframes slideInLeft {
	0% { opacity: 0; transform: translateX(-40px); }
	100% { opacity: 1; transform: translateX(0); }
}

@keyframes slideUp {
	0% { opacity: 0; transform: translateY(40px); }
	100% { opacity: 1; transform: translateY(0); }
}

@keyframes zoomIn {
	0% { opacity: 0; transform: scale(0.8); }
	100% { opacity: 1; transform: scale(1); }
}

.animate { animation-fill-mode: forwards; animation-play-state: paused; opacity: 0; transform-origin: center center; }
.animate-delay-1 { animation-delay: 0.25s; }
.animate-delay-2 { animation-delay: 0.5s; }
.animate-delay-3 { animation-delay: 0.75s; }
.animate-delay-4 { animation-delay: 1s; }
.fade-in { animation-duration: 0.75s; animation-name: fadeIn; }
.fade-in-left { animation-duration: 1s; animation-name: fadeInLeft; }
.flip-in { animation-duration: 1s; animation-name: flipIn; }
.pulse-icon { animation: pulse 2s infinite; display: inline-block; }
.rotate-in { animation-duration: 0.75s; animation-name: rotateIn; }
.slide-down { animation-duration: 0.75s; animation-name: slideDown; }
.slide-in-left { animation-duration: 0.75s; animation-name: slideInLeft; }
.slide-up { animation-duration: 0.75s; animation-name: slideUp; }
.zoom-in { animation-duration: 0.75s; animation-name: zoomIn; }