/* Datorrundan 10-15 (designtråd 2): konfigurationsraderna i Admin på datorn. */

/* "Redigeras"-märket (admin-sections-desktop.css) i orange i stället för temats accent:
   Patrik 10-15: "grön känns lite som att allt är sparat och klart" ⇒ varm ton = pågår, ej sparat.
   Skiljbar från nyckelfältens guld (#c9a227); texten blandas mot temats textfärg så den läses i både ljusa och mörka teman. */
@media (min-width: 769px) {
  :root {
    --edit-badge-fg: color-mix(in srgb, #e8590c 78%, var(--text-primary, #1d1d1f));
    --edit-badge-bg: color-mix(in srgb, #f76707 16%, transparent);
  }
}

/* Reglagerad med eget omslag (.admin-config-toggle-wrap, t.ex. "Säker anslutning SSL/465"): omslaget har width:100%
   och tryckte etiketten till 140 px ⇒ två rader (Patrik 10-15: "behöver inte ta två rader på desktop"). */
@media (min-width: 769px) {
  html body #view-admin .admin-config-row:has(> .admin-config-toggle-wrap) > label {
    flex: 0 0 auto !important; white-space: nowrap !important;
  }
}

/* Upplåst nyckelfält: accentkanten (grön i ljusa teman) stod bredvid guldlisten ⇒ dubbelstreck
   (Patrik 10-15: "nyckelfälten som låses upp får lite konstigt grönt streck"). Nyckelfältet behåller guldet även upplåst;
   att det är upplåst syns på ringen och märket "Redigeras". */
@media (min-width: 769px) {
  html body #view-admin .admin-config-row.admin-config-row.tenant-required-row.tenant-required-row:has(.admin-lock-btn.unlocked) {
    border-color: color-mix(in srgb, #c9a227 60%, transparent) !important;
    background: color-mix(in srgb, #c9a227 11%, transparent) !important;
    box-shadow: inset 3px 0 0 color-mix(in srgb, #c9a227 75%, transparent), 0 0 0 3px color-mix(in srgb, #c9a227 18%, transparent) !important;
  }
}

/* Samma rad: lås/avbryt/spara låg tätare (gap 6px, inline i admin-config.js) än i textfältsraderna (12px) ⇒ låset ur linje. */
@media (min-width: 769px) {
  html body #view-admin .admin-config-row > .admin-config-toggle-wrap > span:has(> .admin-lock-btn) {
    gap: 12px !important;
  }
}

/* Spamlistan (Patrik 10-15: "lägg till … svg knapp", "ta bort rektangeln runt X-ikonerna"): ✕ utan ram, mjuk röd platta bara vid hover. */
@media (min-width: 769px) {
  html body #view-admin .spam-blocklist-row .spam-blocklist-delete:hover {
    background: color-mix(in srgb, var(--danger-text, #ff3b30) 12%, transparent) !important;
  }
  html body #view-admin .spam-blocklist-row .spam-blocklist-kind svg { width: 15px; height: 15px; }
}
@media (min-width: 769px) {
  html body #view-admin .spam-add-btn.admin-config-icon-btn { color: var(--accent-primary) !important; }
}

/* Fällbara rutor i Systemkonfiguration ("Inkommande konto skiljer sig?", "Avancerat: reserv …"): hård mörk kant ⇒ mjuk platta i temats ton. */
@media (min-width: 769px) {
  html body #view-admin .detail-body details[style] {
    border: 1px solid color-mix(in srgb, var(--accent-primary) 16%, transparent) !important;
    background: color-mix(in srgb, var(--accent-primary) 5%, transparent) !important;
    border-radius: 12px !important;
  }
}

/* Drift & Säkerhet → Uppladdade filer (Patrik 10-15: "om den går snygga till lite med"): rubriken som mjuk klickbar list,
   filraderna som mjuka plattor utan hård kant, ladda ner/radera som ikoner utan rektangel (som spamlistan), verktygsraden mjuk. */
@media (min-width: 769px) {
  html body #view-admin .files-section-toggle.files-section-toggle {
    padding: 10px 14px !important; border-radius: 12px !important;
    background: color-mix(in srgb, var(--accent-primary) 6%, transparent) !important;
    border: 1px solid color-mix(in srgb, var(--accent-primary) 16%, transparent) !important;
    transition: background-color .15s ease;
  }
  html body #view-admin .files-section-toggle.files-section-toggle:hover {
    background: color-mix(in srgb, var(--accent-primary) 11%, transparent) !important;
  }
  html body #view-admin .files-section-toggle h4 svg { width: 15px; height: 15px; }
  html body #view-admin #files-list > div {
    border-radius: 10px !important;
    background: color-mix(in srgb, var(--accent-primary) 5%, transparent) !important;
    border: 1px solid color-mix(in srgb, var(--accent-primary) 12%, transparent) !important;
  }
  html body #view-admin #files-list > div > a[download],
  html body #view-admin #files-list > div > button {
    width: 28px !important; height: 28px !important; padding: 0 !important; justify-content: center !important;
    border: 0 !important; border-radius: 999px !important; background: transparent !important;
  }
  html body #view-admin #files-list > div > a[download] { color: var(--accent-primary) !important; }
  html body #view-admin #files-list > div > a[download]:hover {
    background: color-mix(in srgb, var(--accent-primary) 14%, transparent) !important;
  }
  html body #view-admin #files-list > div > button:hover {
    background: color-mix(in srgb, var(--danger-text, #ff3b30) 12%, transparent) !important;
  }
  html body #view-admin #files-search,
  html body #view-admin #files-download-all {
    border-radius: 999px !important;
    background: color-mix(in srgb, var(--accent-primary) 6%, transparent) !important;
    border: 1px solid color-mix(in srgb, var(--accent-primary) 18%, transparent) !important;
  }
  html body #view-admin #files-delete-all {
    border-radius: 999px !important;
    background: color-mix(in srgb, var(--danger-text, #ff3b30) 8%, transparent) !important;
    border: 1px solid color-mix(in srgb, var(--danger-text, #ff3b30) 22%, transparent) !important;
  }
}

@media (min-width: 769px) {
  /* Ord & begrepp m.fl.: raden har ingen <label> utan div-etikett ⇒ "Redigeras" efter etikettens första rad (Patrik 10-15, enhetligt med Drift/E-post). */
  html body #view-admin .admin-config-row:has(> .admin-lock-btn.unlocked) > div:first-child:not(label) > div:first-child::after {
    content: "Redigeras"; display: inline-block; margin-left: 8px; padding: 1px 8px; border-radius: 999px; vertical-align: 1px;
    font-size: 10px; font-weight: 600; letter-spacing: .2px; text-transform: none;
    color: var(--edit-badge-fg); background: var(--edit-badge-bg);
  }
  /* "Ett tomt fält betyder …" (.kb-guide-cta): mjuk accentplatta utan hård ram — temat gav mörk 1px-kant. */
  html body #view-admin #admin-detail-content .kb-guide-cta.kb-guide-cta {
    border: 0 !important; border-radius: 14px !important;
    background: color-mix(in srgb, var(--accent-primary) 7%, transparent) !important;
    box-shadow: inset 3px 0 0 color-mix(in srgb, var(--accent-primary) 45%, transparent) !important;
  }
}