/* Kom igång-guiden: uppfylld kravrad = 1,5px ring i ready-färgen (#139, onboarding-status.css:141) — hård mörkgrön linje runt varje rad.
   Identiteten (ring + ton + bock + bottenlinje) behålls, ringen tonas ner till 45 % (Patrik: inga hårda kanter). */
@media (min-width: 769px) {
  html body .atlas-requirement-row.atlas-requirement-row[data-satisfied="true"] {
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--atlas-onboarding-ready, #31a36d) 45%, transparent) !important;
  }
}

/* "Tillbaka till Kom igång" (onboarding-status.css:309): mörk platta med tung skugga som låg över panelkanten
   (Patrik 10-15: "kan man göra den snyggare … placerad i headern precis under ikonerna till höger"). Nu en mjuk accentpill med
   bakåtpil i headerns nedre högra hörn (ikonerna slutar y≈49, headern 103). Mobilen oförändrad. */
@media (min-width: 769px) {
  html body .atlas-onboarding-return { top: 62px !important; right: 24px !important; }
  html body .atlas-onboarding-return > button {
    display: inline-flex !important; align-items: center !important; gap: 6px !important;
    padding: 5px 13px 5px 10px !important; border-radius: 999px !important;
    font-size: 12px !important; font-weight: 600 !important; line-height: 1.2 !important;
    color: var(--accent-primary) !important;
    background: color-mix(in srgb, var(--accent-primary) 12%, var(--bg-dark-secondary, transparent)) !important;
    border: 1px solid color-mix(in srgb, var(--accent-primary) 26%, transparent) !important;
    box-shadow: none !important; transition: background-color .15s ease, transform .15s ease;
  }
  html body .atlas-onboarding-return > button::before {
    content: ""; width: 14px; height: 14px; flex: none; background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 19-7-7 7-7'/%3E%3Cpath d='M19 12H5'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m12 19-7-7 7-7'/%3E%3Cpath d='M19 12H5'/%3E%3C/svg%3E") center / contain no-repeat;
  }
  html body .atlas-onboarding-return > button:hover {
    background: color-mix(in srgb, var(--accent-primary) 20%, var(--bg-dark-secondary, transparent)) !important; transform: translateY(-1px);
  }
}

/* Raden som en Kom igång-knapp leder till (onboarding-guide.js focusFieldTarget, .atlas-onboarding-target i 2,6 s):
   en guldring som pulserar två gånger — samma guld som nyckelfälten, så det syns vilket fält onboardingen pekar på. */
@media (min-width: 769px) {
  @keyframes atlas-onboarding-target-pulse {
    0%, 100% { box-shadow: 0 0 0 0 color-mix(in srgb, #c9a227 0%, transparent); }
    35% { box-shadow: 0 0 0 6px color-mix(in srgb, #c9a227 38%, transparent); }
  }
  html body #view-admin .admin-config-row.atlas-onboarding-target {
    animation: atlas-onboarding-target-pulse 1.2s ease-in-out 2 !important;
    outline: 2px solid color-mix(in srgb, #c9a227 70%, transparent) !important; outline-offset: 2px;
  }
}
