/* Duty-location tags, custom selector, status colours, and responsive behavior. */

/* ===== Optional duty status: responsive tag + custom selector ===== */
.admin-login-link{
  appearance:none;
  border:0;
  background:transparent;
  padding:.35rem .65rem;
  font:500 .8rem var(--sans);
  color:var(--muted);
  cursor:pointer;
}
.admin-login-link:hover{color:var(--accent)}

.student-details{min-width:0}
.student-name-row{
  display:flex;
  align-items:center;
  gap:.4rem;
  min-width:0;
}
.student-name-row .student-name{min-width:0}
.duty-location-tag{
  flex:0 1 auto;
  min-width:0;
  max-width:9.5rem;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  padding:.18rem .48rem;
  border-radius:999px;
  background:var(--accent-soft);
  border:1px solid rgba(170,68,101,.14);
  color:var(--accent);
  font-size:.58rem;
  font-weight:700;
  line-height:1.2;
}

/* ── Duty location colour coding ──
   Each status gets a distinct hue so you can spot location at a glance.
   All use the same pill shape — only background, border, and text colour change.
*/

/* Casualty — urgent red */
.duty-location-tag[data-status="Casualty"]{
  background:rgba(185,28,28,.08);
  border-color:rgba(185,28,28,.2);
  color:#B91C1C;
}

/* MICU — deep orange (critical care but not A&E) */
.duty-location-tag[data-status="MICU"]{
  background:rgba(194,65,12,.08);
  border-color:rgba(194,65,12,.2);
  color:#C2410C;
}

/* PICU — amber (paeds critical) */
.duty-location-tag[data-status="PICU"]{
  background:rgba(161,98,7,.09);
  border-color:rgba(161,98,7,.2);
  color:#A16207;
}

/* ICU — teal (general intensive care) */
.duty-location-tag[data-status="ICU"]{
  background:rgba(15,118,110,.08);
  border-color:rgba(15,118,110,.2);
  color:#0F766E;
}

/* Wards — blue (routine inpatient) */
.duty-location-tag[data-status="Wards"]{
  background:rgba(29,78,216,.07);
  border-color:rgba(29,78,216,.18);
  color:#1D4ED8;
}

/* OT — purple (operative) */
.duty-location-tag[data-status="OT"]{
  background:rgba(109,40,217,.08);
  border-color:rgba(109,40,217,.18);
  color:#6D28D9;
}

/* =========================================================
   PROFILE STATUS + UNIT DROPDOWNS
   Admin-style controls, intern-profile layout preserved
   ========================================================= */

.profile-status-field{
  position:relative;
  gap:.8rem;
}

.profile-status-copy{
  min-width:0;
}

.status-select{
  position:relative;
  flex:0 0 auto;
  width:150px;
}


/* Trigger */

.status-select-trigger{
  width:100%;
  min-height:52px;

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;

  padding:.75rem .72rem .75rem 1rem;

  border:1.5px solid var(--border);
  border-radius:16px;

  background:#fff;
  color:var(--ink);

  font-family:var(--sans);
  font-size:.82rem;
  font-weight:600;
  text-align:left;

  cursor:pointer;
  outline:none;

  box-shadow:0 3px 12px rgba(36,35,49,.05);

  transition:
    border-color .18s ease,
    box-shadow .18s ease,
    background .18s ease;
}

.status-select-trigger:hover{
  border-color:var(--border-strong);
  background:var(--surface-soft);
}

.status-select-trigger:focus-visible,
.status-select-trigger[aria-expanded="true"]{
  border-color:var(--accent);
  background:#fff;

  box-shadow:
    0 0 0 4px var(--accent-soft),
    0 5px 16px rgba(36,35,49,.06);
}

.status-select-trigger span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}


/* Admin-style chevron box */

.status-select-trigger svg{
  width:34px;
  height:34px;
  flex:0 0 34px;

  padding:9px;

  border:1px solid rgba(170,68,101,.16);
  border-radius:11px;

  background:var(--accent-soft);

  fill:none;
  stroke:var(--accent);
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;

  transition:transform .18s ease;
}

.status-select-trigger[aria-expanded="true"] svg{
  transform:rotate(180deg);
}


/* Dropdown menu */

.status-select-menu{
  position:absolute;
  
  right:0;
   bottom:calc(100% + 8px);
  top:auto;
  z-index:450;

  display:none;

  width:190px;
  max-height:270px;
  overflow-y:auto;

  padding:.42rem;

  border:1px solid var(--border);
  border-radius:16px;

  background:#fff;
  box-shadow:0 12px 30px rgba(36,35,49,.15);

  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:rgba(36,35,49,.18) transparent;
}

.status-select-menu.open{
  display:grid;
  gap:.18rem;
}

.status-select-menu::-webkit-scrollbar{
  width:6px;
}

.status-select-menu::-webkit-scrollbar-thumb{
  border-radius:999px;
  background:rgba(36,35,49,.18);
}


/* Normal location options */

.status-select-menu > button{
  width:100%;
  min-height:40px;

  display:flex;
  align-items:center;

  padding:.65rem .72rem;

  border:0;
  border-radius:11px;

  background:transparent;
  color:var(--ink);

  font-family:var(--sans);
  font-size:.78rem;
  font-weight:500;
  text-align:left;

  cursor:pointer;

  transition:
    background .14s ease,
    color .14s ease;
}

.status-select-menu > button:hover,
.status-select-menu > button:focus-visible,
.status-select-menu > button:active{
  background:var(--accent-soft);
  color:var(--accent);
  outline:none;
}