/* Frontend + admin styles */
.rs-roster-wrap { font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; color:#111; }

.rs-roster-toolbar { display:flex; gap:16px; align-items:center; margin-bottom:12px; flex-wrap:wrap; }
.rs-roster-toolbar label { font-size:14px; display:flex; align-items:center; gap:8px; }
.rs-roster-toolbar input[type="search"], .rs-roster-toolbar select { padding:6px 10px; border:1px solid #ccc; border-radius:6px; min-width:220px; }
.rs-roster-toolbar .rs-export { padding:6px 10px; border:1px solid #bbb; border-radius:6px; background:#f6f6f6; text-decoration:none; color:#111; }
.rs-roster-toolbar .rs-export:hover { background:#eee; }

.rs-roster-table-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; border:1px solid #e5e5e5; border-radius:10px; background:#fff; }
.rs-roster-table { width:100%; border-collapse:collapse; min-width:740px; }
.rs-roster-table th, .rs-roster-table td { padding:10px 12px; border-bottom:1px solid #eee; text-align:left; vertical-align:middle; }
.rs-roster-table thead th { position:sticky; top:0; background:#fafafa; border-bottom:1px solid #e5e5e5; z-index:1; }
.rs-roster-table tbody tr:hover { background:#f9fbff; }
.rs-roster-table .col-unit { width:120px; font-weight:600; }
.rs-roster-table .col-name { width:220px; }
.rs-roster-table .col-office { width:160px; }
.rs-roster-table .col-phone { width:160px; }
.rs-roster-table .col-roles { min-width:220px; }
.rs-roster-table .col-actions { width:90px; }

/* Board */
.rs-board-wrap .col-position { width: 220px; font-weight:600; }
.rs-board-wrap .col-email { width: 240px; }

/* Modal */
.rs-modal { position:fixed; inset:0; z-index:9999; }
.rs-modal-backdrop { position:absolute; inset:0; background:rgba(0,0,0,.35); }
.rs-modal-dialog { position:relative; max-width:560px; width:calc(100% - 24px); margin:6vh auto; background:#fff; border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,.2); overflow:hidden; }
.rs-modal-header { display:flex; align-items:center; justify-content:space-between; padding:12px 16px; background:#f6f7fb; border-bottom:1px solid #eaeaea; }
.rs-modal-header h3 { margin:0; font-size:18px; }
.rs-modal-close { background:transparent; border:none; font-size:22px; line-height:1; cursor:pointer; }
.rs-modal-body { padding:14px 16px; }
.rs-field { margin-bottom:12px; }
.rs-field label { font-weight:600; display:block; margin-bottom:6px; }
.rs-field input[type="text"], .rs-field input[type="email"], .rs-field select { width:100%; max-width:100%; padding:8px 10px; border:1px solid #ccc; border-radius:8px; }

.rs-actions { display:flex; gap:10px; margin-top:10px; }

/* Mobile stacked view */
@media (max-width: 640px) {
  .rs-roster-table, .rs-roster-table thead, .rs-roster-table tbody, .rs-roster-table th, .rs-roster-table td, .rs-roster-table tr { display:block; }
  .rs-roster-table thead { display:none; }
  .rs-roster-table tr { border-bottom:1px solid #eee; padding:8px 10px; }
  .rs-roster-table td { border:none; padding:6px 0; }
  .rs-roster-table td::before { content: attr(data-label) ": "; font-weight:600; display:inline-block; width:36%; }
}