/* ═══════════════════════════════════════════════════════════════════════════
   ЧЕХІЯ РОБОТА — candidate site #2 theme.
   Same layout as the Konstanta site, restyled as a dark/modern variant:
   dark-by-default palette, a cyan accent (vs Konstanta's gold), and Manrope type.
═══════════════════════════════════════════════════════════════════════════ */
:root {
  --bg-main: #f1f5f9;
  --text-main: #0f172a;
  --text-muted: #64748b;
  --card-bg: rgba(255, 255, 255, 0.85);
  --border-color: rgba(226, 232, 240, 1);
  --primary: #0b1120;
  --accent: #06b6d4;
  --accent-light: #22d3ee;
}

.dark {
  --bg-main: #0b1120;
  --text-main: #f8fafc;
  --text-muted: #94a3b8;
  --card-bg: rgba(15, 23, 42, 0.66);
  --border-color: rgba(34, 211, 238, 0.16);
}

body {
  background-color: var(--bg-main);
  color: var(--text-main);
  font-family: 'Manrope', 'Inter', sans-serif;
  transition: background-color 0.3s, color 0.3s;
}

/* Modern dark backdrop: subtle cyan glows over a deep navy base. */
.dark body,
body.dark-bg {
  background-color: #0b1120;
  background-image:
    radial-gradient(60rem 60rem at 80% -10%, rgba(34, 211, 238, 0.10), transparent 60%),
    radial-gradient(50rem 50rem at -10% 20%, rgba(56, 189, 248, 0.08), transparent 55%);
  background-attachment: fixed;
}

.glass {
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  background-color: var(--card-bg);
  border: 1px solid var(--border-color);
  transition: all 0.3s;
}

.glass-card {
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  background-color: var(--card-bg);
  border: 1px solid var(--border-color);
  transition: all 0.3s;
  border-radius: 1.25rem;
}

.glass-card:hover {
  box-shadow: 0 18px 40px -18px rgba(34, 211, 238, 0.45);
  transform: translateY(-2px);
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes slideInLeft {
  from {
    opacity: 0;
    transform: translateX(-30px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes scaleUp {
  from {
    opacity: 0;
    transform: scale(0.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

.animate-fade-in { animation: fadeIn 0.5s ease-out forwards; }
.animate-fade-in-up { animation: fadeInUp 0.6s ease-out forwards; }
.animate-slide-in-left { animation: slideInLeft 0.6s ease-out forwards; }
.animate-scale-up { animation: scaleUp 0.6s ease-out forwards; }

/* Modal styles */
.modal-overlay {
  background-color: rgba(2, 6, 23, 0.72);
  backdrop-filter: blur(4px);
}

/* Submit button: disabled = grey, enabled = branded colour */
#btn-submit-apply:disabled {
  background-color: #cbd5e1;
  color: #94a3b8;
  cursor: not-allowed;
  opacity: 0.7;
  transform: none;
}

#btn-submit-apply:not(:disabled) {
  background-color: #06b6d4;
  color: #042027;
  cursor: pointer;
}

#btn-submit-apply:not(:disabled):hover {
  transform: translateY(-2px);
  opacity: 0.92;
}

.dark #btn-submit-apply:disabled {
  background-color: #334155;
  color: #64748b;
}

.dark #btn-submit-apply:not(:disabled) {
  background-color: #22d3ee;
  color: #042027;
}