/* career.css : Careers application form (career/index.php)
   Builds on marketing-inquiry.css (same tokens and shape rule: inputs 10px, cards 12-14px, chips/buttons pill). */

/* Mobile progress bar hides on the thank-you screen */
.mi-mprogress[hidden] { display: none !important; }

/* Reveal blocks that are form fields keep their column layout */
.mi-f.mi-reveal.is-shown { display: flex; }
.mi-reveal > .mi-err { display: block; margin-top: 6px; }
.mi-reveal > input { width: 100%; border: 1.5px solid #C9D5EA; border-radius: 10px; background: #fff; padding: 11px 13px; font-size: 15px; margin-top: 8px; }
.mi-reveal > input:focus { outline: none; border-color: var(--b); box-shadow: 0 0 0 3px rgba(26, 110, 255, .15); }

/* Job / Internship choice */
.ca-types { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ca-type { position: relative; cursor: pointer; }
.ca-type input { position: absolute; opacity: 0; }
.ca-type > span { display: flex; flex-direction: column; gap: 4px; height: 100%; padding: 18px 20px 18px 52px; border: 1.5px solid #C9D5EA; border-radius: 14px; background: #fff; transition: border-color .15s, background .15s, box-shadow .15s, transform .12s; position: relative; }
.ca-type > span::before { content: ''; position: absolute; left: 18px; top: 20px; width: 20px; height: 20px; border-radius: 50%; border: 1.5px solid #9DB0D1; background: #fff; transition: border-color .15s, box-shadow .15s; }
.ca-type b { font-size: 17px; font-weight: 700; color: var(--ink); }
.ca-type small { font-size: 13px; color: var(--mu); line-height: 1.5; }
.ca-type:hover > span { border-color: var(--b); }
.ca-type:active > span { transform: scale(.99); }
.ca-type input:checked + span { border-color: var(--b); background: #EEF4FF; box-shadow: inset 0 0 0 1.5px var(--b); }
.ca-type input:checked + span::before { border-color: var(--b); box-shadow: inset 0 0 0 5px var(--b); }
.ca-type input:focus-visible + span { outline: 3px solid rgba(26, 110, 255, .35); outline-offset: 2px; }
.mi-f.has-err .ca-type > span { border-color: var(--err); }

/* Labels that change with Job / Internship and with the current situation */
#caApp[data-type="internship"] .ca-job { display: none !important; }
#caApp:not([data-type="internship"]) .ca-intern { display: none !important; }
#caApp [data-sit] { display: none; }
#caApp[data-sit="employed"] [data-sit="employed"],
#caApp[data-sit="freelancer"] [data-sit="freelancer"],
#caApp[data-sit="break"] [data-sit="break"] { display: inline; }
#caApp .ca-req-edu { display: none; }
#caApp[data-sit="student"] .ca-req-edu, #caApp[data-sit="fresher"] .ca-req-edu { display: inline; }

/* Amount input */
.ca-money { display: flex; align-items: center; border: 1.5px solid #C9D5EA; border-radius: 10px; background: #fff; transition: border-color .2s, box-shadow .2s; }
.ca-money:focus-within { border-color: var(--b); box-shadow: 0 0 0 3px rgba(26, 110, 255, .15); }
.ca-money > span { padding: 0 4px 0 13px; font-weight: 700; color: var(--ink2); }
.ca-money .ca-unit { padding: 0 13px 0 6px; font-weight: 500; font-size: 13px; color: var(--mu); white-space: nowrap; }
.mi-f .ca-money input:not([type=checkbox]) { border: 0; box-shadow: none; padding-left: 4px; min-width: 0; }
.mi-f.has-err .ca-money { border-color: var(--err); }

/* Checkbox line */
.ca-check { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; font-size: 14px; font-weight: 500; color: var(--ink2); line-height: 1.5; }
.ca-check input { width: 19px; height: 19px; margin: 1px 0 0; accent-color: var(--b); flex: none; }
.mi-f.has-err .ca-check { color: var(--err); }

/* Resume */
.ca-em { color: var(--err); font-style: normal; }
.ca-limit { margin: 0 0 12px; padding: 12px 14px; border-radius: 10px; background: #FFF8E6; border: 1px solid #F3D88E; color: #6B4E00; font-size: 13.5px; line-height: 1.55; }
.ca-drop { position: relative; display: flex; align-items: center; gap: 16px; padding: 22px 20px; border: 1.5px dashed #9DB0D1; border-radius: 14px; background: var(--soft); cursor: pointer; transition: border-color .15s, background .15s; }
.ca-drop[hidden] { display: none; }
.ca-drop:hover, .ca-drop.is-over { border-color: var(--b); background: #EEF4FF; }
.ca-drop input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; }
.ca-drop input:focus-visible ~ .ca-drop-tx b { outline: 3px solid rgba(26, 110, 255, .35); outline-offset: 3px; border-radius: 4px; }
.ca-drop-ic { flex: none; width: 46px; height: 46px; border-radius: 12px; background: #fff; border: 1px solid var(--line); position: relative; }
.ca-drop-ic::before { content: ''; position: absolute; left: 50%; top: 13px; width: 2px; height: 16px; margin-left: -1px; background: var(--b); border-radius: 2px; }
.ca-drop-ic::after { content: ''; position: absolute; left: 50%; top: 13px; width: 9px; height: 9px; margin-left: -5px; border: solid var(--b); border-width: 2px 0 0 2px; transform: rotate(45deg); }
.ca-drop-tx { display: flex; flex-direction: column; gap: 2px; font-size: 14.5px; color: var(--ink2); }
.ca-drop-tx b { color: var(--bd); font-weight: 700; }
.ca-drop-tx small { font-size: 12.5px; color: var(--mu); }
.mi-f.has-err .ca-drop { border-color: var(--err); }

.ca-file { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: 1.5px solid #C9D5EA; border-radius: 14px; background: #fff; animation: miIn .3s var(--ease); }
.ca-file[hidden] { display: none; }
.ca-file-ic { flex: none; width: 44px; height: 52px; border-radius: 8px; background: var(--ink); color: #fff; font-size: 11px; font-weight: 800; display: grid; place-items: end center; padding-bottom: 8px; letter-spacing: .04em; }
.ca-file-meta { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ca-file-meta b { font-size: 14px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ca-file-meta small { font-size: 12.5px; color: var(--mu); }
.ca-file.is-done .ca-file-meta small { color: var(--ok); font-weight: 600; }
.ca-file.is-error { border-color: var(--err); }
.ca-bar { display: block; height: 5px; border-radius: 99px; background: #E6EDF8; overflow: hidden; margin-top: 6px; }
.ca-bar b { display: block; height: 100%; width: 100%; background: var(--b); border-radius: 99px; transform: scaleX(0); transform-origin: left center; transition: transform .25s var(--ease); }
.ca-file.is-done .ca-bar { display: none; }
.ca-file .mi-link { margin: 0; flex: none; }

@media (max-width: 640px) {
  .ca-types { grid-template-columns: 1fr; }
  .ca-drop { padding: 18px 16px; }
}
@media (prefers-reduced-motion: reduce) { .ca-bar b { transition: none; } }