/* Kontakt er en lille scene i arbejdsområdet. Nye beskeder flytter hverken fokus eller skrivefelt. */
.contact-stage { margin:16px 0 0; padding:13px 18px 12px; border:1px solid #d5d9cc; border-radius:7px; background:linear-gradient(115deg,#fffefa,#f0f1e7); overflow:hidden; }
.contact-heading { display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.contact-heading .eyebrow { display:flex; align-items:center; gap:7px; font-size:9px; letter-spacing:1.1px; color:#6a715e; }
.contact-heading svg { width:15px; height:15px; }
.contact-heading time { margin-left:auto; color:var(--muted); font-size:9px; }
.contact-read { border:0; border-left:1px solid #d5d9cc; padding:0 0 0 12px; background:none; color:var(--green); font-size:10px; font-weight:600; }
.contact-route { display:grid; grid-template-columns:minmax(0,1fr) minmax(80px,150px) minmax(0,1fr); align-items:center; gap:15px; }
.contact-person { display:flex; align-items:center; gap:11px; min-width:0; }
.contact-person.recipient { justify-content:flex-end; }
.contact-identity { min-width:0; }
.contact-identity strong { display:block; font-size:12px; font-weight:600; line-height:1.4; overflow-wrap:anywhere; }
.contact-identity small { display:block; color:var(--muted); font-size:9px; line-height:1.5; margin-top:3px; }
.contact-avatar { --person-ink:#62705d; --person-paper:#e8ebdf; position:relative; display:grid; place-items:center; width:41px; height:41px; flex:0 0 41px; border:1px solid #ffffffc0; border-radius:50%; background:var(--person-paper); color:var(--person-ink); font:600 15px var(--sans); box-shadow:0 0 0 2px var(--person-paper); }
.contact-avatar[data-role=journalist] { --person-ink:#365d8c; --person-paper:#e1e9f2; }
.contact-avatar[data-role=press] { --person-ink:#8a6024; --person-paper:#f0e5cf; }
.contact-avatar[data-role=director] { --person-ink:#244d3b; --person-paper:#dfe9de; }
.contact-avatar[data-role=host] { --person-ink:#5f536b; --person-paper:#e9e3ee; }
.contact-avatar::before,.contact-avatar::after { content:""; position:absolute; inset:-4px; border:1px solid var(--person-ink); border-radius:50%; opacity:0; pointer-events:none; }
.contact-wire { position:relative; height:36px; }
.contact-wire::before { content:""; position:absolute; top:50%; left:0; right:0; height:1px; background:repeating-linear-gradient(90deg,#a3b09a 0 4px,transparent 4px 9px); }
.contact-wire::after { content:""; position:absolute; top:calc(50% - 3px); right:0; width:6px; height:6px; border-top:1px solid #7d9272; border-right:1px solid #7d9272; transform:rotate(45deg); }
.contact-packet { position:absolute; top:50%; left:50%; display:grid; place-items:center; width:33px; height:29px; border:1px solid #c6ad73; border-radius:5px; background:#fff6df; color:#88652e; box-shadow:0 3px 7px #18352a10; transform:translate(-50%,-50%) rotate(-5deg); z-index:1; }
.contact-packet svg { width:22px; height:22px; }
.contact-subject { font-size:10px; line-height:1.5; color:#6c7366; margin-top:10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.contact-stage.is-active { border-color:#b6c4a8; }
.contact-stage.is-active .contact-heading .eyebrow { color:var(--green); }
.contact-stage.is-active[data-channel=mail] .contact-packet { animation:mail-flight 2.5s cubic-bezier(.35,.02,.22,1) both; }
.contact-stage.is-active .recipient .contact-avatar::before { animation:contact-ring 1.1s ease-out 1.8s 2; }
.contact-stage[data-channel=phone] .contact-packet { background:#e5ecdf; color:#244d3b; border-color:#adc19f; border-radius:50%; width:32px; height:32px; transform:translate(-50%,-50%); }
.contact-stage.is-active[data-channel=phone] .contact-packet svg { animation:handset-ring .5s ease-in-out 6; }
.contact-stage.is-active[data-channel=phone] .recipient .contact-avatar::before { animation:contact-ring 1.1s ease-out 3; }
.contact-stage.is-active[data-channel=phone] .recipient .contact-avatar::after { animation:contact-ring 1.1s ease-out .35s 3; }
.contact-stage.is-empty { display:flex; align-items:center; gap:12px; padding-top:15px; padding-bottom:15px; }
.contact-idle-icon { width:33px; height:33px; display:grid; place-items:center; flex-shrink:0; border:1px solid #d4dbc9; border-radius:50%; color:#728065; }
.contact-idle-icon svg { width:19px; height:19px; }
.contact-stage.is-empty strong { display:block; font-size:11px; font-weight:600; }
.contact-stage.is-empty p { font-size:10px; line-height:1.55; color:var(--muted); margin-top:2px; }
.contact-channel { display:flex; align-items:center; flex-wrap:wrap; gap:8px; padding:0; border:0; margin:17px 0 15px; min-width:0; }
.contact-channel legend { padding:0 0 8px; font-size:11px; font-weight:600; }
.channel-option { display:flex; align-items:center; gap:7px; position:relative; margin:0; padding:9px 14px; background:#fffefa; border:1px solid #cdd2c7; border-radius:4px; font-size:11px; font-weight:500; cursor:pointer; }
.channel-option input { width:14px; height:14px; min-height:0; margin:0; padding:0; accent-color:var(--green); }
.channel-option svg { width:18px; height:18px; }
.channel-option:has(input:checked) { background:#e3eadd; border-color:#94a788; color:var(--green); }
.channel-option:has(input:focus-visible) { outline:3px solid var(--gold); outline-offset:3px; }
.channel-option input:focus-visible { outline:none; }
.contact-channel .form-hint { width:100%; margin:2px 0 0; }
.item-channel { display:inline-flex; align-items:center; gap:4px; color:#7c622e; }
.item-channel svg { width:13px; height:13px; }
.item-channel[data-channel=phone] { color:#365d42; }
.feed-card.contact-highlight { border-color:#8a9e78; box-shadow:0 0 0 2px #becdaf80; }
.contact-announcement { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
@keyframes mail-flight { 0% { left:0; opacity:0; transform:translate(-50%,-50%) rotate(-14deg); } 12% { opacity:1; } 55% { transform:translate(-50%,-75%) rotate(4deg); } 85%,100% { left:100%; opacity:1; transform:translate(-50%,-50%) rotate(0deg); } }
@keyframes contact-ring { from { transform:scale(.9); opacity:.5; } to { transform:scale(1.6); opacity:0; } }
@keyframes handset-ring { 0%,100% { transform:rotate(0); } 20% { transform:rotate(-17deg); } 45% { transform:rotate(14deg); } 70% { transform:rotate(-10deg); } }
@media (max-width:620px) {
  .contact-stage { padding:12px; }
  .contact-route { grid-template-columns:minmax(0,1fr) 45px minmax(0,1fr); gap:9px; }
  .contact-person { gap:7px; align-items:flex-start; }
  .contact-person.recipient { justify-content:flex-start; }
  .contact-avatar { width:30px; height:30px; flex-basis:30px; font-size:11px; }
  .contact-identity strong { font-size:10px; }
  .contact-identity small { font-size:8px; }
  .contact-packet { width:27px; height:25px; }
  .contact-packet svg { width:18px; height:18px; }
  .contact-heading .eyebrow { font-size:8px; letter-spacing:.7px; }
  .contact-read { font-size:9px; padding-left:9px; }
  .contact-subject { font-size:9px; }
}
@media (prefers-reduced-motion:reduce) {
  .contact-stage.is-active .contact-packet,.contact-stage.is-active .contact-packet svg,.contact-stage.is-active .contact-avatar::before,.contact-stage.is-active .contact-avatar::after { animation:none !important; }
}
