/** Shopify CDN: Minification failed

Line 1599:4 Unexpected "}"

**/
/* SHOPIFY_STYLESHEETS_VERSION: 1.0 */


/* CSS from section stylesheet tags */
/* START_SECTION:apple-style-contact (INDEX:2) */
@media (max-width: 768px) {
  .apple-contact-form__success {
    animation: none !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    position: relative !important;
    z-index: 10 !important;
    /* Force immediate positioning */
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
  }
}
.apple-contact-form {
  min-height: 100svh;
  min-height: 100dvh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #ffffff;
  padding: 2rem 1rem;
  padding-bottom: calc(2rem + env(safe-area-inset-bottom));
  -webkit-tap-highlight-color: transparent;
  /* Floating-field spacing variables */
  --ff-gap: 0.625rem; /* 10px: gap above label, between label and text, and below text */
  --ff-label-size: 0.875rem; /* floated label font-size */
  --ff-bottom: 0.10rem; /* bottom padding for input text */
  /* Focused state: slightly smaller and a touch higher */
  --ff-label-size-focused: 0.8125rem; /* 13px */
  --ff-gap-focused: calc(var(--ff-gap) - 2px);
}

.apple-contact-form__container {
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
}

.apple-contact-form__title {
  font-size: 2.5rem;
  font-weight: 600;
  color: #1d1d1f;
  text-align: center;
  margin-bottom: 3rem;
}

.apple-contact-form__form {
  width: 100%;
}

.apple-contact-form__fields {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.apple-contact-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem ;
}

.apple-contact-form__field-wrapper {
  position: relative;
  width: 100%;
}

