/* The quote form. Inherits the site's type; only layout and state here. */
.auz-fq{--auz-line:#DAD5C2;--auz-orange:#DA4F29;--auz-green:#0C2D07;
  --auz-tint:#F7F6F2}
.auz-fq *{box-sizing:border-box}
.auz-fq-hp{position:absolute!important;left:-9999px;width:1px;height:1px;
  overflow:hidden}
.auz-fq-grid{display:grid;gap:16px}
.auz-fq-2{grid-template-columns:1fr 1fr}
.auz-fq-3{grid-template-columns:1fr 1fr 1fr}
.auz-fq-f{margin:0 0 12px;display:block}
.auz-fq-f label{display:block;font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;font-weight:700;margin-bottom:4px}
.auz-fq-f label span{color:var(--auz-orange)}
.auz-fq input[type=text],.auz-fq input[type=email],.auz-fq input[type=tel],
.auz-fq input[type=number],.auz-fq input[type=date],.auz-fq select,.auz-fq textarea{
  width:100%;padding:10px 13px;border:1px solid var(--auz-line);
  background:#FDFDFB;border-radius:2px;font:inherit;font-size:16px}

/* 44px, not 48px: the form sits in a half-width column on the home page and
   every saved pixel is multiplied by fourteen fields. 44px is the floor, not
   a preference - it is the minimum comfortable touch target.

   ONE HEIGHT FOR EVERY SINGLE-LINE CONTROL.
   A select does not render the same height as a text input from the same
   padding and font — Chrome gives it about 4px less. In a row of fields
   aligned along their bottoms that difference becomes a visibly lower box,
   which is what it looks like when one field in a row "is not aligned".
   Pinning the height removes the cause rather than nudging the symptom. */
.auz-fq input[type=text],.auz-fq input[type=email],.auz-fq input[type=tel],
.auz-fq input[type=number],.auz-fq input[type=date],.auz-fq select{
  height:44px;min-height:44px;line-height:normal}
.auz-fq input:focus,.auz-fq select:focus,.auz-fq textarea:focus{
  outline:2px solid var(--auz-orange);outline-offset:1px}
.auz-fq-legend{font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  font-weight:700;margin:14px 0 8px}

/* suburb type-ahead */
.auz-fq-sub{position:relative}
.auz-fq-drop{position:absolute;left:0;right:0;top:100%;z-index:40;
  background:#fff;border:1px solid var(--auz-line);border-top:0;
  max-height:240px;overflow:auto;display:block}
.auz-fq-drop[hidden]{display:none}
.auz-fq-opt{display:block;padding:9px 14px;cursor:pointer;font-size:15px}
.auz-fq-opt i{font-style:normal;color:#6B7565;margin-left:6px}
.auz-fq-opt:hover,.auz-fq-opt.is-on{background:var(--auz-green);color:#fff}
.auz-fq-opt.is-on i,.auz-fq-opt:hover i{color:#C9D8BA}
.auz-fq-none{display:block;padding:9px 14px;color:#6B7565}

/* item rows */
.auz-fq-item{display:grid;gap:10px;align-items:end;position:relative;
  grid-template-columns:1.4fr .6fr 1fr 1fr 1fr 1fr auto;
  padding:14px;border:1px solid var(--auz-line);background:var(--auz-tint);
  margin-bottom:10px}
/* padding:0 as well as margin:0 — the cells are <p> elements, and Divi puts
   padding-bottom:1em on every paragraph. Left in place, one padded cell sits
   an em above the rest of the row. */
.auz-fq-item .auz-fq-f,.auz-fq-row .auz-fq-f{margin:0;padding:0}
/* Same 44px as the inputs it sits beside, so the row reads as one band
   rather than a line of boxes with a short one on the end. */
.auz-fq-del{border:1px solid var(--auz-line);background:#fff;width:44px;
  height:44px;font-size:20px;line-height:1;cursor:pointer;border-radius:2px}
.auz-fq-del:hover{border-color:#B3261E;color:#B3261E}
.auz-fq-add{border:1px solid var(--auz-line);background:#fff;padding:9px 16px;
  font:inherit;font-size:13px;letter-spacing:.07em;text-transform:uppercase;
  font-weight:700;cursor:pointer;border-radius:2px}
.auz-fq-add:hover{border-color:var(--auz-green)}
.auz-fq-forklift{margin:14px 0}
.auz-fq-forklift label{display:flex;gap:10px;align-items:flex-start;
  font-size:15px}

/* buttons */
.auz-fq-calc,.auz-fq-send{background:var(--auz-orange);color:#fff;border:0;
  padding:14px 24px;font:inherit;font-size:14px;letter-spacing:.07em;
  text-transform:uppercase;font-weight:700;cursor:pointer;border-radius:2px;
  margin-top:8px}
.auz-fq-calc:hover,.auz-fq-send:hover{background:#C2431F}
.auz-fq-calc[disabled],.auz-fq-send[disabled]{opacity:.55;cursor:default}

/* the quote */
.auz-fq-quote{margin:24px 0;padding:22px 24px;border:1px solid var(--auz-line);
  background:#fff}
.auz-fq-quote h3{margin:0 0 14px}
.auz-fq-quote dl{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;
  margin:0}
.auz-fq-quote dt{font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  font-weight:700;align-self:center}
.auz-fq-quote dd{margin:0;font-size:16px}
.auz-fq-total{display:flex;align-items:baseline;gap:14px;margin:16px 0 0;
  padding-top:14px;border-top:2px solid var(--auz-green)}
.auz-fq-total span{font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  font-weight:700}
.auz-fq-total b{font-size:30px}
.auz-fq-warn{margin:14px 0 0;padding:12px 14px;background:#FFF6D6;
  border-left:3px solid #E8C33A;font-size:15px}

/* messages */
.auz-fq-msg{margin:16px 0 0;padding:12px 14px;font-size:15px}
.auz-fq-msg.is-bad{background:#FBEAE4;border-left:3px solid #B3261E}
.auz-fq-msg.is-ok{background:#E7F0DF;border-left:3px solid #2E6B1F}

@media (max-width:900px){
  .auz-fq-item{grid-template-columns:1fr 1fr 1fr;padding-bottom:52px}
  .auz-fq-del{position:absolute;right:14px;bottom:12px}
}
@media (max-width:700px){
  .auz-fq-2,.auz-fq-3{grid-template-columns:1fr}
  .auz-fq-item{grid-template-columns:1fr 1fr}
}

/* ------------------------------------------------------------------
   FIELDS DEFINED IN THE ADMIN

   Six columns, so a third is an exact third. Three 33.33% columns leave
   a sliver at the end of the row that shows up as a misaligned right
   edge against the full-width fields above and below it.

   align-items:end, for the same reason the package rows use it. A label
   like "Destination Suburbs/Town" wraps to two lines in a narrow column
   while its neighbour's does not; aligned to the top, that pushes one
   input a line below the other. Aligned to the bottom, the labels take
   whatever room they need and the inputs still line up.
   ------------------------------------------------------------------ */
.auz-fq-custom,.auz-fq-fields{display:grid;grid-template-columns:repeat(6,1fr);
  gap:0 16px;align-items:end}
.auz-fq-w-full{grid-column:span 6}
.auz-fq-w-twothirds{grid-column:span 4}
.auz-fq-w-half{grid-column:span 3}
.auz-fq-w-third{grid-column:span 2}

.auz-fq-radios{display:flex;gap:18px;flex-wrap:wrap;padding-top:4px}
.auz-fq-radios label,.auz-fq-tick{display:flex;gap:8px;align-items:center;
  font-size:15px;font-weight:400;letter-spacing:0;text-transform:none}
/* The clickable label extends the target well past the 20px control. */
.auz-fq-radios label{min-height:36px}

/* A yes/no question does not need a line of its own for the question and
   another for the two buttons. Side by side it reads as one question and
   saves a row; it wraps back to two lines when there is no room. */
.auz-fq-f--radio{display:flex;align-items:center;gap:8px 18px;flex-wrap:wrap}
.auz-fq-f--radio > label{margin-bottom:0;flex:0 1 auto}
.auz-fq-f--radio .auz-fq-radios{padding-top:0}
.auz-fq-custom input[type=radio],.auz-fq-custom input[type=checkbox],
.auz-fq-fields input[type=radio],.auz-fq-fields input[type=checkbox]{
  width:auto;min-width:20px;min-height:20px}

/* repeating rows */
.auz-fq-rep .auz-fq-rows{margin-bottom:8px}
.auz-fq-row{display:grid;gap:8px;align-items:end;position:relative;
  grid-template-columns:repeat(4,1fr) auto;
  padding:10px;border:1px solid var(--auz-line);background:var(--auz-tint);
  margin-bottom:8px}
.auz-fq-row .auz-fq-f{grid-column:auto}
.auz-fq-row .auz-fq-del,.auz-fq-item .auz-fq-del{align-self:end}
/* The row labels carry units — "Length (cm)" — so they need room to wrap
   without the cell below them moving. Bottom alignment handles the rest. */
.auz-fq-row .auz-fq-f label,.auz-fq-item .auz-fq-f label{align-self:end}

@media (max-width:900px){
  .auz-fq-w-third{grid-column:span 3}
  .auz-fq-w-twothirds{grid-column:span 6}
  .auz-fq-row{grid-template-columns:1fr 1fr;padding-bottom:52px}
  .auz-fq-row .auz-fq-del{position:absolute;right:14px;bottom:12px}
}
@media (max-width:700px){
  .auz-fq-custom,.auz-fq-fields{grid-template-columns:1fr}
  .auz-fq-w-full,.auz-fq-w-half,.auz-fq-w-third,.auz-fq-w-twothirds{
    grid-column:1 / -1}
}

/* the enquiry form's send button sits under a full-width grid, not beside it */
.auz-enq .auz-fq-send{display:block}