/* STK Kemahasiswaan — Frontend Styles */
.stk-km-box { max-width:760px;margin:0 auto;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:15px;color:#1f2937; }
.stk-km-box-title { font-size:22px;color:#1a3c5e;margin:0 0 20px;padding-bottom:12px;border-bottom:3px solid #2563a8; }
.stk-km-section { background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:20px 24px;margin-bottom:18px;box-shadow:0 1px 3px rgba(0,0,0,.05); }
.stk-km-section h3 { margin:0 0 14px;font-size:16px;color:#1a3c5e; }

/* Form */
.stk-km-form { }
.stk-km-fe-field { display:flex;flex-direction:column;gap:5px;margin-bottom:14px; }
.stk-km-fe-field label { font-size:13px;font-weight:600;color:#374151; }
.stk-km-fe-field input,.stk-km-fe-field textarea,.stk-km-fe-field select { padding:9px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;width:100%;box-sizing:border-box; }
.stk-km-fe-field input:focus,.stk-km-fe-field textarea:focus { outline:none;border-color:#2563a8;box-shadow:0 0 0 3px rgba(37,99,168,.1); }

/* Tombol */
.stk-km-btn { display:inline-block;padding:10px 22px;border-radius:7px;font-size:14px;font-weight:600;cursor:pointer;border:none;text-decoration:none;transition:opacity .15s; }
.stk-km-btn:hover { opacity:.85;text-decoration:none; }
.stk-km-btn-primary { background:linear-gradient(135deg,#1a3c5e,#2563a8);color:#fff; }
.stk-km-btn-outline { background:#fff;color:#2563a8;border:1px solid #2563a8; }
.stk-km-btn-sm { padding:6px 14px;font-size:13px; }
.stk-km-btn-wa { background:#25d366;color:#fff; }

/* Login notice */
.stk-km-login-notice { background:#fffbeb;border:1px solid #fcd34d;border-radius:8px;padding:16px 20px;color:#92400e; }
.stk-km-login-notice a { color:#2563a8; }

/* Konseling list */
.stk-km-list { display:flex;flex-direction:column;gap:12px; }
.stk-km-list-item { background:#f9fbff;border:1px solid #e5e7eb;border-radius:8px;padding:14px 16px; }
.stk-km-list-head { display:flex;align-items:center;gap:10px;margin-bottom:6px;flex-wrap:wrap; }
.stk-km-list-meta { font-size:12px;color:#6b7280; }
.stk-km-catatan { margin-top:8px;background:#eff6ff;border-left:3px solid #3b82f6;padding:8px 12px;border-radius:4px;font-size:13px;color:#1e40af; }

/* Beasiswa */
.stk-km-beasiswa-item { background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:20px 24px;margin-bottom:18px;box-shadow:0 1px 3px rgba(0,0,0,.05); }
.stk-km-beasiswa-item h3 { margin:0 0 10px;color:#1a3c5e;font-size:18px; }
.stk-km-syarat { background:#f9fbff;border-radius:6px;padding:12px 16px;margin-bottom:14px; }
.stk-km-syarat ul { margin:6px 0 0 16px;padding:0; }
.stk-km-syarat li { margin-bottom:4px;font-size:14px; }
.stk-km-meta-row { display:flex;gap:16px;font-size:13px;color:#6b7280;margin-bottom:14px;flex-wrap:wrap; }
.stk-km-expired { color:#ef4444;font-weight:600;font-size:13px; }
.stk-km-sudah-daftar { color:#166534;font-weight:600;font-size:13px; }

/* Alumni grid */
.stk-km-filter-form { display:flex;gap:10px;flex-wrap:wrap;margin-bottom:16px;align-items:center; }
.stk-km-filter-form input,.stk-km-filter-form select { padding:7px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:13px; }
.stk-km-alumni-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px; }
.stk-km-alumni-card { background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:16px;display:flex;gap:14px;align-items:flex-start;box-shadow:0 1px 3px rgba(0,0,0,.05); }
.stk-km-alumni-foto img { width:60px;height:60px;border-radius:50%;object-fit:cover;border:2px solid #e5e7eb; }
.stk-km-alumni-avatar-placeholder { width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,#1a3c5e,#2563a8);color:#fff;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:700;flex-shrink:0; }
.stk-km-alumni-info strong { font-size:15px;color:#1f2937;display:block;margin-bottom:2px; }
.stk-km-alumni-gelar { font-size:12px;color:#2563a8;font-weight:600;display:block;margin-bottom:4px; }
.stk-km-alumni-meta { font-size:12px;color:#6b7280;margin-bottom:4px; }
.stk-km-alumni-tempat { font-size:12px;color:#374151; }

/* Fasilitas grid */
.stk-km-fasilitas-grid { display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px; }
.stk-km-fasilitas-card { background:#fff;border:1px solid #e5e7eb;border-radius:10px;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.05); }
.stk-km-fas-foto img { width:100%;height:160px;object-fit:cover;display:block; }
.stk-km-fas-body { padding:16px; }
.stk-km-fas-body h3 { margin:0 0 8px;font-size:16px;color:#1a3c5e; }
.stk-km-fas-body p { font-size:13px;color:#6b7280;margin:0 0 10px; }
.stk-km-fas-meta { display:flex;flex-direction:column;gap:4px;font-size:12px;color:#6b7280;margin-bottom:12px; }

@media(max-width:600px) {
    .stk-km-alumni-grid { grid-template-columns:1fr; }
    .stk-km-fasilitas-grid { grid-template-columns:1fr; }
    .stk-km-form-grid { grid-template-columns:1fr; }
}

/* ---- Shortcode staf (alumni & fasilitas) ---- */
.stk-km-tabs { display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px; }
.stk-km-tab { display:inline-block;padding:7px 16px;border-radius:20px;font-size:13px;font-weight:500;text-decoration:none;background:#f1f5fb;color:#374151;border:1px solid #dde3ec;transition:all .15s; }
.stk-km-tab:hover { background:#e0e9f5;text-decoration:none; }
.stk-km-subtabs { display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px; }
.stk-km-tab-sm { padding:5px 12px;font-size:12px; }

.stk-km-staf-row { display:flex;align-items:flex-start;gap:14px;padding:14px;border:1px solid #e5e7eb;border-radius:10px;background:#fff;margin-bottom:10px;box-shadow:0 1px 3px rgba(0,0,0,.04); }
.stk-km-staf-foto-wrap { flex-shrink:0; }
.stk-km-staf-foto { width:56px;height:56px;border-radius:8px;object-fit:cover;border:1px solid #e5e7eb; }
.stk-km-staf-avatar { width:56px;height:56px;border-radius:8px;background:linear-gradient(135deg,#1a3c5e,#2563a8);color:#fff;display:flex;align-items:center;justify-content:center;font-size:22px;font-weight:700; }
.stk-km-staf-info { flex:1;min-width:0; }
.stk-km-staf-meta { font-size:12px;color:#6b7280;margin-top:4px;line-height:1.6; }
.stk-km-staf-actions { display:flex;flex-direction:column;gap:6px;flex-shrink:0; }

.stk-km-fas-thumb { width:72px;height:56px;object-fit:cover;border-radius:6px;border:1px solid #e5e7eb; }
.stk-km-fas-thumb-placeholder { width:72px;height:56px;background:#f1f5fb;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:24px; }

.stk-km-form-2col { display:grid;grid-template-columns:1fr 1fr;gap:14px; }
.stk-km-action-row { display:flex;gap:10px;align-items:center;flex-wrap:wrap; }

.stk-km-meta-pill { display:inline-block;background:#f1f5fb;color:#374151;border-radius:12px;padding:2px 9px;font-size:11px;font-weight:500;margin-left:4px; }
.stk-pill-alert { background:#fef3c7;color:#92400e; }

/* Permohonan beasiswa WK2 */
.stk-km-permohonan-card { border:1px solid #e5e7eb;border-radius:10px;padding:18px;margin-bottom:14px;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.04); }
.stk-km-permohonan-head { display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px;flex-wrap:wrap;gap:8px; }
.stk-km-permohonan-body { font-size:13px;color:#374151;margin-bottom:12px; }
.stk-km-permohonan-body p { margin:0 0 4px; }
.stk-km-motivasi { background:#f9fbff;border-left:3px solid #3b82f6;padding:10px 12px;border-radius:4px;font-size:13px;margin-top:8px; }
.stk-km-catatan-wk2 { background:#fefce8;border-left:3px solid #f59e0b;padding:8px 12px;border-radius:4px;font-size:12px;margin-top:8px;color:#92400e; }
.stk-km-approve-form { border-top:1px solid #f1f5fb;padding-top:12px; }

.stk-km-bsw-row { display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border:1px solid #e5e7eb;border-radius:8px;background:#fff;margin-bottom:8px;gap:12px;flex-wrap:wrap; }
.stk-km-bsw-info { display:flex;align-items:center;flex-wrap:wrap;gap:6px; }

.stk-km-info-box { background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px;padding:12px 16px;margin-bottom:16px;font-size:13px;color:#1e40af; }
.stk-km-empty { color:#9ca3af;text-align:center;padding:24px;font-size:14px; }
.stk-km-login-notice { background:#fffbeb;border:1px solid #fcd34d;border-radius:8px;padding:16px 20px;color:#92400e;font-size:14px; }
.stk-km-login-notice a,.stk-km-notif-info a { color:#2563a8; }
.stk-km-notif-info { background:#f1f5fb;border:1px solid #dde3ec;border-radius:8px;padding:16px 20px;color:#374151;font-size:14px; }

.stk-km-btn-success { background:#22c55e;color:#fff; }
.stk-km-btn-danger  { background:#ef4444;color:#fff; }

@media(max-width:600px) {
    .stk-km-form-2col { grid-template-columns:1fr; }
    .stk-km-staf-row { flex-wrap:wrap; }
    .stk-km-staf-actions { flex-direction:row; }
}

/* ---- STK Layanan Mahasiswa — Wrapper Utama ---- */
.stk-layanan-wrap {
    max-width: 900px;
    margin: 0 auto;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* Header */
.stk-layanan-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: linear-gradient(135deg, #1a3c5e 0%, #2563a8 100%);
    border-radius: 12px 12px 0 0;
    padding: 20px 24px;
    color: #fff;
    flex-wrap: wrap;
    gap: 12px;
}
.stk-layanan-title {
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 2px !important;
    color: #fff !important;
    border: none !important;
}
.stk-layanan-subtitle { font-size: 12px; opacity: .75; margin: 0; }
.stk-layanan-user {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #fff;
    position: relative;
}
.stk-layanan-user img { border-radius: 50%; border: 2px solid rgba(255,255,255,.4); }
.stk-layanan-notif-badge {
    background: #ef4444;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    border-radius: 10px;
    padding: 1px 6px;
    animation: stk-pulse 1.5s infinite;
}

/* Tab navigasi */
.stk-layanan-tabs {
    display: flex;
    background: #f1f5fb;
    border-bottom: 2px solid #dde3ec;
    overflow-x: auto;
    scrollbar-width: none;
}
.stk-layanan-tabs::-webkit-scrollbar { display: none; }
.stk-layanan-tab {
    display: inline-block;
    padding: 12px 20px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    color: #6b7280;
    border-bottom: 3px solid transparent;
    white-space: nowrap;
    transition: all .15s;
    margin-bottom: -2px;
}
.stk-layanan-tab:hover { color: #1a3c5e; text-decoration: none; }
.stk-layanan-tab-active {
    color: #1a3c5e !important;
    border-bottom-color: #2563a8 !important;
    background: #fff;
}

/* Konten tab */
.stk-layanan-content {
    background: #fff;
    border: 1px solid #dde3ec;
    border-top: none;
    border-radius: 0 0 12px 12px;
    padding: 24px;
    min-height: 300px;
    transition: opacity .2s;
}
.stk-layanan-content.stk-loading {
    opacity: .4;
    pointer-events: none;
}

/* Tab body */
.stk-layanan-tab-body { }
.stk-layanan-publik { margin-bottom: 24px; }
.stk-layanan-publik .stk-km-box { border: none; padding: 0; box-shadow: none; }

/* Workpage (mode staf/WK2) */
.stk-layanan-workpage {
    border: 2px dashed #bfdbfe;
    border-radius: 10px;
    padding: 20px;
    background: #f0f7ff;
    margin-top: 8px;
}
.stk-layanan-workpage-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
}
.stk-layanan-workpage-header h3 {
    margin: 0;
    font-size: 16px;
    color: #1a3c5e;
}
.stk-layanan-work-badge {
    background: #1a3c5e;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 12px;
}
.stk-layanan-workpage .stk-km-box {
    border: none;
    padding: 0;
    box-shadow: none;
    background: transparent;
}
.stk-layanan-workpage .stk-km-box-title {
    font-size: 15px;
    border-bottom-color: #bfdbfe;
}

@keyframes stk-pulse {
    0%, 100% { opacity: 1; }
    50%       { opacity: .4; }
}

@media (max-width: 600px) {
    .stk-layanan-header { border-radius: 8px 8px 0 0; padding: 16px; }
    .stk-layanan-content { padding: 16px; }
    .stk-layanan-tab { padding: 10px 14px; font-size: 12px; }
}

/* ---- Beasiswa PMB (calon mahasiswa) ---- */
.stk-km-pmb-box {
    background: linear-gradient(135deg, #fefce8, #fef9c3);
    border: 2px solid #fcd34d;
    border-radius: 10px;
    padding: 16px 20px;
    margin-top: 12px;
}
.stk-km-pmb-info {
    color: #92400e;
    font-size: 14px;
    margin: 0 0 12px;
}
.stk-km-btn-pmb {
    background: linear-gradient(135deg, #d97706, #f59e0b);
    color: #fff;
    font-size: 15px;
    padding: 12px 24px;
    border-radius: 8px;
    display: inline-block;
    font-weight: 700;
    text-decoration: none;
    transition: opacity .15s;
}
.stk-km-btn-pmb:hover { opacity: .88; text-decoration: none; color: #fff; }
.stk-km-pmb-note {
    font-size: 12px;
    color: #92400e;
    margin: 10px 0 0;
    opacity: .8;
}