/* Job Vacancy System — Frontend CSS */
.jvs-all-wrap { max-width: 100%; }
.jvs-section { margin-bottom: 50px; }
.jvs-section-title { font-size: 22px; font-weight: 700; padding-bottom: 10px; border-bottom: 3px solid #e2e8f0; margin-bottom: 20px; }
.jvs-list { display: flex; flex-direction: column; gap: 16px; }
.jvs-item { background: #fff; border: 1px solid #e2e8f0; border-radius: 8px; padding: 20px 24px; border-left: 5px solid #1a7f37; transition: box-shadow 0.2s; }
.jvs-item:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.08); }
.jvs-item-past { border-left-color: #dc2626; background: #fafafa; opacity: 0.9; }
.jvs-item-header { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 10px; flex-wrap: wrap; }
.jvs-ref-badge { display: inline-block; background: #f0f6fc; color: #2271b1; font-size: 11px; font-weight: 700; padding: 3px 10px; border-radius: 4px; border: 1px solid #c3d4e8; white-space: nowrap; flex-shrink: 0; margin-top: 3px; }
.jvs-item-title { font-size: 18px; font-weight: 700; margin: 0; line-height: 1.4; }
.jvs-item-title a { color: #1a1a2e; text-decoration: none; }
.jvs-item-title a:hover { color: #2271b1; }
.jvs-item-meta { display: flex; gap: 16px; flex-wrap: wrap; margin-bottom: 12px; }
.jvs-meta-item { font-size: 13px; color: #555; }
.jvs-item-excerpt { font-size: 14px; color: #444; margin-bottom: 14px; line-height: 1.6; }
.jvs-doc-links { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; padding: 12px 16px; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 6px; }
/* VIEW ONLY — no download, opens in browser */
.jvs-doc-link { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: #2271b1; text-decoration: none; padding: 4px 10px; background: #fff; border: 1px solid #c3d4e8; border-radius: 4px; transition: background 0.2s; }
.jvs-doc-link:hover { background: #f0f6fc; text-decoration: none; }
.jvs-item-footer { margin-top: 10px; }
.jvs-read-more { font-size: 13px; color: #2271b1; text-decoration: none; font-weight: 600; }
.jvs-read-more:hover { text-decoration: underline; }
.jvs-no-posts { padding: 20px; background: #f6f7f7; border-radius: 6px; text-align: center; color: #646970; }
/* Single post */
.jvs-single-wrap { max-width: 860px; margin: 0 auto; padding: 20px; }
.jvs-past-banner { background: #fce8e8; color: #dc2626; padding: 12px 20px; border-radius: 6px; font-weight: 700; margin-bottom: 24px; border: 1px solid #f5c6c6; }
.jvs-single-header { margin-bottom: 20px; }
.jvs-single-title { font-size: 28px; font-weight: 800; line-height: 1.3; margin: 8px 0 0; }
.jvs-single-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; padding: 20px; margin-bottom: 30px; }
.jvs-meta-block { display: flex; flex-direction: column; gap: 4px; }
.jvs-meta-label { font-size: 12px; text-transform: uppercase; letter-spacing: 0.5px; color: #888; font-weight: 600; }
.jvs-meta-value { font-size: 15px; font-weight: 600; color: #222; }
.jvs-single-content { font-size: 16px; line-height: 1.8; color: #333; margin-bottom: 30px; }
.jvs-single-docs { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 8px; padding: 20px 24px; margin-bottom: 30px; }
.jvs-single-docs h3 { margin: 0 0 16px; font-size: 17px; }
.jvs-doc-view-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
/* VIEW ONLY button */
.jvs-doc-view-btn { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: #fff; border: 1px solid #e2e8f0; border-radius: 6px; text-decoration: none; color: #333; transition: all 0.2s; }
.jvs-doc-view-btn:hover { background: #f0f6fc; border-color: #2271b1; text-decoration: none; }
.jvs-doc-icon { font-size: 20px; flex-shrink: 0; }
.jvs-doc-name { flex: 1; font-size: 14px; font-weight: 600; color: #2271b1; }
.jvs-doc-action { font-size: 12px; color: #888; background: #f0f6fc; padding: 3px 10px; border-radius: 4px; flex-shrink: 0; }
.jvs-back-link-wrap { margin-top: 20px; }
.jvs-back-link { font-size: 14px; color: #2271b1; text-decoration: none; }
.jvs-back-link:hover { text-decoration: underline; }
@media (max-width: 600px) { .jvs-item-meta { flex-direction: column; gap: 6px; } .jvs-single-meta { grid-template-columns: 1fr; } }