@charset "utf-8";
/* CSS Document */

#content {margin-top:10px;}
/* ===== ACIQ Warranty Form — Compact widths ===== */

/* General: stop stretching and align to left */
.aciq-form .aciq-grid { justify-items: start; align-items: start; }
.aciq-item.model-list {min-height:75px}
form.aciq-form {padding:20px; position:relative; z-index:100;}
.address-list .aciq-field:nth-of-type(4) {clear:left;}
	.address-list .aciq-field:nth-of-type(5) {clear:left;}
.aciq-field {float:left; padding:10px 5px;}
  .aciq-form .aciq-field input,
  .aciq-form .aciq-field select{ max-width: 340px; border:solid 1px #ccc}
  .aciq-form .aciq-field textarea{ max-width: 720px; min-width:500px; border:solid 1px #ccc; }
h4{clear:left; margin-bottom:0; padding-top:20px;}
.aciq-actions {clear:left; text-align:center;}

/* Desktop/tablet: use content-sized columns */
@media (min-width: 768px){
  /* Make inputs shrink to their own max-width instead of 100% */
  .aciq-form input[type="text"],
  .aciq-form input[type="email"],
  .aciq-form input[type="date"],
  .aciq-form input[type="number"],
  .aciq-form select,
  .aciq-form textarea{
    width: auto;            /* was 100% */
  }

  /* Default cap for most fields */


  /* Unit row: make 4 compact columns and size fields */
  .aciq-form .aciq-item .aciq-grid{
    grid-template-columns: repeat(4, max-content);
    column-gap: 16px;
  }
  .aciq-form input[name$="[part_number]"],
  .aciq-form input[name$="[serial_number]"]{ max-width: 300px; }
  .aciq-form input[name$="[purchase_date]"],
  .aciq-form input[name$="[install_date]"]{ max-width: 160px; }

  /* Customer info */
  .aciq-form #customer_name,
  .aciq-form #customer_email,
  .aciq-form #customer_phone{ max-width: 320px; }
	

  .aciq-form #address1,
  .aciq-form #address2{ max-width: 560px; min-width:500px }

  .aciq-form #city{ max-width: 220px; }
  .aciq-form #state{ max-width: 160px; }
  .aciq-form #postal_code{ max-width: 160px; }
  .aciq-form #country{ max-width: 220px; }

  /* Installer */
  .aciq-form #installer_name,
  .aciq-form #installer_license{ max-width: 320px; }

  /* Make non-unit grids use compact columns too */
  .aciq-form .aciq-grid{
    grid-template-columns: repeat(auto-fit, minmax(220px, max-content));
    gap: 14px;
  }
}

.aciq-field label[for="country"],
.aciq-field input#country {display: none;}

/* Mobile keeps full width for usability */
@media (max-width: 767.98px){
  .aciq-form input,
  .aciq-form select,
  .aciq-form textarea{ width: 100%; max-width: 100%; }
}
