/* ==================================================
   RESET
================================================== */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
html, body {
  width: 100%;
  height: 100%;
}
/* ==================================================
   GLASS – SPOLEČNÉ HODNOTY (DESIGN DNA)
================================================== */
:root {
  --top-bar-height: 0px;
  --glass-bg: rgba(255,255,255,0.42);
  --glass-blur: blur(14px);
  --glass-border: rgba(40,40,40,0.35);
}
/* ==================================================
   POZADÍ STRÁNKY
================================================== */
body {
  background-image: url("zahrada 2.png"); /* PNG ve stejné složce */
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;

  font-family: Arial, sans-serif;
  overflow-x: hidden;
}
/* ==================================================
   ZÁKLAD GLASS PANELU
================================================== */
.glass {
  background: var(--glass-bg);
  backdrop-filter: var(--glass-blur);
  -webkit-backdrop-filter: var(--glass-blur);
  border: 0px solid var(--glass-border);
}
/* ==================================================
   PRAVÝ VERTIKÁLNÍ GLASS PANEL (PŮLKA STRÁNKY)
================================================== */
.vertical-glass {
  position: fixed;
  top: var(--top-bar-height);
  right: 0;
  width: 50vw;
  height: calc(100vh - var(--top-bar-height));
  z-index: 3;
  pointer-events: auto;
}
.vertical-glass {
  --glass-bg: rgba(18,18,18,0.05);
  --glass-blur: blur(10px);

  background: linear-gradient(
    120deg,
    rgba(18,18,18,0.10),
    rgba(30,30,30,0.05)
  );

  backdrop-filter: blur(7px);
  -webkit-backdrop-filter: blur(7px);
}
/* ==================================================
   MOBILNÍ OPTIMALIZACE
================================================== */
@media (max-width: 768px) {
  :root {
    --glass-bg: rgba(255,255,255,0.22);
    --glass-blur: blur(4px);
  }
  .top-glass {
    font-size: 14px;
    letter-spacing: 0.08em;
  }
  .enter-button {
    bottom: 0;
    font-size: 16px;
    padding: 12px 0;
  }
}
/* ==================================================
   OBSAH GLASS PANELU – KVĚTINÁŘSTVÍ
================================================== */
.flower-content{
  position:absolute;
  top:50%;
  right:8%;
  transform:translateY(-50%);
  max-width:400px;
  text-align:left;
  pointer-events:auto;
}
/* NADPIS */
.flower-content h1{
  font-size:64px;
  color:white;
  font-weight:300;
  letter-spacing:0.05em;
  margin-bottom:16px;
  text-shadow:
    0 4px 20px rgba(0,0,0,0.25);
}
/* PODTEXT */
.flower-content p{
  font-size:20px;
  color:white;
  line-height:1.5;
  font-weight:300;

  text-shadow:
    0 2px 10px rgba(0,0,0,0.25);
}

.flower-content h1{
  font-size:64px;
  color:white;
  font-weight:300;
  letter-spacing:0.05em;
  backdrop-filter: blur(2px);
}
/* ==================================================
   TEXT NA GLASS PANELU – KVĚTINÁŘSTVÍ
================================================== */
.flower-text{
  position:absolute;
  top:30%;
  right:15%;
  transform:translateY(-50%);
  text-align:right;
  max-width:900px;
  z-index:1000; /* text je nad vším */
}
/* ==================================================
   TEXT NA GLASS PANELU – PODNADIS A JEHO POSUN
================================================== */
.flower-text p{
font-size:26px;
color:rgba(255,255,255,0.85);
font-weight:300;
letter-spacing:0.12em;
margin-top:20px;
margin-right:65px;
text-shadow:
    0 4px 18px rgba(0,0,0,0.25);
}
/* ==================================================
   NADPIS – DUHOVÁ ANIMACE + LUXUSNÍ GLOW
================================================== */

