/**
 * alltours-jobs styling layer for the REXX reverse-proxied application form.
 *
 * Two jobs:
 *  1. FIX class collisions from rexx base.css on injected theme header/footer
 *  2. RESTYLE REXX form (buttons, inputs) to alltours colors
 *
 * All form overrides scoped to #frame_zone (ID-specificity).
 * Fonts and icons from REXX are kept (FontAwesome, OpenSans).
 */

/* =========================================================================
 * 1. FIX CLASS COLLISIONS — rexx base.css defines .flex-row, .block, etc.
 *    that collide with Tailwind on the injected theme header/footer
 * ========================================================================= */

/* rexx base.css:1314 defines .flex-row { width: 16.6667%; border: 1px solid black }
   — Tailwind <header> uses .flex-row. Targeted override in wrapper scope. */
#rexx-theme-header .flex-row,
#rexx-theme-footer .flex-row {
  width: auto !important;
  border: none !important;
  padding: 0 !important;
  text-align: inherit !important;
  flex-direction: row;
}

/* Restore nav dividers (REXX's li { border: 0 } + all:revert stripped them) */
#rexx-theme-header #header nav ul > li + li {
  border-left: 2px solid #d4d6d9;
}

/* =========================================================================
 * 2. RESTYLE form (buttons, inputs, text) to alltours colors
 * ========================================================================= */

:root {
  --primary-rgb: 223 3 19;
  --secondary-rgb: 0 164 213;
  --tertiary-rgb: 0 63 122;
  --cta-color: 92 195 2;
  --divider-grey-rgb: 220 221 224;
  --main-bg-rgb: 247 247 247;
}

/* Headings */
#frame_zone #application_box > h1 {
  color: rgb(var(--tertiary-rgb));
  font-weight: 700;
}

#frame_zone .group_head {
  color: rgb(var(--tertiary-rgb));
  border-bottom: 2px solid rgb(var(--divider-grey-rgb));
  padding-bottom: 0.5em;
}

/* Labels */
#frame_zone label {
  color: rgb(var(--tertiary-rgb));
  font-weight: 600;
}

#frame_zone .asterisk,
#frame_zone .duty {
  color: rgb(var(--primary-rgb));
}

/* Inputs / selects */
#frame_zone input[type="text"],
#frame_zone input[type="email"],
#frame_zone input[type="tel"],
#frame_zone input[type="date"],
#frame_zone input[type="password"],
#frame_zone textarea,
#frame_zone select,
#frame_zone .ui-selectmenu-button {
  border: 1px solid rgb(var(--divider-grey-rgb));
  border-radius: 8px;
  background: #fff;
}

#frame_zone input:focus,
#frame_zone textarea:focus,
#frame_zone select:focus,
#frame_zone .ui-selectmenu-button:focus {
  outline: none;
  border-color: rgb(var(--secondary-rgb));
  box-shadow: 0 0 0 3px rgb(var(--secondary-rgb) / 0.15);
}

#frame_zone input[type="checkbox"],
#frame_zone input[type="radio"] {
  accent-color: rgb(var(--secondary-rgb));
}

/* Progress bar */
#frame_zone .progress-bar {
  background: rgb(var(--cta-color));
}

/* BUTTONS — fix specificity vs rexx base.css */
/* Submit/primary — alltours CTA green */
#frame_zone #btn_online_application_send a,
#frame_zone .css_button input[type="submit"],
#frame_zone button[type="submit"],
#frame_zone input[type="submit"] {
  background: rgb(var(--cta-color)) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 9999px !important;
  padding: 0.7em 1.75em !important;
  font-weight: 700 !important;
  cursor: pointer !important;
}

#frame_zone #btn_online_application_send a:hover,
#frame_zone .css_button input[type="submit"]:hover,
#frame_zone button[type="submit"]:hover,
#frame_zone input[type="submit"]:hover {
  filter: brightness(0.92) !important;
}

/* Secondary buttons (upload CV, finest jobs, cancel) */
#frame_zone .css_button,
#frame_zone .btn_finest_jobs {
  background: rgb(var(--tertiary-rgb)) !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 9999px !important;
  cursor: pointer !important;
}

#frame_zone .css_button a,
#frame_zone .btn_finest_jobs a {
  color: #fff !important;
  text-decoration: none !important;
}

#frame_zone .css_button:hover,
#frame_zone .btn_finest_jobs:hover {
  filter: brightness(1.12) !important;
}

/* Privacy / agreement */
#frame_zone .agreement_new,
#frame_zone #agreement {
  background: rgb(var(--main-bg-rgb));
  padding: 1em;
}

/* Validation errors */
#frame_zone input.error,
#frame_zone select.error,
#frame_zone textarea.error {
  border-color: rgb(var(--primary-rgb)) !important;
}

#frame_zone .upload_error {
  color: rgb(var(--primary-rgb));
}