/* Documents on a staff record (class.staff_documents.php, staff_documents.js): the section under
   Scheduling — Employer Settings rows, one per file — and the document's own drawer with the
   file in it. The section's note line borrows .staff_facts_note from global.css */

.staff_documents_section { margin-bottom: 22px; }
.staff_documents_title { margin-bottom: 8px; font-size: 12px; color: #555; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.staff_documents_section .meetup_add_people_block { margin-top: 10px; }
.sd_empty { background: white; border: 1px solid #e3ebeb; border-radius: 6px; padding: 16px; font-size: 13px; color: #7d939b; }

/* a card with a date on it: amber while it is running out, red once it has lapsed — on the row's
   icon so the list reads without being read */
.settings_row_icon.sd_icon_soon { background: #fff4de; color: #9a6400; }
.settings_row_icon.sd_icon_expired { background: #fdeaea; color: #b91c1c; }
.sd_expiry { display: block; margin-top: 2px; font-weight: 600; color: #6b7c7d; }
.sd_expiry_soon { color: #9a6400; }
.sd_expiry_expired { color: #b91c1c; }

/* the drawer: the file first, then what it is and when it runs out */
.sd_view { background: white; border: 1px solid #e3ebeb; border-radius: 6px; overflow: hidden; margin-bottom: 14px; }
.sd_frame { display: block; width: 100%; height: 300px; border: 0; background: #f3f7f7; }
.sd_image { background: #f3f7f7; text-align: center; padding: 10px; }
.sd_image img { max-width: 100%; max-height: 320px; border-radius: 4px; }
.sd_other { padding: 26px 16px 20px; text-align: center; }
.sd_other .bi { font-size: 34px; color: #7d939b; }
.sd_other_name { margin-top: 8px; font-weight: 700; color: #26424c; overflow-wrap: anywhere; }
.sd_other_copy { margin-top: 4px; font-size: 12.5px; color: #7d939b; }
.sd_open { display: block; padding: 11px 16px; border-top: 1px solid #eef3f3; color: #0f7777; font-weight: 700; text-align: center; text-decoration: none; }
.sd_open:hover, .sd_open:focus { color: #0f7777; background: #f3fafa; text-decoration: none; }

.sd_card + .sd_card { margin-top: 14px; }
/* eight kinds is a long column on a phone — two up keeps the date field in the same screen */
.sd_kind_choices { grid-template-columns: 1fr 1fr; gap: 8px; }
.sd_kind_choice { padding: 10px 11px; gap: 9px; }
.sd_kind_choice .staff_contact_choice_mark { width: 19px; height: 19px; font-size: 11px; }
.sd_kind_choice .staff_contact_choice_label { font-size: .9em; gap: 7px; }
.sd_expires { border-radius: 6px; border: 1px solid #d8e2e2; box-shadow: none; height: 44px; }
.sd_expiry_line { margin-top: 8px; font-size: 13px; font-weight: 600; color: #6b7c7d; }
/* the state colours are declared above, so they have to be said again here or this later rule wins */
.sd_expiry_line.sd_expiry_soon { color: #9a6400; }
.sd_expiry_line.sd_expiry_expired { color: #b91c1c; }
.sd_errors { margin: 14px 0 0; }

/* the header's three dots: Remove, armed on the first tap */
.sd_tools { flex: none; margin-left: 8px; }
.sd_header_btn { background: transparent; border: 1px solid rgba(255,255,255,0.7); color: white; border-radius: 6px; width: 32px; height: 32px; padding: 0; display: inline-flex; align-items: center; justify-content: center; line-height: 1; }
.sd_header_btn:hover, .sd_header_btn:focus, .sd_tools.open .sd_header_btn { background: rgba(255,255,255,0.15); color: white; }
.sd_tools .dropdown-menu { min-width: 220px; border-radius: 8px; padding: 6px 0; }
.sd_tools .dropdown-menu > li > a { padding: 9px 16px; font-size: 14px; display: flex; align-items: center; gap: 10px; font-weight: 600; }