:root{
      --blue:#4471ff;
      --dark-blue:#0039b3;
      --orange:#ff6600;
      --orange-light:#ff944d;
      --green:green;
      --text:#222;
      --bg:#fff;
      --bg-grey:#eee;
      --bg-blue:#6b8fff;
      --max-width:1200px;
      --gap:20px;
      --radius:8px;
      --menu-font-size:15px;
      --menu-font-weight:300;
      --field-gap:14px;
      --carousel-gap:16px;
      --card-bg:#ffffff;
      --muted:#6b7280;
      --login-color:#fff;
      --login-hover:rgba(255,255,255,0.9);
    }


* { box-sizing:border-box; margin:0; padding:0 }
HTML { scrollbar-gutter: stable; }
HTML, BODY { height:100% }
BODY { font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial; font-size:14px; color:var(--text); background:var(--bg); -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; line-height:1.4; min-height:100vh; display:flex; flex-direction:column;  }
A {color:inherit; text-decoration:none; color:var(--dark-blue) }
BUTTON { font-family:inherit; font-size:15px }
H1 { font-size:1.2em; margin-bottom:16px }
H2 { font-size:1.2em; margin-bottom:10px; color:#111; xfont-weight:600 }

#infoBar { position:absolute; left:0; top:0; width:100%; color:white; text-align:center; padding:5px 10px; z-index:10000; }
.infoBar-add { background-color:var(--green); }
.infoBar-del { background-color:var(--orange); }

/* Header / Footer full width */
header.site-header { width:100%; background:var(--blue); color:#fff; display:flex; flex-direction:column }
footer.site-footer { width:100%; background:var(--blue); color:#fff; }
.footer-inner { width:100%; max-width:var(--max-width); margin:0 auto; padding:10px; display:flex; flex-wrap:wrap; gap:20px; align-items:center; box-sizing:border-box }

/* container wrapper widths */
.header-inner { width:100%; max-width:var(--max-width); margin:0 auto; box-sizing:border-box; padding:6px var(--gap) 0 var(--gap); }
.header-top { display:flex; align-items:center; justify-content:flex-end; gap:8px; padding-bottom:4px; }
.login-link { display:inline-flex; align-items:center; gap:8px; color:var(--login-color); font-weight:600; border:0; cursor:pointer; padding:10px 0px; }

.login-icon { display: inline-block; width: 32px; height: 32px; background-color: #ffffff; /* barva ikony */ -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 12a4 4 0 1 0-4-4 4 4 0 0 0 4 4zm0 2c-4.42 0-8 2.24-8 5v1h16v-1c0-2.76-3.58-5-8-5z'/></svg>") center / 70% 70% no-repeat; mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M12 12a4 4 0 1 0-4-4 4 4 0 0 0 4 4zm0 2c-4.42 0-8 2.24-8 5v1h16v-1c0-2.76-3.58-5-8-5z'/></svg>") center / 70% 70% no-repeat; vertical-align: middle;}
.conditions-icon { display: inline-block; width: 32px; height: 32px; background-color: #ffffff; /* barva ikony */ -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='M7 3h7l5 5v11a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z'/><path d='M14 3v6h6'/><path d='M9.5 13.5l6-6 2 2-6 6-2.5.5.5-2.5z' /></svg>") center / 70% 70% no-repeat; mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'><path d='M7 3h7l5 5v11a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z'/><path d='M14 3v6h6'/><path d='M9.5 13.5l6-6 2 2-6 6-2.5.5.5-2.5z' /></svg>") center / 70% 70% no-repeat; vertical-align: middle;}
.remove-icon { display: inline-block; width: 15px; height: 15px; margin-right:4px; background-color: #ff6600; /* barva ikony */ -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' id='Capa_1' x='0px' y='0px' viewBox='0 0 512.021 512.021' style='enable-background:new 0 0 512.021 512.021;' xml:space='preserve' width='512' height='512'><g><path d='M301.258,256.01L502.645,54.645c12.501-12.501,12.501-32.769,0-45.269c-12.501-12.501-32.769-12.501-45.269,0l0,0   L256.01,210.762L54.645,9.376c-12.501-12.501-32.769-12.501-45.269,0s-12.501,32.769,0,45.269L210.762,256.01L9.376,457.376   c-12.501,12.501-12.501,32.769,0,45.269s32.769,12.501,45.269,0L256.01,301.258l201.365,201.387   c12.501,12.501,32.769,12.501,45.269,0c12.501-12.501,12.501-32.769,0-45.269L301.258,256.01z'/></g></svg>") center / 70% 70% no-repeat; mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' id='Capa_1' x='0px' y='0px' viewBox='0 0 512.021 512.021' style='enable-background:new 0 0 512.021 512.021;' xml:space='preserve' width='512' height='512'><g><path d='M301.258,256.01L502.645,54.645c12.501-12.501,12.501-32.769,0-45.269c-12.501-12.501-32.769-12.501-45.269,0l0,0   L256.01,210.762L54.645,9.376c-12.501-12.501-32.769-12.501-45.269,0s-12.501,32.769,0,45.269L210.762,256.01L9.376,457.376   c-12.501,12.501-12.501,32.769,0,45.269s32.769,12.501,45.269,0L256.01,301.258l201.365,201.387   c12.501,12.501,32.769,12.501,45.269,0c12.501-12.501,12.501-32.769,0-45.269L301.258,256.01z'/></g></svg>") center / 70% 70% no-repeat; vertical-align: middle;}

#loadingOverlay {  position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.5); display: none; align-items: center; justify-content: center; flex-direction: column; z-index: 9999; color: white; font-size: 1.5em; }

#pageExpirationOverlay { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); align-items:center; justify-content:center; display:flex; flex-direction:column; z-index:9999; }

.spinner { width: 50px; height: 50px; border: 6px solid #fff; border-top: 6px solid transparent; border-radius: 50%; animation: spin 1s linear infinite; margin-bottom: 15px; }
@keyframes spin { to { transform: rotate(360deg); }}
#infoBar { position:absolute; left:0; top:0; width:100%; color:white; text-align:center; padding:5px 10px; z-index:10000; }
.infoBar-add { background-color:var(--green); }
.infoBar-del { background-color:var(--orange); }
.arrow-progress { height:20px }
.arrow-rotated { transform:rotate(180deg) }

.car-item { border:1px solid #ccc; margin-top:20px; border-radius: var(--radius); padding:20px;  }
.car-item H1 { margin-bottom:5px }
.car-item H2 { margin-bottom:20px }
.car { display:flex; width:100%; gap:20px;  }
.car-left { width:350px; }
.car-center { width:300px; color:#999; }

.car-right { flex:1; text-align:right }
.car-icons { display:grid;  grid-template-columns:1fr 1fr;  gap:5px;  }
.car-icon { display:flex; gap:10px; align-items:center; margin-bottom:3px; }
.car-icon IMG { width:25px }

.car-price { display:grid; grid-template-columns: 200px 150px 150px; gap:20px; align-items:center; text-align:center; }
.car-price-var { text-align:right; }
.car-price-heading { font-weight:bold }
.car-price-eur { font-size:0.9em; color:#666 }
.car-info { display:none; padding-top:20px }
.car-info-inner { display:flex; gap:40px }
.car-more-info { cursor:pointer; display:flex }
.car-more-info IMG { width:15px; margin-right:10px }
.car-info H1 { padding:3px 8px; border-radius:var(--radius); background:var(--bg-grey) }
.car-info-small-desc { font-size:0.8em; color:#666 }

.button-blue-dark { border-radius: var(--radius); background:var(--dark-blue); color:white; padding:8px; border:2px solid var(--dark-blue); width:130px }
.button-blue-light { border-radius: var(--radius); background:white; color:var(--dark-blue); padding:8px; border:2px solid var(--dark-blue); width:130px }
.button-grey { border-radius: var(--radius); background:white; color:var(--grey); padding:8px; border:2px solid var(--bg-grey); width:130px }
.button-active { border-radius: var(--radius); background:var(--orange); color:white; padding:8px; border:2px solid var(--orange); width:130px }
.button-orange-light { border-radius: var(--radius); background:white; color:var(--orange); padding:8px; border:2px solid var(--orange); width:130px }
.button-save { border-radius:var(--radius); background:var(--green); color:white; padding:8px; border:2px solid var(--green); width:130px  }
.button-large { width:auto; padding:8px 20px }
.bottom-buttons { margin:40px 0px; text-align:right }

/* main header row */
.container-inner { width:100%; max-width:var(--max-width); margin:0 auto; padding:6px var(--gap); display:flex; align-items:center; gap:12px; }

/* brand: ensure vertical centering */
.brand { display:flex; align-items:center; height:56px; margin:20px 0px }
.brand IMG  {width:210px; height:auto; display:block; vertical-align:middle }

nav.main-nav { margin-left:auto; display:flex; align-items:center; gap:22px; font-size:var(--menu-font-size); font-weight:var(--menu-font-weight); xtext-transform:uppercase; letter-spacing:0.6px; }
nav.main-nav A { color:#fff;opacity:0.95 }
nav.main-nav A:hover { opacity:1 }

.lang-switch { display:flex; gap:8px; align-items:center }
.lang-flag{ width:34px; height:22px; overflow:hidden; cursor:pointer; background-size:cover; background-position:center; }
.lang-flag[aria-pressed="true"] { outline:2px solid rgba(255,255,255,0.22); opacity:1 }

/* Hamburger */
.hamburger{ display:none; margin-left:auto; width:44px; height:38px; border-radius:8px; border:0; background:rgba(255,255,255,0.06); color:#fff; cursor:pointer; align-items:center; justify-content:center }
.hamburger:focus { outline:2px solid rgba(255,255,255,0.18) }

/* Mobile menu */
.mobile-menu { display:none;position: fixed; top:0; right:0; width:280px; height:100vh; background:linear-gradient(180deg, rgba(68,113,255,1), rgba(68,113,255,0.95)); color:#fff; box-shadow:-8px 0 24px rgba(0,0,0,0.2); z-index:120; padding:20px; transform:translateX(100%); transition:transform .28s ease}
.mobile-menu.open { transform:translateX(0) }
.mobile-menu .close-btn { background:transparent; border:0; color:#fff; font-size:20px; cursor:pointer; margin-left:auto; }
.mobile-menu nav { display:flex; flex-direction:column; gap:14px; margin-top:8px; font-weight:600; text-transform:uppercase }
.mobile-menu nav A { color:#fff; text-decoration:none; padding:8px 6px; border-radius:6px; display:flex; align-items:center; gap:10px }
.mobile-login-icon { width:18px; height:18px; background-size:contain; background-repeat:no-repeat; background-position:center; filter:invert(1) brightness(1.2);}

.container--page { width:100%; max-width:var(--max-width); margin:0 auto; padding:24px var(--gap) 50px var(--gap); box-sizing:border-box; flex:1 0 auto;  }

.reservation-card { background:linear-gradient(180deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.02) 100%), var(--orange); border-radius:var(--radius); padding:20px; color:#fff; box-shadow:0 6px 18px rgba(0,0,0,0.08); width:100%; box-sizing:border-box; display:block; font-family:inherit }
.reservation-grid { display:grid; grid-template-columns: 1fr 1fr auto auto; gap:40px; align-items:start }


.field { display:flex; flex-direction:column; gap:6px; min-width:0 }
label { margin:0; font-weight:600; color:#fff }
select, input[type="date"], input, button { font-family:inherit; }
select, input[type="date"] { padding:10px 12px; border-radius:8px; border:1px solid rgba(0,0,0,0.08); background:#fff; color:#111; appearance:none }
.time-select { padding:10px 12px; border-radius:8px; border:1px solid rgba(0,0,0,0.08); background:#fff; color:#111; appearance:none; height:40px; box-sizing:border-box }
.date-time { display:flex; gap:8px; align-items:center }
.date-time > *{ height:40px; box-sizing:border-box }

.btn { background:var(--dark-blue); color:#fff; padding:10px 14px; border-radius:8px; border:0; cursor:pointer; font-weight:700; height:40px }
.btn:disabled { opacity:0.6; cursor:not-allowed }
.row-bottom { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:12px; flex-wrap:wrap }
.consent-inline { display:flex; align-items:center; gap:8px }
.consent-inline input { width:18px; height:18px }
.consent-inline label { color:#fff; font-weight:600; margin:0 }
#searchBtn { padding:0px 40px }

#login-section { max-width:600px; margin:40px auto; padding:20px; border-radius:var(--radius); }
#login-form h2 { text-align:center; margin-bottom:20px; }
#login-form label { display:block; margin-top:15px; font-weight:bold; color:black }
#login-form input { width: 100%; padding:10px; margin-top:5px; border:1px solid #ccc; border-radius:4px; }
#login-form button { width: 100%; padding: 12px; margin-top: 20px; background-color:var(--dark-blue); color: white; border: none; border-radius: 4px; cursor: pointer;}
#login-form button:hover { background-color: #004080; }
.login-links { text-align: center; margin-top: 15px; }
.login-links a { text-decoration: none; }
.info-bar { color:var(--orange) }
.login-section-content { display:flex; gap:20px; flex-wrap:wrap }
.login-section-content>DIV { flex:1; }

/* Carousel: aligned width same as orange form (no side padding) */
.carousel-wrap { width:100%; max-width:var(--max-width); margin:0 auto; padding:0; box-sizing:border-box; margin-top:28px; }
.carousel-title { font-weight:700; font-size:18px; margin:0 0 12px 0; padding-left:0 }
.carousel{ position:relative; overflow:hidden; width:100%; background:transparent; padding:10px 0px }
.carousel-track{ display:flex; gap:var(--carousel-gap); transition:transform .45s cubic-bezier(.22,.9,.35,1); will-change:transform; padding-bottom:6px; padding-left:0 }

/* Desktop (>= 750px): show 5 items */
.carousel-item { flex:0 0 calc((100% - (4 * var(--carousel-gap))) / 5); max-width:calc((100% - (4 * var(--carousel-gap))) / 5); background:var(--card-bg); border-radius:12px; overflow:hidden; box-shadow:0 0px 10px rgba(10,20,40,0.08); display:flex; flex-direction:column; padding-top:5px }
.ci-media { width:90%; object-fit:contain; background:white; }
.ci-body { padding:10px; display:flex; flex-direction:column; gap:6px }
.ci-title { font-weight:700; color:#0f172a }
.ci-meta { font-size:12px; color:var(--muted) }
.ci-row { display:flex; justify-content:space-between; align-items:center; gap:8px }

.news { margin-top:8px; display:flex; gap:20px; flex-wrap:wrap; }
.news DIV { min-width:250px; flex: 1 0; width: 0; border-radius: var(--radius); padding:20px; }
.news-grey { background:var(--bg-grey); }
.news-orange { background:var(--orange-light); color:white; flex: 1 0; width: 0 }
.news-orange H1 { color:white }

.contact { margin-top:50px; }
.contact-item { display:flex; gap:30px; flex-wrap:wrap;  xflex: 1 1 0; xwidth:0 }
.contact-logo { max-width:150px; padding-top:20px }
.contact-map { width:100%; min-height:250px; }
.contact-address { border-radius: var(--radius); background:var(--bg-blue); color:white; padding:20px; display:flex; flex:1 1 auto; flex-direction:column; flex-wrap:wrap; gap:10px }

.visually-hidden { position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden }

@media (max-width:991px) { .reservation-grid { grid-template-columns:repeat(2,1fr); gap:20px } }
@media (max-width:560px) { .reservation-grid { grid-template-columns:1fr; gap:20px } }

/* Between 480 and 749px: 3 visible */
@media (max-width:749px){
	.carousel-item { flex:0 0 calc((100% - (2 * var(--carousel-gap))) / 3); max-width:calc((100% - (2 * var(--carousel-gap))) / 3); }
	.ci-media { height:100px }
	.ci-body { padding:9px }
	.ci-title { font-size:13px }
	.ci-meta { font-size:12px }
}

/* Under 480px: 1 visible (full width-ish) */
@media (max-width:479px){
	.carousel-item { flex:0 0 45%; max-width:45% }
	.ci-media { height:72px }
	.ci-body { padding:8px }
	.ci-title { font-size:13px }
	.ci-meta { font-size:11px }
	.carousel-track { gap:12px; padding-left:6px }
}

/* Mobile behavior: hide top login in header and show login only in mobile menu */
@media (max-width:750px){
	:root { --max-width: 100%; /* mobilní režim */ }
	.header-top { display:none }
	.footer-inner { gap:10px }
	.brand { margin:0px }
	nav.main-nav { display:none }
	.hamburger { display:flex }
	.container-inner { padding:10px 14px }
	.brand IMG { width:150px; height:auto }
	.mobile-menu { width:92vw; max-width:320px; display:block }
	.container--page { padding:20px 14px 50px 14px }
	.car { flex-flow:column; gap:0px }
	.car-item { padding:10px }
	.car-left { width:100%; text-align:center }
	.car-price { grid-template-columns: 50% 50%; gap:10px 0px; margin-top:20px }
	.car-price > :first-child { display: none; }
	.car-price-var { grid-column: span 3; border-radius:var(--radius); background:var(--bg-grey); padding:5px 0px; xwidth:95%; text-align:center }
	.car-icons { display:grid;  grid-template-columns:1fr 1fr;  gap:5px;  }
	.car-info { padding-top:0px }
	.car-more-info { margin-top:10px }
	.car-info-inner { display:block }
	.car-info-inner H1 { margin-top:10px }
	.button-blue-light, .button-blue-dark { width:150px }
	.acc-longdesc { display:none }
	.acc-longdesc-text H1 { display:none }
	.login-section-content { gap:10px; }
	#login-section { margin:20px 0px; }
	#login-section H2 { margin-bottom:0px; }
	.login-section-content>DIV { flex:none; width:100% }
}