/* iPhone layout fixes. Keep existing branding, artwork and catalog design. */
:root { --border-color: var(--rule, #e2e8f0); --ink-deep: var(--ink, #0f172a); --cx-text-muted: var(--ink-mute, #64748b); }
/* Existing member badge used matching foreground/background colors. */
#member-auth-modal .modal-price-tag { color: #fff; font-size: 12px; display: inline-block; padding: 3px 8px; border-radius: 4px; }
@media (max-width: 768px) {
  html { -webkit-text-size-adjust: 100%; scroll-padding-top: 122px; }
  input:not([type=radio]):not([type=checkbox]), select, textarea { font-size: 16px !important; min-height: 44px; max-width: 100%; min-width: 0; }
  input, select, textarea { scroll-margin-top: 100px; scroll-margin-bottom: 24px; }
  button, a { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
  .site-header .container { gap: 8px; }
  .header-actions { flex-shrink: 0; gap: 6px; }
  /* Old mobile rule hid every label, leaving empty login and CS buttons. */
  .header-actions .pill-label { display: inline !important; }
  .header-actions .header-pill { min-height: 44px; height: auto; padding: 0 9px; font-size: 11px; }
  .header-pill--voucher, .header-pill--track { display: none !important; }
  .header-user-chip { min-width: 44px; min-height: 44px; justify-content: center; }
  .header-actions .cs-dot-live { display: none; }
  .nav-bar .container, .catalog-tabs, .filter-chips-row { -webkit-overflow-scrolling: touch; overscroll-behavior-x: contain; }
  .nav-bar .all-cats, .main-nav button, .main-nav a, .catalog-tab, .filter-chip { min-height: 44px; flex-shrink: 0; }
  .store-section { scroll-margin-top: 122px; }
  .tool-box, .tool-form-row, .search-wrapper, .catalog-tools-row { min-width: 0; }
  .tool-form-row .btn, .product-btn, .btn-car-buy { min-height: 44px !important; }
  .product-title, .car-name { overflow-wrap: anywhere; }
  .modal-overlay {
    padding: max(8px, env(safe-area-inset-top, 0px)) 0 0;
    align-items: flex-end;
    overscroll-behavior: contain;
  }
  .modal-window {
    width: 100% !important;
    max-width: 100% !important;
    max-height: calc(100vh - 16px) !important;
    max-height: calc(100dvh - max(16px, env(safe-area-inset-top, 0px))) !important;
    margin: 0 !important;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain;
    padding-bottom: max(16px, env(safe-area-inset-bottom, 0px));
  }
  body:has(.modal-overlay:not(.hidden)), body:has(.modal-backdrop:not(.hidden)) { overflow: hidden; }
  .modal-header { position: sticky; top: 0; z-index: 10; background: var(--paper, #fff); gap: 10px; }
  .modal-header-content { min-width: 0; }
  .modal-header-content h3 { overflow-wrap: anywhere; line-height: 1.4; }
  .modal-close { width: 44px; height: 44px; min-width: 44px; flex-shrink: 0; }
  .modal-body { overflow-wrap: anywhere; }
  .modal-account-mode-selector { gap: 6px; }
  .mode-radio-label { min-height: 44px; padding: 10px 8px; }
  .qris-auto-banner-simple, .qris-meta-bar, .qris-card-header, .qris-timer-row { flex-wrap: wrap; gap: 8px; }
  .qris-meta-left, .qris-amount-details { min-width: 0; }
  .qris-meta-id, .qris-merchant-sub { overflow-wrap: anywhere; }
  .qris-card-wrapper { width: 100%; max-width: 100%; }
  .qris-img-container { max-width: 100%; }
  .qris-img-container img { width: 260px; max-width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; }
  .qris-actions-row > *, .btn-copy-amount { min-height: 44px; }
  .qris-tip-content { min-width: 0; }
  .cred-item, .cred-row { min-width: 0; flex-wrap: wrap; gap: 6px; }
  .cred-item > div, .cred-val { min-width: 0; overflow-wrap: anywhere; }
  .cred-copy-btn, .cred-copy-pill { min-height: 44px; }
  .notice-window { max-width: calc(100% - 24px); max-height: calc(100dvh - 32px); overflow-y: auto; margin: auto; }
  .lightbox-content, .lightbox-content img { max-height: 85dvh; }
  .mobile-bar { height: auto; min-height: 60px; padding-bottom: max(8px, env(safe-area-inset-bottom, 0px)); padding-left: max(8px, env(safe-area-inset-left, 0px)); padding-right: max(8px, env(safe-area-inset-right, 0px)); }
  .mobile-bar-item { min-height: 44px; }
  body:has(.mobile-bar) { padding-bottom: calc(74px + env(safe-area-inset-bottom, 0px)); }
  .scroll-to-top { bottom: calc(82px + env(safe-area-inset-bottom, 0px)); }
  .page-redeem .site-header .container { padding-inline: max(12px, env(safe-area-inset-left, 0px)) !important; }
  .page-redeem .brand > span:last-child { display: none; }
  .page-redeem .brand > span:nth-child(2), .page-redeem .brand-accent { display: inline; }
  .page-redeem .header-actions .header-pill { min-height: 44px; font-size: 11px; }
  .page-redeem .redeem-input-big { min-height: 50px; }
  :is(.page-inject, .page-unban) .nav-container { gap: 10px; padding-inline: 12px; }
  :is(.page-inject, .page-unban) .nav-link { display: inline-flex; align-items: center; min-height: 44px; }
}
@media (max-width: 360px) {
  .site-header .brand { font-size: 15px; gap: 5px; }
  .header-actions .header-pill { font-size: 10px; padding-inline: 7px; }
  .header-actions { gap: 4px; }
}
@media (max-width: 768px) and (orientation: landscape) {
  .modal-overlay { padding: 8px; align-items: center; }
  .modal-window { max-width: 600px !important; border-radius: 16px !important; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}