/*
Contact page — layout + Contact Form 7 dark skin.
Conditionally enqueued via is_page_template( 'page-contact.php' )
(functions.php). Tokens from main.css :root. Solid gold for focus rings
(translucent gold muddies on dark surfaces).
*/

/* ── LAYOUT ──────────────────────────────────────────── */
.contact-page{min-height:70vh}
.contact-cols{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:start;margin-top:8px}
.contact-info-col .info-cols{grid-template-columns:1fr}

/* ── FORM PANEL ──────────────────────────────────────── */
.contact-form-panel{background:var(--panel);border:1px solid var(--border);border-radius:4px;padding:32px}

/* ── CONTACT FORM 7 SKIN ─────────────────────────────── */
.contact-form-panel .wpcf7 label{display:block;font-family:var(--head);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--mist);margin-bottom:16px}
/* Required marker (matches .req on the sell/join form pages) */
.contact-form-panel .wpcf7 .req{color:var(--gold);margin-left:3px}
.contact-form-panel .wpcf7 .wpcf7-form-control-wrap{display:block;margin-top:6px}
.contact-form-panel .wpcf7 input[type="text"],
.contact-form-panel .wpcf7 input[type="email"],
.contact-form-panel .wpcf7 input[type="tel"],
.contact-form-panel .wpcf7 select,
.contact-form-panel .wpcf7 textarea{width:100%;background:var(--dark);border:1px solid var(--border);border-radius:2px;color:var(--white);font-family:var(--body);font-size:14px;padding:12px 14px}
.contact-form-panel .wpcf7 textarea{min-height:140px;resize:vertical}
.contact-form-panel .wpcf7 input:focus,
.contact-form-panel .wpcf7 select:focus,
.contact-form-panel .wpcf7 textarea:focus{border-color:var(--gold-lt);box-shadow:0 0 0 2px var(--gold-lt);outline:none}
.contact-form-panel .wpcf7 select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%239BA3AF' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;cursor:pointer}
.contact-form-panel .wpcf7 .wpcf7-submit{display:inline-block;background:var(--gold);color:var(--ink);border:none;border-radius:2px;font-family:var(--head);font-size:14px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:16px 44px;cursor:pointer;transition:background .15s}
.contact-form-panel .wpcf7 .wpcf7-submit:hover{background:var(--gold-lt)}

/* Validation + response states */
.contact-form-panel .wpcf7-not-valid-tip{color:color-mix(in srgb,var(--red) 55%,white);font-size:12px;letter-spacing:0;text-transform:none;margin-top:6px}
.contact-form-panel .wpcf7 input.wpcf7-not-valid,
.contact-form-panel .wpcf7 select.wpcf7-not-valid,
.contact-form-panel .wpcf7 textarea.wpcf7-not-valid{border-color:var(--red)}
/* Response box — selectors mirror CF7's own state rules
   (.wpcf7 form.invalid .wpcf7-response-output etc.) at higher
   specificity, or CF7's yellow/green defaults bleed through. */
.contact-form-panel .wpcf7 form .wpcf7-response-output{background:var(--dark);border:1px solid var(--border);border-left:3px solid var(--gold);border-radius:3px;padding:14px 18px;margin:20px 0 0;font-size:14px;color:var(--silver)}
.contact-form-panel .wpcf7 form.invalid .wpcf7-response-output,
.contact-form-panel .wpcf7 form.unaccepted .wpcf7-response-output,
.contact-form-panel .wpcf7 form.aborted .wpcf7-response-output,
.contact-form-panel .wpcf7 form.failed .wpcf7-response-output,
.contact-form-panel .wpcf7 form.spam .wpcf7-response-output{border-color:var(--border);border-left:3px solid var(--red)}
.contact-form-panel .wpcf7 form.sent .wpcf7-response-output{border-color:var(--border);border-left:3px solid var(--gold)}
.contact-form-panel .wpcf7-spinner{background-color:var(--mist)}

/* ── RESPONSIVE ──────────────────────────────────────── */
@media (max-width: 900px) {
  .contact-cols{grid-template-columns:1fr;gap:32px}
}

/* ── ACCEPTANCE CHECKBOXES (added 2026-08-16, mirrors page-join-our-team.css) ── */
.contact-form-panel .wpcf7-acceptance{display:block}
.contact-form-panel .wpcf7-acceptance .wpcf7-list-item{margin:0 0 14px;display:block}
.contact-form-panel .wpcf7-acceptance .wpcf7-list-item label{display:flex;gap:10px;align-items:flex-start;font-family:var(--body);font-size:13px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--mist);line-height:1.6;margin-bottom:0;cursor:pointer}
.contact-form-panel .wpcf7-acceptance input[type="checkbox"]{width:auto;margin:3px 0 0;accent-color:var(--gold);flex-shrink:0}
.contact-form-panel .wpcf7-acceptance a{color:var(--gold-lt);text-decoration:underline}
.contact-form-panel .wpcf7-acceptance a:hover{color:var(--gold)}
.contact-form-panel .wpcf7-acceptance .wpcf7-list-item label::after{content:' *';color:var(--gold);font-weight:700}