/* V22.2.38 — compartilhamento direto, notificações e diálogos compactos. */

/* Detalhes da diária: mantém o conteúdo pareado às caixas internas, sem ocupar largura vazia. */
#jobDetailsDialog.job-details-dialog{
  width:min(660px,calc(100vw - 32px))!important;
  max-width:min(660px,calc(100vw - 32px))!important;
}
#jobDetailsDialog .dialog-card{
  width:100%!important;
  max-width:100%!important;
  padding:18px!important;
  gap:12px!important;
}
#jobDetailsDialog .workflow-actions{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:9px!important;
}
#jobDetailsDialog .workflow-actions>.btn,
#jobDetailsDialog .job-share-slot{width:100%;min-width:0!important;max-width:none!important}
#jobDetailsDialog .workflow-actions>.btn{min-height:48px}
#jobDetailsDialog .job-workflow-pane{margin-top:4px!important;max-height:50dvh}
#jobDetailsDialog .field-help{line-height:1.4}

/* O botão Compartilhar vira o próprio campo de username no mesmo espaço. */
.job-share-slot{display:block;align-self:stretch}
.job-share-slot>#jobShareListBtn{width:100%;height:100%;min-height:48px}
.job-share-inline{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto 38px;
  gap:7px;
  padding:7px;
  border:1px solid #4b4f58;
  border-radius:14px;
  background:#202329;
  min-width:0;
}
.job-share-inline.hidden{display:none!important}
.job-share-inline input{
  min-width:0!important;
  height:40px!important;
  padding:0 11px!important;
  margin:0!important;
  border-radius:10px!important;
  background:#111318!important;
  color:#fff!important;
}
.job-share-inline .btn{min-height:40px!important;padding:0 13px!important;white-space:nowrap}
.job-share-inline .icon-btn{width:38px;height:40px;align-self:center}
.job-share-inline small{grid-column:1/-1;color:#c1c3c8;font-size:.7rem;line-height:1.35;padding:0 4px 2px}

/* Central de notificações por usuário. */
.notification-bell{
  position:relative;
  width:42px;
  height:42px;
  flex:0 0 42px;
  border:1px solid #41444c;
  border-radius:13px;
  background:#181a1f;
  color:#ffd400;
  display:grid;
  place-items:center;
  cursor:pointer;
}
.notification-bell svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.notification-bell:hover{border-color:#ffd400;background:#202329}
.notification-bell b{
  position:absolute;
  top:-6px;
  right:-6px;
  min-width:20px;
  height:20px;
  padding:0 5px;
  border-radius:999px;
  background:#ffd400;
  color:#111;
  border:2px solid #0d0e10;
  font:900 .66rem/16px Inter,sans-serif;
  text-align:center;
}
.notifications-dialog{width:min(520px,calc(100vw - 24px))!important;max-width:min(520px,calc(100vw - 24px))!important}
.notifications-card{width:100%;max-height:min(76dvh,720px);overflow:hidden;display:grid;grid-template-rows:auto auto minmax(0,1fr)}
.notifications-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-bottom:8px;border-bottom:1px solid #343840}
.notifications-toolbar span{font-size:.78rem;color:#c6c9cf;font-weight:700}
.notifications-toolbar .btn{padding:8px 10px;min-height:34px;font-size:.75rem}
.notifications-list{display:grid;gap:8px;overflow:auto;min-height:90px;padding-right:2px}
.notification-item{
  width:100%;
  display:grid;
  grid-template-columns:10px minmax(0,1fr) auto;
  gap:10px;
  align-items:start;
  text-align:left;
  padding:12px;
  border:1px solid #3c4048;
  border-radius:14px;
  background:#1b1e23;
  color:#f7f7f3;
  cursor:pointer;
}
.notification-item:hover{border-color:#666b75;background:#22262c}
.notification-item.unread{border-color:rgba(255,212,0,.55);background:linear-gradient(90deg,rgba(255,212,0,.07),#1b1e23 35%)}
.notification-dot{width:7px;height:7px;border-radius:50%;margin-top:6px;background:#59606b}
.notification-item.unread .notification-dot{background:#ffd400;box-shadow:0 0 0 4px rgba(255,212,0,.10)}
.notification-copy{display:grid;gap:4px;min-width:0}
.notification-copy strong{font-size:.88rem;color:#fff}
.notification-copy small{font-size:.76rem;color:#c4c7cd;line-height:1.4}
.notification-copy em{font-style:normal;font-size:.7rem;color:#ffd400;line-height:1.35}
.notification-item time{font-size:.66rem;color:#9499a3;white-space:nowrap}

/* Confirmação visual inequívoca de cópia. */
#shareInviteCopy{transition:transform .15s ease,background .15s ease,border-color .15s ease,color .15s ease}
#shareInviteCopy.copying{opacity:.75}
#shareInviteCopy.copied{background:#ffd400!important;color:#111!important;border-color:#ffd400!important;transform:scale(.98)}
.share-invite-link-row input:focus{outline:2px solid rgba(255,212,0,.42);outline-offset:1px}

@media(max-width:700px){
  #jobDetailsDialog.job-details-dialog{width:calc(100vw - 16px)!important;max-width:calc(100vw - 16px)!important}
  #jobDetailsDialog .dialog-card{padding:14px!important}
  #jobDetailsDialog .workflow-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .job-share-inline{grid-template-columns:minmax(0,1fr) 40px}
  .job-share-inline #jobShareInlineSend{grid-column:1/2;grid-row:2}
  .job-share-inline #jobShareInlineCancel{grid-column:2;grid-row:1/3;height:100%}
  .job-share-inline small{grid-column:1/-1}
  .notifications-toolbar{align-items:flex-start;flex-direction:column}
  .notifications-toolbar .btn{width:100%}
}
@media(max-width:430px){
  #jobDetailsDialog .workflow-actions{grid-template-columns:1fr!important}
  .notification-bell{width:38px;height:38px;flex-basis:38px}
  .notification-item{grid-template-columns:9px minmax(0,1fr)}
  .notification-item time{grid-column:2;justify-self:start}
}