.flower-text h1{
  display:inline-block;
  position:relative;
  font-family: 'Playfair Display', serif;
  font-size:90px;
  font-weight:300;
  letter-spacing:0.03em;
  margin-bottom:12px;
  background: linear-gradient(
      90deg,
      #0f0f0f 0%,
      #0f0f0f 46%,
      #ffffff 48%,
      #f705df 50%,
      #ffffff 52%,
      #0f0f0f 54%,
      #0f0f0f 100%
  );
  background-size:400% 100%;
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  animation: rainbowSweep 25s linear infinite;
  filter: brightness(1.08);
  /* jemná luxusní mlha kolem textu */
  text-shadow:
      0 0 25px rgba(255,255,255,0.65),
      0 0 60px rgba(255,255,255,0.45),
      0 10px 40px rgba(255,255,255,0.35),
      0 6px 25px rgba(0,0,0,0.25);
}
/* ==================================================
   SVĚTELNÝ EFEKT POD TEXTEM
================================================== */
.flower-text h1::after{
  content:"";
  position:absolute;
  left:0;
  bottom:-35px;
  width:120%;
  height:160px;
   background:radial-gradient(
    ellipse at center,
    rgba(255,255,255,0.45) 0%,
    rgba(255,255,255,0.28) 30%,
    rgba(255,255,255,0.12) 55%,
    rgba(255,255,255,0) 85%
   );
  filter:blur(35px);
  z-index:-1;
}
/* ==================================================
   LINKA
================================================== */
.hero-line{
width:170%;
height:3px;
margin-top:-130px;
margin-bottom:10px;
margin-left:-50%;

background:linear-gradient(
to right,
rgba(18,18,18,0) 0%,
rgba(247,5,223,0.3) 20%,
rgba(247,5,223,0.9) 35%,
rgba(247,5,223,0.3) 45%,
rgba(18,18,18,0.5) 100%
);
}
/* ==================================================
   ANIMACE DUHY
================================================== */
@keyframes rainbowSweep{
  0%{
    background-position:200% 0;
  }
  100%{
    background-position:-200% 0;
  }
}
/* ==================================================
   PODTEXT
================================================== */
.flower-text p{
  font-size:32px;
  color:rgba(255,255,255,0.85);
  font-weight:300;
  letter-spacing:0.12em;
  margin-top:12px;
  text-shadow:
      0 4px 18px rgba(0,0,0,0.25);
}
/* =================================================
   SEKCE TLAČÍTKA
================================================= */
.flower-buttons{
display:flex;
gap:40px;
position:absolute;
top:41%;
right:3%;
transform:translateY(-50%);
z-index:1000;
/* důležité – umožní hover uvnitř glass panelu */
pointer-events:auto;
}
/* =================================================
   GLASS ČTVEREC TLAČÍTKO 
================================================= */
.flower-circle{
  width:145px;
  height:60px;
  border-radius:8px;

  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;

  text-decoration:none;
  color:white;

  position:relative;
  overflow:hidden;

  border:2px solid rgba(247,5,223,0.5); /* 🔥 vínová linka */

  box-shadow:
  0 -8px 20px rgba(255,255,255,0.20) inset,
  0 -3px 10px rgba(255,255,255,0.10),
  0 10px 25px rgba(0,0,0,0.08);

  transition:all 0.35s ease;
  pointer-events:auto;
}

