/* Job detail styles extracted from the template, retaining component order. */
.jd-hero { background-color: var(--primary-color); padding: 160px 20px 56px; }
.jd-hero-inner { max-width: 1200px; margin: 0 auto; }
.jd-back-link { display: inline-flex; align-items: center; gap: 4px; color: rgba(255,255,255,.7); text-decoration: none; font-size: .85rem; font-weight: 500; margin-bottom: 20px; transition: color .15s ease; }
.jd-back-link:hover { color: #fff; }
.jd-hero h1 { color: #fff; font-size: 2.4rem; font-weight: 800; margin-bottom: 6px; }
.jd-location { display: flex; align-items: center; gap: 6px; color: rgba(255,255,255,.9); font-size: 1.05rem; font-weight: 500; margin-bottom: 14px; }
.jd-location svg { stroke: rgba(255,255,255,.75); flex-shrink: 0; }
.jd-company { display: flex; align-items: center; gap: 8px; color: #e0e5ff; font-size: 1rem; font-weight: 500; margin-bottom: 14px; }
.jd-company-link { display: inline-flex; align-items: center; gap: 8px; color: #e0e5ff; text-decoration: none; }
.jd-company-link:hover { color: #fff; }
.jd-company-logo { border-radius: 4px; object-fit: contain; background: rgba(255,255,255,.15); }
.jd-company-logo-sm { border-radius: 3px; object-fit: contain; background: #f3f4f6; vertical-align: middle; margin-right: 4px; }
.jd-info-company { display: flex; align-items: center; gap: 6px; }
.jd-meta-row { display: flex; flex-wrap: wrap; gap: 20px; }
.jd-meta-item { display: inline-flex; align-items: center; gap: 6px; color: rgba(255,255,255,.85); font-size: .92rem; font-weight: 500; }
.jd-meta-item svg { stroke: rgba(255,255,255,.7); }
.jd-body-section { background-color: #f8f9fa; padding: 48px 20px 60px; }
.jd-container { max-width: 1200px; margin: 0 auto; }
.jd-grid { display: grid; grid-template-columns: minmax(0,1fr) 360px; gap: 32px; align-items: start; }
.jd-content { background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; padding: 40px 48px; min-width: 0; }
.jd-division-tags { display: flex; flex-wrap: wrap; gap: 7px; margin: 0 0 24px; }
.jd-division-tag { display: inline-flex; align-items: center; border-radius: 7px; padding: 6px 10px; background: #eef0ff; border: 1px solid #d7dcff; color: var(--primary-color); font-size: .78rem; font-weight: 800; line-height: 1; }
.jd-description-iframe { width: 100%; border: none; display: block; min-height: 300px; height: 600px; }
.jd-description style, .jd-description meta, .jd-description title, .jd-description link { display: none !important; }
.jd-description .job-container { background: none !important; padding: 0 !important; border-radius: 0 !important; box-shadow: none !important; max-width: none !important; margin: 0 !important; }
.jd-description .header { border-bottom: none !important; padding-bottom: 0 !important; margin-bottom: 0 !important; }
.jd-description .header h1, .jd-description .header .job-meta { display: none !important; }
.jd-description h1, .jd-description h2, .jd-description h3 { color: var(--primary-color) !important; font-family: var(--font-heading) !important; border-left: none !important; padding-left: 0 !important; font-size: revert !important; margin-top: 28px; margin-bottom: 12px; }
.jd-description h2 { font-size: 1.35rem !important; font-weight: 700; }
.jd-description h3 { font-size: 1.15rem !important; font-weight: 600; }
.jd-description p, .jd-description span { color: var(--text-light) !important; line-height: 1.7; margin-bottom: 16px; font-family: var(--font-body) !important; font-size: 1rem !important; }
.jd-description ul, .jd-description ol { padding-left: 24px; margin-bottom: 16px; }
.jd-description li { color: var(--text-light) !important; margin-bottom: 8px; line-height: 1.6; font-size: 1rem !important; }
.jd-description strong, .jd-description .highlight { color: var(--text-main) !important; font-weight: 600; }
.jd-description .footer-action { background-color: #f0f2ff !important; border: 1px solid #dde0f5; border-radius: 8px !important; padding: 28px !important; text-align: center; margin-top: 32px !important; }
.jd-description .footer-action h3 { color: var(--primary-color) !important; border-bottom: none !important; margin-top: 0 !important; }
.jd-description .footer-action .btn, .jd-description .footer-action a { display: inline-block !important; background-color: #a84300 !important; color: #fff !important; font-family: var(--font-heading) !important; font-weight: 700 !important; font-size: .95rem !important; padding: 12px 28px !important; border-radius: 6px !important; text-decoration: none !important; transition: background-color .2s ease; }
.jd-description .footer-action .btn:hover, .jd-description .footer-action a:hover { background-color: #873600 !important; }
.jd-sidebar { display: flex; flex-direction: column; gap: 20px; position: sticky; top: 100px; }
.jd-apply-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; padding: 28px; text-align: center; }
.jd-apply-card h2 { font-size: 1.15rem; color: var(--primary-color); margin-bottom: 8px; }
.jd-apply-card p { font-size: .9rem; color: #6b7280; margin-bottom: 20px; line-height: 1.5; }
.btn-jd-apply { display: inline-block; background-color: #a84300; color: #fff; font-family: var(--font-heading); font-weight: 700; font-size: 1rem; padding: 14px 40px; border-radius: 6px; text-decoration: none; text-align: center; transition: background-color .2s ease; border: none; cursor: pointer; }
.btn-jd-apply:hover { background-color: #873600; }
.jd-already-applied { display: flex; align-items: center; justify-content: center; gap: 8px; background: #f0fdf4; border: 1px solid #bbf7d0; border-radius: 6px; padding: 12px 16px; color: #166534; font-weight: 600; font-size: .92rem; margin-bottom: 12px; }
.jd-already-applied svg { color: #16a34a; flex-shrink: 0; }
.btn-jd-view-apps { display: block; background: var(--primary-color); color: #fff; font-family: var(--font-heading); font-weight: 600; font-size: .9rem; padding: 10px 20px; border-radius: 6px; text-decoration: none; text-align: center; transition: background-color .2s ease; }
.btn-jd-view-apps:hover { background-color: #0a1aa0; }
.jd-save-btn { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; margin-top: 12px; padding: 10px 16px; background: none; border: 1px solid #e5e7eb; border-radius: 6px; cursor: pointer; font-family: var(--font-heading); font-size: .88rem; font-weight: 600; color: #4b5563; transition: all .2s ease; }
.jd-save-btn:hover { border-color: #b91c1c; color: #b91c1c; }
.jd-save-btn--active { color: #b91c1c; border-color: #fecaca; background: #fef2f2; }
.jd-save-btn--active svg { fill: currentColor; }
.jd-apply-hint { font-size: .82rem; color: #6b7280; margin-top: 12px; margin-bottom: 0; }
.jd-apply-hint a { color: var(--primary-color); font-weight: 600; text-decoration: none; }
.jd-apply-hint a:hover { text-decoration: underline; }
.jd-info-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; padding: 28px; }
.jd-info-card h2 { font-size: 1rem; color: var(--primary-color); margin-bottom: 16px; padding-bottom: 12px; border-bottom: 1px solid #e5e7eb; }
.jd-info-list { display: grid; grid-template-columns: auto minmax(0,1fr); gap: 8px 16px; }
.jd-info-list dt { font-size: .82rem; font-weight: 600; color: #6b7280; text-transform: uppercase; letter-spacing: .5px; }
.jd-info-list dd { font-size: .92rem; color: var(--text-main); font-weight: 500; margin: 0; overflow-wrap: anywhere; }
.jd-reposted { color: #374151; font-weight: 600; }
.jd-original-date { font-size: 12px; color: #4b5563; margin-top: 2px; }
.jd-share-card { background: #fff; border: 1px solid #e5e7eb; border-radius: 8px; padding: 20px 28px; }
.jd-share-card h2 { font-size: .88rem; color: #6b7280; font-weight: 600; text-transform: uppercase; letter-spacing: .5px; margin-bottom: 12px; }
.jd-share-links { display: flex; gap: 8px; flex-wrap: wrap; }
.jd-share-btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 6px; font-size: .82rem; font-weight: 600; text-decoration: none; transition: box-shadow .2s ease; color: #fff; }
.jd-share-btn:hover { box-shadow: 0 0 0 2px #081080; }
.jd-share-btn svg { flex-shrink: 0; }
.jd-share-linkedin { background-color: #0a66c2; }
.jd-share-facebook { background-color: #1261c9; }
.jd-share-x { background-color: #000; }
.jd-share-email { background-color: #6b7280; color: #fff; }
.jd-share-email svg { stroke: #fff; }
.jd-share-whatsapp { background-color: #137c3a; }
.jd-share-sms { background-color: #5b21b6; color: #fff; }
.jd-share-sms svg { stroke: #fff; }
.jd-cta-banner { background-color: var(--primary-color); padding: 56px 20px; text-align: center; }
.jd-cta-inner { max-width: 650px; margin: 0 auto; }
.jd-cta-banner h2 { color: #fff; font-size: 1.8rem; margin-bottom: 10px; }
.jd-cta-banner p { color: rgba(255,255,255,.85); font-size: 1rem; margin-bottom: 24px; }
.btn-jd-cta { display: inline-block; background-color: #a84300; color: #fff; font-family: var(--font-heading); font-weight: 700; padding: 14px 36px; border-radius: 6px; text-decoration: none; transition: background-color .2s ease; }
.btn-jd-cta:hover { background-color: #873600; }
@media (max-width: 768px) {
    .jd-hero { padding: 130px 16px 40px; }
    .jd-hero h1 { font-size: 1.7rem; }
    .jd-grid { grid-template-columns: minmax(0,1fr); }
    .jd-content { padding: 24px 20px; }
    .jd-sidebar { position: static; }
}
.jd-modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.5); z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 20px; }
.jd-modal-overlay[hidden] { display: none; }
.jd-modal-content { background: #fff; border-radius: 12px; max-width: 520px; width: 100%; padding: 32px; position: relative; box-shadow: 0 20px 60px rgba(0,0,0,.15); animation: jd-modal-in .2s ease-out; max-height: calc(100dvh - 40px); overflow-y: auto; }
@keyframes jd-modal-in { from { opacity: 0; transform: translateY(12px) scale(.97); } to { opacity: 1; transform: translateY(0) scale(1); } }
.jd-modal-close { position: absolute; top: 12px; right: 16px; background: none; border: none; font-size: 1.5rem; color: #4b5563; cursor: pointer; line-height: 1; padding: 4px; }
.jd-modal-close:hover { color: #374151; }
.jd-modal-title { font-size: 1.25rem; font-weight: 700; color: #1f2937; margin-bottom: 4px; padding-right: 20px; }
.jd-modal-subtitle { font-size: .9rem; color: #6b7280; margin-bottom: 24px; }
.jd-modal-options { display: flex; flex-direction: column; gap: 12px; }
.jd-modal-option { display: flex; align-items: center; gap: 16px; padding: 16px; border: 1px solid #e5e7eb; border-radius: 10px; text-decoration: none; color: #1f2937; transition: border-color .15s ease, box-shadow .15s ease, background .15s ease; }
.jd-modal-option:hover { border-color: var(--primary-color); box-shadow: 0 2px 8px rgba(8,16,128,.08); background: #f8f9ff; }
.jd-modal-option--primary { border-color: var(--primary-color); background: #f0f1ff; }
.jd-modal-option-icon { flex-shrink: 0; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; background: #f3f4f6; border-radius: 8px; }
.jd-modal-option--primary .jd-modal-option-icon { background: var(--primary-color); }
.jd-modal-option--primary .jd-modal-option-icon svg { stroke: #fff; }
.jd-modal-option-text { flex: 1; display: flex; flex-direction: column; min-width: 0; }
.jd-modal-option-text strong { font-size: .92rem; font-weight: 600; }
.jd-modal-option-text span { font-size: .82rem; color: #6b7280; margin-top: 2px; }
.jd-modal-option > svg:last-child { flex-shrink: 0; color: #4b5563; }
.jd-modal-back { display: inline-flex; align-items: center; gap: 4px; background: none; border: none; color: #6b7280; font-size: .85rem; font-weight: 500; cursor: pointer; padding: 0; margin-bottom: 12px; }
.jd-modal-back:hover { color: var(--primary-color); }
.jd-upload-zone { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 40px 24px; border: 2px dashed #d1d5db; border-radius: 12px; cursor: pointer; transition: border-color .15s ease, background .15s ease; text-align: center; }
.jd-upload-zone[hidden] { display: none; }
.jd-upload-zone:hover { border-color: var(--primary-color); background: #f8f9ff; }
.jd-upload-zone.jd-upload-zone--dragover { border-color: var(--primary-color); background: #eef0ff; }
.jd-upload-zone svg { color: #4b5563; }
.jd-upload-zone strong { font-size: .95rem; color: #1f2937; }
.jd-upload-zone span { font-size: .85rem; color: #6b7280; }
.jd-upload-formats { font-size: .78rem !important; color: #4b5563 !important; margin-top: 4px; }
.jd-upload-parsing:not([hidden]), .jd-upload-success:not([hidden]), .jd-upload-error:not([hidden]) { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 40px 24px; text-align: center; }
.jd-upload-parsing strong, .jd-upload-success strong, .jd-upload-error strong { font-size: .95rem; color: #1f2937; }
.jd-upload-parsing span, .jd-upload-success span, .jd-upload-error span { font-size: .85rem; color: #6b7280; }
.jd-upload-spinner { width: 36px; height: 36px; border: 3px solid #e5e7eb; border-top-color: var(--primary-color); border-radius: 50%; animation: jd-spin .8s linear infinite; }
@keyframes jd-spin { to { transform: rotate(360deg); } }
.jd-upload-continue-btn { margin-top: 8px; padding: 10px 24px; background: #a84300; color: #fff; border: none; border-radius: 8px; font-size: .9rem; font-weight: 600; cursor: pointer; transition: background .15s ease; }
.jd-upload-continue-btn:hover { background: #873600; }
.jd-upload-retry-btn, .jd-upload-cancel-btn { padding: 6px 16px; background: none; color: #6b7280; border: 1px solid #d1d5db; border-radius: 6px; font-size: .82rem; cursor: pointer; transition: border-color .15s ease, color .15s ease; }
.jd-upload-retry-btn:hover, .jd-upload-cancel-btn:hover { border-color: #9ca3af; color: #374151; }
.jd-upload-cancel-btn { margin-top: 4px; }
.jd-upload-hint { font-size: .78rem; color: #4b5563; font-style: italic; }
button.jd-modal-option { width: 100%; background: none; text-align: left; font: inherit; cursor: pointer; }
.jd-page :is(a,button,input,[tabindex]):focus-visible { outline: 3px solid #081080; outline-offset: 3px; box-shadow: 0 0 0 6px #fff; }
.jd-page .jd-description { overflow-wrap: anywhere; }
.jd-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.jd-page :is(.btn-search-jobs,.btn-search-jobs-mobile) { background: #a84300; color: #fff; }
.jd-page :is(.btn-search-jobs,.btn-search-jobs-mobile):hover { background: #873600; color: #fff; }
@media (max-width: 768px) {
    .jd-modal-overlay { padding: 12px; }
    .jd-modal-content { padding: 28px 20px; max-height: calc(100dvh - 24px); }
}
@media (prefers-reduced-motion: reduce) {
    .jd-modal-content { animation: none; }
    .jd-upload-spinner { animation-duration: 2s; }
}