.jsa-reforg-lookup { max-width: 1024px; margin: 0 auto; font-family: system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif; }
.jr-label{ display:block; font-weight:700; color:#03264f; margin:6px 0 6px; }
.jr-input-row{ position:relative; }
.jr-input{ width:100%; padding:10px 40px 10px 12px; border:2px solid #e3e8ef; border-radius:10px; background:#fff; font-size:16px; }
.jr-input:focus{ outline:none; border-color:#6BC3D0; box-shadow:0 0 0 3px rgba(107,195,208,.2); }
.jr-spinner{ position:absolute; right:10px; top:50%; transform:translateY(-50%); width:18px; height:18px; border:2px solid #cbd5e1; border-top-color:#088c91; border-radius:50%; animation:jrspin 1s linear infinite; display:none; }
.jr-list{ margin-top:8px; border:1px solid #e3e8ef; border-radius:10px; background:#fff; box-shadow:0 8px 20px rgba(0,0,0,.06); overflow:hidden; }
.jr-row{ display:flex; justify-content:space-between; align-items:center; padding:10px 12px; border-top:1px solid #f0f2f6; cursor:pointer; }
.jr-row:first-child{ border-top:none; }
.jr-row:hover, .jr-row:focus{ background:#f8fcfd; }
.jr-name{ font-weight:600; color:#03264f; }
.jr-go{ font-size:12px; padding:4px 8px; background:#088c91; color:#fff; border-radius:8px; }
.jr-actions{ margin-top:10px; }
.jr-create-btn{ background:#03264f; color:#fff; border:0; border-radius:10px; padding:8px 14px; font-weight:600; box-shadow:0 3px 10px rgba(0,0,0,.08); cursor:pointer; }
.jr-create{ margin-top:12px; border:2px solid #e3e8ef; border-radius:12px; padding:12px; background:#fff; }
.hidden{ display:none !important; }

@keyframes jrspin{ to { transform:translateY(-50%) rotate(360deg); } }
/* ─── JSILNY brand tokens ───────────────────────────────────────── */
:root{
  --brand:#1abc9c;
  --brand-dark:#169f87;
  --navy:#0f4a7a;
  --navy-600:#0c3d65;
  --line:#e2e8f0;
  --bg:#f7f9fc;
  --text:#0e3d5c;
  --muted:#6b7a90;
  --radius:10px;
  --shadow:0 6px 18px rgba(0,0,0,.06);
  --shadow-light:0 2px 8px rgba(0,0,0,.05);
}

body{
  margin:0; padding:18px;
  font:14px/1.5 system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  background:#fff; color:#22313f;
}

/* Shell */
.panel{max-width:1100px; margin:0 auto;}
.head{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px;}
.title{margin:0; font-size:1.25rem; color:var(--text); display:flex; align-items:center; gap:.6rem}
.title i{color:var(--brand)}
.hint{color:var(--muted); font-size:.9rem}

/* Toolbar */
.toolbar{display:flex; gap:10px; align-items:center; justify-content:space-between; margin:10px 0 14px}
.search{flex:1; display:flex; gap:8px; align-items:center; border:1px solid var(--line); border-radius:8px; padding:.55rem .7rem; background:#fff; box-shadow:var(--shadow-light)}
.search i{color:#6b7a90}
.search input{border:0; outline:0; flex:1; font:inherit; background:transparent}

/* Filters / role dropdown */
.filters{display:flex; gap:8px; flex-wrap:wrap; align-items:center}
.filter-label{
  font-size:.85rem;
  color:var(--muted);
}
.role-filter{
  border:1px solid var(--line);
  background:#fff;
  border-radius:999px;
  padding:.4rem .9rem;
  font-weight:600;
  color:#22313f;
  cursor:pointer;
  min-width:140px;
  box-shadow:var(--shadow-light);
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  background-image:
    linear-gradient(45deg, transparent 50%, #64748b 50%),
    linear-gradient(135deg, #64748b 50%, transparent 50%);
  background-position:
    calc(100% - 16px) 50%,
    calc(100% - 11px) 50%;
  background-size:5px 5px,5px 5px;
  background-repeat:no-repeat;
}
.role-filter:focus{
  outline:none;
  border-color:var(--brand);
  box-shadow:0 0 0 1px var(--brand);
}

/* Table */
.card{background:#fff; border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-light); overflow:hidden;}
.user-table{width:100%; border-collapse:collapse}
.user-table thead th{background:#2da4c8; color:#fff; text-align:left; padding:.7rem .85rem; font-size:.9rem}
.user-table tbody td{border-top:1px solid var(--line); padding:.65rem .85rem; vertical-align:middle}
.user-row{transition:background .15s}
.user-row:hover{background:#f3f8fb}
.user-meta{display:flex; align-items:center; gap:.65rem}
.avatar{width:32px; height:32px; border-radius:50%; display:inline-grid; place-items:center; font-weight:700; color:#fff; background:var(--navy); box-shadow:0 1px 2px rgba(0,0,0,.08)}

/* Footer */
.footer{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:14px}
.btn{display:inline-flex; align-items:center; gap:.5rem; border:1px solid transparent; border-radius:8px; padding:.6rem 1rem; font-weight:700; cursor:pointer; text-decoration:none}
.btn:disabled{opacity:.5; cursor:not-allowed}
.btn-secondary{background:#e8f4f8; color:#075985; border-color:#bfe3ee}
.btn-primary{background:var(--brand); color:#fff}
.btn-primary:hover{background:var(--brand-dark)}
.btn-muted{background:#eef2f6; color:#0f172a}
.count{color:var(--muted); font-size:.9rem}

/* 🔵 Assign button now blue (was red) */
.btn-danger{background:var(--navy); color:#fff; border-color:var(--navy)}
.btn-danger:hover{background:var(--navy-600); border-color:var(--navy-600)}

/* Small */
@media (max-width:740px){
  .filters{display:none}
  .user-table thead{display:none}
  .user-table, .user-table tbody, .user-table tr, .user-table td{display:block; width:100%}
  .user-table tr{border-top:1px solid var(--line)}
  .user-table td{display:flex; justify-content:space-between}
  .user-table td::before{content:attr(data-label); font-weight:700; color:#374151; padding-right:10px}
}
/* Shared modal used by translation dashboard */
.jsa-modal {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 99999;
}
.jsa-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.55);
}
.jsa-modal-panel {
  position: relative;
  width: min(1100px, 92vw);
  height: min(750px, 88vh);
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
  z-index: 1;
}
.jsa-modal-x {
  position: absolute;
  top: 10px;
  right: 12px;
  z-index: 2;
  border: 0;
  background: rgba(0,0,0,.06);
  border-radius: 999px;
  width: 38px;
  height: 38px;
  font-size: 26px;
  line-height: 38px;
  cursor: pointer;
}
body.jsa-modal-open {
  overflow: hidden;
}

/* Field lookup widget additions */
.jsa-field-lookup .jr-input-row { position: relative; }
.jsa-field-lookup .jsa-field-clear{
  position:absolute; right:42px; top:50%; transform:translateY(-50%);
  border:none; background:transparent; font-size:20px; line-height:1;
  cursor:pointer; color:#667085; padding:0 6px; display:none;
}
.jsa-field-lookup .jsa-field-clear:hover{ color:#03264f; }
.jsa-field-lookup .jsa-field-selected{
  margin-top:8px; border:1px solid #e3e8ef; border-radius:10px;
  background:#f8fcfd; padding:8px 10px; display:none; align-items:center; justify-content:space-between;
}
.jsa-field-lookup .jsa-field-selected button{
  border:none; background:transparent; font-size:20px; line-height:1;
  cursor:pointer; color:#667085; padding:0 6px;
}
.jsa-field-lookup .jsa-field-selected button:hover{ color:#03264f; }