/* LORE V2 - SUPERADMIN - FAKTURALEVERANS - VISUAL PROPOSAL 3
   Direction: saturated, vivid, warm, high-contrast. No pastel identity.
   Readiness colours remain owned by shared Lore status CSS. */

body:has(#idTestRecipient):has(#idExpires){
  --idv-ink:#0b1733;
  --idv-muted:#394969;
  --idv-blue:#0b5cff;
  --idv-indigo:#3f36d6;
  --idv-violet:#7a2fd0;
  --idv-magenta:#d42a7b;
  --idv-teal:#008f86;
  --idv-cyan:#00a9c7;
  --idv-gold:#ffb703;
  --idv-orange:#ff7a00;
  --idv-coral:#e94755;
  --idv-line:#b7c6e0;
  --idv-shadow:0 18px 42px rgba(23,35,79,.20),0 4px 12px rgba(23,35,79,.10);
}

/* Exact Fakturaleverans page wrapper: idSave is a direct child in the current renderer */
body:has(#idTestRecipient):has(#idExpires) div:has(> #idSave){
  box-sizing:border-box;
  max-width:1180px !important;
  margin:0 auto !important;
  padding:22px !important;
  border:1px solid #8da7d6 !important;
  border-radius:22px !important;
  color:var(--idv-ink) !important;
  background:
    radial-gradient(circle at 0 0,rgba(255,183,3,.56),transparent 26%),
    radial-gradient(circle at 100% 8%,rgba(212,42,123,.40),transparent 29%),
    radial-gradient(circle at 80% 100%,rgba(0,169,199,.34),transparent 31%),
    linear-gradient(135deg,#b9cbff 0%,#d4b9ff 39%,#ffc0ac 74%,#ffe06f 100%) !important;
  box-shadow:0 18px 46px rgba(29,42,88,.18) !important;
}

/* Main title/header */
body:has(#idTestRecipient) div:has(> #idSave) > div:first-child{
  position:relative;
  overflow:hidden;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:16px !important;
  margin:0 0 18px !important;
  padding:22px 22px !important;
  border:1px solid rgba(255,255,255,.28) !important;
  border-radius:18px !important;
  background:linear-gradient(112deg,#052d7e 0%,#174fcb 34%,#6f30c7 67%,#cf2f78 100%) !important;
  box-shadow:0 15px 30px rgba(23,34,91,.30),inset 0 1px 0 rgba(255,255,255,.20) !important;
}
body:has(#idTestRecipient) div:has(> #idSave) > div:first-child::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:5px;
  background:linear-gradient(90deg,#ffbd00 0%,#ff6d00 27%,#ff2d82 53%,#8f32e6 77%,#00c2d7 100%);
}
body:has(#idTestRecipient) div:has(> #idSave) > div:first-child h2{
  margin:0 !important;
  color:#fff !important;
  font-size:32px !important;
  line-height:1.08 !important;
  font-weight:950 !important;
  letter-spacing:-.03em !important;
  text-shadow:0 2px 9px rgba(3,16,55,.34);
}
body:has(#idTestRecipient) div:has(> #idSave) > div:first-child h2 + div{
  margin-top:6px !important;
  color:#fff !important;
  opacity:.94 !important;
  font-weight:700 !important;
}

/* Header buttons */
body:has(#idTestRecipient) #idBack,
body:has(#idTestRecipient) #idReload{
  min-width:190px !important;
  min-height:44px !important;
  padding:10px 18px !important;
  border:0 !important;
  border-radius:12px !important;
  font-weight:900 !important;
  box-shadow:0 8px 18px rgba(10,23,73,.24) !important;
  transition:transform .14s ease,filter .14s ease,box-shadow .14s ease !important;
}
body:has(#idTestRecipient) #idBack{
  color:#2e2200 !important;
  background:linear-gradient(135deg,#ffd54a 0%,#ffb703 55%,#ff9700 100%) !important;
}
body:has(#idTestRecipient) #idReload{
  color:#fff !important;
  background:linear-gradient(135deg,#00a9c7 0%,#0b78e3 48%,#3d46d8 100%) !important;
}
body:has(#idTestRecipient) :is(#idBack,#idReload):hover{
  transform:translateY(-2px);
  filter:saturate(1.14) brightness(1.04);
  box-shadow:0 11px 23px rgba(10,23,73,.30) !important;
}

/* Every functional card */
body:has(#idTestRecipient) div:has(> #idSave) > .sa-box{
  position:relative;
  overflow:hidden;
  margin:16px 0 !important;
  padding:20px !important;
  border-radius:17px !important;
  box-shadow:var(--idv-shadow) !important;
}

/* SMS */
body:has(#idTestRecipient) .sa-box:has(#idEnabled){
  border:2px solid #4338ca !important;
  background:linear-gradient(135deg,#dfe6ff 0%,#e7dcff 55%,#f7d7ff 100%) !important;
}
body:has(#idTestRecipient) .sa-box:has(#idEnabled) > h3{
  margin:-20px -20px 18px !important;
  padding:15px 18px !important;
  color:#fff !important;
  background:linear-gradient(100deg,#0758d6 0%,#3f36d6 46%,#832bd0 100%) !important;
  font-size:23px !important;
  font-weight:950 !important;
  letter-spacing:-.015em !important;
  box-shadow:0 6px 16px rgba(47,43,166,.20);
}
body:has(#idTestRecipient) .sa-box:has(#idEnabled) > h3::before{
  content:"SMS";
  display:inline-block;
  margin-right:11px;
  padding:5px 10px;
  border-radius:999px;
  color:#0e2a62;
  background:#63e7ff;
  font-size:11px;
  font-weight:950;
  letter-spacing:.06em;
  vertical-align:3px;
}

/* Enabled is an active setting, not readiness -> blue/cyan, never green */
body:has(#idEnabled) label:has(#idEnabled){
  display:flex !important;
  align-items:center !important;
  gap:11px !important;
  width:fit-content !important;
  max-width:100% !important;
  margin:10px 0 16px !important;
  padding:11px 15px !important;
  border:1px solid #00b6d7 !important;
  border-radius:12px !important;
  color:#fff !important;
  background:linear-gradient(135deg,#006cff 0%,#007cdd 43%,#00a9c7 100%) !important;
  font-weight:900 !important;
  box-shadow:0 8px 18px rgba(0,95,201,.24) !important;
}
body:has(#idEnabled) #idEnabled{
  width:20px !important;
  height:20px !important;
  margin:0 !important;
  accent-color:#fff !important;
}

/* Secure link */
body:has(#idExpires) .sa-box:has(#idExpires){
  border:2px solid #008f86 !important;
  background:linear-gradient(135deg,#c9fff5 0%,#d7ffe8 51%,#ffe69a 100%) !important;
}
body:has(#idExpires) .sa-box:has(#idExpires) > h3{
  margin:-20px -20px 18px !important;
  padding:15px 18px !important;
  color:#fff !important;
  background:linear-gradient(100deg,#007f79 0%,#00a47c 48%,#d49b00 100%) !important;
  font-size:23px !important;
  font-weight:950 !important;
  letter-spacing:-.015em !important;
  box-shadow:0 6px 16px rgba(0,121,109,.18);
}
body:has(#idExpires) .sa-box:has(#idExpires) > h3::before{
  content:"LÄNK";
  display:inline-block;
  margin-right:11px;
  padding:5px 10px;
  border-radius:999px;
  color:#063c37;
  background:#6fffe5;
  font-size:11px;
  font-weight:950;
  letter-spacing:.06em;
  vertical-align:3px;
}

/* Runtime is informational/operational identity, not readiness */
body:has(#idSmsSenders) .sa-box:has(#idSmsSenders){
  border:2px solid #d53869 !important;
  background:linear-gradient(135deg,#ffd7d5 0%,#ffd1e7 55%,#efc8ff 100%) !important;
}
body:has(#idSmsSenders) .sa-box:has(#idSmsSenders) > h3{
  margin:-20px -20px 18px !important;
  padding:15px 18px !important;
  color:#fff !important;
  background:linear-gradient(100deg,#e3454f 0%,#d42a7b 50%,#8a2db8 100%) !important;
  font-size:23px !important;
  font-weight:950 !important;
  letter-spacing:-.015em !important;
  box-shadow:0 6px 16px rgba(175,35,103,.20);
}
body:has(#idSmsSenders) .sa-box:has(#idSmsSenders) > h3::before{
  content:"DRIFT";
  display:inline-block;
  margin-right:11px;
  padding:5px 10px;
  border-radius:999px;
  color:#64132d;
  background:#ff9dbb;
  font-size:11px;
  font-weight:950;
  letter-spacing:.06em;
  vertical-align:3px;
}

/* Field surfaces */
body:has(#idTestRecipient)
label:has(#idTestRecipient),
body:has(#idTemplate)
label:has(#idTemplate),
body:has(#idSmsMaxChars)
label:has(#idSmsMaxChars),
body:has(#idExpires)
label:has(#idExpires),
body:has(#idMaxUses)
label:has(#idMaxUses){
  display:block !important;
  margin:10px 0 !important;
  padding:11px 12px !important;
  border:1px solid rgba(54,76,126,.20) !important;
  border-radius:12px !important;
  color:var(--idv-ink) !important;
  background:rgba(255,255,255,.82) !important;
  font-weight:850 !important;
  box-shadow:0 4px 10px rgba(35,48,86,.07) !important;
}

/* Inputs stay clean white; section identity comes from the card, not beige fields */
body:has(#idTestRecipient)
:is(#idTestRecipient,#idTemplate,#idSmsMaxChars,#idExpires,#idMaxUses){
  box-sizing:border-box !important;
  margin-top:7px !important;
  padding:10px 12px !important;
  border:2px solid #8eb0e8 !important;
  border-radius:10px !important;
  outline:none !important;
  color:#0b1733 !important;
  background:#fff !important;
  font:inherit !important;
  font-weight:700 !important;
  box-shadow:inset 0 1px 2px rgba(17,38,77,.05),0 3px 8px rgba(17,38,77,.06) !important;
}
body:has(#idTestRecipient) #idTestRecipient{width:100% !important;max-width:620px !important;}
body:has(#idTemplate) #idTemplate{width:100% !important;min-height:128px !important;resize:vertical !important;line-height:1.5 !important;}
body:has(#idSmsMaxChars) :is(#idSmsMaxChars,#idExpires,#idMaxUses),
body:has(#idExpires) :is(#idSmsMaxChars,#idExpires,#idMaxUses){width:min(190px,100%) !important;}
body:has(#idTestRecipient)
:is(#idTestRecipient,#idTemplate,#idSmsMaxChars,#idExpires,#idMaxUses):focus{
  border-color:#1858e4 !important;
  box-shadow:0 0 0 4px rgba(24,88,228,.18),0 7px 17px rgba(24,88,228,.13) !important;
}

/* Helper text + template variable chips */
body:has(#idTemplate) .sa-box:has(#idEnabled) code{
  display:inline-block;
  padding:3px 7px;
  border-radius:7px;
  color:#fff !important;
  background:linear-gradient(135deg,#5f36d9,#9a2bc3) !important;
  font-weight:850 !important;
}
body:has(#idTemplate) .sa-box:has(#idEnabled) > div[style*="opacity"]{
  padding:9px 11px !important;
  border-radius:10px !important;
  color:#263657 !important;
  background:rgba(255,255,255,.72) !important;
  opacity:1 !important;
  font-weight:650 !important;
}

/* Runtime profile boxes */
body:has(#idSmsSenders) .sa-box:has(#idSmsSenders) .sa-box{
  border:1px solid #c3a0cf !important;
  border-radius:11px !important;
  background:#fff !important;
  box-shadow:0 5px 12px rgba(90,35,107,.08) !important;
}

/* Module action buttons */
body:has(#idSmsSenders) #idSmsSenders{
  min-height:42px !important;
  margin-top:12px !important;
  padding:10px 17px !important;
  border:0 !important;
  border-radius:11px !important;
  color:#fff !important;
  background:linear-gradient(135deg,#e13a4b 0%,#d42a7b 55%,#8f2eb8 100%) !important;
  font-weight:900 !important;
  box-shadow:0 8px 18px rgba(180,39,102,.24) !important;
}
body:has(#idSave) #idSave{
  min-height:48px !important;
  margin-top:2px !important;
  padding:11px 22px !important;
  border:0 !important;
  border-radius:12px !important;
  color:#fff !important;
  background:linear-gradient(120deg,#075de3 0%,#3c42d8 45%,#8b2ec2 100%) !important;
  font-size:15px !important;
  font-weight:950 !important;
  box-shadow:0 10px 22px rgba(55,55,181,.28) !important;
}
body:has(#idTestRecipient) :is(#idSmsSenders,#idSave):hover{
  transform:translateY(-2px);
  filter:saturate(1.14) brightness(1.04);
}

/* Shared Lore readiness standard: full relevant field surface, saturated */
body:has(#idTestRecipient) label.lore-status-surface[data-lore-status="red"]{
  color:#581014 !important;
  border:2px solid #d71920 !important;
  background:#ffb3b6 !important;
  box-shadow:0 6px 14px rgba(164,24,35,.16) !important;
}
body:has(#idTestRecipient) label.lore-status-surface[data-lore-status="yellow"]{
  color:#4d3300 !important;
  border:2px solid #d98b00 !important;
  background:#ffda66 !important;
  box-shadow:0 6px 14px rgba(166,104,0,.15) !important;
}
body:has(#idTestRecipient) label.lore-status-surface[data-lore-status="green"]{
  color:#073f27 !important;
  border:2px solid #00834a !important;
  background:#79dfa5 !important;
  box-shadow:0 6px 14px rgba(0,111,62,.15) !important;
}

/* Keyboard focus */
body:has(#idTestRecipient) button:focus-visible,
body:has(#idTestRecipient) input:focus-visible,
body:has(#idTemplate) textarea:focus-visible{
  outline:3px solid #ffb703 !important;
  outline-offset:2px !important;
}

@media (max-width:760px){
  body:has(#idTestRecipient):has(#idExpires) div:has(> #idSave){padding:13px !important;border-radius:16px !important;}
  body:has(#idTestRecipient) div:has(> #idSave) > div:first-child{align-items:stretch !important;flex-direction:column !important;}
  body:has(#idTestRecipient) div:has(> #idSave) > div:first-child > div:last-child{display:grid !important;grid-template-columns:1fr 1fr !important;width:100% !important;}
  body:has(#idTestRecipient) #idBack,
  body:has(#idTestRecipient) #idReload{min-width:0 !important;width:100% !important;}
  body:has(#idTestRecipient) div:has(> #idSave) > .sa-box{padding:16px !important;}
  body:has(#idTestRecipient) .sa-box:has(#idEnabled) > h3,
  body:has(#idExpires) .sa-box:has(#idExpires) > h3,
  body:has(#idSmsSenders) .sa-box:has(#idSmsSenders) > h3{margin:-16px -16px 16px !important;}
  body:has(#idTestRecipient) :is(#idTestRecipient,#idTemplate,#idSmsMaxChars,#idExpires,#idMaxUses){width:100% !important;max-width:none !important;}
}
/* LORE V2 - FAKTURALEVERANS - VISUAL PROPOSAL 3A DARK FRAME START */
.superadmin-panel:has(#idTestRecipient):has(#idExpires){
  background:
    radial-gradient(circle at 50% 0%,rgba(24,58,105,.48) 0%,rgba(5,13,25,.84) 48%,rgba(1,4,9,.96) 100%) !important;
}
.superadmin-panel:has(#idTestRecipient):has(#idExpires) .sa-panel{
  background:
    radial-gradient(circle at 50% 0%,#132d50 0%,#081525 42%,#02070d 100%) !important;
}
.superadmin-panel:has(#idTestRecipient):has(#idExpires) #superadminIndexRoot{
  background:transparent !important;
}
/* LORE V2 - FAKTURALEVERANS - VISUAL PROPOSAL 3A DARK FRAME END */