/* variables.css
   Central variables used across the component styles.
   Keep this file first and imported before other files.
*/

:root{
  /* Form email / input defaults */
  --fe-bg: #ffffff;
  --fe-border: #d1d5db;
  --fe-text: #0f1720;
  --fe-placeholder: #9aa4b2;
  --fe-focus: #3b82f6;
  --fe-invalid: #d9534f;
  --fe-radius: 100px;
  --fe-padding-y: 0.6rem;
  --fe-padding-x: 0.9rem;
  --fe-font-size: 1rem;
  --fe-icon-gap: 12px;

  /* WPForms dark inputs */
  --wf-input-bg: #000000;
  --wf-input-border: #2b2b2b;
  --wf-input-text: #ffffff;
  --wf-label-color: #ffffff;
  --wf-focus: #3b82f6;
  --wf-invalid: #d9534f;
  --wf-radius: 12px;
  --wf-padding-y: 1rem;
  --wf-padding-x: 1rem;
  --wf-font-size: 1rem;
  --wf-label-size: 1.125rem;

  /* Buttons (defaults used for WPForms but available globally) */
  --btn-bg: #000000;
  --btn-border: #ffffff;
  --btn-text: #ffffff;
  --btn-hover-bg: #e8492f;
  --btn-hover-border: #e23a20;
  --btn-radius: 100px;
  --btn-padding: 5px 10px;
  --btn-font-size: 18px;
  --btn-focus-ring: rgba(59,130,246,0.18);
  --btn-transition: 120ms ease;

  /* Team Cobras page palette */
  --tc-bg: #10172a;
  --tc-panel-bg: #081428;
  --tc-text: #ffffff;
  --tc-muted: #9fb0d2;
  --tc-accent: #7fc2ff;
  --tc-radius: 20px;
  --tc-max-width: 900px;
  --tc-gap: 18px;
  --tc-container-padding: 28px;
  --tc-font-size: 18px;
  --tc-field-radius: 20;

  /* Custom select */
  --select-bg: #ffffff;
  --select-border: #000000;
  --select-color: #000000;
  --select-radius: 100px;
  --select-padding-y: 0.6rem;
  --select-padding-x: 0.8rem;
  --select-font-size: 1.125rem;
  --select-arrow-gap: 12px;
  --select-focus-ring: rgba(59,130,246,0.15);
  --select-disabled-bg: #f3f4f6;
  --select-invalid-border: #d9534f;

  /* Utility */
  --ui-font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}