/* Tasuro — doplňkové styly nad Tailwind */

[x-cloak] { display: none !important; }

html { scroll-behavior: smooth; }

/* Sjednocený vstupní prvek formuláře */
.ts-input {
  width: 100%;
  border-radius: 0.75rem;
  border: 1px solid #e2e8f0;        /* slate-200 */
  background: #fff;
  padding: 0.7rem 0.9rem;
  font-size: 0.95rem;
  color: #1d293d;
  transition: border-color .15s, box-shadow .15s;
}
.ts-input:focus {
  outline: none;
  border-color: #16a34a;            /* brand */
  box-shadow: 0 0 0 3px rgba(98, 95, 255, .15);
}

/* Právní stránky — jednoduchá typografie */
.prose-legal h2 { font-size: 1.15rem; font-weight: 700; margin: 1.6rem 0 .5rem; color: #1d293d; }
.prose-legal p, .prose-legal li { color: #475569; line-height: 1.7; margin: .4rem 0; }
.prose-legal ul { list-style: disc; padding-left: 1.25rem; }
.prose-legal a { color: #16a34a; text-decoration: underline; }
.prose-legal table { width: 100%; border-collapse: collapse; margin: 1rem 0; font-size: .9rem; }
.prose-legal th, .prose-legal td { border: 1px solid #e2e8f0; padding: .6rem .75rem; text-align: left; }
.prose-legal th { background: #f8fafc; }

/* Drobná animace při záměně jídla */
.meal-swapping { opacity: .4; transition: opacity .2s; }

/* --- Mobilní aplikace: bezpečné zóny (notch / Dynamic Island / home indicator) --- */
/* Hlavička aplikace vyplní výřez svým pozadím a obsah posune pod něj. */
.ts-app-header { padding-top: env(safe-area-inset-top, 0px); }
/* Spodní bezpečná zóna + boční insety pro obsah v aplikaci. */
.app-mode {
  padding-bottom: env(safe-area-inset-bottom, 0px);
  padding-left: env(safe-area-inset-left, 0px);
  padding-right: env(safe-area-inset-right, 0px);
}

/* --- Dekorativní kouzelník v pozadí obsahu --- */
.ts-wizard-bg {
  position: fixed;
  right: max(1rem, calc((100vw - 72rem) / 2 - 6rem));
  bottom: -1.5rem;
  z-index: 0;                 /* za obsahem (main má vyšší vrstvu díky relative) */
  pointer-events: none;       /* neblokuje kliky */
  user-select: none;
  opacity: .10;
  filter: saturate(1.05);
  animation: ts-wizard-float 7s ease-in-out infinite;
}
.ts-wizard-bg img {
  width: clamp(160px, 22vw, 300px);
  height: auto;
  display: block;
}
@keyframes ts-wizard-float {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50%      { transform: translateY(-14px) rotate(-1.5deg); }
}
.dark .ts-wizard-bg { opacity: .14; }

/* Obsah nad dekorací */
body > main, body > header, body > footer { position: relative; z-index: 1; }

/* Na malých displejích kouzelníka skryjeme, ať neruší formulář */
@media (max-width: 640px) {
  .ts-wizard-bg { opacity: .07; right: -2rem; }
  .ts-wizard-bg img { width: 130px; }
}
@media (prefers-reduced-motion: reduce) {
  .ts-wizard-bg { animation: none; }
}

/* --- Noční režim --- */
.dark .ts-input {
  background: #1e293b;        /* slate-800 */
  border-color: #334155;      /* slate-700 */
  color: #e2e8f0;             /* slate-200 */
}
.dark .ts-input:focus {
  border-color: #16a34a;
  box-shadow: 0 0 0 3px rgba(98, 95, 255, .25);
}
.dark .ts-input::placeholder { color: #64748b; }

.dark .prose-legal h2 { color: #f1f5f9; }
.dark .prose-legal p, .dark .prose-legal li { color: #cbd5e1; }
.dark .prose-legal th { background: #1e293b; color: #e2e8f0; }
.dark .prose-legal th, .dark .prose-legal td { border-color: #334155; }
.dark .prose-legal a { color: #8b88ff; }