/* ═══════════════════════════════════════════════════════
   Azia Jobs — Frontend Styles
   Palette: dark #1a1a10 | gold #c9a96e | cream #f0e8d8
═══════════════════════════════════════════════════════ */
.azj-list-wrap *{font-family:'Roboto', sans-serif !important}
/* ── Common ───────────────────────────────────────── */
.azj-back-link {
    display: inline-block;
    margin-bottom: 20px;
    color: #c9a96e;
    text-decoration: none;
    font-size: 0.85rem;
    letter-spacing: 0.5px;
}
.azj-back-link:hover { color: #a07840; }
.azj-section-label .azj-row-inner,.azj-detail-section-label {
  font-weight: 600;
  font-size: 18px;
  width: 100%;
  padding-top: 20px;
  padding-bottom: 20px;
  color: #000;
}
/* ── Buttons ──────────────────────────────────────── */
.azj-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    font-size: 0.7rem;
    font-family: 'Roboto', sans-serif !important;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: opacity 0.2s, background 0.2s;
    border-radius: 2px;
}

/* Job-list tile buttons — icon above, label below */
.azj-btn-tile {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    width: 72px;
    min-height: 72px;
    padding: 10px 6px;
    font-size: 0.62rem;
    
    font-weight: 700;
    letter-spacing: 1.2px;
    text-transform: uppercase;
    text-decoration: none;
    border: none;
    cursor: pointer;
    transition: opacity 0.18s;
    line-height: 1;
}
.azj-btn-tile:hover { opacity: 0.82; }

