/* Application forms (/apply/corporate/, /apply/partner/, /apply/chauffeur/) — same dark card and gold as /widget/card/.
   Transparent page, mobile-first; two columns once the card is wide enough. Height is posted to the parent page (apply.js). */
:root, html, body { background: transparent !important; background-color: transparent !important; color-scheme: normal; margin: 0; padding: 0; }
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
body { --gold: #c8a96e; --gold-hi: #d9bd86; --field: #f4f3ef; --field-line: #d6d2c8; --ink: #1a1a1a; --err: #ff8a7a;
  --body: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  font: 400 14px/1.4 var(--body); color: #fff; overflow: hidden; -webkit-text-size-adjust: 100%; }
a { color: var(--gold); }
:focus-visible { outline: 2px solid var(--gold-hi); outline-offset: 2px; }

.ap-card { background: rgba(15,15,15,.85); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border: 1px solid rgba(200,169,110,.35);
  max-width: 680px; margin: 0 auto; border-radius: 14px; padding: 18px 16px; box-shadow: 0 20px 50px rgba(0,0,0,.45); container-type: inline-size; }
.ap-h { margin: 0; font: 400 22px/1.2 Georgia, 'Times New Roman', serif; color: var(--gold); }
.ap-sub { margin: 4px 0 14px; font-size: 13px; color: rgba(255,255,255,.7); }
.ap-req-note { margin: 0 0 14px; padding: 9px 12px; border-left: 3px solid var(--gold); background: rgba(200,169,110,.12); font-size: 13px; font-weight: 600; color: #f3e6c8; }
.ap-sec { margin: 16px 0 8px; padding-top: 12px; border-top: 1px solid rgba(200,169,110,.22); font: 600 11px/1 var(--body); letter-spacing: .1em; text-transform: uppercase; color: var(--gold); }
.ap-sec:first-of-type { border-top: 0; padding-top: 0; margin-top: 4px; }

.ap-grid { display: grid; grid-template-columns: 1fr; gap: 0 10px; }
@container (min-width: 500px) { .ap-grid { grid-template-columns: 1fr 1fr; } .ap-grid .full { grid-column: 1 / -1; } }

.ap-f { display: grid; gap: 4px; margin: 0 0 10px; min-width: 0; position: relative; }
.ap-f > label, .ap-lab { font-size: 10px; line-height: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .06em; color: rgba(255,255,255,.78); }
.ap-f .req::after, .ap-lab.req::after { content: ' *'; color: var(--gold); }
.ap-f input, .ap-f select, .ap-f textarea { width: 100%; height: 40px; padding: 0 11px; font: 400 15px var(--body); color: var(--ink); background: var(--field);
  border: 1px solid var(--field-line); border-radius: 7px; -webkit-appearance: none; appearance: none; }
.ap-f select { padding-right: 30px; background-image: linear-gradient(45deg, transparent 50%, #6b665c 50%), linear-gradient(135deg, #6b665c 50%, transparent 50%);
  background-position: calc(100% - 16px) 17px, calc(100% - 11px) 17px; background-size: 5px 5px; background-repeat: no-repeat; }
.ap-f textarea { height: auto; min-height: 76px; padding: 9px 11px; resize: vertical; line-height: 1.4; }
.ap-f input:focus, .ap-f select:focus, .ap-f textarea:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 2px rgba(200,169,110,.35); }
.ap-f.bad input, .ap-f.bad select, .ap-f.bad textarea { border-color: var(--err); box-shadow: 0 0 0 2px rgba(255,138,122,.3); }
.ap-hint { font-size: 11px; color: rgba(255,255,255,.55); }
.ap-msg { font-size: 12px; font-weight: 600; color: var(--err); }

/* pill choices (radio = one, checkbox = several) */
.ap-pills { display: flex; flex-wrap: wrap; gap: 6px; }
.ap-pills label { position: relative; cursor: pointer; }
.ap-pills input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.ap-pills span { display: inline-flex; align-items: center; min-height: 34px; padding: 0 12px; border: 1px solid rgba(200,169,110,.45); border-radius: 17px;
  font: 600 13px/1 var(--body); color: #fff; background: rgba(255,255,255,.03); user-select: none; }
.ap-pills input:checked + span { background: var(--gold); border-color: var(--gold); color: #0f0f0f; }
.ap-pills input:focus-visible + span { outline: 2px solid var(--gold-hi); outline-offset: 2px; }
.ap-f.bad .ap-pills span { border-color: var(--err); }
.ap-pills.eq { display: grid; grid-template-columns: repeat(4, 1fr); }
.ap-pills.eq.n2 { grid-template-columns: repeat(2, 1fr); } .ap-pills.eq.n3 { grid-template-columns: repeat(3, 1fr); } /* classes, not inline styles: the page CSP blocks style attributes */
.ap-pills.eq label { display: block; min-width: 0; }
.ap-pills.eq span { display: flex; width: 100%; justify-content: center; padding: 0 4px; text-align: center; }

/* address suggestions open inside the card, so the iframe height includes them */
.ap-sugg { list-style: none; margin: 4px 0 0; padding: 4px 0; background: #fff; color: var(--ink); border: 1px solid var(--gold); border-radius: 8px; }
.ap-sugg li { padding: 8px 11px; cursor: pointer; font-size: 14px; line-height: 1.3; }
.ap-sugg li small { display: block; color: #6b665c; font-size: 12px; }
.ap-sugg li.active, .ap-sugg li:hover { background: #f4ecdc; }
.ap-sugg li.credit { cursor: default; text-align: right; font-size: 10px; color: #8a857b; padding: 2px 11px; }
.ap-sugg li.credit:hover { background: none; }

.ap-check { display: flex; gap: 9px; align-items: flex-start; margin: 12px 0 10px; font-size: 13px; font-weight: 500; cursor: pointer; }
.ap-check input { width: 18px; height: 18px; flex: none; margin: 0; accent-color: var(--gold); }
.ap-check.bad span { color: var(--err); }
.ap-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.ap-ts { min-height: 65px; margin: 4px 0 6px; }
.ap-err { margin: 8px 0 0; padding: 8px 11px; font-size: 13px; font-weight: 600; color: #ffd0c8; background: #3a1d1a; border-left: 3px solid var(--err); border-radius: 4px; }
.ap-go { display: block; width: 100%; height: 46px; margin-top: 10px; border: 0; border-radius: 8px; background: var(--gold); color: #0f0f0f; font: 700 15px var(--body); cursor: pointer; }
.ap-go:hover { background: var(--gold-hi); }
.ap-go:disabled { opacity: .6; cursor: wait; }
.ap-note { margin: 8px 0 0; text-align: center; font-size: 11px; color: rgba(255,255,255,.55); }

.ap-done { text-align: center; padding: 18px 6px 10px; }
.ap-done .tick { display: inline-grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--gold); color: #0f0f0f; font: 700 26px/1 var(--body); }
.ap-done h2 { margin: 12px 0 6px; font: 400 22px/1.25 Georgia, 'Times New Roman', serif; color: var(--gold); }
.ap-done p { margin: 0 auto 8px; max-width: 440px; color: rgba(255,255,255,.85); font-size: 14px; }

/* embedded (apply/framed.js): the host page provides the H1 and intro */
.framed .ap-h, .framed .ap-sub { display: none; }
html:not(.framed) .framed-only { display: none; }