.flower-circle::before{
  content:"";
  position:absolute;
  inset:0;

  background:rgba(18,18,18,0.15); /* 🔥 šedý glass */

  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);

  z-index:0;
}
.flower-circle *{
  position:relative;
  z-index:1;
}
.flower-circle:hover{
  transform:translateY(-4px);

  box-shadow:
  0 0 25px rgba(255,255,255,0.6),
  0 15px 35px rgba(0,0,0,0.2);
}
/* =================================================
   KVĚTINA
================================================= */
.flower-icon{
font-size:40px;
margin-bottom:6px;
transition:transform 0.35s ease;
}
/* =================================================
   TEXT - TLAČÍTKA 
================================================= */
.flower-circle span{

  font-size:17px;
  font-weight:600;
  letter-spacing:0.05em;
  text-align:center;   
  width:100%; 
  background: linear-gradient(
      90deg,
      #2a2a2a 0%,
      #1a1a1a 45%,
      #ffffff 50%,
      #1a1a1a 55%,
      #ffffff 100%
  );

  background-size:300% 100%;

  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;

  text-shadow:
    0 1px 3px rgba(0,0,0,0.15),
    0 0 8px rgba(255,255,255,0.15);

}
/* =================================================
   HOVER EFEKT
================================================= */
.flower-circle:hover{
animation:flowerShake 0.6s ease;
/* jemný glass glow bez tmavého stínu */
box-shadow:
0 0 18px rgba(255,255,255,0.35),
inset 0 0 20px rgba(255,255,255,0.35);
}
/* květina lehce poskočí */
.flower-circle:hover .flower-icon{
transform:translateY(-6px) scale(1.15);
}
/* =================================================
   ZATŘESENÍ
================================================= */
@keyframes flowerShake{
0%{ transform:scale(1) rotate(0deg); }
25%{ transform:scale(1.04) rotate(1deg); }
50%{ transform:scale(1.04) rotate(-1deg); }
75%{ transform:scale(1.03) rotate(1deg); }
100%{ transform:scale(1.05) rotate(0deg); }
}
/* =================================================
   SPODNÍ FOTO PÁS
================================================= */
.flower-strip{
position:fixed;
bottom:0;
left:0;
width:100%;
height:130px;
display:flex;
align-items:center;
overflow:hidden;
z-index:500;

/* 🔥 TMAVÝ GLASS */
background:linear-gradient(
  180deg,
  rgba(18,18,18,0.10) 0%,
  rgba(18,18,18,0.10) 40%,
  rgba(18,18,18,0.10) 100%
);

backdrop-filter:blur(8px);
-webkit-backdrop-filter:blur(8px);

border-top:0px solid rgba(255,255,255,0.08);

box-shadow:
  inset 0 0 25px rgba(0,0,0,0.4),
  0 -5px 20px rgba(0,0,0,0.15),
  0 10px 25px rgba(0,0,0,0.5);
}
/* =================================================
   FADE OKRAJE GALERIE
================================================= */
.flower-strip::before,
.flower-strip::after{
content:"";
position:absolute;
top:0;
height:100%;
width:520px;   /* ještě delší fade */
z-index:10;
pointer-events:none;
}
.flower-strip::before{
left:0;
background:linear-gradient(
to right,
rgba(255,255,255,0.55) 0%,
rgba(255,255,255,0.45) 20%,
rgba(255,255,255,0.35) 35%,
rgba(255,255,255,0.25) 50%,
rgba(255,255,255,0.15) 65%,
rgba(255,255,255,0.07) 80%,
rgba(255,255,255,0.0) 100%
);
}
.flower-strip::after{
right:0;
background:linear-gradient(
to left,
rgba(255,255,255,0.55) 0%,
rgba(255,255,255,0.45) 20%,
rgba(255,255,255,0.35) 35%,
rgba(255,255,255,0.25) 50%,
rgba(255,255,255,0.15) 65%,
rgba(255,255,255,0.07) 80%,
rgba(255,255,255,0.0) 100%
);
}
/* =================================================
   TRACK
================================================= */
.flower-track{
display:flex;
gap:20px;
width:max-content;
padding:15px;
animation:flowerScroll 30s linear infinite;
}
/* =================================================
   OBRÁZKY
================================================= */
.flower-track img{
height:110px;
width:240px;
border-radius:8px;
object-fit:cover;
 object-position: center center;
border:3px solid rgba(18,18,18,0.50);
box-shadow:0 10px 25px rgba(0,0,0,0.25);
}
/* =================================================
   NEKONEČNÝ POHYB
================================================= */
@keyframes flowerScroll{
0%{
transform:translateX(0);
}
100%{
transform:translateX(-50%);
}
}
/* ==================================================
   GLASS PANEL NA ZAHRADU - KYTICE
================================================== */
.garden-overlay{
position:fixed;
overflow:hidden;
top:140px;
left:60px;
width:45vw;
height:70vh;
background:linear-gradient(
180deg,
rgba(255,255,255,0.45) 0%,
rgba(255,255,255,0.28) 100%
);
backdrop-filter:blur(10px);
-webkit-backdrop-filter:blur(10px);
border-radius:8px;
border:2px solid rgba(247,5,223,0.45);
box-shadow:
0 30px 80px rgba(0,0,0,0.35),
0 0 0 1px rgba(255,255,255,0.35) inset;
padding:50px;
color:white;
opacity:0;
visibility:hidden;
pointer-events:none;
transform-origin:top left;
transform:none;
transition:
transform 0.5s cubic-bezier(.22,.9,.3,1),
opacity 0.25s ease;
z-index:6;
}
.garden-overlay.active{
visibility:visible;
pointer-events:auto;
opacity:1;
}
.garden-overlay::after{
content:"";
position:absolute;
top:-120%;
left:-40%;
width:80%;
height:300%;
background:linear-gradient(
120deg,
rgba(255,255,255,0) 0%,
rgba(255,255,255,0.25) 45%,
rgba(255,255,255,0.55) 50%,
rgba(255,255,255,0.25) 55%,
rgba(255,255,255,0) 100%
);
transform:rotate(25deg);
opacity:0;
pointer-events:none;
}
.garden-overlay.active::after{
animation:glassLight 1.2s ease;
}
@keyframes glassLight{
0%{ left:-60%; opacity:0; }
30%{ opacity:1; }
100%{ left:120%; opacity:0; }
}
.garden-overlay-content img{
width:100%;
max-height:260px;
border-radius:14px;
margin:20px 0;
object-fit:cover;
box-shadow:none;
}
.garden-overlay-content ul{
margin-top:15px;
line-height:1.7;
}
/* =================================================
   KLIK EFEKT KVĚTINY
================================================= */
.flower-circle:active{
transform:scale(0.9);
}
/* jemné pulzování při hover */
.flower-circle:hover .flower-icon{
animation:flowerGrow 0.6s ease;
}
@keyframes flowerGrow{
0%{
transform:scale(1);
}
50%{
transform:scale(1.25);
}
100%{
transform:scale(1.15);
}
}
/* =================================================
   ZTMAVENÍ PŘI OTEVŘENÍ PANLU 
================================================= */
#pageDim{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.35);
backdrop-filter:blur(3px);
z-index:5;
display:none;
cursor:pointer; 
}
/* =================================================
   TLAČÍTKO VSTUP DO SHOPU
================================================= */
.shop-enter{
display:inline-block;
margin-top:20px;
margin-bottom:25px;   /* odsazení od textu */
padding:14px 28px;
border-radius:14px;
background:linear-gradient(
180deg,
rgba(255,248,235,0.75) 0%,
rgba(255,235,205,0.45) 100%
);
color:white;
text-decoration:none;
font-weight:600;
border:1px solid rgba(255,255,255,0.45);
backdrop-filter:blur(8px);
transition:0.3s;
}
.shop-enter:hover{
transform:translateY(-3px);
box-shadow:
0 0 20px rgba(255,255,255,0.45),
inset 0 0 20px rgba(255,255,255,0.35);
}
.shop-cta{
margin-top:18px;
margin-bottom:12px;
font-size:15px;
color:rgba(255,255,255,0.9);
}
/* =================================================
   MOBILNÍ VERZE - GLASS PANEL – polovina obrazovky
================================================= */
@media (max-width:768px){
.vertical-glass{
width:70%;
height:100%;
right:0;
top:0;
}
/* TEXT */
.flower-text{
top:18%;
right:70%;
transform:translate(50%,-50%);
text-align:center;
max-width:150%;
}
/* NADPIS */
.flower-text h1{
font-size:52px;
line-height:1.05;
}
/* PODNADPIS */
.flower-text p{
font-size:20px;
margin-right:0;
}
/* TLAČÍTKA */
.flower-buttons{
top:60%;
right:50%;
transform:translate(60%,-50%);
gap:15px;
display:grid;
grid-template-columns:repeat(2,1fr);
}
/* KRUHY */
.flower-circle{
width:80px;
height:80px;
border-radius:18px;
}
/* IKONA */
.flower-icon{
font-size:26px;
}
/* TEXT POD IKONOU */
.flower-circle span{
font-size:12px;
}
}
/* DEAKTIVACE ČERNÝ LINKY */
.flower-text h1{
caret-color: transparent;
user-select: none;
pointer-events: none;
}
@media (max-width:768px){
.garden-overlay{
width:95vw;
left:2.5vw;
padding:30px;
}
}
/* =================================================
   MOBILE - PANEL NAD VŠÍM
================================================= */
@media (max-width:768px){
.garden-overlay{
z-index:9999 !important;
position:fixed;
transform:translateZ(0);
}
#pageDim{
z-index:9998 !important;
}
.flower-strip{
z-index:500;
}
}
/* =================================================
   MOBILE - ŠIRŠÍ OBRÁZKY VE FILMOVÉM PÁSU
================================================= */
@media (max-width:768px){
.flower-strip{
height:70px;
}
.flower-track{
height:70px;
display:flex;
align-items:center;
}
/* obrázky */
.flower-track img{
height:60px;
width:100px;   /* tady se nastavuje šířka */
object-fit:cover;
margin:0 5px;
}
}
/* =================================================
   MOBIL - Úpravy filmového pásu
================================================= */
@media (max-width:768px){
.flower-strip::before,
.flower-strip::after{
display:none;
}
}
/* =================================================
   MOBIL - linka pod nadpisem
================================================= */
@media (max-width:768px){
.hero-line{
width:220px;
margin:auto;
}
}
@media (max-width:768px){
.flower-strip{
height:80px;
}
}
@media (max-width:768px){
.flower-text p{
font-size:20px;
font-weight:500;
color:rgba(255,255,255,0.75);
text-shadow:0 2px 10px rgba(0,0,0,0.30);
}
}
.garden-overlay-content{
color:#2b2b2b;
font-weight:550;
text-shadow:
0 2px 8px rgba(0,0,0,0.15);
}
/* =================================================
   SCROLL UVNITŘ PANELU
================================================= */
.garden-overlay-content{
height:calc(70vh - 100px);
overflow-y:auto;
overflow-x:hidden;
padding-right:10px;
padding-bottom:30px;
scrollbar-width:none;
scroll-behavior:smooth;
}
.garden-overlay-content::-webkit-scrollbar{
display:none;
}
.garden-overlay-content{
scroll-behavior:smooth;
}
@media (max-width:768px){
.garden-overlay-content{
height:calc(70vh - 60px);
}
}