.apple-contact-form__error-message {
  position: absolute;
  bottom: -20px;
  left: 0;
  font-size: 0.75rem;
  color: #FF3B30;
  display: none;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.error-icon {
  flex-shrink: 0;
}

.apple-contact-form__field-wrapper--full {
  grid-column: 1 / -1;
}

.apple-contact-form__input {
  width: 100%;
  /* Top padding reserves space for label height + equal gap above/below text */
  padding: calc(var(--ff-gap) * 2 + var(--ff-label-size)) 0.75rem var(--ff-gap) 0.65rem;
  border: 1px solid #d2d2d7;
  border-radius: 8px;
  font-size: 1rem;
  background-color: #ffffff;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  outline: none;
  
  -moz-appearance: none;
  appearance: none;
  -webkit-appearance: none;
  /* Requested: bottom padding variable */
  padding-bottom: var(--ff-bottom, 0.10rem) !important;
}

/* Error state styling */
.apple-contact-form__input.error {
  border-color: #FF3B30;
  background-color: #FFF5F5;
}

.apple-contact-form__input.error::placeholder {
  color: #FF3B30;
}

.apple-contact-form__input:focus {
  border-color: #007aff !important;
  box-shadow: none !important;
  outline: none !important;
  transform: none !important;
}

/* Blue active border for select as well (native focus or JS-managed .focused) */
.apple-contact-form__select:focus {
  border-color: #007aff !important;
  box-shadow: inset 0 0 0 1px #007aff !important;
  outline: none !important;
}
/* Fallback error border for select */
.apple-contact-form__input--textarea {
  resize: vertical;
  min-height: 120px;
  /* Match single-line input spacing, add a bit more so long text never touches the floated label */
  /* Empty state placeholder top padding should be 24px */
  padding-top: 24px !important;
  line-height: 1.5;
  position: relative; /* create stacking context under the label */
  z-index: 0;
  /* Keep textarea bottom padding consistent with inputs */
  padding-bottom: var(--ff-bottom, 0.10rem) !important;
}

/* Align scrollbar/resizer within rounded border and remove square background while keeping diagonal lines */
.apple-contact-form__input--textarea {
  overflow: auto;
  /* Helps keep layout stable when scrollbar appears; safe fallback when unsupported */
  scrollbar-gutter: stable;
}

/* WebKit/Blink: make the resize corner background transparent but keep the diagonal lines */
.apple-contact-form__input--textarea::-webkit-resizer {
  background-color: transparent; /* keep corner square invisible */
  background-image: repeating-linear-gradient(
    135deg,
    rgba(0, 0, 0, 0.28) 0 2px,
    transparent 2px 6px
  ); /* add diagonal lines */
  background-size: 16px 16px;
  background-position: bottom right;
  background-repeat: no-repeat;
  border: none;
}

/* Hide the square scrollbar corner when both scrollbars are present */
.apple-contact-form__input--textarea::-webkit-scrollbar-corner {
  background: transparent;
}

/* Keep the scrollbar subtle and inside the radius */
.apple-contact-form__input--textarea::-webkit-scrollbar {
  width: 10px;
}
.apple-contact-form__input--textarea::-webkit-scrollbar-track {
  background: transparent;
}
.apple-contact-form__input--textarea::-webkit-scrollbar-thumb {
  background-clip: padding-box;
  border: 3px solid transparent;
  border-radius: 8px;
  background-color: rgba(0, 0, 0, 0.2);
}

/* Firefox */
@supports (scrollbar-width: thin) {
  .apple-contact-form__input--textarea {
    scrollbar-width: thin;
    scrollbar-color: rgba(0, 0, 0, 0.4) transparent;
  }
}

/* Fallback: when textarea is focused, ensure extra clearance even if JS .focused isn't applied */
.apple-contact-form__input--textarea:focus {
  /* Ensure first line is always below the label when focused */
  padding-top: 30px !important;
}

/* Also apply extra clearance whenever textarea has content (blurred state too) */
.apple-contact-form__input--textarea:not(:placeholder-shown) {
  padding-top: 40px !important;
}

.apple-contact-form__select {
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
  background-position: right 0.5rem center;
  background-repeat: no-repeat;
  background-size: 1.5em 1.5em;
  padding-right: 2.5rem;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-size: 1rem; /* keep closed select text same as dropdown */
  color: #1d1d1f;
  /* Ensure visible border in all states (fix intermittent missing border on Topic) */
  border: 1px solid #d2d2d7 !important;
 
  /* Fallback visual border in case native border is not painted */
}

/* Make dropdown options match the select's font size */
.apple-contact-form__select option {
  font-size: inherit;
}

/* Placeholder vs. selected color controlled by wrapper state set via JS */
.apple-contact-form__field-wrapper:not(.has-value) .apple-contact-form__select { color: #86868b; }
.apple-contact-form__field-wrapper.has-value .apple-contact-form__select { color: #1d1d1f; }

/* Safari-specific fix: Ensure placeholders stay as single space */
@supports (-webkit-appearance: none) {
  .apple-contact-form__input[placeholder=" "]::-webkit-input-placeholder,
  .apple-contact-form__select[placeholder=" "]::-webkit-input-placeholder {
    content: ' ' !important;
    color: transparent !important;
  }
  /* Force Safari to not modify required field placeholders */
  .apple-contact-form__input:required::-webkit-input-placeholder {
    opacity: 0 !important;
  }
}

/* Custom select for Safari (native checkmark-free UI) */
.custom-select { position: relative; display: none; }
.custom-select__button { width: 100%; text-align: left; padding: calc(var(--ff-gap) * 2 + var(--ff-label-size)) 2.25rem var(--ff-bottom, 0.10rem) 0.65rem; border: 1px solid #d2d2d7; border-radius: 8px; background: #fff; font-size: 1rem; line-height: 1rem; color: #1d1d1f; cursor: pointer; text-wrap: nowrap; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; box-sizing: border-box; min-height: 52.8px;}
.custom-select__button:after { content: ''; position: absolute; right: 0.5rem; top: 50%; transform: translateY(-50%); width: 1.5em; height: 1.5em; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-size: contain; pointer-events: none; }
.custom-select.is-open .custom-select__button { border-color: #007aff; }
.custom-select__list { position: absolute; z-index: 1000; top: 100%; left: 0; right: 0; background: #fff; border: 1px solid #d2d2d7; border-radius: 8px; margin-top: 4px; max-height: 240px; overflow: auto; padding: 0.25rem 0; box-shadow: 0 8px 24px rgba(0,0,0,0.08); display: none; }
.custom-select.is-open .custom-select__list { display: block; }
.custom-select__option { padding: 0.5rem 0.75rem; cursor: pointer; }
.custom-select__option[aria-selected="true"] { background: rgba(0,113,255,0.08); }
.custom-select__option:hover { background: rgba(0,0,0,0.05); }
.custom-select.error .custom-select__button { border-color: #FF3B30; background-color: #FFF5F5; }
/* Keep label centered and red when in error */
.custom-select.error + .apple-contact-form__label { color: #FF3B30 !important; top: 50% !important; transform: translateY(-50%) !important; left: 0.65rem; font-size: 1rem !important; background: transparent; padding: 0; }
/* Safari spacing tweak: keep height the same while improving label-text gap */
.apple-contact-form.is-safari .custom-select__button { padding-top: calc((var(--ff-gap) * 2 + var(--ff-label-size)) - 7.5px); padding-bottom: calc(var(--ff-bottom, 0.10rem) + 1.5px); }

.apple-contact-form__label {
  position: absolute;
  left: 0.4rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1rem;
  color: #86868b;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  padding: 0 0.25rem;
  line-height: 1;
  z-index: 2;
}

/* Local background shim behind the label to fully hide the field's top border and scrolling text
   without spilling into adjacent UI (e.g., navigation). */
.apple-contact-form__label::before {
  content: none !important;
  background: transparent !important;
  background-color: transparent !important;
}

/* Expand the shim just for the Description textarea label to ensure no seam is visible at any zoom level */
.apple-contact-form__input--textarea + .apple-contact-form__label {
  z-index: 3; /* keep the label and its shim above scrolled text */
}
.apple-contact-form__input--textarea + .apple-contact-form__label::before {
  /* Floating chip shim: tight to border; covers seam without overlap */
  content: none !important;
  background: transparent !important;
  background-color: transparent !important;
}

/* Textarea wrapper: keep relative for safe positioning */
.apple-contact-form__field-wrapper--textarea { position: relative; }

/* Full-width white strip masked inside the textarea's inner border */
.apple-contact-form__field-wrapper--textarea::before {
  content: none !important;
  background: transparent !important;
  background-color: transparent !important;
}

.apple-contact-form__field-wrapper--textarea.focused::before,
.apple-contact-form__field-wrapper--textarea.has-value::before {
  display: none !important;
}

/* Keep the label compact; the white strip supplies full-width background */
.apple-contact-form__field-wrapper--textarea .apple-contact-form__label {
  left: 0.4rem;
  right: auto;
  padding-left: 0.25rem;
  padding-right: 0.25rem;
  z-index: 2;
}

/* Disable the narrow label shim to avoid double backgrounds on textarea */
.apple-contact-form__field-wrapper--textarea .apple-contact-form__label::before { content: none !important; }

/* Select uses the same animation: default label is centered (inherited from base),
   and floats on focus/has-value just like inputs */

/* Floated (has value, not necessarily focused) */
/* Exclude selects from :placeholder-shown logic (selects don't support it) */
.apple-contact-form__input:not(.apple-contact-form__select):not(:placeholder-shown) + .apple-contact-form__label,
.apple-contact-form__field-wrapper.has-value .apple-contact-form__label {
  top: var(--ff-gap);
  left: 0.4rem;
  font-size: var(--ff-label-size);
  color: #666666;
  font-weight: 500;
  background-color: #ffffff;
  transform: none !important;
  padding: 0 0.25rem;
  /* No halo; rely on tight label shim */
  box-shadow: none;
  border-radius: 4px;
}

/* Focused state: a bit smaller and slightly higher */
.apple-contact-form__input:focus + .apple-contact-form__label,
.apple-contact-form__field-wrapper.focused .apple-contact-form__label {
  top: var(--ff-gap-focused) !important;
  left: 0.4rem;
  font-size: var(--ff-label-size-focused) !important;
  color: #666666;
  font-weight: 500;
  background-color: #ffffff;
  transform: none !important;
  padding: 0 0.25rem;
  /* No halo; rely on tight label shim */
  box-shadow: none;
  border-radius: 4px;
}

/* Select: value floated (not focused) */
.apple-contact-form__field-wrapper.has-value .apple-contact-form__select + .apple-contact-form__label {
  top: 1px !important;
  left: 0.4rem;
  font-size: var(--ff-label-size);
  color: #666666;
  font-weight: 500;
  background-color: #ffffff;
  transform: none !important;
  padding: 0 0.25rem;
  /* Halo to eliminate any visible seam with the field border */
  box-shadow: none;
  border-radius: 4px;
      padding-top: 6px;
    padding-bottom: 6px;

}

/* Select: focused state */
.apple-contact-form__select:focus + .apple-contact-form__label,
.apple-contact-form__field-wrapper.focused .apple-contact-form__select + .apple-contact-form__label {
  top: var(--ff-gap-focused) !important;
  left: 0.4rem;
  font-size: var(--ff-label-size) !important;
  color: #666666;
  font-weight: 500;
  background-color: #ffffff;
  transform: none !important;
  padding: 0 0.25rem;
  /* Halo to eliminate any visible seam with the field border */
  box-shadow: none;
  border-radius: 4px;
}

/* Default centered state is covered by base .apple-contact-form__label styles */

/* Give textarea extra clearance when label is floated so long content never collides */
.apple-contact-form__field-wrapper.focused .apple-contact-form__input--textarea,
.apple-contact-form__field-wrapper.has-value .apple-contact-form__input--textarea {
  /* When the label is floated, start text well below the label (no overlap) */
  padding-top: 25px !important;
  transform: translate(0) !important;
}

/* Textarea: place label above the field to avoid any border overlap */
.apple-contact-form__field-wrapper .apple-contact-form__input--textarea {
  /* Create a bit of room above for the outside label */
  margin-top: 0;
}
.apple-contact-form__field-wrapper .apple-contact-form__input--textarea + .apple-contact-form__label {
  /* reverted above-label styling (no overrides) */
}
.apple-contact-form__field-wrapper.focused .apple-contact-form__input--textarea + .apple-contact-form__label,
.apple-contact-form__field-wrapper.has-value .apple-contact-form__input--textarea + .apple-contact-form__label {
  /* reverted above-label styling (no overrides) */
}

/* Select floats via .focused / .has-value (JS-managed) to match other fields; :has removed for consistency */

/* Textarea floats to the same position as other fields (chip over the border)
   The extra top padding applied to textarea content keeps text clear of the label. */
/* Textarea: value floated (not focused) */
.apple-contact-form__input--textarea:not(:placeholder-shown) + .apple-contact-form__label,
.apple-contact-form__field-wrapper.has-value .apple-contact-form__input--textarea + .apple-contact-form__label {
  top: var(--ff-gap) !important;
}

/* Textarea: focused state */
.apple-contact-form__input--textarea:focus + .apple-contact-form__label,
.apple-contact-form__field-wrapper.focused .apple-contact-form__input--textarea + .apple-contact-form__label {
  position: absolute;          /* make it span over the input */
      top: 1px !important;
    left: 0.4rem;                 /* start at far left */
  width: 98%;                 /* full width */
  background-color: #ffffff !important; 
      padding: 0 0.25rem;  
      padding-top:6px;     /* match your textarea’s horizontal padding */
  border-radius: 4px 4px 0 0;  /* rounded top corners */
  display: block;              /* full block instead of inline-block */
  z-index: 2;                  /* stay above textarea border */
  transition: all 0.2s ease;   /* smooth animation */
}


/* Chip mask for all fields when label is floated (prevents text/border showing behind label) */
.apple-contact-form__field-wrapper.focused::after,
.apple-contact-form__field-wrapper.has-value::after {
  content: none !important; /* Use the label shim instead to avoid covering adjacent UI */
}

/* Freeze-like mask: add a white strip under the label so scrolled text never shows behind it */
.apple-contact-form__field-wrapper:has(.apple-contact-form__input--textarea).focused::after,
.apple-contact-form__field-wrapper:has(.apple-contact-form__input--textarea).has-value::after {
  content: none !important; /* Avoid broad white bar for textarea; rely on label shim */
}

.apple-contact-form__submit {
  background: none;
  border: none;
  color: #0071e3;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  padding: 0.5rem 1rem;
  border-radius: 6px;
  transition: all 0.2s ease;
  text-align: center;
  margin: 0 auto;
  display: block;
}

.apple-contact-form__submit:hover {
  background-color: rgba(0, 113, 227, 0.1);
}

.apple-contact-form__submit:active {
  transform: scale(0.98);
}

.apple-contact-form__submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
}

.apple-contact-form__submit.loading {
  background-color: rgba(0, 113, 227, 0.1);
  color: #0071e3;
}

.submit-loading {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.loading-circle {
  /* Animation removed - static loading indicator */
}

/* Error block CSS removed - using inline validation instead */

.apple-contact-form__success {
  text-align: center;
  margin: 0px;
  padding: 0px;
  font-size: 48px;
  line-height: 1.0834933333; /* Line height on container affects inline children */
  font-weight: 600;
  letter-spacing: -0.003em;
  transition: none !important;
  animation: none !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  width: 100%;
}

/* Remove any borders from parent containers when success is shown */
.apple-contact-form:has(.apple-contact-form__success) *,
body.form-success-showing * {
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}

.apple-contact-form__success span {
 
  
  color: #1d1d1f;
  margin-bottom: 0px !important;
  line-height: 0.5 !important;
   display: block;
}


.apple-contact-form__success p:first-of-type {
  margin-top: 0px; 
  line-height: 1.0834933333;
  display: block; 
    color: #86868b;
        margin-bottom: 60px;
}


.apple-contact-form__team {
  font-weight: 300;
  color: #1d1d1f !important;
  font-size: 21px  !important;
}

.apple-contact-form__support-link {
  color: #0071e3;
  text-decoration: none;
  font-size: 21px;

}

.apple-contact-form__support-link:hover {
  text-decoration: underline;
}

/* Hide the title when form is successfully submitted */
.apple-contact-form:has(.apple-contact-form__success) .apple-contact-form__title,
body.form-success-showing .apple-contact-form__title,
.apple-contact-form__success ~ .apple-contact-form__title {
  display: none;
}

/* Alternative approach for browsers that don't support :has() */
.apple-contact-form__success {
  display: flex !important;
}

/* Hide form fields when success message is present */
.apple-contact-form__success ~ .apple-contact-form__fields,
.apple-contact-form__success + .apple-contact-form__fields {
  display: none !important;
}

/* Disable page view-transitions ONLY when the success block is present */
:root:has(.apple-contact-form__success),
body.form-success-showing {
  --view-transition-old-main-content: none !important;
  --view-transition-new-main-content: none !important;
}
:root:has(.apple-contact-form__success) main[data-page-transition-enabled="true"],
body.form-success-showing main[data-page-transition-enabled="true"] {
  view-transition-name: none !important;
}
:root:has(.apple-contact-form__success) ::view-transition-old(main-content),
:root:has(.apple-contact-form__success) ::view-transition-new(main-content),
body.form-success-showing ::view-transition-old(main-content),
body.form-success-showing ::view-transition-new(main-content) {
  animation: none !important;
}

/* Disable smooth scrolling when success message is present to prevent "ease up" */
html:has(.apple-contact-form__success),
body.form-success-showing {
  scroll-behavior: auto !important;
  overflow-anchor: none !important;
}

/* Prevent page scrolling when success is visible (mobile only) */
@media (max-width: 768px) {
  body:has(.apple-contact-form__success),
  body.form-success-showing {
    overflow: auto !important;
    height: auto !important;
  }
}

/* Kill any micro-animations during first paint/setup */
/* (reverted) no global suppression of field animations on load */

/* Disable all view transitions when success message is present */
body:has(.apple-contact-form__success) *,
body.form-success-showing * {
  view-transition-name: none !important;
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

/* Override global view transition animations */
body:has(.apple-contact-form__success) ::view-transition-old(*),
body:has(.apple-contact-form__success) ::view-transition-new(*),
body:has(.apple-contact-form__success) ::view-transition-group(*),
body.form-success-showing ::view-transition-old(*),
body.form-success-showing ::view-transition-new(*),
body.form-success-showing ::view-transition-group(*) {
  animation: none !important;
}

/* Disable page transitions when navigating to success page */
body:has(.apple-contact-form__success) main[data-page-transition-enabled="true"],
body.form-success-showing main[data-page-transition-enabled="true"] {
  view-transition-name: none !important;
}

/* Force immediate layout - no animations */
body:has(.apple-contact-form__success) .apple-contact-form,
body:has(.apple-contact-form__success) .apple-contact-form__container,
body:has(.apple-contact-form__success) .apple-contact-form__form,
body:has(.apple-contact-form__success) .apple-contact-form__success,
body.form-success-showing .apple-contact-form,
body.form-success-showing .apple-contact-form__container,
body.form-success-showing .apple-contact-form__form,
body.form-success-showing .apple-contact-form__success {
  animation: none !important;
  transition: none !important;
  transform: none !important;
  height: auto !important;
  min-height: auto !important;
  max-height: none !important;
}

/* Preserve padding on success screen */
body:has(.apple-contact-form__success) .apple-contact-form,
body.form-success-showing .apple-contact-form {
  padding: 2rem 1rem !important;
}

body:has(.apple-contact-form__success) .apple-contact-form__container,
body.form-success-showing .apple-contact-form__container {
  padding: 2rem !important;
}

/* Ensure the form container doesn't animate its height */
.apple-contact-form {
  transition: none !important;
}

.apple-contact-form__container {
  transition: none !important;
}

/* Override any fadeInUp or slide animations */
body:has(.apple-contact-form__success) [class*="animate"],
body:has(.apple-contact-form__success) [class*="fade"],
body:has(.apple-contact-form__success) [class*="slide"],
body.form-success-showing [class*="animate"],
body.form-success-showing [class*="fade"],
body.form-success-showing [class*="slide"] {
  animation: none !important;
  transition: none !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Global animation disable when class is present */
html.disable-all-animations *,
body.disable-all-animations * {
  animation: none !important;
  transition: none !important;
  animation-duration: 0s !important;
  animation-delay: 0s !important;
  transition-duration: 0s !important;
  transition-delay: 0s !important;
}

/* Ensure immediate rendering */
html.disable-all-animations,
body.disable-all-animations {
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

/* Override view transition animations globally */
html.disable-all-animations ::view-transition-old(*),
html.disable-all-animations ::view-transition-new(*),
html.disable-all-animations ::view-transition-group(*),
html.disable-all-animations ::view-transition-image-pair(*) {
  animation: none !important;
  animation-duration: 0s !important;
}

@media (max-width: 768px) {
body:has(.apple-contact-form__success) .apple-contact-form,
body.form-success-showing .apple-contact-form {
  padding: 0rem 1rem !important;
}
  .apple-contact-form__row {
    grid-template-columns: 1fr;
  }
  
  .apple-contact-form__title {
    font-size: 2rem;
    margin-bottom: 2rem;
  }
  
  .apple-contact-form {
    padding: 1rem;
    padding-bottom: calc(1rem + env(safe-area-inset-bottom));
    min-height: 100svh;
    min-height: 100dvh;
  }
  
  .apple-contact-form__input {
    font-size: 16px; /* Prevents zoom on iOS */
  }
  
  .apple-contact-form__submit {
    width: 100%;
    padding: 1rem;
    font-size: 1.125rem;
  }

  /* Ensure success message is visible on mobile */
.apple-contact-form__success {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  z-index: 10 !important;
}

  /* Center success screen vertically & horizontally on mobile */
  body:has(.apple-contact-form__success) .apple-contact-form,
  body.form-success-showing .apple-contact-form {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    /* Reserve space for fixed header on mobile */
    --mobile-fixed-header-height: var(--header-height, 64px);
    margin-top: var(--mobile-fixed-header-height) !important;
    min-height: calc(100svh - var(--mobile-fixed-header-height)) !important;
    height: calc(100svh - var(--mobile-fixed-header-height)) !important;
    padding: 2rem 1rem !important;
  }
  body:has(.apple-contact-form__success) .apple-contact-form__container,
  body.form-success-showing .apple-contact-form__container {
    padding: 0 !important;
    margin: 0 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 100% !important;
    width: 100% !important;
  }

/* Disable any global page/view transitions when success is present */
/* (reverted) keep theme-level transitions; success element itself still has none */

}

@media (max-width: 480px) {
  .apple-contact-form__title {
    font-size: 1.75rem;
  }
  
  .apple-contact-form__container {
    padding: 0 1rem;
  }
}
/* END_SECTION:apple-style-contact */

/* START_SECTION:apple-style-multi-steps-form (INDEX:3) */
.apple-contact-form {
    min-height: 100svh;
    min-height: 100dvh;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ffffff;
    padding: 2rem 1rem;
    padding-bottom: calc(2rem + env(safe-area-inset-bottom));
    -webkit-tap-highlight-color: transparent;
    --ff-gap: 0.625rem;
    --ff-label-size: 0.875rem;
    --ff-bottom: 0.10rem;
    --ff-label-size-focused: 0.8125rem;
    --ff-gap-focused: calc(var(--ff-gap) - 2px);
  }

  .apple-contact-form__container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    position: relative;
  }

  .apple-contact-form__title {
    font-size: 2.5rem;
    font-weight: 600;
    color: #1d1d1f;
    text-align: center;
    margin-bottom: 3rem;
  }

  /* Only the active step is visible */
  .apple-contact-form .step-content { display: none; }
  .apple-contact-form .step-content.active { display: block; }
  .step-content[data-step="4"].active:focus-visible{
    outline: none;
  }
  /* Vertical dots */
  .step-indicator-vertical {
    position: fixed;
    right: 2rem;
    top: 50%;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
    gap: 1rem;
    z-index: 2;
  }
  .step-dot {
    width: 12px; height: 12px; border-radius: 50%;
    background-color: #d2d2d7; transition: all 0.3s ease; cursor: pointer;
  }
  .step-dot.active { background-color: #007aff; transform: scale(1.2); }

  .apple-contact-form__form { width: 100%; }
  .apple-contact-form__fields { display: flex; flex-direction: column; gap: 2rem; }
  .apple-contact-form__row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
  .apple-contact-form__field-wrapper { position: relative; width: 100%; min-width: 0;}

  .apple-contact-form__error-message {
    position: absolute;
    bottom: -20px;
    left: 0;
    font-size: 0.75rem;
    color: #FF3B30;
    display: none;
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }

  .error-icon {
    flex-shrink: 0;
  }
  .apple-contact-form__field-wrapper--full { grid-column: 1 / -1; }

  .apple-contact-form__input {
    width: 100%;
    padding: calc(var(--ff-gap) * 2 + var(--ff-label-size)) 0.75rem var(--ff-gap) 0.65rem;
    border: 1px solid #d2d2d7;
    border-color: #d2d2d7 !important;
    border-radius: 8px;
    font-size: 1rem;
    background-color: #ffffff;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    outline: none;

    appearance: none;
    -webkit-appearance: none;
    padding-bottom: var(--ff-bottom, 0.10rem) !important;

    /* Safari focus support */
    -webkit-tap-highlight-color: transparent;
  }
  .apple-contact-form__input:focus,
  .apple-contact-form__input:focus-visible {
    border-color: #007aff !important;
    box-shadow: none !important;
  }

  /* Safari-specific focus styles (keep strict to actual :focus only) */

  /* Ensure select elements get proper focus styling in Safari */
  .apple-contact-form__select {
    border-color: #d2d2d7 !important;
  }
  .apple-contact-form__select:focus {
    border-color: #007aff !important;
    box-shadow: none !important;
  }

  /* Error state styling */
  .apple-contact-form__input.error {
    border-color: #FF3B30;
    background-color: #FFF5F5;
  }

  .apple-contact-form__input.error::placeholder {
    color: #FF3B30;
  }

  .apple-contact-form__input--textarea {
    resize: vertical; min-height: 120px; padding-top: 24px !important; line-height: 1.5; z-index: 0;
    padding-bottom: var(--ff-bottom, 0.10rem) !important;
  }

  .apple-contact-form__select {
    cursor: pointer;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
    background-position: right 0.5rem center; background-repeat: no-repeat; background-size: 1.5em 1.5em;
    padding-right: 2.5rem; font-size: 1rem; color: #1d1d1f;
    /* Hide Safari's default checkmarks */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
  }
  .apple-contact-form__select option {
    font-size: inherit;
    padding-left: 0;
    text-indent: 0;
    /* Remove Safari's default checkmarks from options */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
  }

  /* Additional Safari-specific fixes for dropdown checkmarks */
  .apple-contact-form__select::-webkit-list-button {
    display: none;
  }

  .apple-contact-form__select option::-webkit-check {
    display: none;
  }

  .apple-contact-form__field-wrapper:not(.has-value) .apple-contact-form__select { color: #86868b; }
  .apple-contact-form__field-wrapper.has-value .apple-contact-form__select { color: #1d1d1f; }

  .apple-contact-form__label {
    position: absolute; left: 0.4rem; top: 50%; transform: translateY(-50%);
    font-size: 1rem; color: #86868b; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none; background-color: #ffffff; padding: 0 0.25rem; line-height: 1; z-index: 2;
  }
  .apple-contact-form__label::before { content: ''; position: absolute; left: -4px; right: -4px; top: -2px; bottom: -2px; background: #ffffff; border-radius: 4px; z-index: -1; }

  .apple-contact-form__field-wrapper--textarea::before {
    content: ''; position: absolute; left: 1px; right: 1px; top: 1px; height: 30px; background: #ffffff;
    border-top-left-radius: 7px; border-top-right-radius: 7px; z-index: 1; display: none; pointer-events: none;
  }
  .apple-contact-form__field-wrapper--textarea.focused::before,
  .apple-contact-form__field-wrapper--textarea.has-value::before { display: block; }

  .apple-contact-form__input:not(.apple-contact-form__select):not(:placeholder-shown) + .apple-contact-form__label,
  .apple-contact-form__field-wrapper.has-value .apple-contact-form__label {
    top: 1px !important; left: 0.4rem; font-size: var(--ff-label-size); color: #666666; font-weight: 500;
    background-color: #ffffff; padding: 0 0.25rem; border-radius: 4px;padding-top: 6px  ;   padding-bottom: 6px;
  }
  .apple-contact-form__input:focus + .apple-contact-form__label,
  .apple-contact-form__field-wrapper.focused .apple-contact-form__label {
    top: var(--ff-gap-focused) !important; left: 0.4rem; font-size: var(--ff-label-size-focused) !important; color: #666666; font-weight: 500;
  }

  .apple-contact-form__field-wrapper.focused .apple-contact-form__input--textarea,
  .apple-contact-form__field-wrapper.has-value .apple-contact-form__input--textarea { padding-top: 25px !important; transform: translate(0) !important; }

  .step-navigation { display: flex; gap: 1rem; justify-content: space-between; margin-top: 1rem; }
  .apple-contact-form__submit { background: none; border: none; color: #0071e3; font-size: 1rem; font-weight: 500; cursor: pointer; padding: 0.5rem 1rem; border-radius: 6px; transition: all 0.2s ease; text-align: center; }
  .apple-contact-form__submit:hover { background-color: rgba(0, 113, 227, 0.1); }

  /* Intro layout: push Start button to bottom */
  .apple-contact-form__fields--intro { display: flex; flex-direction: column; min-height: 90vh; justify-content: center; }
  .apple-contact-form__fields--intro .step-navigation {  justify-content: center; }
  .intro-start { position: relative; }
  .intro-start::after {
    content: '';
    display: block;
    width: 16px;
    height: 16px;
    margin: 6px auto 0;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%230071e3' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.6' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-size: contain;
  }

  /* Intro slide-up animation when starting */
  @keyframes apple-intro-slide-up-out {
    0% { transform: translateY(0); opacity: 1; }
    100% { transform: translateY(-28px); opacity: 0; }
  }
  .step-content[data-step="0"].slide-up-out {
    will-change: transform, opacity;
    animation: apple-intro-slide-up-out 380ms cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
  }
  @media (prefers-reduced-motion: reduce) {
    .step-content[data-step="0"].slide-up-out { animation: none; opacity: 0; }
  }

  /* Step slide-in for smooth entrance after intro */
  @keyframes apple-step-slide-in {
    0% { transform: translateY(24px); opacity: 0; }
    100% { transform: translateY(0); opacity: 1; }
  }
  .step-content.animate-in {
    will-change: transform, opacity;
    animation: apple-step-slide-in 380ms cubic-bezier(0.22, 0.61, 0.36, 1) both;
  }
  @media (prefers-reduced-motion: reduce) {
    .step-content.animate-in { animation: none; }
  }

  /* Hide the textarea field immediately when the form is submitting */
  .apple-contact-form__form.is-submitting .apple-contact-form__field-wrapper--textarea {
    display: none !important;
  }

  
  /* Also hide the back button during submit to avoid a flash */
  .apple-contact-form__form.is-submitting .step-content[data-step="3"] .prev-step {
    display: none !important;
  }

  /* Hide the vertical step indicator while submit/success flow is in progress */
  body.form-success-showing .step-indicator-vertical {
    display: none !important;
  }

  /* Make the whole section full-bleed only on step 2 to escape any 600/750px caps */
  .apple-contact-form.is-wide-step-2 {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
  }

  /* Re-center the inner container to a readable 1200px on step 2 */
  .apple-contact-form.is-wide-step-2 .apple-contact-form__container {
    max-width: 1024px !important;
    width: 100% !important;
    margin: 0 auto !important;
  }

  /* Step 2: force clean 3-column grid on desktop only */
  @media (min-width: 992px) {
    .apple-contact-form .step-content[data-step="2"] .apple-contact-form__row {
      grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
      gap: 1.25rem !important;
    }
    .apple-contact-form .step-content[data-step="2"] .apple-contact-form__field-wrapper { min-width: 0 !important; }
    .apple-contact-form .step-content[data-step="2"] .apple-contact-form__input,
    .apple-contact-form .step-content[data-step="2"] .apple-contact-form__select {
      width: 100% !important; box-sizing: border-box !important;
    }
  }
  .apple-contact-form__success {
    text-align: center;
    margin: 0px;
    padding: 0px;
    font-size: 48px;
    line-height: 1.0834933333; /* Line height on container affects inline children */
    font-weight: 600;
    letter-spacing: -0.003em;
    transition: none !important;
    animation: none !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
  }

  /* Remove any borders from parent containers when success is shown */
  .apple-contact-form:has(.apple-contact-form__success) *,
  body.form-success-showing * {
    border: none !important;
    box-shadow: none !important;
    outline: none !important;
  }

  /* Disable page view-transitions ONLY when the success block is present */
  /* Safari fallback using body class instead of :has() */
  body.form-success-showing {
    --view-transition-old-main-content: none !important;
    --view-transition-new-main-content: none !important;
  }
  body.form-success-showing main[data-page-transition-enabled="true"] {
    view-transition-name: none !important;
  }
  body.form-success-showing ::view-transition-old(main-content),
  body.form-success-showing ::view-transition-new(main-content) {
    animation: none !important;
  }
  
  /* Keep :has() selectors as fallback for browsers that support it */
  :root:has(.apple-contact-form__success) {
    --view-transition-old-main-content: none !important;
    --view-transition-new-main-content: none !important;
  }
  :root:has(.apple-contact-form__success) main[data-page-transition-enabled="true"] {
    view-transition-name: none !important;
  }
  :root:has(.apple-contact-form__success) ::view-transition-old(main-content),
  :root:has(.apple-contact-form__success) ::view-transition-new(main-content) {
    animation: none !important;
  }

  /* Disable any global page/view transitions when success is present */
  /* (reverted) keep theme-level transitions; success element itself still has none */

  .apple-contact-form__success span {


    color: #1d1d1f;
    margin-bottom: 0px !important;
    line-height: 0.5 !important;
     display: block;
  }


  .apple-contact-form__success p:first-of-type {
    margin-top: 0px;
    line-height: 1.0834933333;
    display: block;
      color: #86868b;
          margin-bottom: 60px;
  }


  .apple-contact-form__team {
    font-weight: 300;
    color: #1d1d1f !important;
    font-size: 21px  !important;
  }

  /* Kill any micro-animations during first paint/setup */
  /* (reverted) no global suppression of field animations on load */


  /* Disable all view transitions when success message is present */
  /* Safari fallback using body class instead of :has() */
  body.form-success-showing * {
    view-transition-name: none !important;
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }

  /* Override global view transition animations */
  body.form-success-showing ::view-transition-old(*),
  body.form-success-showing ::view-transition-new(*),
  body.form-success-showing ::view-transition-group(*) {
    animation: none !important;
  }

  /* Disable page transitions when navigating to success page */
  body.form-success-showing main[data-page-transition-enabled="true"] {
    view-transition-name: none !important;
  }

  /* Force immediate layout - no animations */
  body.form-success-showing .apple-contact-form,
  body.form-success-showing .apple-contact-form__container,
  body.form-success-showing .apple-contact-form__form,
  body.form-success-showing .apple-contact-form__success {
    animation: none !important;
    transition: none !important;
    transform: none !important;
    height: auto !important;

     display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        padding-top: 0 !important;
        min-height: 90vh !important;
        box-sizing: border-box;  
  }
  @media (max-width: 769px) {
  body.form-success-showing .apple-contact-form,
  body.form-success-showing .apple-contact-form__container,
  body.form-success-showing .apple-contact-form__form,
  body.form-success-showing .apple-contact-form__success {
    animation: none !important;
    transition: none !important;
    transform: none !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        padding-top: 0 !important;
        min-height: 80vh !important;
        box-sizing: border-box;  
  }
}

  
  /* Preserve padding on success screen */
  body.form-success-showing .apple-contact-form {
    padding: 12rem 2rem !important;
  }
  


  /* Override any fadeInUp or slide animations */
  body.form-success-showing [class*="animate"],
  body.form-success-showing [class*="fade"],
  body.form-success-showing [class*="slide"] {
    animation: none !important;
    transition: none !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
  }
  
  /* Keep :has() selectors as fallback for browsers that support it */
  body:has(.apple-contact-form__success) * {
    view-transition-name: none !important;
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }

  body:has(.apple-contact-form__success) ::view-transition-old(*),
  body:has(.apple-contact-form__success) ::view-transition-new(*),
  body:has(.apple-contact-form__success) ::view-transition-group(*) {
    animation: none !important;
  }

  body:has(.apple-contact-form__success) main[data-page-transition-enabled="true"] {
    view-transition-name: none !important;
  }

  body:has(.apple-contact-form__success) .apple-contact-form,
  body:has(.apple-contact-form__success) .apple-contact-form__container,
  body:has(.apple-contact-form__success) .apple-contact-form__form,
  body:has(.apple-contact-form__success) .apple-contact-form__success {
    animation: none !important;
    transition: none !important;
    transform: none !important;
    height: auto !important;

     display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        padding-top: 0 !important;
        min-height: 90vh !important;
        box-sizing: border-box;  
  }
  
  body:has(.apple-contact-form__success) .apple-contact-form {
    padding: 12rem 2rem !important;
  }
  
  body:has(.apple-contact-form__success) .apple-contact-form__container {
    padding: 2rem !important;
  }

  /* Ensure the form container doesn't animate its height */
  .apple-contact-form {
    transition: none !important;
  }

  .apple-contact-form__container {
    transition: none !important;
  }

  body:has(.apple-contact-form__success) [class*="animate"],
  body:has(.apple-contact-form__success) [class*="fade"],
  body:has(.apple-contact-form__success) [class*="slide"] {
    animation: none !important;
    transition: none !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  /* Global animation disable when class is present */
  html.disable-all-animations *,
  body.disable-all-animations * {
    animation: none !important;
    transition: none !important;
    animation-duration: 0s !important;
    animation-delay: 0s !important;
    transition-duration: 0s !important;
    transition-delay: 0s !important;
  }

  /* Ensure immediate rendering */
  html.disable-all-animations,
  body.disable-all-animations {
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }

  /* Override view transition animations globally */
  html.disable-all-animations ::view-transition-old(*),
  html.disable-all-animations ::view-transition-new(*),
  html.disable-all-animations ::view-transition-group(*),
  html.disable-all-animations ::view-transition-image-pair(*) {
    animation: none !important;
    animation-duration: 0s !important;
  }

  @media (max-width: 768px) {
    .apple-contact-form__row { grid-template-columns: 1fr; }
    .apple-contact-form__title { font-size: 2rem; }
    .step-navigation { flex-direction: column-reverse; gap: 0rem;}
    .apple-contact-form__submit { width: 100%; padding: 1rem; }
    .apple-contact-form { padding: 1rem; padding-bottom: calc(1rem + env(safe-area-inset-bottom)); }
    .apple-contact-form__input { font-size: 16px; }
    .step-indicator-vertical { position: relative; right: auto; top: auto; transform: none; flex-direction: row; justify-content: center; gap: 1rem; margin-bottom:50px;}

    /* Center success and prevent header overlap on mobile */
    body:has(.apple-contact-form__success) .apple-contact-form,
    body.form-success-showing .apple-contact-form {
      --mobile-fixed-header-height: var(--header-height, 64px);
      margin-top: var(--mobile-fixed-header-height) !important;
      min-height: calc(100svh - var(--mobile-fixed-header-height)) !important;
      height: calc(100svh - var(--mobile-fixed-header-height)) !important;
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
    }
    body:has(.apple-contact-form__success) .apple-contact-form__container,
    body.form-success-showing .apple-contact-form__container {
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
      width: 100% !important;
    }
  }
  body.form-success-showing .apple-contact-form,
  body.form-success-showing .apple-contact-form__container,
  body.form-success-showing .apple-contact-form__form,
  body.form-success-showing .apple-contact-form__success {
    animation: none !important;
    transition: none !important;
    transform: none !important;
    height: auto !important;
     display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        padding-top: 0 !important;
        min-height: 90vh !important;
        box-sizing: border-box;  
  }
  @media (max-width: 769px) {
  body.form-success-showing .apple-contact-form,
  body.form-success-showing .apple-contact-form__container,
  body.form-success-showing .apple-contact-form__form,
  body.form-success-showing .apple-contact-form__success {
    animation: none !important;
    transition: none !important;
    transform: none !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        padding-top: 0 !important;
        min-height: 80vh !important;
        box-sizing: border-box;  
  }
}
/* END_SECTION:apple-style-multi-steps-form */

/* START_SECTION:bulk-inquiry-form (INDEX:5) */
.spacing1{
  gap:2rem !important;
}
    @media (max-width: 768px) {

.apple-contact-form__row{
  gap:2rem !important;
}
        }    /* Reuse Apple form styles and add a few local rules */
    .bulk-inquiry__subheading { margin: 0rem 0 1rem; font-weight: 600; color: #1d1d1f; text-align: center; }
    .bulk-item { position: relative; padding-top: 0; margin-bottom: 26px; }
    .bulk-item__remove {font-size: 30px; position: absolute; right: 0; top: -0.25rem; color: #FF3B30; background: none; border: 0; cursor: pointer; padding-top: 4px;}
    .bulk-item + .bulk-item {
      border-top:1px solid #898d95;
      padding-top: 40px;
     }

    .other-input {
      /* margin-top: 0.5rem; */
      margin-block-start: 0.5rem;
     }

    .other-input.apple-contact-form__field-wrapper { grid-column: 1 / -1; margin-top: 0.5rem; }
    .other-input:not(.focused):not(.has-value) .apple-contact-form__label { top: 50% !important; transform: translateY(-50%) !important; font-size: 1rem !important; }
    .other-input .apple-contact-form__label { color: #86868b !important; font-weight: 400 !important; }
    .bulk-grid-3 { display: grid; grid-template-columns: 1fr; gap: 0.875rem; align-items: start; }
    @media (min-width: 768px) {
      .bulk-inquiry-form .apple-contact-form__row.bulk-grid-3 { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; column-gap: 0.875rem; }
      .bulk-inquiry-form .apple-contact-form__field-wrapper { min-width: 0; }
    }
    @media (min-width: 1200px) {
      .bulk-inquiry-form .apple-contact-form__row.bulk-grid-3 { column-gap: 1rem; }
    }
    /* Make vertical spacing between commodity rows match logistics */
    .bulk-item .apple-contact-form__row.bulk-grid-3 { margin-bottom: 2rem; }
    .bulk-item .apple-contact-form__row.bulk-grid-3:last-of-type { margin-bottom: 2rem; }
    /* Widen container so 3-up fits comfortably */
    .bulk-inquiry-form .apple-contact-form__container { max-width: 1024px; }
    /* Header with right-aligned Add Items, consistent top/bottom spacing */
    .bulk-header { display: flex; align-items: center; gap: 1rem; position: relative; margin: 2rem 0 1rem; justify-content:center;}
    .bulk-header .bulk-inquiry__subheading { margin: 0; flex: 1; text-align: center; }
    .bulk-add-row { display: flex; justify-content: flex-end; padding: 0; margin: 0; }
    .bulk-add-row .bulk-add { margin: 0; padding: 0; }
    .bulk-header h3 {
      margin: 0;
      text-align: center;
      flex: 1;
  }

  .bulk-header button {
    position: absolute;
    right: 0; /* stick to right */
  }
    /* Inline error spacing and icon alignment */
    .apple-contact-form__error-message {
      position: absolute;
      top: 100%;
      left: 0;
      margin-top: 10px;
      font-size: 0.75rem;
      color: #FF3B30;
      display: none;
      white-space: nowrap;
      display: flex;
      align-items: center;
      gap: 0.5rem;
    }
    .error-icon { width: 12px; height: 12px; flex-shrink: 0; }

    /* Success message styling (matching apple-style-multi-steps-form.liquid) */
    .apple-contact-form__success {
      text-align: center;
      margin: 0px;
      padding: 0px;
      font-size: 48px;
      line-height: 1.0834933333; /* Line height on container affects inline children */
      font-weight: 600;
      letter-spacing: -0.003em;
      transition: none !important;
      animation: none !important;
      transform: none !important;
      display: flex !important;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      opacity: 1 !important;
      visibility: visible !important;
      border: none !important;
      box-shadow: none !important;
      outline: none !important;
    }

    /* Disable smooth scrolling and anchoring when success is present */
    html:has(.apple-contact-form__success),
    body.form-success-showing {
      scroll-behavior: auto !important;
      overflow-anchor: none !important;
    }

    /* Remove any borders from parent containers when success is shown */
    .apple-contact-form:has(.apple-contact-form__success) *,
    body.form-success-showing * {
      border: none !important;
      box-shadow: none !important;
      outline: none !important;
    }

    .apple-contact-form__success span {
      color: #1d1d1f;
      margin-bottom: 0px !important;
      line-height: 0.5 !important;
      display: block;
    }

    .apple-contact-form__success p:first-of-type {
      margin-top: 0px;
      line-height: 1.0834933333;
      display: block;
      color: #86868b;
      margin-bottom: 60px;
    }

    .apple-contact-form__team {
      font-weight: 300;
      color: #1d1d1f !important;
      font-size: 21px !important;
    }

    .apple-contact-form__support-link {
      color: #0071e3 !important;
      text-decoration: none;
      font-size: 21px !important;
    }

    .apple-contact-form__support-link:hover {
      text-decoration: underline;
    }

    /* Hide the title when form is successfully submitted */
    .apple-contact-form:has(.apple-contact-form__success) .apple-contact-form__title {
      display: none;
    }

    /* Hide form fields when success message is present */
    .apple-contact-form__success ~ .apple-contact-form__fields {
      display: none !important;
    }

    /* Ensure success message is always visible and properly displayed */
    .apple-contact-form__success {
      display: flex !important;
      visibility: visible !important;
      opacity: 1 !important;
      position: relative !important;
      z-index: 1000 !important;
      width: 100% !important;
      min-height: 400px !important;
    }

    @media (max-width: 768px) {
      /* Ensure success message is visible on mobile */
      .apple-contact-form__success {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: relative !important;
        z-index: 10 !important;
      }
      /* Center success and prevent header overlap on mobile */
      body:has(.apple-contact-form__success) .apple-contact-form,
      body.form-success-showing .apple-contact-form {
        --mobile-fixed-header-height: var(--header-height, 64px);
        margin-top: var(--mobile-fixed-header-height) !important;
        min-height: calc(100svh - var(--mobile-fixed-header-height)) !important;
        height: calc(100svh - var(--mobile-fixed-header-height)) !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
      }
      body:has(.apple-contact-form__success) .apple-contact-form__container,
      body.form-success-showing .apple-contact-form__container {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
      }
      
      /* Add margin-top to button in mobile */
      .bulk-header button {
                margin-top: 78px;
        text-align: right;
        padding-right: 0px;
        padding-bottom: 0px;
        font-size:15px;
    }
    .first{
      padding-bottom:20px;
    }
      }
    }

    /* Safari-compatible: Add class to body when success is shown */
    body.form-success-showing * {
      view-transition-name: none !important;
      animation: none !important;
      transition: none !important;
      transform: none !important;
    }

    /* Override global view transition animations */
    body.form-success-showing ::view-transition-old(*),
    body.form-success-showing ::view-transition-new(*),
    body.form-success-showing ::view-transition-group(*) {
      animation: none !important;
    }

    /* Disable page transitions when navigating to success page */
    body.form-success-showing main[data-page-transition-enabled="true"] {
      view-transition-name: none !important;
    }

    /* Force immediate layout - no animations */
    body.form-success-showing .apple-contact-form,
    body.form-success-showing .apple-contact-form__container,
    body.form-success-showing .apple-contact-form__form,
    body.form-success-showing .apple-contact-form__success {
      animation: none !important;
      transition: none !important;
      transform: none !important;
      height: auto !important;
      min-height: auto !important;
      max-height: none !important;
      padding-top:100px;
    }
    @media (max-width: 769px) {
  body.form-success-showing .apple-contact-form,
  body.form-success-showing .apple-contact-form__container,
  body.form-success-showing .apple-contact-form__form,
  body.form-success-showing .apple-contact-form__success {
    animation: none !important;
    transition: none !important;
    transform: none !important;
    padding-top: 1px;
  }
}




    /* Also support :has() for browsers that support it */
    body:has(.apple-contact-form__success) * {
      view-transition-name: none !important;
      animation: none !important;
      transition: none !important;
      transform: none !important;
    }

    body:has(.apple-contact-form__success) .apple-contact-form,
    body:has(.apple-contact-form__success) .apple-contact-form__container,
    body:has(.apple-contact-form__success) .apple-contact-form__form,
    body:has(.apple-contact-form__success) .apple-contact-form__success {
      animation: none !important;
      transition: none !important;
      transform: none !important;
      display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        padding-top: 0 !important;
        min-height: 80vh !important;
        box-sizing: border-box;  
    }

    body:has(.apple-contact-form__success) .apple-contact-form {
      padding: 2rem 1rem !important;
    }



    /* Ensure the form container doesn't animate its height */
    .apple-contact-form {
      transition: none !important;
    }

    .apple-contact-form__container {
      transition: none !important;
    }

    /* Override any fadeInUp or slide animations */
    body:has(.apple-contact-form__success) [class*="animate"],
    body:has(.apple-contact-form__success) [class*="fade"],
    body:has(.apple-contact-form__success) [class*="slide"] {
      animation: none !important;
      transition: none !important;
      transform: none !important;
      opacity: 1 !important;
      visibility: visible !important;
    }

    /* Global animation disable when class is present */
    html.disable-all-animations *,
    body.disable-all-animations * {
      animation: none !important;
      transition: none !important;
      animation-duration: 0s !important;
      animation-delay: 0s !important;
      transition-duration: 0s !important;
      transition-delay: 0s !important;
    }

    /* Ensure immediate rendering */
    html.disable-all-animations,
    body.disable-all-animations {
      animation: none !important;
      transition: none !important;
      transform: none !important;
    }

    /* Override view transition animations globally */
    html.disable-all-animations ::view-transition-old(*),
    html.disable-all-animations ::view-transition-new(*),
    html.disable-all-animations ::view-transition-group(*),
    html.disable-all-animations ::view-transition-image-pair(*) {
      animation: none !important;
      animation-duration: 0s !important;
    }

    /* Date input calendar-only styling */
    input[type="date"] {
      cursor: pointer;
      background-color: #ffffff;
      /* Force consistent height with other inputs */
      height: 53px;
      box-sizing: border-box;
      /* Fix iOS placeholder alignment and color */
      color: #1d1d1f;
      text-align: left;
    }

    input[type="date"]:focus {
      cursor: pointer;
    }

    input[type="date"]::-webkit-calendar-picker-indicator {
      cursor: pointer;
      opacity: 1;
      /* Make the calendar icon larger and more tappable on iOS */
      width: 20px;
      height: 20px;
      padding: 5px;
    }
    
    /* iOS specific fixes for date input placeholder */
    input[type="date"]::-webkit-date-and-time-value {
      text-align: left;
      color: #1d1d1f;
    }
    
    /* Fix placeholder color on iOS */
    input[type="date"]::-webkit-datetime-edit-text,
    input[type="date"]::-webkit-datetime-edit-month-field,
    input[type="date"]::-webkit-datetime-edit-day-field,
    input[type="date"]::-webkit-datetime-edit-year-field {
      color: #1d1d1f;
    }
    
    /* When empty (showing placeholder), make it gray like other inputs */
    input[type="date"]:invalid::-webkit-datetime-edit-text,
    input[type="date"]:invalid::-webkit-datetime-edit-month-field,
    input[type="date"]:invalid::-webkit-datetime-edit-day-field,
    input[type="date"]:invalid::-webkit-datetime-edit-year-field {
      color: #86868b;
    }
    
    /* iOS-specific improvements for touch responsiveness */
    @supports (-webkit-touch-callout: none) {
      input[type="date"] {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        background-color: #ffffff;
        /* Critical for iOS touch events */
        pointer-events: auto !important;
        touch-action: manipulation !important;
        -webkit-tap-highlight-color: transparent;
      }
      
      /* Make the calendar icon more prominent and clickable on iOS */
      input[type="date"]::-webkit-calendar-picker-indicator {
        cursor: pointer;
        opacity: 1;
        /* Larger touch target */
        min-width: 30px;
        min-height: 30px;
      }
    }

  /* Disable text selection on date input */
  input[type="date"] {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
  }

  /* Custom select for Safari (native checkmark-free UI) */
  .custom-select {
    position: relative;
    display: block;
  }
  
  /* Ensure dropdown container captures clicks properly in Safari */
  .custom-select * {
    pointer-events: auto;
  }

  .custom-select__button {
    width: 100%;
    text-align: left;
    /* Match floating-label spacing used by text inputs */
    padding: calc(var(--ff-gap, 0.625rem) * 2 + var(--ff-label-size, 0.875rem)) 2.25rem var(--ff-bottom, 0.10rem) 0.65rem;
    border: 1px solid #d2d2d7;
    border-radius: 8px;
    background: #fff;
    font-size: 1rem;
    line-height: 1rem; /* align with input text line-height */
    color: #1d1d1f;
    cursor: pointer;
    position: relative;
    box-sizing: border-box; /* ensure padding contributes like inputs */
    min-height: 52.8px; /* keep visual parity with inputs */
    white-space: nowrap; /* prevent wrap from changing height */
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* Safari fine‑tune: match Windows input label/text gap
     Reduce top padding slightly and add the same amount to bottom padding
     so overall height stays unchanged. Applies only when JS marks container
     as Safari (class added below). */
  .bulk-inquiry-form.is-safari .custom-select__button {
    /* Increase bottom spacing by ~1.5px without changing total height */
    padding-top: calc((var(--ff-gap, 0.625rem) * 2 + var(--ff-label-size, 0.875rem)) - 7.5px);
    padding-bottom: calc(var(--ff-bottom, 0.10rem) + 1.5px);
  }

  .custom-select__button:after {
    content: '';
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    width: 1.5em;
    height: 1.5em;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-size: contain;
    pointer-events: none;
  }

  .custom-select.is-open .custom-select__button {
    border-color: #007aff;
  }

  .custom-select__list {
    position: absolute;
    z-index: 1000;
    top: 100%;
    left: 0;
    right: 0;
    background: #fff;
    border: 1px solid #d2d2d7;
    border-radius: 8px;
    margin-top: 4px;
    max-height: 240px;
    overflow: auto;
    padding: 0.25rem 0;
    box-shadow: 0 8px 24px rgba(0,0,0,0.08);
    -webkit-overflow-scrolling: touch; /* Smooth scrolling on Safari */
  }

  .custom-select__option {
    padding: 0.5rem 0.75rem;
    cursor: pointer;
  }

  .custom-select__option[aria-selected="true"] {
    background: rgba(0,113,255,0.08);
  }

  .custom-select__option:hover {
    background: rgba(0,0,0,0.05);
  }

  .custom-select.error .custom-select__button {
    border-color: #FF3B30;
    background-color: #FFF5F5;
  }
  /* When the custom select is in error, color and float the label like Windows */
  /* Error state: keep label as centered placeholder, but red */
  .custom-select.error + .apple-contact-form__label {
    color: #FF3B30 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    left: 0.65rem;
    font-size: 1rem !important;
    background: transparent;
    padding: 0;
  }

  /* Safari-friendly override for "Other" input */
  .other-input.apple-contact-form__field-wrapper[hidden] {
    display: none !important; /* hidden ne force karo */
  }

  .other-input.apple-contact-form__field-wrapper {
    grid-column: 1 / -1;
    margin-top: 0.5rem;   /* use margin-top, not margin-block-start */
  }

  select#ContactForm-industry {
      padding-top: 25px;
  }
/* END_SECTION:bulk-inquiry-form */

/* START_SECTION:contact-request-form (INDEX:17) */
.spacing1{
  gap:2rem !important;
}
@media (max-width: 768px) {
  .apple-contact-form__row{
    gap:2rem !important;
  }
  /* Keep date label floated up by default on mobile */
  .apple-contact-form__field-wrapper--date .apple-contact-form__label{
    top: 7px !important;
    transform: none !important;
    font-size: 0.8125rem !important;
    left: 0.4rem;
    background: #fff;
    padding: 0 4px;
    pointer-events: none !important; /* Allow clicks to pass through to input */
  }
}

/* Reuse Apple form styles and add local rules */
.contact-request__subheading { 
  margin: 0rem 0 1rem; 
  font-weight: 600; 
  font-size: 24px;
  color: #1d1d1f; 
  text-align: center; 
}

.other-input {
  margin-block-start: 0.5rem;
}

.other-input.apple-contact-form__field-wrapper { 
  grid-column: 1 / -1; 
  margin-top: 0.5rem; 
}

.other-input:not(.focused):not(.has-value) .apple-contact-form__label { 
  top: 50% !important; 
  transform: translateY(-50%) !important; 
  font-size: 1rem !important; 
}

.other-input .apple-contact-form__label { 
  color: #86868b !important; 
  font-weight: 400 !important; 
}

/* Float the "Please specify" label a bit higher on focus/value to match others */
.other-input.focused .apple-contact-form__label,
.other-input.has-value .apple-contact-form__label {
  top: 7px !important;
  transform: none !important;
  font-size: 0.8125rem !important; /* 13px */
  left: 0.4rem;
  background: #fff;
  padding: 0 4px;
}

/* Ensure there is room for the floated label */
.other-input .apple-contact-form__input {
  padding-top: 1.35rem;
}

/* Widen container for better layout */
.contact-request-form .apple-contact-form__container { 
  max-width: 1024px; 
}

/* Bulk item styles */
.bulk-item { 
  position: relative; 
  padding-top: 0; 
  margin-bottom: 26px; 
}

.bulk-item__remove {
  font-size: 30px; 
  position: absolute; 
  right: 0; 
  top: -0.25rem; 
  color: #FF3B30; 
  background: none; 
  border: 0; 
  cursor: pointer; 
  padding-top: 4px;
}

.bulk-item + .bulk-item {
  border-top:1px solid #898d95;
  padding-top: 40px;
}

.bulk-grid-3 { 
  display: grid; 
  grid-template-columns: 1fr; 
  gap: 0.875rem; 
  align-items: start; 
}

@media (min-width: 768px) {
  .contact-request-form .apple-contact-form__row.bulk-grid-3 { 
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important; 
    column-gap: 0.875rem; 
  }
  .contact-request-form .apple-contact-form__field-wrapper { 
    min-width: 0; 
  }
}

@media (min-width: 1200px) {
  .contact-request-form .apple-contact-form__row.bulk-grid-3 { 
    column-gap: 1rem; 
  }
}

/* Make vertical spacing between commodity rows match logistics */
.bulk-item .apple-contact-form__row.bulk-grid-3 { 
  margin-bottom: 2rem; 
}

.bulk-item .apple-contact-form__row.bulk-grid-3:last-of-type { 
  margin-bottom: 2rem; 
}

/* Header with right-aligned Add Items, consistent top/bottom spacing */
.bulk-header { 
  display: flex; 
  align-items: center; 
  gap: 1rem; 
  position: relative; 
  margin: 2rem 0 1rem; 
  justify-content:center;
}

.bulk-header .contact-request__subheading { 
  margin: 0; 
  flex: 1; 
  text-align: center; 
}

.bulk-add-row { 
  display: flex; 
  justify-content: flex-end; 
  padding: 0; 
  margin: 0; 
}

.bulk-add-row .bulk-add { 
  margin: 0; 
  padding: 0; 
}

.bulk-header h3 {
  margin: 0;
  text-align: center;
  flex: 1;
}

.bulk-header button {
  position: absolute;
  right: 0; /* stick to right */
}

@media (max-width: 768px) {
  .bulk-header button {
    margin-top: 78px;
    text-align: right;
    padding-right: 0px;
    padding-bottom: 0px;
    font-size:15px;
  }
  .first{
    padding-bottom:20px;
  }
}

/* Inline error spacing and icon alignment */
.apple-contact-form__error-message {
  position: absolute;
  top: 100%;
  left: 0;
  margin-top: 10px;
  font-size: 0.75rem;
  color: #FF3B30;
  display: none;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

/* Make sure dropdowns show red border in error state (no other UI changes) */
select.apple-contact-form__input.error,
.apple-contact-form__select.error {
  border-color: #FF3B30 !important;
}

/* Ensure text inputs and textarea show red border on error */
.apple-contact-form__input.error {
  border-color: #FF3B30 !important;
}

/* Fix textarea gap issue */
.apple-contact-form__field-wrapper--textarea {
  position: relative;
}

.apple-contact-form__input--textarea {
  resize: vertical;
  min-height: 100px;
  line-height: 1.5;
  padding-top: 1.5rem;
  padding-bottom: 0.75rem;
  /* Keep whitespace inside the textarea and prevent horizontal spill */
  white-space: pre-wrap;          /* preserve spaces and wrap (fallback) */
  white-space: break-spaces;      /* modern: wrap long sequences of spaces */
  overflow-wrap: anywhere;        /* allow breaking long runs of spaces/words */
  word-break: break-word;         /* fallback */
  overflow-x: hidden;             /* no horizontal overflow */
}

.apple-contact-form__input--textarea:focus {
  outline: none;
  border-color: #007aff;
  box-shadow: 0 0 0 3px rgba(0, 122, 255, 0.1);
}

/* Ensure textarea floating label width fits inside without touching borders */
.apple-contact-form__input--textarea + .apple-contact-form__label,
.apple-contact-form__input--textarea:focus + .apple-contact-form__label,
.apple-contact-form__field-wrapper.focused .apple-contact-form__input--textarea + .apple-contact-form__label {
  width: 96% !important;
}

/* Prevent gap when clicking textarea */
.apple-contact-form__input--textarea::placeholder {
  opacity: 0;
  transition: none;
}

.apple-contact-form__input--textarea:focus::placeholder {
  opacity: 0;
}

.error-icon { 
  width: 12px; 
  height: 12px; 
  flex-shrink: 0; 
}

/* Success message styling (matching apple-style-multi-steps-form.liquid) */
.apple-contact-form__success {
  text-align: center;
  margin: 0px;
  padding: 0px;
  font-size: 48px;
  line-height: 1.0834933333;
  font-weight: 600;
  letter-spacing: -0.003em;
  transition: none !important;
  animation: none !important;
  transform: none !important;
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  opacity: 1 !important;
  visibility: visible !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Disable smooth scrolling and anchoring when success is present */
html:has(.apple-contact-form__success),
body.form-success-showing {
  scroll-behavior: auto !important;
  overflow-anchor: none !important;
}

/* Remove any borders from parent containers when success is shown */
.apple-contact-form:has(.apple-contact-form__success) *,
body.form-success-showing * {
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}

.apple-contact-form__success span {
  color: #1d1d1f;
  margin-bottom: 0px !important;
  line-height: 0.5 !important;
  display: block;
}

.apple-contact-form__success p:first-of-type {
  margin-top: 0px;
  line-height: 1.0834933333;
  display: block;
  color: #86868b;
  margin-bottom: 60px;
}

.apple-contact-form__team {
  font-weight: 300;
  color: #1d1d1f !important;
  font-size: 21px !important;
}

.apple-contact-form__support-link {
  color: #0071e3 !important;
  text-decoration: none;
  font-size: 21px !important;
}

.apple-contact-form__support-link:hover {
  text-decoration: underline;
}

/* Hide the title when form is successfully submitted */
.apple-contact-form:has(.apple-contact-form__success) .apple-contact-form__title {
  display: none;
}

/* Hide form fields when success message is present */
.apple-contact-form__success ~ .apple-contact-form__fields {
  display: none !important;
}

/* Ensure success message is always visible and properly displayed */
.apple-contact-form__success {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  z-index: 1000 !important;
  width: 100% !important;
  min-height: 400px !important;
}

@media (max-width: 768px) {
  /* Ensure success message is visible on mobile */
  .apple-contact-form__success {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    z-index: 10 !important;
  }
  
  /* Center success and prevent header overlap on mobile */
  body:has(.apple-contact-form__success) .apple-contact-form,
  body.form-success-showing .apple-contact-form {
    --mobile-fixed-header-height: var(--header-height, 64px);
    margin-top: var(--mobile-fixed-header-height) !important;
    min-height: calc(100svh - var(--mobile-fixed-header-height)) !important;
    height: calc(100svh - var(--mobile-fixed-header-height)) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  
  body:has(.apple-contact-form__success) .apple-contact-form__container,
  body.form-success-showing .apple-contact-form__container {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
  }
}

/* Safari-compatible: Add class to body when success is shown */
body.form-success-showing * {
  view-transition-name: none !important;
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

/* Override global view transition animations */
body.form-success-showing ::view-transition-old(*),
body.form-success-showing ::view-transition-new(*),
body.form-success-showing ::view-transition-group(*) {
  animation: none !important;
}

/* Disable page transitions when navigating to success page */
body.form-success-showing main[data-page-transition-enabled="true"] {
  view-transition-name: none !important;
}

/* Force immediate layout - no animations */
body.form-success-showing .apple-contact-form,
body.form-success-showing .apple-contact-form__container,
body.form-success-showing .apple-contact-form__form,
body.form-success-showing .apple-contact-form__success {
  animation: none !important;
  transition: none !important;
  transform: none !important;
  height: auto !important;
  min-height: auto !important;
  max-height: none !important;
  padding-top:100px;
}

@media (max-width: 769px) {
  body.form-success-showing .apple-contact-form,
  body.form-success-showing .apple-contact-form__container,
  body.form-success-showing .apple-contact-form__form,
  body.form-success-showing .apple-contact-form__success {
    animation: none !important;
    transition: none !important;
    transform: none !important;
    padding-top: 1px;
  }
  body:has(.apple-contact-form__success) .apple-contact-form {
  padding: 0rem 1rem !important;
}
}

/* Also support :has() for browsers that support it */
body:has(.apple-contact-form__success) * {
  view-transition-name: none !important;
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

body:has(.apple-contact-form__success) .apple-contact-form,
body:has(.apple-contact-form__success) .apple-contact-form__container,
body:has(.apple-contact-form__success) .apple-contact-form__form,
body:has(.apple-contact-form__success) .apple-contact-form__success {
  animation: none !important;
  transition: none !important;
  transform: none !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  padding-top: 0 !important;
  min-height: 80vh !important;
  box-sizing: border-box;  
}

body:has(.apple-contact-form__success) .apple-contact-form {
  padding: 2rem 1rem !important;
}

/* Ensure the form container doesn't animate its height */
.apple-contact-form {
  transition: none !important;
}

.apple-contact-form__container {
  transition: none !important;
}

/* Override any fadeInUp or slide animations */
body:has(.apple-contact-form__success) [class*="animate"],
body:has(.apple-contact-form__success) [class*="fade"],
body:has(.apple-contact-form__success) [class*="slide"] {
  animation: none !important;
  transition: none !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Global animation disable when class is present */
html.disable-all-animations *,
body.disable-all-animations * {
  animation: none !important;
  transition: none !important;
  animation-duration: 0s !important;
  animation-delay: 0s !important;
  transition-duration: 0s !important;
  transition-delay: 0s !important;
}

/* Ensure immediate rendering */
html.disable-all-animations,
body.disable-all-animations {
  animation: none !important;
  transition: none !important;
  transform: none !important;
}

/* Override view transition animations globally */
html.disable-all-animations ::view-transition-old(*),
html.disable-all-animations ::view-transition-new(*),
html.disable-all-animations ::view-transition-group(*),
html.disable-all-animations ::view-transition-image-pair(*) {
  animation: none !important;
  animation-duration: 0s !important;
}

  /* Native select styling for all browsers */
  .apple-contact-form__select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 1.5em;
    padding-right: 2.25rem;
  }

/* Ensure dropdown container captures clicks properly in Safari */
.custom-select * {
  pointer-events: auto;
}

.custom-select__button {
  width: 100%;
  text-align: left;
  /* Match floating-label spacing used by text inputs */
  padding: calc(var(--ff-gap, 0.625rem) * 2 + var(--ff-label-size, 0.875rem)) 2.25rem var(--ff-bottom, 0.10rem) 0.65rem;
  border: 1px solid #d2d2d7;
  border-radius: 8px;
  background: #fff;
  font-size: 1rem;
  line-height: 1rem; /* align with input text line-height */
  color: #1d1d1f;
  cursor: pointer;
  position: relative;
  box-sizing: border-box; /* ensure padding contributes like inputs */
  min-height: 52.8px; /* keep visual parity with inputs */
  white-space: nowrap; /* prevent wrap from changing height */
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Safari fine‑tune: match Windows input label/text gap */
.contact-request-form.is-safari .custom-select__button {
  /* Increase bottom spacing by ~1.5px without changing total height */
  padding-top: calc((var(--ff-gap, 0.625rem) * 2 + var(--ff-label-size, 0.875rem)) - 7.5px);
  padding-bottom: calc(var(--ff-bottom, 0.10rem) + 1.5px);
}

.custom-select__button:after {
  content: '';
  position: absolute;
  right: 0.5rem;
  top: 50%;
  transform: translateY(-50%);
  width: 1.5em;
  height: 1.5em;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-size: contain;
  pointer-events: none;
}

.custom-select.is-open .custom-select__button {
  border-color: #007aff;
}

.custom-select__list {
  position: absolute;
  z-index: 1000;
  top: 100%;
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid #d2d2d7;
  border-radius: 8px;
  margin-top: 4px;
  max-height: 240px;
  overflow: auto;
  padding: 0.25rem 0;
  box-shadow: 0 8px 24px rgba(0,0,0,0.08);
  -webkit-overflow-scrolling: touch; /* Smooth scrolling on Safari */
}

.custom-select__option {
  padding: 0.5rem 0.75rem;
  cursor: pointer;
}

.custom-select__option[aria-selected="true"] {
  background: rgba(0,113,255,0.08);
}

.custom-select__option:hover {
  background: rgba(0,0,0,0.05);
}

.custom-select.error .custom-select__button {
  border-color: #FF3B30;
  background-color: #FFF5F5;
}

/* When the custom select is in error, color and float the label like Windows */
.custom-select.error + .apple-contact-form__label {
  color: #FF3B30 !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  left: 0.65rem;
  font-size: 1rem !important;
  background: transparent;
  padding: 0;
}

/* Safari-friendly override for "Other" input */
.other-input.apple-contact-form__field-wrapper[hidden] {
  display: none !important;
}

.other-input.apple-contact-form__field-wrapper {
  grid-column: 1 / -1;
  margin-top: 0.5rem;
}
  /* Override custom select styles - use native browser dropdowns */
  .custom-select,
  .custom-select__button,
  .custom-select__list,
  .custom-select__option {
    display: none !important;
  }
/* Safari fix: Ensure date input is fully clickable */
.apple-contact-form__field-wrapper--date {
  cursor: pointer;
}

.apple-contact-form__field-wrapper--date .apple-contact-form__input {
  cursor: pointer;
  position: relative;
  z-index: 2;
}

.apple-contact-form__field-wrapper--date .apple-contact-form__label {
  pointer-events: none !important;
  z-index: 2;
}

/* Date format hint - always visible and clickable */
.apple-contact-form__field-wrapper--date { position: relative; }
.mobile-date-hint {
  display:none;
  position:absolute;
  left:10px;
  bottom:0.6rem;
  color:#86868b;
  font-size:1rem;
  cursor:pointer;
  z-index: 3;
  user-select: none;
}
/* END_SECTION:contact-request-form */

/* START_SECTION:logo-scrolling-section (INDEX:27) */
.logo-scrolling-section {
  width: 100%;
  overflow: hidden;
  position: relative;
  display: flex;
  align-items: center;
}

.logo-scrolling-container {
  width: 100%;
}

.logo-scrolling-heading {
  margin-bottom: 30px;
}

.logo-scrolling-title {
  margin: 0;
  font-weight: 600;
}

.logo-row {
  overflow: hidden;
  position: relative;
  margin-bottom: var(--row-gap, 20px);
  width: 100%;
}

.logo-row:last-child {
  margin-bottom: 0;
}

.logo-track {
  display: flex;
  align-items: center;
  width: max-content;
  will-change: transform;
  transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-font-smoothing: antialiased;
}

/* Animation for Left to Right */
.logo-row[data-direction="ltr"] .logo-track {
  animation: scroll-ltr var(--scroll-speed, 20s) linear infinite;
}

/* Animation for Right to Left */
.logo-row[data-direction="rtl"] .logo-track {
  animation: scroll-rtl var(--scroll-speed, 20s) linear infinite;
}

/* Pause animation on hover */
.logo-row.paused .logo-track {
  animation-play-state: paused !important ;
}
.logo-row:hover .logo-track,
.logo-row.paused .logo-track {
  animation-play-state: paused !important;
}


.logo-item {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  padding: 10px;
  background: transparent;
  transition: transform 0.2s ease-out, opacity 0.2s ease-out;
}

.logo-item:hover {
  transform: scale(1.05);
  opacity: 0.9;
}

.logo-link {
  display: block;
  text-decoration: none;
  color: inherit;
}

.logo-image {
  display: block;
  max-width: 100%;
  height: auto;
}

/* Keyframe animations */
@keyframes scroll-ltr {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

@keyframes scroll-rtl {
  0% {
    transform: translateX(-50%);
  }
  100% {
    transform: translateX(0);
  }
}

/* Responsive Design */
@media (max-width: 768px) {
  .logo-scrolling-container {
    padding: 0 15px !important;
  }
  
  .logo-scrolling-heading {
    margin-bottom: 20px;
  }
  
  .logo-row {
    margin-bottom: 15px;
  }
  
  .logo-item {
    padding: 8px;
  }
}

@media (max-width: 480px) {
  .logo-scrolling-container {
    padding: 0 10px !important;
  }
  
  .logo-item {
    padding: 6px;
  }
}

/* Reduced Motion Support */
@media (prefers-reduced-motion: reduce) {
  .logo-track {
    animation: none !important;
  }
  
  .logo-item:hover {
    transform: none;
  }
}
/* END_SECTION:logo-scrolling-section */

/* START_SECTION:thank-you (INDEX:58) */
.apple-contact-form {
  min-height: 100svh;
  min-height: 100dvh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #ffffff;
  padding: 2rem 1rem;
  padding-bottom: calc(2rem + env(safe-area-inset-bottom));
  -webkit-tap-highlight-color: transparent;
}

.apple-contact-form__container {
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
}

.apple-contact-form__title {
  font-size: 2.5rem;
  font-weight: 600;
  color: #1d1d1f;
  text-align: center;
  margin-bottom: 3rem;
}

.apple-contact-form__form {
  width: 100%;
}

.apple-contact-form__fields {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.apple-contact-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

.apple-contact-form__field-wrapper {
  position: relative;
  width: 100%;
}

.apple-contact-form__field-wrapper--full {
  grid-column: 1 / -1;
}

.apple-contact-form__input {
  width: 100%;
  padding: 1.5rem 0.75rem 0rem 0.65rem;
  border: 1px solid #d2d2d7;
  border-radius: 8px;
  font-size: 1rem;
  background-color: #ffffff;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.apple-contact-form__input:focus {
  border-color: #666666;
  box-shadow: 0 0 0 3px rgba(102, 102, 102, 0.1);
  transform: translateY(-1px);
}

.apple-contact-form__input--textarea {
  resize: vertical;
  min-height: 120px;
  padding-top: 1.5rem;
}

.apple-contact-form__select {
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");
  background-position: right 0.5rem center;
  background-repeat: no-repeat;
  background-size: 1.5em 1.5em;
  padding-right: 2.5rem;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  color: transparent; /* Hide the default text when no option is selected */
}

/* Style the select dropdown when an option is selected */
.apple-contact-form__select:not([value=""]) {
  color: #1d1d1f; /* Show text color when option is selected */
}



.apple-contact-form__label {
  position: absolute;
  left: 0.4rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1rem;
  color: #86868b;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
  background-color: #ffffff;
  padding: 0 0.25rem;
}

/* .apple-contact-form__input:focus + .apple-contact-form__label,
.apple-contact-form__input:not(:placeholder-shown) + .apple-contact-form__label:not(for=ContactForm-topic),
.apple-contact-form__field-wrapper.focused .apple-contact-form__label,
.apple-contact-form__field-wrapper.has-value .apple-contact-form__label {
  top: 0.2rem;
  left: 0.4rem;
  font-size: 0.875rem;
  color: #666666;
  font-weight: 500;
  background-color: transparent;
  transform: none;
  padding: 0 0.25rem;
} */

/* .apple-contact-form__input--textarea:focus + .apple-contact-form__label,
.apple-contact-form__input--textarea:not(:placeholder-shown) + .apple-contact-form__label,
.apple-contact-form__field-wrapper.focused .apple-contact-form__input--textarea + .apple-contact-form__label,
.apple-contact-form__field-wrapper.has-value .apple-contact-form__input--textarea + .apple-contact-form__label {
  top: 0.2rem;
  left: 0.4rem;
  font-size: 0.875rem;
  color: #666666;
  font-weight: 500;
  background-color: transparent;
  transform: none;
  padding: 0 0.25rem;
} */

/* Ensure select dropdown label is vertically centered by default */
/* .apple-contact-form__select + .apple-contact-form__label {
  top: 50%;
  transform: translateY(-50%);
} */

/* .apple-contact-form__select:focus + .apple-contact-form__label,
.apple-contact-form__field-wrapper.focused .apple-contact-form__select + .apple-contact-form__label,
.apple-contact-form__field-wrapper.has-value .apple-contact-form__select + .apple-contact-form__label {
  top: 0.2rem;
  left: 0.4rem;
  font-size: 0.875rem;
  color: #666666;
  font-weight: 500;
  background-color: transparent;
  transform: none;
  padding: 0 0.25rem;
} */

.apple-contact-form__submit {
  background: none;
  border: none;
  color: #0071e3;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  padding: 0.5rem 1rem;
  border-radius: 6px;
  transition: all 0.2s ease;
  text-align: center;
  margin: 0 auto;
  display: block;
}

.apple-contact-form__submit:hover {
  background-color: rgba(0, 113, 227, 0.1);
}

.apple-contact-form__submit:active {
  transform: scale(0.98);
}

.apple-contact-form__submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
}

.apple-contact-form__submit.loading {
  background-color: rgba(0, 113, 227, 0.1);
  color: #0071e3;
}

.submit-loading {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.loading-circle {
  animation: spin 1.5s linear infinite;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

.apple-contact-form__error {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1rem;
  padding: 2rem;
  border-radius: 12px;
  margin-bottom: 2rem;
  background-color: #ffebee;
  color: #c62828;
  border: 1px solid #ffcdd2;
}

.apple-contact-form__success {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 1rem;
  margin-bottom: 2rem;
}

.apple-contact-form__success span {
  font-size: 2rem;
  font-weight: 600;
  color: #1d1d1f;
  margin-bottom: 1rem;
  line-height: 1.2;
}

.apple-contact-form__success p {
  font-size: 2rem;
  color: #86868b;
  margin: 0;
  line-height: 1.4;
}

.apple-contact-form__team {
  font-weight: 300;
  color: #1d1d1f !important;
  font-size: 1rem  !important;
}

.apple-contact-form__support-link {
  color: #0071e3;
  text-decoration: none;
  font-size: 1rem;

}

.apple-contact-form__support-link:hover {
  text-decoration: underline;
}

/* Hide the title when form is successfully submitted */
.apple-contact-form:has(.apple-contact-form__success) .apple-contact-form__title,
.apple-contact-form__success ~ .apple-contact-form__title {
  display: none;
}

/* Alternative approach for browsers that don't support :has() */
.apple-contact-form__success {
  display: flex !important;
}

/* Hide form fields when success message is present */
.apple-contact-form__success ~ .apple-contact-form__fields,
.apple-contact-form__success + .apple-contact-form__fields {
  display: none !important;
}

@media (max-width: 768px) {
  .apple-contact-form__row {
    grid-template-columns: 1fr;
  }
  
  .apple-contact-form__title {
    font-size: 2rem;
    margin-bottom: 2rem;
  }
  
  .apple-contact-form {
    padding: 20px;
    padding-bottom: calc(1rem + env(safe-area-inset-bottom));
    min-height: 100svh;
    min-height: 100dvh;
  }
  
  .apple-contact-form__input {
    font-size: 16px; /* Prevents zoom on iOS */
  }
  
  .apple-contact-form__submit {
    width: 100%;
    padding: 1rem;
    font-size: 1.125rem;
  }

  /* Ensure success message is visible on mobile */
.apple-contact-form__success {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  z-index: 10 !important;
}

}

@media (max-width: 480px) {
  .apple-contact-form__title {
    font-size: 1.75rem;
  }
  
  .apple-contact-form__container {
    padding: 0 0rem;
  }
}
/* END_SECTION:thank-you */

/* START_SECTION:track-order-advanced (INDEX:59) */
.apple-track-order {
  min-height: 100svh;
  min-height: 89dvh;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #ffffff;
  padding: 100px 1rem;
  padding-bottom:100px;
  /* padding-bottom: calc(2rem + env(safe-area-inset-bottom)); */
  -webkit-tap-highlight-color: transparent;
  /* Floating-field spacing variables */
  --ff-gap: 0.625rem;
  --ff-label-size: 0.875rem;
  --ff-bottom: 0.10rem;
  --ff-label-size-focused: 0.8125rem;
  --ff-gap-focused: calc(var(--ff-gap) - 2px);
}

.apple-track-order__container {
  width: 100%;
  max-width: 600px;
  margin: 0 auto;
}

.apple-track-order__title {
  font-size: 2.5rem;
  font-weight: 600;
  color: #1d1d1f;
  text-align: center;
  margin-bottom: 0.5rem;
}

.apple-track-order__description {
  font-size: 1.125rem;
  color: #86868b;
  text-align: center;
  margin-bottom: 3rem;
}

.apple-track-order__form {
  width: 100%;
}

.apple-track-order__fields {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.apple-track-order__field-wrapper {
  position: relative;
  width: 100%;
  margin-bottom: 0.75rem; /* Add space for help text and error messages */
}
.apple-track-order__help-text {
  display: block;
  margin-top: 0.375rem;
  font-size: 0.8125rem;
  color: #86868b;
  line-height: 1.3;
}

.apple-track-order__error-message {
 margin-top: 0.25rem;
 font-size: 0.75rem;
 color: #FF3B30;
 white-space: normal;
 align-items: center;
 gap: 0.5rem;
 display: none; /* Hidden by default, shown via JS */

}

.error-icon {
  flex-shrink: 0;
}

.apple-track-order__input {
  width: 100%;
  height: 53.19px;
  padding: 1.5rem 0.75rem 0rem 0.65rem;
  border: 1px solid #d2d2d7;
  border-radius: 8px;
  font-size: 1rem;
  background-color: #ffffff;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  outline: none;
  -moz-appearance: none;
  appearance: none;
  -webkit-appearance: none;
  padding-bottom: var(--ff-bottom, 0.10rem) !important;
}

.apple-track-order__input.error {
  border-color: #FF3B30;
  background-color: #FFF5F5;
  
}
/* Keep label in default position when input has error and is empty */
.apple-track-order__input.error:placeholder-shown + .apple-track-order__label {
  color: #FF3B30 !important;
      top: 36%;
}


.apple-track-order__input:focus {
  border-color: #007aff !important;
  box-shadow: none !important;
  outline: none !important;
  transform: none !important;
}

.apple-track-order__label {
  position: absolute;
  left: 0.4rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1rem;
  color: #86868b;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  pointer-events: none;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  padding: 0 0.25rem;
  line-height: 1;
  z-index: 2;
}
  @media (max-width: 768px) {
  .apple-track-order__label{
    top: 50%;
  }
  }

.apple-track-order__input:not(:placeholder-shown) + .apple-track-order__label,
.apple-track-order__field-wrapper.has-value .apple-track-order__label {
  top: var(--ff-gap) !important;
  left: 0.4rem;
  font-size: var(--ff-label-size);
  color: #666666;
  font-weight: 500;
  background-color: #ffffff;
  transform: translateY(0) !important;
  padding: 0 0.25rem;
  box-shadow: none;
  border-radius: 4px;
}

.apple-track-order__input:focus + .apple-track-order__label,
.apple-track-order__field-wrapper.focused .apple-track-order__label {
  top: var(--ff-gap) !important;
  left: 0.4rem;
  font-size: var(--ff-label-size-focused) !important;
  color: #666666;
  font-weight: 500;
  background-color: #ffffff;
  transform: none !important;
  padding: 0 0.25rem;
  box-shadow: none;
  border-radius: 4px;
}


.apple-track-order__submit {
  background: none;
  border: none;
  color: #0071e3;
  font-size: 1rem;
  font-weight: 500;
  cursor: pointer;
  padding: 0.5rem 1rem;
  border-radius: 6px;
  transition: all 0.2s ease;
  text-align: center;
  margin: 0 auto;
  display: block;
}

.apple-track-order__submit:hover {
  background-color: rgba(0, 113, 227, 0.1);
}

.apple-track-order__submit:active {
  transform: scale(0.98);
}

.apple-track-order__submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  transform: none;
}

.apple-track-order__submit.loading {
  background-color: rgba(0, 113, 227, 0.1);
  color: #0071e3;
}

.submit-loading {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Safari-specific fixes */
@supports (-webkit-appearance: none) {
  .apple-track-order__input[placeholder=" "]::-webkit-input-placeholder {
    content: ' ' !important;
    color: transparent !important;
  }
  .apple-track-order__input:required::-webkit-input-placeholder {
    opacity: 0 !important;
  }
  
  /* Prevent content shifting in Safari */
  .apple-track-order__input {
    transform: none !important;
    transition: border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  }
  
  .apple-track-order__input:hover {
    transform: none !important;
  }
  
  /* Ensure label positioning is stable */
  .apple-track-order__label {
    transform: translateY(-50%) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
  }
  
  .apple-track-order__input:not(:placeholder-shown) + .apple-track-order__label,
  .apple-track-order__field-wrapper.has-value .apple-track-order__label {
    transform: translateY(0) !important;
  }
  
  .apple-track-order__input:focus + .apple-track-order__label,
  .apple-track-order__field-wrapper.focused .apple-track-order__label {
    transform: translateY(0) !important;
  }
}

@media (max-width: 768px) {
  .apple-track-order__title {
    font-size: 2rem;
    margin-bottom: 0.5rem;
  }
  
  .apple-track-order__description {
    font-size: 1rem;
    margin-bottom: 2rem;
  }
  
  .apple-track-order {
    padding: 1rem;
    padding-bottom: calc(1rem + env(safe-area-inset-bottom));
    min-height: 100svh;
    min-height: 100dvh;
  }
  
  .apple-track-order__input {
    font-size: 16px; /* Prevents zoom on iOS */
  }
  
  .apple-track-order__submit {
    width: 100%;
    padding: 1rem;
    font-size: 1.125rem;
  }
}

@media (max-width: 480px) {
  .apple-track-order__title {
    font-size: 1.75rem;
  }
  
  .apple-track-order__container {
    padding: 0 1rem;
  }
}

/* Keep existing tracking results styles */
.tracking-results {
  margin-top: 3rem;
  padding: 2rem;
  background: #f8f8f8;
  border-radius: 12px;
}

.results-header h3 {
  font-size: 1.5rem;
  margin-bottom: 1rem;
  color: #1d1d1f;
}

.tracking-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-bottom: 1.5rem;
}

@media (max-width: 640px) {
  .tracking-info-grid {
    grid-template-columns: 1fr;
  }
}

.info-item {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.info-label {
  font-size: 0.875rem;
  color: #86868b;
  font-weight: 500;
}

.info-value {
  font-size: 1rem;
  color: #1d1d1f;
  font-weight: 600;
}

.tracking-timeline {
  margin-top: 2rem;
}

.tracking-timeline h4 {
  font-size: 1.25rem;
  margin-bottom: 1rem;
  color: #1d1d1f;
}

.timeline {
  position: relative;
  padding-left: 2rem;
}

.timeline::before {
  content: '';
  position: absolute;
  left: 0.5rem;
  top: 0.5rem;
  bottom: 0.5rem;
  width: 2px;
  background: #e0e0e5;
}

.timeline-item {
  position: relative;
  padding-bottom: 1.5rem;
}

.timeline-marker {
  position: absolute;
  left: -1.5rem;
  top: 0.25rem;
  width: 1rem;
  height: 1rem;
  background: #fff;
  border: 2px solid #86868b;
  border-radius: 50%;
}

.timeline-item.current .timeline-marker {
  background: #0071e3;
  border-color: #0071e3;
}

.timeline-content {
  background: #fff;
  padding: 1rem;
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

.timeline-status {
  font-weight: 600;
  color: #1d1d1f;
  margin-bottom: 0.25rem;
}

.timeline-location {
  color: #666;
  font-size: 0.875rem;
  margin-bottom: 0.25rem;
}

.timeline-date {
  color: #86868b;
  font-size: 0.875rem;
}

.error-message {
  margin-top: 2rem;
  padding: 1.5rem;
  background: #fff5f5;
  border: 1px solid #ff3b30;
  border-radius: 8px;
}

.error-content h3 {
  color: #ff3b30;
  margin-bottom: 0.5rem;
}

.alternative-tracking {
  padding: 2rem;
  border-radius: 12px;
}

.courier-links, .universal-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 1rem;
}

.courier-link, .universal-link {
  display: inline-block;
  padding: 0.5rem 1rem;
  background: #fff;
  border: 1px solid #d2d2d7;
  border-radius: 8px;
  color: #0071e3;
  text-decoration: none;
  transition: all 0.2s ease;
}

  .courier-link:hover, .universal-link:hover {
    background: #0071e3 !important;
    color: #fff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0,113,227,0.15);
  }

/* Safari-specific input stability fixes */
.is-safari .apple-track-order__input {
  transform: none !important;
  transition: border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.is-safari .apple-track-order__input:hover {
  transform: none !important;
  border-color: #d2d2d7 !important;
}

.is-safari .apple-track-order__label {
  transform: translateY(-50%) !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.is-safari .apple-track-order__input:not(:placeholder-shown) + .apple-track-order__label,
.is-safari .apple-track-order__field-wrapper.has-value .apple-track-order__label {
  transform: translateY(0) !important;
}

.is-safari .apple-track-order__input:focus + .apple-track-order__label,
.is-safari .apple-track-order__field-wrapper.focused .apple-track-order__label {
  transform: translateY(0) !important;
}
/* END_SECTION:track-order-advanced */