/* 
   CSS PPDB
    */

.ppdb-section { padding: 40px 0 64px; background: #f4f6f5; }

/*  Form Card  */
.form-card {
    background: #fff;
    border: 1px solid #dce8e1;
    border-radius: 16px;
    padding: 32px;
    box-shadow: 0 2px 18px rgba(26,107,60,.07);
}
@media (max-width:576px) { .form-card { padding: 18px 14px; } }

/*  Step Indicator  */
.step-indicator { display:flex; align-items:flex-start; margin-bottom:30px; }
.step-dot { display:flex; flex-direction:column; align-items:center; gap:6px; flex-shrink:0; min-width:76px; }
.step-dot .dot {
    width:36px; height:36px; border-radius:50%;
    background:#e2e5ea; color:#888;
    font-size:14px; font-weight:700;
    display:flex; align-items:center; justify-content:center;
    border:2px solid #e2e5ea; transition:all .25s;
}
.step-dot.active .dot    { background:#1a6b3c; color:#fff; border-color:#1a6b3c; box-shadow:0 0 0 4px rgba(26,107,60,.15); }
.step-dot.completed .dot { background:#d4edda; color:#1a6b3c; border-color:#1a6b3c; }
.step-dot .step-label    { font-size:11px; color:#999; text-align:center; font-weight:500; white-space:nowrap; }
.step-dot.active .step-label   { color:#1a6b3c; font-weight:700; }
.step-dot.completed .step-label { color:#1a6b3c; }
.step-line { flex:1; height:2px; background:#e2e5ea; margin-top:17px; transition:background .25s; }
.step-line.done { background:#1a6b3c; }

/*  Form Steps  */
.form-step        { display:none; }
.form-step.active { display:block; }

/*  Controls  */
.form-label { font-size:13px; font-weight:600; color:#2a2a2a; margin-bottom:5px; display:block; }
.form-label.required::after { content:' *'; color:#dc3545; }
.form-control, .form-select {
    display:block; width:100%; padding:9px 12px; font-size:14px;
    color:#2a2a2a; background:#fff; border:1px solid #cdd8d2;
    border-radius:8px; transition:border-color .2s, box-shadow .2s; appearance:auto;
}
.form-control:focus, .form-select:focus {
    border-color:#1a6b3c; box-shadow:0 0 0 3px rgba(26,107,60,.12); outline:none;
}
textarea.form-control { resize:vertical; }
.input-group { display:flex; }
.input-group-text {
    padding:9px 12px; background:#f0f7f3;
    border:1px solid #cdd8d2; border-right:none;
    border-radius:8px 0 0 8px; color:#1a6b3c;
    display:flex; align-items:center;
}
.input-group .form-control { border-left:none; border-radius:0 8px 8px 0; }
.form-text { font-size:12px; color:#6c757d; margin-top:4px; }

/*  Buttons  */
.btn-nu {
    display:inline-flex; align-items:center; gap:6px;
    background:linear-gradient(135deg,#1a6b3c 0%,#2d9d5e 100%);
    color:#fff !important; border:none; border-radius:8px;
    padding:10px 22px; font-size:14px; font-weight:600;
    cursor:pointer; text-decoration:none;
    transition:opacity .2s, transform .15s; line-height:1.4;
}
.btn-nu:hover { opacity:.9; transform:translateY(-1px); }
.btn-nu.btn-lg { padding:12px 28px; font-size:15px; }
.btn-nu-outline {
    display:inline-flex; align-items:center; justify-content:center; gap:6px;
    background:transparent; color:#1a6b3c !important;
    border:2px solid #1a6b3c; border-radius:8px;
    padding:8px 18px; font-size:13px; font-weight:600;
    cursor:pointer; text-decoration:none; transition:background .2s, color .2s;
}
.btn-nu-outline:hover { background:#1a6b3c; color:#fff !important; }

.text-nu { color:#1a6b3c !important; }
.w-100   { width:100%; }

/*  PPDB Closed */
.ppdb-closed { padding:48px 20px; text-align:center; }
.ppdb-closed .closed-icon {
    width:80px; height:80px; border-radius:50%;
    background:#fdeaea; color:#dc3545; font-size:32px;
    display:flex; align-items:center; justify-content:center;
    margin:0 auto 20px;
}

/*  Email notice (Step 3)  */
.email-notice {
    display:flex; align-items:flex-start; gap:12px;
    background:linear-gradient(135deg,#e8f5ee,#f0faf4);
    border:1px solid #b8dfc6; border-radius:10px; padding:14px 16px;
}
.email-notice .en-icon { font-size:22px; flex-shrink:0; margin-top:2px; }
.email-notice .en-text { font-size:12px; color:#2a5a3a; line-height:1.55; }
.email-notice .en-text strong { color:#1a6b3c; }

/* 
   SIDEBAR CARDS
    */
.info-card {
    background:#fff; border:1px solid #dce8e1; border-radius:14px;
    padding:22px 22px 20px; box-shadow:0 2px 14px rgba(26,107,60,.07);
    position:relative; overflow:hidden;
}
.info-card::before {
    content:''; position:absolute; top:0; left:0; right:0; height:4px;
    background:linear-gradient(90deg,#1a6b3c,#2d9d5e);
}
.info-card .info-icon {
    width:40px; height:40px; border-radius:10px;
    background:linear-gradient(135deg,#1a6b3c,#2d9d5e);
    color:#fff; font-size:16px;
    display:flex; align-items:center; justify-content:center;
    margin-bottom:12px; flex-shrink:0;
}
.info-card h5 { font-size:15px; font-weight:700; color:#1a1a2e; margin-bottom:0; }
.info-card hr { border:none; border-top:1px solid #dce8e1; margin:10px 0 14px; }
.badge-opsional {
    display:inline-block; font-size:10px;
    background:#e8f5ee; color:#1a6b3c;
    border:1px solid #b8dfc6; border-radius:4px;
    padding:1px 5px; font-weight:600; margin-left:3px; vertical-align:middle;
}
@media (min-width:992px) { .sidebar-sticky { position:sticky; top:24px; } }