/* ========================================================================
   SYNAPSE — Data Classification & Agent Authorization
   Minimalist, professional. Extends existing design tokens.
   ======================================================================== */

/* ── Sensitivity badges ──────────────────────────────────────────────── */
.clf-badge {
  display: inline-flex;
  align-items: center;
  gap: .32rem;
  padding: .17rem .52rem;
  border-radius: 2px;
  font-family: var(--ff-mono);
  font-size: .59rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 500;
  border: 1px solid currentColor;
  white-space: nowrap;
  cursor: default;
  transition: opacity .2s;
}

.clf-badge::before {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
  flex-shrink: 0;
  animation: clf-pulse 3s ease-in-out infinite;
}

@keyframes clf-pulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: .45; }
}

.clf-badge[data-level="0"] { color: #7da77b; background: rgba(125,167,123,.09); border-color: rgba(125,167,123,.28); }
.clf-badge[data-level="1"] { color: #6EA8FF; background: rgba(110,168,255,.09); border-color: rgba(110,168,255,.28); }
.clf-badge[data-level="2"] { color: #D6A64F; background: rgba(214,166,79,.09);  border-color: rgba(214,166,79,.28); }
.clf-badge[data-level="3"] { color: #c97b4a; background: rgba(201,123,74,.09);  border-color: rgba(201,123,74,.28); }
.clf-badge[data-level="4"] { color: #b04848; background: rgba(176,72,72,.09);   border-color: rgba(176,72,72,.28); }
.clf-badge[data-level="5"] { color: #e04040; background: rgba(224,64,64,.07);   border-color: rgba(224,64,64,.32); }

/* stop the pulse on level 0 — it's public, no urgency */
.clf-badge[data-level="0"]::before { animation: none; }

.clf-domain-tag {
  display: inline-flex;
  align-items: center;
  padding: .15rem .42rem;
  border-radius: 2px;
  font-family: var(--ff-mono);
  font-size: .57rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  background: rgba(255,255,255,.055);
  border: 1px solid rgba(255,255,255,.09);
  color: var(--text-2);
  white-space: nowrap;
}

/* ── Doc item meta row ───────────────────────────────────────────────── */
.dash-doc-item-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .38rem;
  margin-top: .42rem;
}

.dash-doc-item-content {
  flex: 1;
  min-width: 0;
}

/* ── Classification selector rows in forms ───────────────────────────── */
.clf-selectors {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .6rem;
  margin-top: .65rem;
  padding-top: .65rem;
  border-top: 1px solid rgba(255,255,255,.07);
}

.clf-selectors label {
  display: flex;
  flex-direction: column;
  gap: .28rem;
}

.clf-selectors label > span {
  font-family: var(--ff-mono);
  font-size: .59rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--text-3);
}

/* ── Agent authorization section ─────────────────────────────────────── */
.clf-clearance-row {
  padding-top: .65rem;
  border-top: 1px solid rgba(255,255,255,.07);
  margin-top: .65rem;
}

.clf-clearance-row > span,
.clf-domains-header {
  display: block;
  font-family: var(--ff-mono);
  font-size: .59rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--text-3);
  margin-bottom: .5rem;
}

.clf-domains-grid {
  display: flex;
  flex-wrap: wrap;
  gap: .42rem;
  margin-top: .3rem;
}

.clf-domain-check {
  display: flex;
  align-items: center;
  gap: .28rem;
  cursor: pointer;
  user-select: none;
}

.clf-domain-check input[type="checkbox"] {
  width: 12px;
  height: 12px;
  accent-color: var(--accent-blue);
  cursor: pointer;
}

.clf-domain-check span {
  font-family: var(--ff-mono);
  font-size: .59rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--text-2);
  transition: color .2s;
}

.clf-domain-check:has(input:checked) span {
  color: var(--white);
}

/* ── Agent list authorization display ────────────────────────────────── */
.agent-auth-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .32rem;
  margin-top: .42rem;
  padding-top: .42rem;
  border-top: 1px solid rgba(255,255,255,.055);
}

.agent-clearance-badge {
  display: inline-flex;
  align-items: center;
  gap: .28rem;
  padding: .15rem .48rem;
  border-radius: 2px;
  font-family: var(--ff-mono);
  font-size: .59rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  font-weight: 500;
  border: 1px solid currentColor;
}

.agent-clearance-badge[data-level="0"] { color: #7da77b; background: rgba(125,167,123,.08); border-color: rgba(125,167,123,.25); }
.agent-clearance-badge[data-level="1"] { color: #6EA8FF; background: rgba(110,168,255,.08); border-color: rgba(110,168,255,.25); }
.agent-clearance-badge[data-level="2"] { color: #D6A64F; background: rgba(214,166,79,.08);  border-color: rgba(214,166,79,.25); }
.agent-clearance-badge[data-level="3"] { color: #c97b4a; background: rgba(201,123,74,.08);  border-color: rgba(201,123,74,.25); }
.agent-clearance-badge[data-level="4"] { color: #b04848; background: rgba(176,72,72,.08);   border-color: rgba(176,72,72,.25); }
.agent-clearance-badge[data-level="5"] { color: #e04040; background: rgba(224,64,64,.06);   border-color: rgba(224,64,64,.28); }

/* ── Compatibility indicator ─────────────────────────────────────────── */
.compat-indicator {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  padding: .75rem 1rem;
  border-radius: 2px;
  border: 1px solid rgba(255,255,255,.07);
  background: rgba(0,0,0,.22);
  margin-top: .75rem;
  transition: border-color .35s var(--ease), background .35s var(--ease);
}

.compat-indicator[data-access="full"] {
  border-color: rgba(125,167,123,.28);
  background: rgba(125,167,123,.065);
}

.compat-indicator[data-access="partial"] {
  border-color: rgba(214,166,79,.28);
  background: rgba(214,166,79,.065);
}

.compat-indicator[data-access="denied"] {
  border-color: rgba(176,72,72,.28);
  background: rgba(176,72,72,.065);
}

.compat-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: .25rem;
  transition: background .35s var(--ease), box-shadow .35s var(--ease);
  background: var(--text-3);
}

.compat-indicator[data-access="full"]    .compat-dot { background: #7da77b; box-shadow: 0 0 9px rgba(125,167,123,.55); }
.compat-indicator[data-access="partial"] .compat-dot { background: #D6A64F; box-shadow: 0 0 9px rgba(214,166,79,.55); }
.compat-indicator[data-access="denied"]  .compat-dot { background: #b04848; box-shadow: 0 0 9px rgba(176,72,72,.55); }

.compat-body { flex: 1; min-width: 0; }

.compat-label {
  font-family: var(--ff-mono);
  font-size: .64rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--text-3);
  transition: color .35s var(--ease);
}

.compat-indicator[data-access="full"]    .compat-label { color: #7da77b; }
.compat-indicator[data-access="partial"] .compat-label { color: #D6A64F; }
.compat-indicator[data-access="denied"]  .compat-label { color: #b04848; }

.compat-reason {
  margin-top: .22rem;
  font-size: .76rem;
  color: var(--text-2);
  line-height: 1.48;
}

.compat-partial-tag {
  display: inline-block;
  margin-top: .38rem;
  padding: .14rem .42rem;
  border-radius: 2px;
  font-family: var(--ff-mono);
  font-size: .58rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  background: rgba(214,166,79,.1);
  border: 1px solid rgba(214,166,79,.28);
  color: #D6A64F;
}

/* ── Partial access notice in live feed ──────────────────────────────── */
.partial-access-notice {
  display: flex;
  align-items: flex-start;
  gap: .65rem;
  padding: .7rem 1rem;
  border: 1px solid rgba(214,166,79,.22);
  background: rgba(214,166,79,.055);
  border-radius: 2px;
  margin: .55rem 0;
}

.partial-access-notice-icon {
  font-family: var(--ff-mono);
  font-size: .7rem;
  color: #D6A64F;
  flex-shrink: 0;
  margin-top: .05rem;
}

.partial-access-notice-body strong {
  display: block;
  font-family: var(--ff-mono);
  font-size: .63rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: #D6A64F;
  margin-bottom: .2rem;
}

.partial-access-notice-body p {
  font-size: .78rem;
  color: var(--text-2);
  line-height: 1.45;
  margin: 0;
}

/* ── Security / Audit view ───────────────────────────────────────────── */
.security-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .55fr);
  gap: 1rem;
  align-items: start;
}

.audit-log-list {
  display: grid;
  gap: .6rem;
  max-height: calc(100vh - 240px);
  overflow: auto;
}

.audit-entry {
  display: grid;
  grid-template-columns: 8px 1fr auto;
  gap: .55rem .8rem;
  align-items: start;
  padding: .85rem;
  border: 1px solid rgba(255,255,255,.07);
  background: rgba(5,6,7,.48);
  transition: border-color .2s;
}

.audit-entry:hover { border-color: rgba(255,255,255,.12); }

.audit-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  margin-top: .42rem;
  flex-shrink: 0;
}

.audit-entry[data-access="full"]    .audit-dot { background: #7da77b; box-shadow: 0 0 6px rgba(125,167,123,.4); }
.audit-entry[data-access="partial"] .audit-dot { background: #D6A64F; box-shadow: 0 0 6px rgba(214,166,79,.4); }
.audit-entry[data-access="denied"]  .audit-dot { background: #b04848; box-shadow: 0 0 6px rgba(176,72,72,.4); }
.audit-entry[data-access="anon"]    .audit-dot { background: #6EA8FF; box-shadow: 0 0 6px rgba(110,168,255,.4); }
.audit-entry[data-access="system"]  .audit-dot { background: var(--text-3); }

.audit-body {}

.audit-body strong {
  display: block;
  color: var(--white);
  font-weight: 500;
  font-size: .87rem;
}

.audit-body .audit-meta {
  display: block;
  margin-top: .22rem;
  font-family: var(--ff-mono);
  font-size: .6rem;
  color: var(--text-3);
  letter-spacing: .06em;
}

.audit-body .audit-detail {
  margin-top: .32rem;
  font-size: .79rem;
  color: var(--text-2);
  line-height: 1.48;
}

.audit-time {
  font-family: var(--ff-mono);
  font-size: .59rem;
  color: var(--text-3);
  white-space: nowrap;
  margin-top: .08rem;
}

/* ── History security event ──────────────────────────────────────────── */
.history-security {
  border-left: 2px solid rgba(110,168,255,.35) !important;
}

/* ── Legend panel ────────────────────────────────────────────────────── */
.clf-legend {
  display: grid;
  gap: .5rem;
}

.clf-legend-title {
  font-family: var(--ff-mono);
  font-size: .6rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--text-3);
  margin-bottom: .35rem;
}

.clf-legend-entry {
  display: flex;
  align-items: flex-start;
  gap: .6rem;
  padding: .55rem .7rem;
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(5,6,7,.36);
}

.clf-legend-level {
  font-family: var(--ff-mono);
  font-size: .64rem;
  font-weight: 600;
  min-width: 1.4rem;
  flex-shrink: 0;
}

.clf-legend-entry[data-level="0"] .clf-legend-level { color: #7da77b; }
.clf-legend-entry[data-level="1"] .clf-legend-level { color: #6EA8FF; }
.clf-legend-entry[data-level="2"] .clf-legend-level { color: #D6A64F; }
.clf-legend-entry[data-level="3"] .clf-legend-level { color: #c97b4a; }
.clf-legend-entry[data-level="4"] .clf-legend-level { color: #b04848; }
.clf-legend-entry[data-level="5"] .clf-legend-level { color: #e04040; }

.clf-legend-info {}

.clf-legend-info strong {
  display: block;
  font-size: .8rem;
  font-weight: 500;
  color: var(--white);
}

.clf-legend-info p {
  font-size: .74rem;
  color: var(--text-2);
  margin-top: .1rem;
  line-height: 1.4;
}

/* ── Tooltip ─────────────────────────────────────────────────────────── */
[data-clf-tip] {
  position: relative;
  cursor: help;
}

[data-clf-tip]::after {
  content: attr(data-clf-tip);
  position: absolute;
  bottom: calc(100% + 7px);
  left: 50%;
  transform: translateX(-50%);
  padding: .42rem .65rem;
  background: rgba(12,14,17,.97);
  border: 1px solid rgba(255,255,255,.1);
  color: var(--text-2);
  font-family: var(--ff-mono);
  font-size: .62rem;
  letter-spacing: .04em;
  pointer-events: none;
  opacity: 0;
  transition: opacity .2s var(--ease);
  z-index: 200;
  backdrop-filter: blur(10px);
  width: max-content;
  max-width: 240px;
  white-space: normal;
  text-align: left;
  line-height: 1.5;
  border-radius: 2px;
}

[data-clf-tip]:hover::after { opacity: 1; }

/* ── Document form classification preview ────────────────────────────── */
.clf-form-preview {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .45rem;
  padding: .5rem 0 .25rem;
  min-height: 1.75rem;
}

/* Keeps the description text at the same optical weight as the badges */
.clf-preview-desc {
  font-size: .74rem;
  color: var(--text-3);
  line-height: 1.4;
}

/* ── Responsive ──────────────────────────────────────────────────────── */
@media (max-width: 900px) {
  .security-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px) {
  .clf-selectors {
    grid-template-columns: 1fr;
  }
}