/* =================================================
   AKTUÁLNÍ HLAVNÍ TEXT STRÁNKY 
================================================= */
.main-slogan{
  position:absolute;
  top:50%;
  right:20%;
  transform:translateY(-50%);

  display:flex;
  flex-direction:column;
  align-items:flex-end;

  text-align:right;

  width:auto;        /* 🔥 KLÍČ */
  max-width:none;    /* 🔥 KLÍČ – ZRUŠ OMEZENÍ */
}

.main-slogan span{
  display:block;
  font-size:clamp(48px, 7vw, 84px);
  line-height:1.2;

  white-space: nowrap; /* ✔ zůstává */
}
/* =================================================
   CHAT / OBJEDNÁVKA PANEL
================================================= */
.chat-panel{
  position:fixed;
  bottom:160px;
  left:77%;
  transform:translateX(-50%);

  width:520px;
  height:340px;

  display:flex;
  flex-direction:column;

  border-radius:8px;

  background:linear-gradient(
    180deg,
    rgba(255,255,255,0.10) 0%,
    rgba(255,255,255,0.08) 100%
  );

  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);

  border:2px solid rgba(247,5,223,0.45);

  box-shadow:
    0 20px 50px rgba(0,0,0,0.18),
    0 0 25px rgba(247,5,223,0.18),
    inset 0 1px 0 rgba(255,255,255,0.3);

  overflow:hidden;
  z-index:800;
}

