/* ==========================================================================
   iPro Hire enquiry basket: header trigger + drawer (styles.css "Enquiry list")
   Site-wide. Icons are CSS masks so they survive the header's HTML filter.
   ========================================================================== */
.ip-nav-basket, .ipb {
  --ipb-bg: #0c0d10; --ipb-surface: #1c1f24; --ipb-elev: #15171b; --ipb-border: #2a2d34; --ipb-strong: #3a3e47;
  --ipb-text: #f4f5f6; --ipb-muted: #a7acb5; --ipb-faint: #8a90a0;
  --ipb-red: #d6001c; --ipb-red-h: #ef1f37; --ipb-sky: #1e9be0; --ipb-sky-300: #6fc4ee; --ipb-green: #22c55e;
  --ipb-font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ipb-display: "ITC Avant Garde Gothic", "Archivo Black", "Arial Black", sans-serif;
  --ipb-ease: cubic-bezier(.2,.7,.3,1);
}
.ipb-mask { display: inline-block; background: currentColor; -webkit-mask: var(--m) center / contain no-repeat; mask: var(--m) center / contain no-repeat; }

/* ---------- Header trigger ---------- */
.ip-nav-basket {
  position: relative; width: 36px; height: 36px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;
  color: #a7acb5 !important; text-decoration: none; vertical-align: middle;
}
.ip-nav-basket:hover { color: #fff !important; background: rgba(255,255,255,0.07); }
.ip-basket-icon {
  width: 18px; height: 18px; display: block; background: currentColor;
  --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='8' y='2' width='8' height='4' rx='1'/%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2'/%3E%3Cpath d='m9 14 2 2 4-4'/%3E%3C/svg%3E");
  -webkit-mask: var(--m) center / contain no-repeat; mask: var(--m) center / contain no-repeat;
}
.ip-basket-count {
  position: absolute; top: -2px; right: -4px; min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: 999px; background: #d6001c; color: #fff;
  font: 700 11px/18px "Inter", -apple-system, sans-serif; text-align: center; pointer-events: none;
}
.ip-basket-count.is-empty { display: none; }
.ip-basket-count.is-bumped { animation: ipb-bump 400ms cubic-bezier(.2,.7,.3,1); }
@keyframes ipb-bump { 40% { transform: scale(1.35); } }
/* Sits in the header's Text 2 slot, just before the phone number */
#header .et-header-text.text-2 { display: inline-flex; align-items: center; gap: 14px; }
.header-mobile .et-mobile-header-text { display: inline-flex; align-items: center; gap: 8px; }
.ipb-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- Drawer ---------- */
html.ipb-lock, html.ipb-lock body { overflow: hidden; }
.ipb-backdrop { position: fixed; inset: 0; z-index: 1040; background: rgba(0,0,0,0.6); opacity: 0; transition: opacity 250ms var(--ipb-ease, ease); }
.ipb-backdrop.is-open { opacity: 1; }
.ipb {
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 1045;
  width: min(420px, 92vw); display: flex; flex-direction: column;
  background: var(--ipb-bg); border-left: 1px solid var(--ipb-border); color: var(--ipb-muted);
  font-family: var(--ipb-font); font-weight: 300; line-height: 1.55;
  transform: translateX(100%); visibility: hidden;
  transition: transform 300ms var(--ipb-ease), visibility 0s linear 300ms; outline: none;
}
.ipb.is-open { transform: none; visibility: visible; transition: transform 300ms var(--ipb-ease); }
.admin-bar .ipb { top: 32px; }
@media (max-width: 782px) { .admin-bar .ipb { top: 46px; } }
.ipb *, .ipb *::before, .ipb *::after { box-sizing: border-box; }
.ipb-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; border-bottom: 1px solid var(--ipb-border); }
.ipb .ipb-title { margin: 0; color: #fff; font: 700 1rem/1.2 var(--ipb-display); text-transform: uppercase; letter-spacing: 0.04em; }
.ipb-close { width: 36px; height: 36px; border: 0; border-radius: 50%; background: rgba(255,255,255,0.04); color: var(--ipb-muted); cursor: pointer; position: relative; padding: 0; }
.ipb-close::before, .ipb-close::after { content: ""; position: absolute; left: 50%; top: 50%; width: 14px; height: 2px; margin: -1px 0 0 -7px; background: currentColor; border-radius: 1px; transform: rotate(45deg); }
.ipb-close::after { transform: rotate(-45deg); }
.ipb-close:hover { color: #fff; background: rgba(255,255,255,0.08); }
.ipb-body { flex: 1 1 auto; overflow-y: auto; padding: 20px; display: flex; flex-direction: column; gap: 24px; }

.ipb-empty { text-align: center; padding: 32px 8px; }
.ipb-empty[hidden], .ipb-form[hidden] { display: none !important; }
.ipb-empty-icon {
  display: block; width: 40px; height: 40px; margin: 0 auto; background: var(--ipb-faint);
  --m: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='8' y='2' width='8' height='4' rx='1'/%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2'/%3E%3C/svg%3E");
  -webkit-mask: var(--m) center / contain no-repeat; mask: var(--m) center / contain no-repeat;
}
.ipb .ipb-empty-title { color: #fff; font-weight: 600; margin: 12px 0 6px; }
.ipb .ipb-empty p { margin: 0 0 6px; }
.ipb-pill { display: inline-flex; align-items: center; gap: 12px; margin-top: 14px; background: var(--ipb-red); color: #fff !important; border-radius: 999px; padding: 8px 8px 8px 20px; font: 700 12px/1 var(--ipb-font); letter-spacing: 0.04em; text-transform: uppercase; text-decoration: none; transition: background 200ms var(--ipb-ease); }
.ipb-pill:hover { background: var(--ipb-red-h); }
.ipb-pill-arrow { width: 28px; height: 28px; border-radius: 50%; background: rgba(255,255,255,0.2); display: flex; align-items: center; justify-content: center; }

.ipb-items { display: flex; flex-direction: column; gap: 1px; list-style: none; margin: 0; padding: 0; background: var(--ipb-border); border-radius: 10px; overflow: hidden; }
.ipb-items:empty { display: none; }
.ipb-item { display: flex; gap: 14px; padding: 14px; margin: 0; background: var(--ipb-surface); }
.ipb-thumb { width: 64px; height: 64px; flex-shrink: 0; object-fit: contain; background: #fff; border-radius: 6px; display: block; margin: 0; }
.ipb-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.ipb .ipb-name { color: #fff; font-weight: 600; font-size: 15px; line-height: 1.3; text-decoration: none; }
.ipb .ipb-name:hover { color: var(--ipb-sky-300); }
.ipb-sub { color: var(--ipb-faint); font-size: 12px; }
.ipb-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 8px; }
.ipb-qty { display: flex; align-items: center; background: var(--ipb-elev); border: 1px solid var(--ipb-border); border-radius: 6px; overflow: hidden; }
.ipb-qty button { width: 34px; height: 34px; border: 0; background: none; color: var(--ipb-muted); font: 400 16px/1 var(--ipb-font); cursor: pointer; padding: 0; }
.ipb-qty button:hover { color: #fff; }
.ipb-qty span { min-width: 28px; text-align: center; color: #fff; font: 700 14px/1 var(--ipb-font); }
.ipb-remove {
  width: 34px; height: 34px; border: 0; border-radius: 50%; background: none; color: var(--ipb-faint); cursor: pointer; padding: 0; position: relative;
}
.ipb-remove::before {
  content: ""; position: absolute; inset: 9px; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2m3 0v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2m3 0v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6'/%3E%3C/svg%3E") center / contain no-repeat;
}
.ipb-remove:hover { color: #ff5a6b; background: rgba(255,255,255,0.07); }

/* ---------- Drawer form (Gravity Forms) ---------- */
.ipb-form { padding-top: 24px; border-top: 1px solid var(--ipb-border); }
.ipb .gform_wrapper { margin: 0 !important; }
.ipb .gform_wrapper .gform_fields { row-gap: 16px !important; }
.ipb .gform_wrapper .gfield_label { color: #fff !important; font: 700 12px/1.3 var(--ipb-font) !important; letter-spacing: 0.06em !important; text-transform: uppercase !important; margin: 0 0 7px !important; }
.ipb .gform_wrapper .gfield_required { display: none !important; }
.ipb .gform_wrapper input[type="text"], .ipb .gform_wrapper input[type="email"], .ipb .gform_wrapper input[type="tel"], .ipb .gform_wrapper textarea {
  width: 100%; background: var(--ipb-elev) !important; border: 1px solid var(--ipb-border) !important; border-radius: 4px !important;
  padding: 11px 13px !important; height: auto !important; min-height: 0 !important; color: var(--ipb-text) !important; font: 400 15px/1.4 var(--ipb-font) !important; box-shadow: none !important;
}
.ipb .gform_wrapper textarea { min-height: 88px !important; resize: vertical; }
.ipb .gform_wrapper input::placeholder, .ipb .gform_wrapper textarea::placeholder { color: var(--ipb-faint) !important; opacity: 1 !important; }
.ipb .gform_wrapper input:focus, .ipb .gform_wrapper textarea:focus { outline: none; border-color: var(--ipb-sky) !important; box-shadow: 0 0 0 3px rgba(30,155,224,0.25) !important; }
.ipb .gform_wrapper .gform_footer { margin: 16px 0 0 !important; padding: 0 !important; position: relative; }
.ipb .gform_wrapper .gform_button, .ipb .gform_wrapper input[type="submit"] {
  width: 100% !important; height: 48px !important; background: var(--ipb-red) !important; color: #fff !important; border: 0 !important; border-radius: 999px !important;
  font: 700 13px/1 var(--ipb-font) !important; letter-spacing: 0.04em !important; text-transform: uppercase !important; cursor: pointer; box-shadow: none !important; margin: 0 !important; padding: 0 24px !important;
}
.ipb .gform_wrapper .gform_button:hover { background: var(--ipb-red-h) !important; }
.ipb .gform_wrapper .gform_footer::after { content: "\2192"; position: absolute; right: 9px; top: 50%; transform: translateY(-50%); width: 30px; height: 30px; border-radius: 50%; background: rgba(255,255,255,0.2); color: #fff; display: flex; align-items: center; justify-content: center; font: 700 14px/1 var(--ipb-font); pointer-events: none; }
.ipb .gform_wrapper .validation_message { color: #ff5a6b !important; background: none !important; border: 0 !important; padding: 6px 0 0 !important; }
.ipb .gform_wrapper .gform_validation_errors { background: rgba(214,0,28,0.12) !important; border: 1px solid rgba(214,0,28,0.4) !important; border-radius: 6px !important; box-shadow: none !important; }
.ipb .gform_wrapper .gform_validation_errors h2 { color: #ffb3bb !important; font-size: 13px !important; }
.ipb .gform_confirmation_message { text-align: center; padding: 24px 8px; color: var(--ipb-muted); }
.ipb .gform_confirmation_message::before {
  content: ""; display: block; width: 44px; height: 44px; margin: 0 auto 14px; background: var(--ipb-green);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm-1.2 14.2-4-4 1.4-1.4 2.6 2.6 5.6-5.6 1.4 1.4-7 7Z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm-1.2 14.2-4-4 1.4-1.4 2.6 2.6 5.6-5.6 1.4 1.4-7 7Z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.ipb .gform_confirmation_message strong { display: block; color: #fff; font: 700 1.2rem/1.3 var(--ipb-display); text-transform: uppercase; margin-bottom: 8px; }

@media (prefers-reduced-motion: reduce) {
  .ipb, .ipb-backdrop { transition: none !important; }
  .ip-basket-count.is-bumped { animation: none; }
}
