/* SIAPIYA_DASHBOARD_ROLE_TODAY_FIRST_V37056
   Dashboard & Role Workspace UX Wave 1 — Today-First Priorities & Role Context.
   Read-only aggregation of data already delivered to the dashboard. */

#mainContent .siapiya-dashboard-role-priority{
  display:grid;
  gap:.8rem;
  margin-bottom:1rem;
  padding:1rem;
  border:1px solid var(--bs-border-color);
  border-radius:1rem;
  background:linear-gradient(135deg,
    color-mix(in srgb,var(--bs-primary-bg-subtle) 42%,var(--bs-body-bg)),
    var(--bs-body-bg) 62%);
  box-shadow:0 .45rem 1.35rem rgba(15,23,42,.055);
}

#mainContent .siapiya-dashboard-role-priority-head{
  display:grid;
  grid-template-columns:minmax(8.5rem,.38fr) minmax(0,1fr);
  gap:1rem;
  align-items:start;
}

#mainContent .siapiya-dashboard-role-context{
  display:grid;
  align-content:start;
  gap:.15rem;
  min-width:0;
  padding:.62rem .7rem;
  border:1px solid color-mix(in srgb,var(--bs-primary) 20%,var(--bs-border-color));
  border-radius:.72rem;
  background:color-mix(in srgb,var(--bs-primary-bg-subtle) 35%,var(--bs-body-bg));
}

#mainContent .siapiya-dashboard-role-context span{
  overflow:hidden;
  color:var(--bs-primary);
  font-size:.76rem;
  font-weight:800;
  line-height:1.25;
  text-overflow:ellipsis;
  white-space:nowrap;
}

#mainContent .siapiya-dashboard-role-context small{
  color:var(--bs-secondary-color);
  font-size:.65rem;
  line-height:1.3;
}

#mainContent .siapiya-dashboard-role-priority-title{
  min-width:0;
}

#mainContent .siapiya-dashboard-role-priority-title h4{
  margin:.08rem 0 .18rem;
  font-size:1.12rem;
  font-weight:800;
  line-height:1.22;
  text-wrap:balance;
}

#mainContent .siapiya-dashboard-role-priority-title p{
  max-width:70ch;
  margin:0;
  color:var(--bs-secondary-color);
  font-size:.75rem;
  line-height:1.45;
}

#mainContent .siapiya-dashboard-priority-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.5rem;
}

#mainContent .siapiya-dashboard-priority-item{
  display:grid;
  grid-template-columns:2rem minmax(0,1fr) auto;
  gap:.55rem;
  align-items:center;
  width:100%;
  min-height:3.6rem;
  padding:.55rem .65rem;
  border:1px solid var(--bs-border-color);
  border-radius:.72rem;
  background:var(--bs-body-bg);
  color:var(--bs-body-color);
  text-align:left;
}

#mainContent button.siapiya-dashboard-priority-item:hover{
  border-color:color-mix(in srgb,var(--bs-primary) 34%,var(--bs-border-color));
  background:var(--bs-tertiary-bg);
}

#mainContent .siapiya-dashboard-priority-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:2rem;
  height:2rem;
  border-radius:.58rem;
  background:var(--bs-tertiary-bg);
  font-size:.95rem;
}

#mainContent .siapiya-dashboard-priority-copy{
  display:grid;
  gap:.08rem;
  min-width:0;
}

#mainContent .siapiya-dashboard-priority-copy b{
  font-size:.76rem;
  font-weight:800;
  line-height:1.3;
}

#mainContent .siapiya-dashboard-priority-copy small{
  color:var(--bs-secondary-color);
  font-size:.66rem;
  line-height:1.35;
}

#mainContent .siapiya-dashboard-priority-chevron{
  color:var(--bs-border-color);
  font-size:.7rem;
}

#mainContent .siapiya-dashboard-priority-clear{
  grid-column:1/-1;
  display:flex;
  align-items:center;
  gap:.58rem;
  min-height:3.6rem;
  padding:.58rem .7rem;
  border:1px solid color-mix(in srgb,var(--bs-success) 28%,var(--bs-border-color));
  border-radius:.72rem;
  background:color-mix(in srgb,var(--bs-success-bg-subtle) 34%,var(--bs-body-bg));
}

#mainContent .siapiya-dashboard-priority-clear > i{
  color:var(--bs-success);
  font-size:1.2rem;
}

#mainContent .siapiya-dashboard-priority-clear > span{
  display:grid;
}

#mainContent .siapiya-dashboard-priority-clear b{
  font-size:.76rem;
}

