/* DETALJRUTANS FOT PÅ DATORN — datorrundan AT-74, 2026-10-15 (designtråd 4).
   Patrik: "headern har mer kundens uppgifter, footern har företagets" (som i läsarna) och
   "lägga pills på samma rad som kopiera mailmall ... mailmalls-listan vid ikonerna till höger".
   detail-ui.js renderMobileDetailFooterPills ritar nu fotraden även på datorn ⇒ huvudets
   .detail-pill-meta döljs här. Pillraden läggs på mallraden (absolut, ingen extra höjd —
   läsfönstret ska inte krympa på 1366×768), mallväljaren blir en ikonknapp längst till höger.
   Gäller Mina ärenden, Inkorgen, Garaget (sidfoten) och båda läsarna (admin + kund). */
@media (min-width: 769px) {
  html body .detail-container:has(.mobile-detail-footer-pills .pill) .detail-pills-container .detail-pill-meta { display: none !important; }
  html body #archive-detail .mobile-detail-footer-pills ~ .desktop-footer-close-pill { display: none !important; }
  html body #archive-detail .mobile-detail-footer-pills { padding: 0 !important; flex: 0 1 auto; min-width: 0; }
  html body .mobile-detail-footer-pills .pill { font-size: 11px; }
  html body :is(#my-ticket-detail, #inbox-detail, #customer-reader-modal, #atlas-reader-modal) .atlas-mobile-reply-footer { position: relative; --fp-left: 32px; --fp-right: 158px; }
  html body :is(#customer-reader-modal, #atlas-reader-modal) .atlas-mobile-reply-footer { --fp-left: 14px; --fp-right: 128px; }
  html body :is(#my-ticket-detail, #inbox-detail, #customer-reader-modal, #atlas-reader-modal) .atlas-mobile-reply-footer > .mobile-detail-footer-pills {
    position: absolute !important; left: var(--fp-left); bottom: 13px; z-index: 1;
    max-width: calc(100% - var(--fp-left) - var(--fp-right)) !important; padding: 0 !important;
  }
  html body .atlas-mobile-reply-footer div:has(> div > .atlas-tmpl-trigger) { justify-content: flex-end !important; }
  html body .atlas-mobile-reply-footer div:has(> .atlas-tmpl-trigger) { order: 2; }
  html body :is(#my-ticket-detail, #inbox-detail, #customer-reader-modal, #atlas-reader-modal) .atlas-mobile-reply-footer .atlas-tmpl-trigger {
    width: 32px !important; min-width: 0 !important; flex: 0 0 32px !important; padding: 0 !important; justify-content: center !important;
    border: 0 !important; background: transparent !important; color: var(--detail-accent, var(--accent-primary)) !important;
  }
  html body :is(#my-ticket-detail, #inbox-detail, #customer-reader-modal, #atlas-reader-modal) .atlas-mobile-reply-footer .atlas-tmpl-trigger:is(:hover, .open) {
    background: color-mix(in srgb, var(--detail-accent, var(--accent-primary)) 12%, transparent) !important;
  }
  html body :is(#my-ticket-detail, #inbox-detail, #customer-reader-modal, #atlas-reader-modal) .atlas-mobile-reply-footer .atlas-tmpl-trigger > span,
  html body :is(#my-ticket-detail, #inbox-detail, #customer-reader-modal, #atlas-reader-modal) .atlas-mobile-reply-footer .atlas-tmpl-trigger .atlas-tmpl-chevron { display: none !important; }
  html body :is(#my-ticket-detail, #inbox-detail, #customer-reader-modal, #atlas-reader-modal) .atlas-mobile-reply-footer .atlas-tmpl-trigger > svg:first-child { width: 18px; height: 18px; }
}
