/* Darkchats: shared access details, in Kollektivet's charcoal and bronze palette. */
.darkchats-view {
  --dc-accent: #cfb998;
  --dc-line: #353a34;
  --dc-muted: #a1a89e;
  height: calc(100vh - var(--header));
  height: calc(100dvh - var(--header));
  overflow: auto;
  padding: 46px clamp(20px, 4vw, 64px) 28px;
  background: radial-gradient(ellipse at 95% 0, #302b2040, transparent 45%), #101310;
}
.darkchats-content { max-width: 1380px; margin: 0 auto; }
.darkchats-head {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 32px;
  padding-bottom: 36px;
  border-bottom: 1px solid var(--dc-line);
}
.darkchats-head::after {
  content: "";
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 72px;
  height: 2px;
  background: var(--dc-accent);
}
.darkchats-eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 20px;
  color: var(--dc-accent, #cfb998);
  font: 600 10px/1.5 Inter, sans-serif;
  letter-spacing: 1.7px;
  text-transform: uppercase;
}
.darkchats-eyebrow > span { width: 6px; height: 6px; background: currentColor; flex: none; }
.darkchats-heading { min-width: 0; max-width: 100%; }
.darkchats-heading h1 {
  font: 700 clamp(52px, 6.8vw, 96px)/.92 'Barlow Condensed', sans-serif;
  letter-spacing: -1px;
  color: #f1f0e7;
  overflow-wrap: anywhere;
}
.darkchats-heading h1 > span { color: var(--dc-accent); }
.darkchats-intro { margin: 20px 0 0; color: var(--dc-muted); font-size: 13px; line-height: 1.8; }
.darkchats-head-aside { display: grid; justify-items: center; gap: 22px; flex: none; }
.darkchats-emblem {
  position: relative;
  display: grid;
  place-items: center;
  width: 88px;
  height: 88px;
  color: #9e8f75;
  border: 1px solid #5a503a75;
  background: linear-gradient(135deg, #af976714, transparent);
  transform: rotate(-8deg);
}
.darkchats-emblem::before { content: ""; position: absolute; inset: 7px; border: 1px solid #5a503a45; }
.darkchats-emblem svg { width: 40px; height: 40px; transform: rotate(8deg); }
.darkchats-view svg, .darkchat-dialog svg {
  display: block;
  width: 18px;
  height: 18px;
  flex: none;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.darkchats-view .darkchats-emblem svg { width: 40px; height: 40px; }
.darkchat-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 44px;
  padding: 12px 19px;
  border: 1px solid #cfb998;
  border-radius: 3px;
  background: #cfb998;
  color: #171a16;
  font-size: 12px;
  font-weight: 700;
  transition: background .18s, border-color .18s;
}
.darkchat-primary:hover { background: #e2ceb0; border-color: #e2ceb0; }
.darkchat-primary:disabled { opacity: .55; cursor: wait; }
.darkchats-view button:focus-visible, .darkchats-view summary:focus-visible,
.darkchat-dialog button:focus-visible { outline: 2px solid #e2ceb0; outline-offset: 4px; }
.darkchats-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 30px 0 18px; }
.darkchats-directory-title { display: flex; align-items: center; gap: 13px; min-width: 0; }
.darkchats-section-number { color: #948773; font: 11px Consolas, monospace; letter-spacing: 1px; }
.darkchats-directory-title h2 { font: 600 24px 'Barlow Condensed', sans-serif; white-space: nowrap; }
.darkchat-count { padding: 4px 7px; border: 1px solid #454739; border-radius: 3px; color: var(--dc-accent); background: #bba17509; font: 11px Consolas, monospace; }
.darkchat-search { position: relative; display: block; margin: 0; width: min(320px, 45%); }
.darkchat-search > svg { position: absolute; left: 14px; top: 14px; color: var(--dc-muted); pointer-events: none; }
.darkchat-search input { height: 44px; padding: 10px 14px 10px 42px; border-color: var(--dc-line); background: #191d18; font-size: 11px; font-weight: 400; }
.darkchat-search input::placeholder { color: #959c91; }
.darkchat-search input:focus { border-color: var(--dc-accent); box-shadow: 0 0 0 2px #cfb99818; }
.darkchat-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.darkchats-list-caption { display: flex; justify-content: space-between; gap: 14px; margin-bottom: 21px; color: #a1a89e; font-size: 10px; line-height: 1.6; }
#darkchatResults { flex: none; color: #c0c3b8; }
.darkchat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 18px; align-items: start; }
.darkchat-card {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-self: stretch;
  overflow: hidden;
  border: 1px solid var(--dc-line);
  border-radius: 5px;
  background: linear-gradient(145deg, #20241c55, transparent 55%), #181c17;
  transition: border-color .2s, box-shadow .2s;
  animation: darkchat-enter .35s both;
  animation-delay: calc(var(--card-order) * 35ms);
}
.darkchat-card:hover { border-color: #786c54; box-shadow: 0 8px 26px #00000020; }
.darkchat-card-head { display: flex; align-items: center; gap: 12px; padding: 21px 20px; }
.darkchat-contact-icon { display: grid; place-items: center; width: 38px; height: 42px; flex: none; border: 1px solid #4b4c3c; border-radius: 3px; color: var(--dc-accent); background: #282b20; }
.darkchat-contact { flex: 1; min-width: 0; }
.darkchat-label { display: block; color: #a1a89e; font-size: 9px; font-weight: 600; letter-spacing: 1.4px; line-height: 1.5; text-transform: uppercase; }
.darkchat-contact .darkchat-label { color: #c0ab87; }
.darkchat-contact h3 { margin: 4px 0 0; color: #edece1; font: 600 28px/1.05 'Barlow Condensed', sans-serif; overflow-wrap: anywhere; }
.darkchat-edit { display: grid; place-items: center; flex: none; width: 36px; height: 44px; border: 1px solid transparent; border-radius: 3px; background: transparent; color: #a1a89e; }
.darkchat-edit:hover { color: var(--dc-accent); background: #25291f; border-color: #4b4c3c; }
.darkchat-edit svg { width: 16px; height: 16px; }
.darkchat-access { margin: 0 20px; border: 1px solid #4b4637; border-left: 2px solid #bca57f; border-radius: 3px; background: #10140f; overflow: hidden; }
.darkchat-access-heading { display: flex; align-items: center; gap: 8px; padding: 11px 15px; border-bottom: 1px solid #3b392e; background: #28271b60; color: #cdb897; font-size: 9px; font-weight: 600; letter-spacing: 1px; text-transform: uppercase; }
.darkchat-access-heading svg { width: 13px; height: 13px; }
.darkchat-credentials { margin: 0; }
.darkchat-credentials > div { padding: 13px 15px 15px; }
.darkchat-credentials > div + div { border-top: 1px solid #2c3128; }
.darkchat-credentials dt { margin: 0 0 7px; color: #b0b9a5; font-size: 11px; font-weight: 500; line-height: 1.3; }
.darkchat-credentials dd { margin: 0; color: #ecebdc; font: 500 18px/1.4 Consolas, 'Courier New', monospace; overflow-wrap: anywhere; white-space: pre-wrap; user-select: text; }
.darkchat-credentials .darkchat-name { color: #e0c69f; }
.darkchat-credentials .is-missing { color: #a99e89; font: 400 13px/1.8 Inter, sans-serif; }
.darkchat-purpose { padding: 22px 20px; flex: 1; }
.darkchat-purpose p { margin: 7px 0 0; color: #b1b7a9; font-size: 12px; line-height: 1.7; white-space: pre-wrap; overflow-wrap: anywhere; }
.darkchat-note-details summary { margin-top: 7px; color: #b1b7a9; font-size: 12px; line-height: 1.7; cursor: pointer; overflow-wrap: anywhere; }
.darkchat-note-details summary b { display: block; color: var(--dc-accent); font-size: 10px; font-weight: 500; margin-top: 5px; }
.darkchat-note-details[open] summary span { display: none; }
.darkchat-note-details[open] summary b { font-size: 0; }
.darkchat-note-details[open] summary b::after { content: "Skjul notat"; font-size: 10px; }
.darkchat-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding: 13px 20px; border-top: 1px solid #30352b; color: #969e8f; font-size: 9px; line-height: 1.5; }
.darkchat-card-foot strong { margin-left: 3px; color: #c2c7b8; font-weight: 500; overflow-wrap: anywhere; }
.darkchat-card-index { color: #a29172; font: 10px Consolas, monospace; }
.darkchats-page-foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 34px; padding-top: 20px; border-top: 1px solid #30352b; color: #969e8f; font-size: 10px; }
.darkchats-page-foot > span:first-child { color: #b0a38d; font: 600 14px 'Barlow Condensed', sans-serif; letter-spacing: 2px; }
.darkchat-empty { grid-column: 1 / -1; padding: 52px 24px; border: 1px dashed #494b3b; border-radius: 5px; text-align: center; background: #191d1633; }
.darkchat-empty-icon { display: grid; place-items: center; width: 54px; height: 54px; margin: 0 auto 22px; border: 1px solid #59503b; color: var(--dc-accent); background: #282b20; }
.darkchat-empty .darkchats-eyebrow { justify-content: center; margin-bottom: 12px; }
.darkchat-empty h3 { margin: 0; font: 600 32px 'Barlow Condensed', sans-serif; }
.darkchat-empty p:not(.darkchats-eyebrow) { max-width: 360px; margin: 12px auto 22px; color: var(--dc-muted); font-size: 13px; line-height: 1.7; }

/* Editing uses the same grouping as the overview. */
.darkchat-dialog { --dc-accent: #cfb998; width: min(570px, calc(100% - 28px)); max-height: 90vh; max-height: 90dvh; overflow: auto; border-color: #625841; border-radius: 5px; background: #181c17; box-shadow: 0 30px 90px #0009; }
.darkchat-dialog form { padding: 30px; }
.darkchat-dialog .modal-head { padding-bottom: 22px; border-bottom: 1px solid #393e32; margin-bottom: 24px; }
.darkchat-dialog .darkchats-eyebrow { margin-bottom: 8px; font-size: 9px; }
.darkchat-dialog h2 { font-size: 38px; }
.darkchat-dialog input, .darkchat-dialog textarea { background: #10140f; border-color: #404535; }
.darkchat-dialog input:focus, .darkchat-dialog textarea:focus { border-color: #cfb998; }
.darkchat-access-editor { min-width: 0; padding: 14px 18px 0; margin: 24px 0; border: 1px solid #64573e; border-radius: 3px; }
.darkchat-access-editor legend { padding: 0 8px; color: #cfb998; font-size: 11px; font-weight: 600; }
.darkchat-access-editor legend svg { display: inline-block; width: 14px; height: 14px; margin-right: 7px; vertical-align: middle; }
.darkchat-access-editor > p { margin: 0; color: #a1a89e; font-size: 11px; line-height: 1.6; }
.darkchat-access-editor input { font-family: Consolas, 'Courier New', monospace; }
.darkchat-access-editor input::placeholder { font-family: Inter, sans-serif; font-size: 11px; }
.darkchat-dialog .modal-actions { padding-top: 22px; border-top: 1px solid #393e32; flex-wrap: wrap; }
.darkchat-dialog .modal-actions button { min-height: 44px; font-size: 11px; }
.darkchat-dialog .danger-btn { margin-right: auto; padding: 10px 12px; }

/* Existing links between laundering profiles and Darkchat contacts. */
.laundering-darkchat { margin-top: 10px; color: #efbd51; font-size: 12px; }
.laundering-contact-editor { display: flex; gap: 8px; margin: 14px 0; }
.laundering-contact-editor input { margin: 0; }
.laundering-contact-editor button { white-space: nowrap; }

@keyframes darkchat-enter { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .darkchat-card { animation: none; } .darkchats-view *, .darkchat-dialog * { transition: none; } }
@media (max-width: 1100px) {
  .darkchats-section-number { display: none; }
  .darkchats-toolbar { gap: 16px; }
}
@media (max-width: 850px) {
  .darkchats-view { padding-top: 30px; }
  .darkchats-heading h1 { font-size: 64px; }
  .darkchats-emblem { display: none; }
  .darkchats-head { align-items: flex-end; gap: 20px; }
  .darkchats-toolbar { flex-wrap: wrap; padding-top: 25px; }
  .darkchat-search { width: 100%; }
  .darkchats-list-caption { flex-wrap: wrap; gap: 5px; }
}
@media (max-width: 600px) {
  .darkchats-view { padding: 26px 14px 22px; }
  .darkchats-head { align-items: flex-start; flex-direction: column; padding-bottom: 26px; }
  .darkchats-eyebrow { font-size: 8px; letter-spacing: 1px; gap: 7px; margin-bottom: 17px; }
  .darkchats-heading h1 { font-size: clamp(32px, 10.4vw, 60px); letter-spacing: -.5px; }
  .darkchats-intro { font-size: 11px; margin-top: 14px; }
  .darkchats-head-aside, .darkchats-head-aside .darkchat-primary { width: 100%; }
  .darkchats-directory-title { gap: 8px; }
  .darkchats-directory-title h2 { font-size: 23px; }
  .darkchat-card-head { padding: 17px 13px; gap: 8px; }
  .darkchat-contact-icon { width: 29px; height: 35px; }
  .darkchat-contact h3 { font-size: 24px; }
  .darkchat-edit { width: 28px; }
  .darkchat-access { margin: 0 12px; }
  .darkchat-access-heading { padding: 10px; font-size: 8px; gap: 6px; letter-spacing: .5px; }
  .darkchat-credentials > div { padding: 12px 10px; }
  .darkchat-credentials dd { font-size: 16px; }
  .darkchat-purpose { padding: 18px 13px; }
  .darkchat-card-foot { padding: 12px 13px; }
  .darkchats-page-foot { align-items: flex-start; flex-direction: column; gap: 7px; }
  .darkchat-dialog form { padding: 22px 18px; }
  .darkchat-dialog .modal-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .darkchat-dialog .danger-btn { margin: 0; grid-column: 1 / -1; }
  .darkchat-empty { padding: 32px 14px; }
  .darkchat-empty h3 { font-size: 26px; }
}
