:root{
  --primary: #93003F;
  --secondary: #071345; 
  --muted: #6c757d;
}

/* base */
body { font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial; color:#222; }

/* banner */
.banner { background: var(--secondary); color:#fff; font-weight:700; }

/* job card */
.job-card .card-title.text-secondary { color: var(--secondary); }
.job-card img { height: 300px; object-fit: cover; }

/* How to Apply */
.how-wrap { background: #faf9f8; border-radius: 10px; }
.how-title{ font-family: Georgia, serif; font-size:34px; }
.how-card { display:flex; flex-direction:column; align-items:center; gap:12px; }
.how-icon { font-size:36px; color: var(--primary); }

/* positions */
#positionsSection { margin-top: 18px; }
#positionsTable th, #positionsTable td { vertical-align: middle; }

/* PRELOADER */
#preloader {
  display:none;
  position:fixed; inset:0;
  background: rgba(255,255,255,0.86);
  z-index: 99999;
  align-items:center; justify-content:center;
}
#preloader .preloader-box {
  display:flex; gap:12px; align-items:center;
  background:#fff; padding:16px 20px; border-radius:10px; box-shadow:0 12px 40px rgba(0,0,0,0.12); font-weight:700; color:var(--primary);
}
#preloader .spinner{
  width:18px; height:18px; border-radius:50%; border:3px solid rgba(147,0,63,0.12); border-top-color:var(--primary); animation:spin 0.9s linear infinite;
}
@keyframes spin{ to{ transform: rotate(360deg); } }

/* ---------- Modal Toast (center) ---------- */
#toastBackdrop {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.5);
  z-index: 100000;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

#customToast {
  width: min(320px, 96%);
  background: #fff;
  color: #111;
  border-radius: 12px;
  padding: 20px;
  text-align: center;   /* center all text */
  box-shadow: 0 30px 80px rgba(0,0,0,0.25);
  position: relative;
  font-weight: 600;
}

/* Center icon */
#customToast .toast-icon {
  font-size: 44px;
  display: block;
  margin-bottom: 12px;
  margin-left: auto;
  margin-right: auto;
}

/* Message */
#customToast .toast-body {
  font-weight: 600;
  margin-bottom: 14px;
  color: #222;
  text-align: center;
}

/* Center the buttons row */
#customToast .toast-actions {
  display: flex;
  gap: 10px;
  justify-content: center;   /* center buttons */
  margin-top: 6px;
}

/* Close button (X) top-right stays as-is */
#customToast .toast-close {
  position: absolute;
  right: 12px;
  top: 12px;
  background: transparent;
  border: 0;
  font-size: 18px;
  color: #666;
  cursor: pointer;
}


/* Toast icon and message */
#customToast .toast-icon { font-size: 44px; display:block; margin-bottom:12px; }
#customToast.error .toast-icon   { color: #dc3545; }
#customToast.success .toast-icon { color: #28a745; }
#customToast.warning .toast-icon { color: #ffc107; }
#customToast.info .toast-icon    { color: #0dcaf0; }

/* Toast message body */
#customToast .toast-body { font-weight:600; margin-bottom:14px; color:#222; }

/* Action buttons row */
#customToast .toast-actions { display:flex; gap:10px; justify-content:flex-end; margin-top:6px; }

/* Primary action (Retry) */
#customToast .btn-retry {
  background: var(--primary);
  color: #fff;
  border: 0;
  padding: 8px 14px;
  border-radius: 8px;
  font-weight:700;
}

/* Secondary action (Cancel / Close) */
#customToast .btn-cancel {
  background: transparent;
  color: var(--primary);
  border: 1px solid #ddd;
  padding: 8px 12px;
  border-radius: 8px;
  font-weight:700;
}

/* Close (X) top-right */
#customToast .toast-close {
  position:absolute;
  right:12px;
  top:12px;
  background:transparent;
  border:0;
  font-size:18px;
  color:#666;
  cursor:pointer;
}

/* small responsive tweak */
@media(max-width:480px){
  #customToast { padding:14px; }
  #customToast .toast-actions { flex-direction:column-reverse; gap:8px; }
}

/* near-button bubble (non-blocking) */
.near-toast { position:absolute; pointer-events:auto; background:#fff; border-radius:8px; padding:8px 12px; box-shadow:0 10px 30px rgba(0,0,0,0.12); color:var(--primary); font-weight:700; z-index:120000; }

/* responsive */
@media(max-width:768px){
  .how-title{ font-size:24px; }
  .job-card img { height:160px; }
}
/* --- Gramodaya Theme Buttons Override --- */
.btn-primary {
  background-color: var(--primary) !important;
  border-color: var(--primary) !important;
  color: #fff !important;
}
.btn-primary:hover,
.btn-primary:focus {
  background-color: #7a0034 !important; /* slightly darker shade */
  border-color: #7a0034 !important;
}

.btn-outline-secondary {
  border-color: var(--secondary) !important;
  color: var(--secondary) !important;
  background-color: #faf9f8 !important;
}
.btn-outline-secondary:hover,
.btn-outline-secondary:focus {
  background-color: var(--secondary) !important;
  color: #fff !important;
}
 .btn-login{background:var(--secondary);color:#fff;border:0;padding:10px 16px;border-radius:8px;font-weight:700;cursor:pointer}
 .btn-payment{padding:10px 14px;border-radius:8px;border:0;background:var(--primary);color:#fff;font-weight:700;cursor:pointer}
 .btn{padding:10px 14px;border-radius:8px;border:0;background:var(--primary);color:#fff;font-weight:700;cursor:pointer}
/* ---------- Recruitment Phases ---------- */
.phases-section .phase-card {
  border-radius: 10px;
  box-shadow: 0 3px 8px rgba(0,0,0,0.1);
  background: #fff;
  padding: 1.5rem;
  transition: transform 0.3s;
}
.phases-section .phase-card:hover {
  transform: translateY(-5px);
}
.phase-header {
  background: #93003F;
  color: #fff;
  font-weight: 600;
  padding: 8px 15px;
  border-radius: 5px;
  margin-bottom: 10px;
  text-align: center;
}
.phase-1 .phase-header { background: #FFD966; color: #071345; }
.phase-2 .phase-header { background: #B7E1E4; color: #071345; }
.phase-3 .phase-header { background: #E0B7E4; color: #071345; }
.phase-card ul { padding-left: 20px; }
.phase-card li { margin-bottom: 8px; font-size: 0.95rem; color: #333; }

/* ---------- Action Buttons ---------- */
.action-circle {
  width: 130px;
  height: 130px;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s;
  margin: 0 auto;
  box-shadow: 0 3px 6px rgba(0,0,0,0.1);
}
.action-circle i {
  font-size: 2rem;
  margin-bottom: 6px;
}
.action-circle span {
  font-size: 0.85rem;
  text-align: center;
  line-height: 1.1rem;
}
.action-circle:hover {
  transform: translateY(-5px);
  box-shadow: 0 5px 12px rgba(0,0,0,0.2);
}
.bg-primary-gradient {
  background: linear-gradient(135deg, #93003F, #c90a6c);
}
.bg-secondary-gradient {
  background: linear-gradient(135deg, #071345, #26346b);
}
.bg-pink-gradient {
  background: linear-gradient(135deg, #F857A6, #FF5858);
}
.bg-teal-gradient {
  background: linear-gradient(135deg, #00C9A7, #005B5C);
}
.bg-purple-gradient {
  background: linear-gradient(135deg, #9C27B0, #673AB7);
}
.bg-orange-gradient {
  background: linear-gradient(135deg, #FF9800, #F44336);
}