/* =================================================
   HEADER
================================================= */
.chat-header{
  padding:14px 16px;
  text-align:center;
  font-weight:600;
  color:#2a2a2a;

  background:linear-gradient(
    180deg,
    rgba(18,18,18,0.30),
    rgba(18,18,18,0.30)
  );

  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);

  border-bottom:1px solid rgba(247,5,223,0.35);
}

/* =================================================
   TABY
================================================= */
.chat-tabs{
  display:flex;
  justify-content:center;
  gap:18px;
}

.tab{
  cursor:pointer;
  opacity:0.65;
  transition:all 0.25s ease;
  padding:6px 14px;
  border-radius:8px;
  color:#2a2a2a;
}

.tab.active{
  opacity:1;
  font-weight:600;

  background:rgba(255,255,255,0.18);
  border:1px solid rgba(247,5,223,0.35);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.35),
    0 6px 14px rgba(0,0,0,0.1);
}

/* =================================================
   OBSAH TABŮ
================================================= */
.tab-content{
  display:none;
  flex:1;
  min-height:0;
  overflow:hidden;
}

.tab-content.active{
  display:flex;
  flex-direction:column;
}

/* =================================================
   CHAT BODY (scroll neviditelný ✔)
================================================= */
.chat-body{
  flex:1;
  min-height:0;
  padding:14px;

  overflow-y:auto;
  overflow-x:hidden;

  scrollbar-width:none;
  -ms-overflow-style:none;
  scroll-behavior:smooth;
}

