/* Base styles only. Instance-specific CSS is injected inline by the widget.
   This file also includes "mobile visibility" and basic responsive safety rules,
   because themes/builders love hiding random things on mobile.
*/

.ptepsafe-wrap { 
  max-width: 100%;
  width: 100%;
  display: block;
  visibility: visible;
  opacity: 1;
}

.ptepsafe-wrap * { box-sizing: border-box; }

/* If some theme/plugin hides the widget on mobile, try to override it. */
@media (max-width: 1024px) {
  .ptepsafe-wrap {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
}

/* Prevent media overflow */
.ptepsafe-wrap img,
.ptepsafe-wrap video,
.ptepsafe-wrap iframe {
  max-width: 100%;
  height: auto;
}

/* Tables: allow horizontal scroll on small screens */
@media (max-width: 768px) {
  .ptepsafe-wrap table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
    width: 100%;
  }
}

/* iOS safe area helper (in case the translator uses fixed elements) */
.ptepsafe-wrap .is-fixed-bottom {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  padding-bottom: env(safe-area-inset-bottom);
  z-index: 9999;
}

/* Touch targets */
.ptepsafe-wrap button,
.ptepsafe-wrap a,
.ptepsafe-wrap input[type="button"],
.ptepsafe-wrap input[type="submit"] {
  min-height: 44px;
}
