/* TALKCHAT_R19C12R9R18R10R3_LOGOUT_CONFIRMATION_PROFILE_PARITY */

.tc-logout-confirm-overlay{
  position:fixed;
  inset:0;
  z-index:32000;
  display:grid;
  place-items:center;
  padding:20px;
  background:var(--tc-overlay,rgba(2,6,23,.62));
  backdrop-filter:blur(2px);
}

.tc-logout-confirm-card{
  width:min(390px,calc(100vw - 32px));
  border:1px solid var(--tc-border,#e5e7eb);
  border-radius:16px;
  background:var(--tc-panel,#fff);
  color:var(--tc-text,#1f2937);
  box-shadow:0 24px 72px rgba(0,0,0,.32);
  overflow:hidden;
}

.tc-logout-confirm-head{
  display:flex;
  gap:13px;
  align-items:center;
  padding:20px 20px 17px;
}

.tc-logout-confirm-icon{
  width:38px;
  height:38px;
  min-width:38px;
  flex:0 0 38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  border-radius:11px;
  background:rgba(220,38,38,.12);
  color:#dc2626;
  font-size:22px;
  line-height:1;
  text-align:center;
}

.tc-logout-confirm-copy{
  min-width:0;
  flex:1 1 auto;
}

.tc-logout-confirm-head h2{
  margin:0 0 6px;
  color:var(--tc-text,#1f2937);
  font-size:17px;
  line-height:1.25;
  font-weight:800;
}

.tc-logout-confirm-head p{
  margin:0;
  color:var(--tc-muted,#6b7280);
  font-size:13px;
  line-height:1.55;
}

.tc-logout-confirm-actions{
  display:flex;
  justify-content:flex-end;
  gap:9px;
  padding:14px 16px 16px;
  border-top:1px solid var(--tc-border,#e5e7eb);
  background:var(--tc-elevated,#f8fafc);
}

.tc-logout-confirm-actions button{
  min-height:38px;
  border-radius:10px;
  padding:0 15px;
  font:inherit;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
}

.tc-logout-confirm-cancel{
  border:1px solid var(--tc-border,#e5e7eb);
  background:var(--tc-panel,#fff);
  color:var(--tc-text,#1f2937);
}

.tc-logout-confirm-cancel:hover{
  background:var(--tc-hover,#f3f4f6);
}

.tc-logout-confirm-yes{
  border:1px solid #dc2626;
  background:#dc2626;
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
}

.tc-logout-confirm-yes:hover{
  background:#b91c1c;
  border-color:#b91c1c;
}

.tc-logout-confirm-yes .material-symbols-outlined{
  width:18px;
  height:18px;
  flex:0 0 18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  line-height:1;
  text-align:center;
}

/* Only the two real logout controls. */
.ref-shell .rail button.logout[data-action="logout"] .material-symbols-outlined,
.msref-menu-footer button[data-msref="menu-action"][data-key="logout"] .material-symbols-outlined{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  line-height:1!important;
}

.ref-shell .rail button.logout[data-action="logout"] .material-symbols-outlined{
  width:22px!important;
  height:22px!important;
}

.msref-menu-footer button[data-msref="menu-action"][data-key="logout"]{
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
}

.msref-menu-footer button[data-msref="menu-action"][data-key="logout"] .material-symbols-outlined{
  width:20px!important;
  height:20px!important;
  flex:0 0 20px!important;
}

.tc-logout-confirm-actions button:focus-visible{
  outline:2px solid #3b82f6;
  outline-offset:2px;
}

@media (max-width:480px){
  .tc-logout-confirm-overlay{padding:16px}
  .tc-logout-confirm-head{padding:18px 17px 15px}
  .tc-logout-confirm-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    padding:13px 14px 14px;
  }
  .tc-logout-confirm-actions button{padding:0 10px}
}