.chat-body::-webkit-scrollbar{
  display:none;
}

/* =================================================
   BUBLINY (GLASS STYLE 🔥)
================================================= */
.chat-bubble{
  max-width:80%;
  padding:10px 14px;
  margin:8px 0;
  border-radius:8px;
  font-size:15px;
  line-height:1.4;

  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);

  border:1px solid rgba(255,255,255,0.35);

  box-shadow:
    0 8px 18px rgba(0,0,0,0.12),
    inset 0 1px 0 rgba(255,255,255,0.4);
}

/* BOT – světlejší, jemný */
.chat-bubble.bot{
  background:linear-gradient(
    135deg,
    rgba(255,255,255,0.45),
    rgba(255,255,255,0.25)
  );
  color:#2a2a2a;
}

/* USER – šedý glass (ale pořád elegantní) */
.chat-bubble.user{
  background:linear-gradient(
    135deg,
    rgba(180,180,180,0.25),
    rgba(120,120,120,0.15)
  );
  color:#1a1a1a;

  margin-left:auto;
}

/* =================================================
   INPUT
================================================= */
.chat-input{
  display:flex;
  gap:8px;
  padding:10px 12px;

  /* 🔥 STEJNÝ GLASS JAK TLAČÍTKA */
  background:linear-gradient(
    180deg,
    rgba(18,18,18,0.35),
    rgba(18,18,18,0.15)
  );

  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);

  /* 🔥 VÍNOVÁ LINKA */
  border-top:1px solid rgba(247,5,223,0.35);

  /* ✨ HLUBKA (glass efekt) */
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.15),
    0 -6px 20px rgba(0,0,0,0.2);
}

.chat-input input{
  flex:1;
  padding:11px 14px;

  border:none;
  outline:none;
  border-radius:12px;

  background:rgba(255,255,255,0.25);
  color:#2a2a2a;

  box-shadow:
    inset 0 1px 3px rgba(0,0,0,0.08),
    inset 0 1px 0 rgba(255,255,255,0.25);
}

.chat-input input::placeholder{
  color:rgba(0,0,0,0.45);
}

.chat-input button{
  padding:11px 16px;
  border:none;
  border-radius:12px;
  cursor:pointer;
  color:#2a2a2a;
  font-weight:600;

  background:linear-gradient(
    135deg,
    rgba(247,5,223,0.85),
    rgba(180,90,140,0.85)
  );

  box-shadow:
    0 10px 20px rgba(180,90,140,0.25),
    inset 0 1px 0 rgba(255,255,255,0.25);

  transition:0.25s ease;
}

.chat-input button:hover,
.order-btn:hover{
  transform:translateY(-1px);
}

/* =================================================
   OBJEDNÁVKA
================================================= */
.order-body{
  flex:1;
  min-height:0;

  display:flex;
  flex-direction:column;
  gap:10px;
  padding:14px;

  overflow-y:auto;
  overflow-x:hidden;

  scrollbar-width:none;
  -ms-overflow-style:none;
}

.order-body::-webkit-scrollbar{
  display:none;
}

.form-row{
  display:flex;
  gap:10px;
}

.form-row input{
  flex:1;
}

.order-body input,
.order-body textarea,
.order-body select{
  width:100%;
  padding:11px 13px;

  border:none;
  outline:none;
  border-radius:8px;

  background:rgba(255,255,255,0.75);
  color:#222;
  font-size:14px;

  box-shadow:
    0 6px 14px rgba(0,0,0,0.06),
    inset 0 1px 0 rgba(255,255,255,0.6);

  transition:0.25s ease;
}