#mainContent .siapiya-dashboard-priority-clear small{
  color:var(--bs-secondary-color);
  font-size:.66rem;
}

#mainContent .siapiya-dashboard-role-shortcuts{
  display:flex;
  flex-wrap:wrap;
  gap:.38rem;
}

#mainContent .siapiya-dashboard-role-shortcuts button{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  min-height:2.65rem;
  padding:.38rem .62rem;
  border:1px solid var(--bs-border-color);
  border-radius:.65rem;
  background:var(--bs-body-bg);
  color:var(--bs-body-color);
  font-size:.7rem;
  font-weight:750;
}

#mainContent .siapiya-dashboard-role-shortcuts button:hover{
  border-color:color-mix(in srgb,var(--bs-primary) 35%,var(--bs-border-color));
  color:var(--bs-primary);
}

#mainContent .siapiya-dashboard-priority-authority{
  display:flex;
  align-items:flex-start;
  gap:.35rem;
  padding-top:.6rem;
  border-top:1px solid var(--bs-border-color);
  color:var(--bs-secondary-color);
  font-size:.61rem;
  line-height:1.4;
}

#mainContent .siapiya-dashboard-priority-authority i{
  flex:0 0 auto;
  margin-top:.04rem;
}

/* Do not rely on color alone: attention state has a stronger leading edge. */
#mainContent .siapiya-dashboard-role-priority[data-priority-state="attention"]{
  border-inline-start:4px solid var(--bs-primary);
}

#mainContent .siapiya-dashboard-role-priority[data-priority-state="clear"]{
  border-inline-start:4px solid var(--bs-success);
}

#mainContent :is(
  .siapiya-dashboard-priority-item,
  .siapiya-dashboard-role-shortcuts button
):focus-visible{
  outline:3px solid color-mix(in srgb,var(--bs-primary) 58%,transparent);
  outline-offset:2px;
  box-shadow:none!important;
}

[data-bs-theme="dark"] #mainContent .siapiya-dashboard-role-priority{
  background:linear-gradient(135deg,
    color-mix(in srgb,var(--bs-primary-bg-subtle) 20%,var(--bs-body-bg)),
    var(--bs-body-bg) 64%);
  box-shadow:0 .5rem 1.4rem rgba(0,0,0,.18);
}

@media (max-width:767.98px){
  #mainContent .siapiya-dashboard-role-priority{
    gap:.68rem;
    padding:.78rem;
    border-radius:.82rem;
  }

  #mainContent .siapiya-dashboard-role-priority-head{
    grid-template-columns:1fr;
    gap:.58rem;
  }

  #mainContent .siapiya-dashboard-role-context{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:.5rem;
    padding:.48rem .58rem;
  }

  #mainContent .siapiya-dashboard-role-context span{
    max-width:68%;
  }

  #mainContent .siapiya-dashboard-priority-list{
    grid-template-columns:1fr;
  }

  #mainContent .siapiya-dashboard-priority-item{
    min-height:3.75rem;
  }

  #mainContent .siapiya-dashboard-role-shortcuts{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  #mainContent .siapiya-dashboard-role-shortcuts button{
    justify-content:flex-start;
    min-height:2.8rem;
  }
}

@media (max-width:420px){
  #mainContent .siapiya-dashboard-role-priority-title h4{
    font-size:1rem;
  }

  #mainContent .siapiya-dashboard-role-shortcuts{
    grid-template-columns:1fr 1fr;
    gap:.3rem;
  }

  #mainContent .siapiya-dashboard-role-shortcuts button{
    padding-inline:.5rem;
    font-size:.67rem;
  }
}

@media (forced-colors:active){
  #mainContent .siapiya-dashboard-role-priority,
  #mainContent .siapiya-dashboard-priority-item,
  #mainContent .siapiya-dashboard-role-shortcuts button,
  #mainContent .siapiya-dashboard-priority-clear{
    border-color:CanvasText;
  }

  #mainContent .siapiya-dashboard-role-priority[data-priority-state]{
    border-inline-start-color:Highlight;
  }

  #mainContent :is(
    .siapiya-dashboard-priority-item,
    .siapiya-dashboard-role-shortcuts button
  ):focus-visible{
    outline:3px solid Highlight;
  }
}

@media (prefers-reduced-motion:reduce){
  #mainContent .siapiya-dashboard-role-priority,
  #mainContent .siapiya-dashboard-priority-item,
  #mainContent .siapiya-dashboard-role-shortcuts button{
    transition:none!important;
    animation:none!important;
  }
}