/*
  Vizuál je záměrně přiblížen původnímu webu:
  - tmavé pozadí
  - světlé „záložky“ menu
  - jednoduchý banner se slideshow
*/
:root{
  --bg:#000000;
  --text:#ffffff;
  --muted:#d0d0d0;
  --border:#444444;
  --panel:#0c0c0c;
  --menu-tab:#b6b6b6;
  --menu-tab-hover:#d6d6d6;
  --menu-active:#5c5c5c;
  --menu-text:#000000;
  /* barevný panel obsahu – mění se podle sekce */
  --section-bg:#000000;
}

/* Sekční barevnost (přiblížení původnímu webu dle screenshotů) */
body.theme-pokoje{ --section-bg:#7b4a1b; }
body.theme-fotogalerie{ --section-bg:#7b4a1b; }
body.theme-rezervace{ --section-bg:#355f80; }
body.theme-kontakt{ --section-bg:#222222; }
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{font-family:Arial,Calibri,"Trebuchet MS",Helvetica,sans-serif;color:var(--text);background:var(--bg);line-height:1.7;}
a{color:inherit;}
.container{max-width:980px;margin:0 auto;padding:0 18px;}

/* Header */
.site-header{border-bottom:1px solid #111;background:#000;}
.header-inner{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;padding:16px 0 10px 0;}
.brand{display:flex;flex-direction:column;gap:2px;text-decoration:none;}
.brand-title{font-size:24px;letter-spacing:0.2px;}
.brand-subtitle{font-size:13px;color:var(--muted);}
.nav{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end;}
.nav a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:48px;
  min-width:150px;
  padding:0 12px;
  text-decoration:none;
  font-weight:700;
  letter-spacing:0.4px;
  background:linear-gradient(#f2f2f2, #bfbfbf);
  color:var(--menu-text);
  border-radius:12px 12px 6px 6px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.70),
    inset 0 -1px 0 rgba(0,0,0,0.25),
    0 4px 10px rgba(0,0,0,0.55);
  border:1px solid rgba(255,255,255,0.20);
}
.nav a:hover{background:linear-gradient(#ffffff, #d6d6d6);}
.nav a.active, .nav a[aria-current="page"]{
  background:linear-gradient(#7a7a7a, #3f3f3f);
  color:#fff;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.20),
    inset 0 -1px 0 rgba(0,0,0,0.35),
    0 5px 12px rgba(0,0,0,0.65);
}

/* Banner (původní web měl velký obrázkový pruh se slideshow) */
.banner{background:var(--panel);border-top:1px solid #111;border-bottom:1px solid #111;}
.banner-inner{display:grid;grid-template-columns:320px 1fr;gap:18px;align-items:stretch;padding:14px 0;}
.banner-left{display:flex;flex-direction:column;justify-content:center;padding:10px 0;}
.banner-left h1{margin:0 0 8px 0;font-size:26px;font-weight:normal;}
.banner-left p{margin:0;color:var(--muted);}
.slideshow{position:relative;height:200px;overflow:hidden;border:1px solid #111;background:#000;}
.slideshow img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 800ms ease;}
.slideshow img.active{opacity:1;}

/* Úvodní rámeček ve stylu původního webu (logo vlevo + měnící se fotka vpravo) */
.hero-frame{padding:14px 0 8px 0;}
.frame{
  display:grid;
  grid-template-columns: 320px 1fr;
  gap:0;
  border:2px solid #2b2b2b;
  background:#000;
  box-shadow:0 0 0 1px rgba(255,255,255,0.08), 0 12px 24px rgba(0,0,0,0.55);
}
.frame-logo{background:#000;display:flex;align-items:stretch;justify-content:stretch;}
.frame-logo img{display:block;width:100%;height:230px;object-fit:cover;}

.frame-show{position:relative;height:230px;overflow:hidden;background:#000;}
.frame-show img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 900ms ease;}
.frame-show img.active{opacity:1;}

/* Diagonální „výřez“ vpravo (podobně jako původní rámeček) */
.frame-show{clip-path:polygon(0 0, 100% 0, 100% 70%, 86% 100%, 0 100%);}

/* Jemné překrytí (dává podobný dojem vrstvení jako původní obrázek) */
.frame-overlay{position:absolute;inset:0;pointer-events:none;background:
  linear-gradient(90deg, rgba(0,0,0,0.30) 0%, rgba(0,0,0,0.00) 30%, rgba(0,0,0,0.05) 100%),
  linear-gradient(135deg, rgba(255,255,255,0.10) 0%, rgba(255,255,255,0.00) 35%, rgba(0,0,0,0.15) 100%);
}

.hero-actions{margin-top:12px;display:flex;gap:10px;flex-wrap:wrap;}

/* Main */
.content{
  background:var(--section-bg);
  border:1px solid rgba(255,255,255,0.10);
  box-shadow:0 8px 18px rgba(0,0,0,0.55);
  padding:18px;
}
main{padding:22px 0 40px 0;}
.card{border:1px solid var(--border);background:#000;padding:0;}
.card h2{margin:0 0 10px 0;font-size:22px;color:#fff;}
.card h3{margin:18px 0 8px 0;font-size:16px;color:#fff;}
.list{margin:10px 0 0 18px;}
.highlight{padding:12px 14px;border:1px solid var(--border);background:#0d0d0d;color:#fff;}

h2{letter-spacing:-1px;font-size:26px;font-weight:normal;}
h3{font-size:15px;}

.bullets{margin-left:18px;}

.callout{margin-top:14px;padding:12px 14px;border:1px solid var(--border);background:#0d0d0d;}

/* Form */
.reserve-layout{display:grid;grid-template-columns: 1fr 380px;gap:18px;align-items:start;}
.reserve-photo{border:1px solid rgba(255,255,255,0.18);background:#000;box-shadow:0 8px 18px rgba(0,0,0,0.55);}
.reserve-photo img{display:block;width:100%;height:100%;max-height:420px;object-fit:cover;}

.form{display:flex;flex-direction:column;gap:14px;}
.form .row{display:grid;gap:14px;}
.form .row-2{grid-template-columns:1fr 1fr;}
.form .row-3{grid-template-columns:1fr 1fr 1fr;}
.field{display:flex;flex-direction:column;gap:6px;}
.field label{font-size:13px;color:#fff;font-weight:700;}
.field input,.field textarea, .field select{border:1px solid rgba(0,0,0,0.35);border-radius:6px;padding:10px 12px;font-size:14px;background:rgba(255,255,255,0.10);color:#fff;}
.field textarea{min-height:150px;resize:vertical;}
.form-help{padding-top:2px;}
.actions{display:flex;gap:10px;align-items:center;}
.btn{border:1px solid rgba(255,255,255,0.25);background:linear-gradient(#6b6b6b, #3e3e3e);color:#fff;border-radius:10px;padding:10px 14px;font-weight:800;cursor:pointer;text-decoration:none;display:inline-block;box-shadow:0 4px 10px rgba(0,0,0,0.55), inset 0 1px 0 rgba(255,255,255,0.25);}
.btn.btn-secondary{background:#b6b6b6;color:#000;border-color:#b6b6b6;}
.note{font-size:13px;color:var(--muted);}

/* Gallery */
.gallery{display:grid;grid-template-columns:repeat(3, 1fr);gap:12px;}
.thumb{border:1px solid var(--border);border-radius:0;overflow:hidden;background:#000;cursor:pointer;}
.thumb img{display:block;width:100%;height:220px;object-fit:cover;}
.section-title{margin:22px 0 10px 0;font-size:16px;color:#fff;font-weight:800;letter-spacing:0.2px;}

/* Contact */
.contact-grid{display:grid;grid-template-columns: 1fr 1fr;gap:18px;align-items:start;}
.contact-left{display:flex;flex-direction:column;gap:18px;}
.contact-card{border:1px solid rgba(255,255,255,0.14);background:rgba(0,0,0,0.20);padding:14px 14px 12px 14px;box-shadow:0 8px 18px rgba(0,0,0,0.40);}
.contact-card h2{margin:0 0 10px 0;font-size:18px;}
.contact-card h3{margin:14px 0 6px 0;font-size:14px;font-weight:800;}
.contact-primary{background:rgba(0,0,0,0.30);border-color:rgba(255,255,255,0.20);}
.contact-name{margin:0 0 8px 0;}
.contact-cols{display:grid;grid-template-columns: 1fr 1fr;gap:14px;}
.map iframe{width:100%;height:420px;border:0;display:block;}

/* Footer */
.site-footer{border-top:1px solid #111;padding:18px 0;color:var(--muted);font-size:13px;}
.footer-inner{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;}

/* Lightbox */
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,0.75);display:none;align-items:center;justify-content:center;padding:18px;z-index:999;}
.lightbox.open{display:flex;}
.lightbox-inner{max-width:1100px;width:100%;}
.lightbox img{width:100%;height:auto;border-radius:14px;display:block;}
.lightbox-close{position:fixed;top:14px;right:14px;border:1px solid rgba(255,255,255,0.25);background:rgba(0,0,0,0.35);color:#fff;border-radius:12px;padding:8px 10px;font-weight:800;cursor:pointer;}

/* Responsive */
@media (max-width: 900px){
  .banner-inner{grid-template-columns:1fr;}
  .frame{grid-template-columns:1fr;}
  .frame-show{clip-path:none;}
  .gallery{grid-template-columns:repeat(2, 1fr);}
  .thumb img{height:200px;}
  .reserve-layout{grid-template-columns:1fr;}
  .reserve-photo img{max-height:260px;}
  .contact-grid{grid-template-columns:1fr;}
  .contact-cols{grid-template-columns:1fr;}
}
@media (max-width: 560px){
  .nav{gap:8px;}
  .nav a{padding:8px 8px;}
  .form .row-2{grid-template-columns:1fr;}
  .form .row-3{grid-template-columns:1fr;}
  .gallery{grid-template-columns:1fr;}
  .thumb img{height:220px;}
}


/* --- Menu button skins (legacy style) --- */
.nav{gap:10px;}
.nav a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:42px;
  min-width:140px;
  padding:0 18px;
  border-radius:10px;
  color:#111;
  font-weight:700;
  letter-spacing:0.3px;
  text-transform:uppercase;
  text-decoration:none;
  background-repeat:no-repeat;
  background-size:100% 100%;
  background-position:center;
  border:none;
  box-shadow:0 8px 18px rgba(0,0,0,.35);
}
.nav a:hover{filter:brightness(1.03); transform:translateY(-1px);}
.nav a:active{transform:translateY(0);}

/* All tabs: white button + black text (legacy look) */
.nav a:nth-child(1){background-image:url("../images/nav/hmenu_uni.png");}
.nav a:nth-child(2){background-image:url("../images/nav/hmenu_uni.png");}
.nav a:nth-child(3){background-image:url("../images/nav/hmenu_uni.png");}
.nav a:nth-child(4){background-image:url("../images/nav/hmenu_uni.png");}

/* Keep text readable on active/pressed tab */
.nav a:visited{color:#111;}
.nav a.active,
.nav a[aria-current="page"]{
  color:#0b2e4a; /* tmavě modrá pro zvýraznění aktivní záložky */
  filter:brightness(0.96);
  box-shadow:0 10px 22px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.45);
}
.nav a.active:visited{color:#0b2e4a;}

@media (max-width: 700px){
  .nav{flex-wrap:wrap; justify-content:center;}
  .nav a{min-width:140px; height:44px;}
}

/* Section panel colors (match legacy palette) */
.theme-pokoje .content{background:rgba(198,168,21,.95); color:#111;}
.theme-pokoje .content h2,
.theme-pokoje .content h3,
.theme-pokoje .content p,
.theme-pokoje .content li{color:#111;}
.theme-pokoje .content a{color:#0b2e4a;}
.theme-fotogalerie .content{background:rgba(92,56,18,.95);}
.theme-rezervace .content{background:rgba(49,92,130,.95);}
.theme-kontakt .content{background:rgba(35,35,35,.95);}