.order-body input:focus,
.order-body textarea:focus,
.order-body select:focus{
  background:rgba(255,255,255,0.9);

  box-shadow:
    0 0 0 1px rgba(180,90,140,0.4),
    0 8px 18px rgba(180,90,140,0.15);
}

.order-body textarea{
  min-height:90px;
  resize:none;
}

.order-btn{
  padding:12px 16px;
  border:none;
  border-radius:8px;
  cursor:pointer;

  color:#2a2a2a;
  font-size:14px;
  font-weight:600;

  background:linear-gradient(
    135deg,
    rgba(200,120,160,0.9),
    rgba(180,90,140,0.9)
  );

  box-shadow:
    0 12px 24px rgba(180,90,140,0.25),
    inset 0 1px 0 rgba(255,255,255,0.25);

  transition:0.25s ease;
}

/* ========================================
   FORCE GLASS BUBLINY (PŘEPÍŠE VŠE)
======================================== */

.chat-body .chat-bubble{
  background:linear-gradient(
    135deg,
    rgba(180,180,180,0.25),
    rgba(120,120,120,0.15)
  ) !important;

  backdrop-filter:blur(14px) !important;
  -webkit-backdrop-filter:blur(14px) !important;

  border:1px solid rgba(255,255,255,0.35) !important;

  box-shadow:
    0 8px 18px rgba(0,0,0,0.12),
    inset 0 1px 0 rgba(255,255,255,0.4) !important;

  color:#1a1a1a !important;
}

/* BOT */
.chat-body .chat-bubble.bot{
  background:linear-gradient(
    135deg,
    rgba(220,220,220,0.35),
    rgba(180,180,180,0.18)
  ) !important;
}

/* USER */
.chat-body .chat-bubble.user{
  background:linear-gradient(
    135deg,
    rgba(160,160,160,0.28),
    rgba(100,100,100,0.18)
  ) !important;

  margin-left:auto !important;
}

/* ========================================
   FORCE GLASS OBJEDNÁVKA
======================================== */

.order-body input,
.order-body textarea,
.order-body select{

  background:linear-gradient(
    135deg,
    rgba(200,200,200,0.35),
    rgba(150,150,150,0.18)
  ) !important;

  backdrop-filter:blur(12px) !important;
  -webkit-backdrop-filter:blur(12px) !important;

  border:1px solid rgba(255,255,255,0.4) !important;

  color:#1a1a1a !important;

  box-shadow:
    0 6px 16px rgba(0,0,0,0.1),
    inset 0 1px 0 rgba(255,255,255,0.4) !important;
}

.order-body input:focus,
.order-body textarea:focus,
.order-body select:focus{

  background:linear-gradient(
    135deg,
    rgba(220,220,220,0.5),
    rgba(180,180,180,0.25)
  ) !important;

  box-shadow:
    0 0 0 1px rgba(180,180,180,0.5),
    0 8px 20px rgba(0,0,0,0.15) !important;
}

.chat-panel:hover{
  transform:translateX(-50%) scale(1.015);

  box-shadow:
    0 30px 70px rgba(0,0,0,0.3),
    0 0 35px rgba(247,5,223,0.35);
}

.custom-select{
  position:relative;
}

.select-selected{
  padding:11px 13px;
  border-radius:8px;

  background:linear-gradient(
    135deg,
    rgba(200,200,200,0.35),
    rgba(150,150,150,0.18)
  );

  backdrop-filter:blur(12px);
  border:1px solid rgba(247,5,223,0.35);

  color:#1a1a1a;
  cursor:pointer;
}

.select-options{

  position:absolute;
  top:110%;
  left:0;
  right:0;

  display:none;

  padding:10px;

  /* 🔥 hlavní trik */
  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,0.85),
      rgba(240,240,240,0.75)
    );

  backdrop-filter:blur(12px);

  border:1px solid rgba(120,120,120,0.25);
  border-radius:10px;

  box-shadow:
    0 10px 30px rgba(0,0,0,0.15),
    inset 0 1px 0 rgba(255,255,255,0.6);

  z-index:999;
}

