html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

img,
video,
svg,
canvas {
  max-width: 100%;
}

button,
a,
input,
select,
textarea {
  -webkit-tap-highlight-color: transparent;
}

#page-content {
  min-height: 100vh;
}

.modal-overlay:not(.open) {
  pointer-events: none;
}

.modal-box,
.admin-card,
.card,
.price-box,
.guarantee-badge,
.testimonial-card,
.contact-card {
  max-width: 100%;
}

.form-input,
.admin-input,
textarea,
select {
  max-width: 100%;
}

@media (max-width: 768px) {
  .hero-floating-card {
    max-width: min(82vw, 280px);
  }

  .app-hero-content {
    width: min(92vw, 560px);
  }

  .plan-toggle,
  .price-box,
  .modal-box {
    width: min(92vw, 620px);
  }
}

/* Fix for jittery animations and clipping borders on hover */
.card, .btn-cta, .btn-stripe, .btn-outline, .faq-item, .tab-btn, .video-card, .diet-card, .med-item, .settings-section, .price-box {
  will-change: transform, box-shadow;
  -webkit-font-smoothing: subpixel-antialiased;
}
.tab-btn { overflow: hidden; } /* zapobiega wychodzeniu gradientu */

/* Fix for backdrop-filter outline glitch */
.price-box, .btn-cta, .card { isolation: isolate; }

/* Restore missing transition on price-box */
.price-box { transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease, background 0.35s ease, border-color 0.35s ease !important; }

/* FORCE single scrollbar to fix the double scrollbar bug globally */
html { 
  overflow-y: auto !important; 
  overflow-x: hidden !important;
}
body, #appShell { 
  overflow-x: clip !important; /* clip never generates scrollbars unlike hidden */
  overflow-y: visible !important; 
}
.app-main, .tab-panel { 
  overflow: visible !important; 
}
