/* Fixed border labels: the label position never depends on focus or field value. */
.ep-form-icon { width: 22px; height: 22px; }
html body .page .content.content .employee-request-form.employee-request-form.employee-dashboard-card {
    --request-surface: var(--ep-surface, #fff);
    --request-text: var(--ep-text, #103a43);
    --request-muted: var(--ep-muted, #637e91);
    --request-border: #cbdbe6;
    --request-brand: var(--ep-brand, #00877d);
    display: grid; gap: 14px !important; width: min(100%, 520px) !important;
    padding: 24px !important; border-radius: 16px !important;
    background: var(--request-surface) !important; color: var(--request-text) !important;
    max-height: calc(100dvh - 32px) !important; overflow-y: auto !important;
    box-shadow: 0 20px 70px #102c4333 !important;
}
html body .page .content.content .employee-request-form.employee-request-form .employee-request-form-heading { align-items: start; gap: 12px; margin: 0 0 3px; padding: 0; }
html body .page .content.content .employee-request-form.employee-request-form .employee-request-form-heading h2 {
    margin: 0; font-size: 19px !important; line-height: 1.25; letter-spacing: -.035em; color: var(--request-text) !important;
}
html body .page .content.content .employee-request-form.employee-request-form .employee-request-form-heading p {
    margin: 6px 0 0; font-size: 12px; line-height: 1.5; color: var(--request-muted);
}
html[data-theme="dark"] body .page .content.content .employee-request-form.employee-request-form {
    --request-border: #425c6b;
}
.ep-request-form-title { display: flex; gap: 12px; align-items: flex-start; }
.ep-request-form-title > .ep-form-icon {
    width: 36px; height: 36px; flex: 0 0 36px; padding: 7px;
    border-radius: 9px; color: var(--request-brand); background: var(--ep-soft, #e4f5f0);
}
html body .page .content.content .employee-request-form.employee-request-form .employee-request-field-grid { display: grid; grid-template-columns: 1fr; gap: 14px !important; }
html body .page .content.content .employee-request-form.employee-request-form label:has(> .form-control) {
    display: block; position: relative; min-width: 0; padding: 0 !important; margin: 0 !important;
}
html body .page .content.content .employee-request-form.employee-request-form label:has(> .form-control) > span {
    position: absolute !important; z-index: 2; top: 0 !important; left: 12px !important;
    transform: translateY(-50%) !important; transition: none !important;
    margin: 0 !important; padding: 0 5px !important;
    background: var(--request-surface) !important; color: var(--request-muted) !important;
    font-size: 11px !important; font-weight: 700 !important; line-height: 1.2 !important;
    letter-spacing: 0 !important; text-transform: none !important; white-space: nowrap;
    pointer-events: none;
}
html body .page .content.content .employee-request-form.employee-request-form label > span b { color: #d12d47; margin-left: 2px; font-weight: 600; }
html body .page .content.content .employee-request-form.employee-request-form label:has(> .form-control) > .ep-form-icon {
    position: absolute; left: 10px; top: 11px; width: 26px; height: 26px; padding: 5px;
    border-radius: 8px; background: var(--ep-soft, #e4f5f0); color: var(--request-brand); pointer-events: none;
}
html body .page .content.content .employee-request-form.employee-request-form label > .form-control {
    width: 100%; min-height: 48px !important; height: 48px; box-sizing: border-box;
    padding: 12px 10px 10px 43px !important; border: 1px solid var(--request-border) !important;
    border-radius: 9px !important; background: var(--request-surface) !important; color: var(--request-text) !important;
    font-size: 13px !important; font-weight: 400 !important; line-height: 1.5 !important;
    outline: none !important; box-shadow: none !important;
}
html body .page .content.content .employee-request-form.employee-request-form label > .form-control[readonly] { font-weight: 650 !important; }
html body .page .content.content .employee-request-form.employee-request-form label > .form-control[name="requestedAt"] { font-weight: 400 !important; }
html body .page .content.content .employee-request-form.employee-request-form label > textarea.form-control { min-height: 64px !important; height: 64px; resize: vertical; }
html body .page .content.content .employee-request-form.employee-request-form label > .form-control::placeholder { color: var(--request-muted) !important; opacity: .9; }
html body .page .content.content .employee-request-form.employee-request-form label > .form-control:focus {
    border-color: var(--request-brand) !important; box-shadow: 0 0 0 1px var(--request-brand) !important;
}
html body .page .content.content .employee-request-form.employee-request-form .employee-request-inline-row {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px !important; align-items: start;
}
html body .page .content.content .employee-request-form.employee-request-form .employee-request-receipt-field {
    min-width: 0; width: auto; padding: 0 !important; margin: 0; border: 0 !important; background: transparent !important;
}
html body .page .content.content .employee-request-form.employee-request-form .employee-request-upload-actions { display: flex !important; gap: 6px !important; }
html body .page .content.content .employee-request-form.employee-request-form :is(.employee-request-upload-button, .employee-request-camera-button) {
    display: flex !important; position: relative; flex-direction: column; align-items: center; justify-content: center;
    gap: 5px; width: 50px !important; height: 48px !important; min-height: 48px !important; min-width: 50px !important;
    padding: 5px !important; border: 1px solid var(--request-border) !important; border-radius: 8px !important;
    background: var(--ep-soft, #e4f5f0) !important; color: var(--request-brand) !important; cursor: pointer;
}
html body .page .content.content .employee-request-form.employee-request-form .employee-request-upload-actions strong { font-size: 9px; line-height: 1; font-weight: 650; }
html body .page .content.content .employee-request-form.employee-request-form .employee-request-upload-button:focus-within {
    outline: 2px solid var(--request-brand); outline-offset: 2px;
}
html body .page .content.content .employee-request-form.employee-request-form .employee-request-file-status {
    font-size: 10px !important; line-height: 1.4; color: var(--request-muted) !important;
    margin: -10px 0 0 !important; overflow-wrap: anywhere;
}
html body .page .content.content .employee-request-form.employee-request-form .employee-request-actions {
    display: grid; grid-template-columns: 1.35fr 1fr; gap: 10px; padding-top: 10px;
    border-top: 1px solid var(--request-border); margin: 0;
}
html body .page .content.content .employee-request-form.employee-request-form .employee-request-actions .btn {
    display: inline-flex !important; align-items: center; justify-content: center; gap: 9px;
    min-height: 46px !important; border-radius: 10px !important; font-size: 14px !important; font-weight: 700;
}
html body .page .content.content .employee-request-form.employee-request-form .employee-request-actions .btn-primary {
    background: linear-gradient(120deg, var(--request-brand), color-mix(in srgb, var(--request-brand) 85%, #17677b)) !important;
    border-color: var(--request-brand) !important; color: var(--ep-surface, white) !important;
    box-shadow: 0 5px 12px color-mix(in srgb, var(--request-brand) 15%, transparent);
}
html body .page .content.content .employee-request-form.employee-request-form .employee-request-actions .btn-outline-secondary {
    background: var(--ep-bg, #f3f7fa) !important; border-color: var(--request-border) !important; color: var(--request-text) !important;
}
@media (max-width: 760px) {
    html body .page .content.content .employee-request-form.employee-request-form.employee-dashboard-card { width: 100% !important; padding: 18px !important; }
}
@media (max-width: 359px) {
    html body .page .content.content .employee-request-form.employee-request-form.employee-dashboard-card { padding: 20px 14px !important; }
    html body .page .content.content .employee-request-form.employee-request-form .employee-request-inline-row { grid-template-columns: 1fr; gap: 10px !important; }
    html body .page .content.content .employee-request-form.employee-request-form .employee-request-upload-actions { justify-content: flex-end !important; }
}