.select-options div{
  padding:10px 12px;
  cursor:pointer;
}

.select-options div:hover{
  background:rgba(247,5,223,0.15);
}

.custom-date{
  position:relative;
}

.date-selected{
  padding:11px 13px;
  border-radius:8px;

  background:linear-gradient(
    135deg,
    rgba(200,200,200,0.35),
    rgba(150,150,150,0.18)
  );

  backdrop-filter:blur(12px);
  border:1px solid rgba(247,5,223,0.35);

  color:#1a1a1a;
  cursor:pointer;
}

.date-picker{
  position:absolute;
  top:110%;
  left:0;
  right:0;

  display:none;

  background:linear-gradient(
    135deg,
    rgba(220,220,220,0.45),
    rgba(180,180,180,0.25)
  );

  backdrop-filter:blur(16px);

  border:1px solid rgba(247,5,223,0.35);
  border-radius:8px;

  z-index:999;
}

.date-picker div{
  padding:10px;
  cursor:pointer;
}

.date-picker div:hover{
  background:rgba(247,5,223,0.15);
}

.calendar{

  position:absolute;
  top:110%;
  left:0;
  right:0;

  display:none;
  padding:12px;

  /* 🔥 pevný glass */
  background:
    linear-gradient(
      135deg,
      rgba(255,255,255,0.9),
      rgba(235,235,235,0.8)
    );

  backdrop-filter:blur(14px);

  border:1px solid rgba(120,120,120,0.25);
  border-radius:10px;

  box-shadow:
    0 15px 40px rgba(0,0,0,0.2),
    inset 0 1px 0 rgba(255,255,255,0.7);

  z-index:999;
}

.calendar-header{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:10px;
  font-weight:600;
  color:#1a1a1a;
}

.calendar-header button{
  background:none;
  border:none;
  cursor:pointer;
  font-size:18px;
  color:#1a1a1a;
}

.calendar-days{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:6px;
}

.calendar-days div{
  padding:8px;
  text-align:center;
  border-radius:6px;
  cursor:pointer;
}

.calendar-days div:hover{
  background:rgba(247,5,223,0.2);
}

.calendar-days .today{
  border:1px solid rgba(247,5,223,0.6);
}

.calendar-days .selected{
  background:rgba(247,5,223,0.6);
  color:white;
}

.select-options div,
.calendar-days div{

  padding:8px;
  border-radius:6px;
  cursor:pointer;

  transition:all 0.2s ease;
}

.select-options div:hover,
.calendar-days div:hover{

  background:rgba(247,5,223,0.15);

  transform:scale(1.03);
}

.order-btn{
  transition:all 0.2s ease;
}

.order-btn:hover{
  transform:scale(1.05);
  box-shadow:0 8px 20px rgba(0,0,0,0.2);
}

.order-message{
  min-height: 20px;
  margin-top: 4px;
  margin-bottom: 6px;
  padding: 8px 10px;
  border-radius: 8px;
  font-size: 14px;
  text-align: center;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.order-message.success{
  background: rgba(0,180,120,0.2);
  color: #0a5c3c;
}

.order-message.error{
  background: rgba(255,80,80,0.2);
  color: #7a1a1a;
}

.clear-chat-btn{
  margin-left:8px;
  padding:10px 14px;

  border-radius:10px;
  border:1px solid rgba(120,120,120,0.3);

  background:rgba(80,80,80,0.25);
  backdrop-filter:blur(8px);

  color:#ddd;
  font-size:13px;

  cursor:pointer;
  transition:0.3s;
}

.clear-chat-btn:hover{
  background:rgba(120,120,120,0.35);
  color:white;
}

.pk-signature{
  position:fixed;
  bottom:15px;
  left:50%;
  transform:translateX(-50%);

  font-size:13px;
  color:rgba(40,40,40,0.7);

  background:rgba(200,200,200,0.15);
  backdrop-filter:blur(10px);

  padding:6px 14px;
  border-radius:12px;

  border:1px solid rgba(120,120,120,0.2);

  box-shadow:
    0 4px 12px rgba(0,0,0,0.08),
    inset 0 1px 0 rgba(255,255,255,0.3);

  z-index:999;
}