.azj-btn-email { background: #ffffff; color: #1a1a0e; }
.azj-btn-view  { background: #c9a96e; color: #1a1a0e; }
.azj-btn-dark  { background: #1a1a0e; color: #ffffff; }

.azj-btn-apply {
 background: #000;
  color: #fff;
}
.azj-btn-apply:hover { background: #000;
  color: #fff;}

.azj-btn-lg { padding: 13px 32px; font-size: 0.9rem;
 }

.azj-submit-btn {
    background: #1a1a1a;
    color: #fff;
    padding: 14px 48px;
    font-size: 0.72rem;
    
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    border: none;
    cursor: pointer;
    border-radius: 2px;
    transition: background 0.2s;
}
.azj-submit-btn:hover    { background: #c9a96e; }
.azj-submit-btn:disabled { opacity: 0.6; cursor: not-allowed; }

.azj-next-btn, .azj-prev-btn {
    background: #c9a96e;
    color: #1a1a10;
    padding: 12px 36px;
    font-size: 0.72rem;
    
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    border: none;
    cursor: pointer;
    border-radius: 2px;
    transition: background 0.2s;
}
.azj-prev-btn { background: #888; color: #fff; margin-right: 12px; }
.azj-next-btn:hover { background: #a07840; }
.azj-prev-btn:hover { background: #666; }

/* ═══════════════════════════════════════════════════
   JOB LIST
═══════════════════════════════════════════════════ */
.azj-list-wrap { width: 100%; }

/* shared centering shell used by label + each job row */
.azj-row-inner {
    max-width: 1120px;
    margin: 0 auto;
    padding: 0 30px;
}

.azj-section-label {
    background: #f5f0eb;
    margin: 0 0 2px;
    padding: 14px 0;
    
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 2px;
    color: #6a6050;
    text-transform: uppercase;
}

.azj-jobs {
    list-style: none;
    margin: 0;
    padding: 0;
}

.azj-job-row {
    display: block;
    background: #B4ADA4;
    margin-bottom: 2px;
    transition: opacity 0.2s;
}
.azj-job-row:hover { opacity: 0.88; }
.azj-job-row:nth-child(even) { background: #968E85; }

/* flex layout lives on the inner wrapper, not the <li> */
.azj-job-row .azj-row-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 18px 30px;
}

.azj-job-info { flex: 1; min-width: 0; }

.azj-job-title {
    font-size: 1rem;
    font-weight: 700;
    color: #ffffff;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    line-height: 1.35;
}

.azj-job-dept {
    font-size: 0.90rem;
    color: rgba(255,255,255,0.78);
    margin-top: 4px;
}

.azj-job-actions {
    display: flex;
    align-items: stretch;
    gap: 3px;
    flex-shrink: 0;
}

.azj-empty {
    padding: 40px;
    text-align: center;
    color: #777;
    font-style: italic;
}

/* ═══════════════════════════════════════════════════
   JOB DETAIL
═══════════════════════════════════════════════════ */
.azj-detail-wrap { max-width: 1200px; width: 90vw; margin: 0 auto;}

.azj-detail-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 28px;
}

.azj-detail-body {
    width:50%;
    padding: 36px 40px;
    border: 1px solid #e0d8c8;
    border-radius: 2px;
}



.azj-detail-body p strong { color: #1a1a10; }

.azj-job-description {
    margin: 24px 0;
    line-height: 1.85;
    color: #3a3020;
    font-size: 1.15rem;
}

.azj-job-description h2, .azj-job-description h3 {
    
    font-weight: 300;
    color: #1a1a10;
}

.azj-confidential {
    font-size: 0.78rem;
    color: #888;
    text-align: center;
    margin-top: 28px;
    padding-top: 16px;
    border-top: 1px solid #e0d8c8;
}

/* ═══════════════════════════════════════════════════
   APPLY CHOICE
═══════════════════════════════════════════════════ */
.azj-choose-wrap { max-width: 700px; margin: 0 auto; text-align: center; padding: 40px 20px; }

.azj-choose-title h2 {
    
    font-weight: 300;
    font-size: 1.4rem;
    color: #1a1a10;
    margin-bottom: 36px;
}

.azj-choose-options {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 30px;
    flex-wrap: wrap;
}

.azj-choose-option { flex: 1; min-width: 200px; }

.azj-choose-en {
    font-size: 0.92rem;
    color: #3a3020;
    margin: 0 0 6px;
}

.azj-choose-gr {
    font-size: 0.85rem;
    color: #6a6050;
    margin: 0;
}

.azj-choose-option a { color: #c9a96e; text-decoration: none; font-weight: 600; }
.azj-choose-option a:hover { text-decoration: underline; }

.azj-choose-divider {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    font-size: 0.85rem;
    color: #888;
    font-weight: 600;
}

.azj-choose-h { font-size: 1.1rem; color: #c9a96e; }

/* ═══════════════════════════════════════════════════
   CV FORM
═══════════════════════════════════════════════════ */
.azj-cv-wrap {
    max-width: 580px;
    margin: 0 auto;
   
    padding: 36px 40px 40px;
    border-radius: 4px;
}

.azj-form-heading {
    
    font-size: 2rem;
    font-weight: 300;
    color: #1a1a10;
    margin: 0 0 28px;
}

.azj-field { margin-bottom: 14px; }

.azj-field-readonly {
  background: #fff;
  border-radius: 28px;
  padding: 22px 20px;
  font-size: 1rem;
  color: #8b6a1e;
  font-weight: 600;
  letter-spacing: 0.3px;
}

.azj-input, .azj-textarea, .azj-select {
  width: 100%;
  background: #fff;
  border: 1px solid #d4c8a8;
  border-radius: 28px;
  padding: 22px 20px;
  font-size: 1rem;
  color: #3a3020;
  font-family: inherit;
  box-sizing: border-box;
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
  -webkit-appearance: none;
}
.azj-input:focus,
.azj-textarea:focus,
.azj-select:focus { border-color: #c9a96e; box-shadow: 0 0 0 3px rgba(201,169,110,0.18); }

.azj-textarea { border-radius: 14px; resize: vertical; }
.azj-select   { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23c9a96e' stroke-width='1.5' fill='none'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; padding-right: 40px; }

.azj-file-field { background: #fff; border-radius: 28px; padding: 12px 20px; }
.azj-file-label { font-size: 0.82rem; color: #888; margin-right: 10px; }
.azj-file-hint  { font-size: 0.72rem; color: #aaa; display: block; margin-top: 4px; }
.azj-optional   { font-size: 0.75rem; color: #aaa; font-weight: 400; }

.azj-field-submit { text-align: center; margin-top: 20px; }

.azj-field-error {
    background: #fde8e8;
    color: #a33;
    border-radius: 8px;
    padding: 10px 16px;
    font-size: 0.85rem;
    margin-bottom: 12px;
}

.azj-field-success {
    background: #e8fde8;
    color: #266226;
    border-radius: 8px;
    padding: 10px 16px;
    font-size: 0.85rem;
    margin-bottom: 12px;
}

/* ═══════════════════════════════════════════════════
   FULL APPLICATION FORM
═══════════════════════════════════════════════════ */
.azj-fullform-wrap { max-width: 800px;margin: 0 auto; }

.azj-fullform-intro {
    font-size: 0.88rem;
    color: #3a3020;
    margin-bottom: 28px;
    font-weight: 600;
}

.azj-step-indicator {
    background: #c9a96e;
    color: #1a1a10;
   
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    padding: 8px 18px;
    display: inline-block;
    border-radius: 2px;
    margin-bottom: 24px;
}

.azj-step-subtitle {
    font-size: 0.85rem;
    color: #6a6050;
    margin-bottom: 20px;
    font-style: italic;
}

.azj-form-grid { display: flex; flex-direction: column; gap: 2px; }

.azj-form-row {
    display: flex;
    align-items: baseline;
    gap: 16px;
   
    padding: 15px 14px;
    
}
.azj-form-row:nth-child(even) {  }
.azj-form-row.azj-half { flex: 1; }

.azj-form-row label {
    width: auto;
    flex-shrink: 0;
    font-size: 1rem;
    color: #3a3020;
    line-height: 1.4;
    min-width: 110px;
    font-weight: 400;
}

.azj-form-row .azj-input,
.azj-form-row .azj-select,
.azj-form-row .azj-textarea {
    border-radius: 3px;
    padding: 7px 10px;
    font-size: 0.85rem;
    flex: 1;
}

/* Language section */
.azj-lang-section { flex-direction: column; align-items: flex-start; gap: 10px; padding: 14px; }
.azj-lang-grid { width: 100%; }
.azj-lang-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 7px 0;
    border-bottom: 1px solid #e0d8c8;
    flex-wrap: wrap;
}
.azj-lang-name {
    width: 100px;
    flex-shrink: 0;
    font-size: 0.8rem;
    font-weight: 600;
    color: #3a3020;
}
.azj-lang-options { display: flex; flex-wrap: wrap; gap: 10px; }
.azj-radio-label {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 0.78rem;
    color: #3a3020;
    cursor: pointer;
}
.azj-other-lang { border-bottom: none; }
.azj-input-sm { width: 200px; flex: none; }

/* Employer blocks */
.azj-employer-block {
    
    border-radius: 4px;
    padding: 20px;
    margin-bottom: 14px;
}
.azj-employer-block h4 {
    margin: 0 0 14px;
    font-size: 0.85rem;
    
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #6a6050;
}

.azj-step-nav {
    display: flex;
    align-items: center;
    margin-top: 28px;
    padding-top: 20px;
    border-top: 1px solid #e0d8c8;
}

/* ═══════════════════════════════════════════════════
   SUCCESS PAGE
═══════════════════════════════════════════════════ */
.azj-success-wrap {
    max-width: 560px;
    margin: 40px auto;
    text-align: center;
    padding: 48px 40px;
    
    border-radius: 4px;
    border-top: 4px solid #c9a96e;
}

.azj-success-icon {
    width: 64px; height: 64px;
    background: #c9a96e;
    color: #fff;
    font-size: 2rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 24px;
}

.azj-success-wrap h2 {
    
    font-weight: 300;
    font-size: 2rem;
    color: #1a1a10;
    margin: 0 0 16px;
}

.azj-success-wrap p { color: #3a3020; line-height: 1.85; margin-bottom: 10px; }
.azj-success-gr { color: #6a6050; font-style: italic; font-size: 0.9rem; }

/* ── Responsive ───────────────────────────────────── */
@media (max-width: 640px) {
	.azj-detail-wrap { max-width: 700px; width: 90vw; margin: 0 auto;}
    /* job rows scroll horizontally — no stacking */
    .azj-choose-options { flex-direction: column; gap: 20px; }
    .azj-choose-divider { flex-direction: row; }

    .azj-cv-wrap { padding: 24px 20px; }
    .azj-form-row { flex-direction: column; gap: 6px; }
    .azj-form-row label { width: auto; }

    .azj-lang-row { flex-direction: column; align-items: flex-start; }
    .azj-lang-options { gap: 6px; }
}