/* Adminlane: colour tokens for every skinned screen.
 *
 * Each colour is written once as light-dark(light, dark). Which half is used
 * depends on the colour-scheme of the element that uses it:
 *   adl-light → light, adl-dark → dark, adl-auto → follows the system.
 * adl-soft is light, with a grey menu and page under white cards (set further down).
 * adl-dim is dark, in lifted slate greys (also further down).
 * adl-accent-* swaps the blue for another accent colour, in every mode.
 * On screens the skin only frames (other plugins' pages) the scheme is set on
 * the menu and the toolbar alone, so the page itself keeps its own colours.
 */

body.adl {
  --adl-bg:            light-dark(#f4f6fa, #0e131d);
  --adl-surface:       light-dark(#ffffff, #161c29);
  --adl-surface-2:     light-dark(#f8fafc, #1b2232);
  --adl-surface-3:     light-dark(#eef2f7, #222a3c);
  --adl-input:         light-dark(#ffffff, #10151f);
  --adl-border:        light-dark(#e4e8f0, #262f42);
  --adl-border-strong: light-dark(#cfd6e2, #34405a);
  --adl-text:          light-dark(#111827, #e6e9ef);
  --adl-text-2:        light-dark(#374151, #c9cfda);
  --adl-muted:         light-dark(#6b7280, #8f9bb0);
  --adl-control:       light-dark(#9aa3b2, #4b5772);

  --adl-blue:          light-dark(#2563eb, #2f6fdc);
  --adl-blue-h:        light-dark(#1d4ed8, #2563eb);
  --adl-blue-soft:     light-dark(#eaf1ff, rgba(59, 130, 246, .15));
  --adl-link:          light-dark(#2563eb, #8db4ff);
  --adl-link-h:        light-dark(#1d4ed8, #b5cdff);
  --adl-focus:         light-dark(rgba(37, 99, 235, .28), rgba(59, 130, 246, .42));

  --adl-ok:            light-dark(#15803d, #4ade80);
  --adl-ok-line:       light-dark(#16a34a, #22c55e);
  --adl-ok-soft:       light-dark(#ecfdf3, rgba(34, 197, 94, .12));
  --adl-warn:          light-dark(#b45309, #fbbf24);
  --adl-warn-line:     light-dark(#f59e0b, #f59e0b);
  --adl-warn-soft:     light-dark(#fff8eb, rgba(245, 158, 11, .12));
  --adl-bad:           light-dark(#dc2626, #f87171);
  --adl-bad-line:      light-dark(#dc2626, #ef4444);
  --adl-bad-soft:      light-dark(#fef2f2, rgba(239, 68, 68, .12));
  --adl-purple:        light-dark(#7c3aed, #c4b5fd);
  --adl-purple-soft:   light-dark(rgba(124, 58, 237, .1), rgba(167, 139, 250, .14));
  --adl-accent-tint:   #93b4ff; /* the accent, light enough for lines and rings on a dark background */

  /* Menu on the left and the toolbar on top */
  --adl-side-bg:       light-dark(#ffffff, #111722);
  --adl-side-border:   light-dark(#e4e8f0, #1f2737);
  --adl-side-text:     light-dark(#374151, #c3cad7);
  --adl-side-muted:    light-dark(#6b7280, #8792a6);
  --adl-side-hover:    light-dark(#f1f4f9, #1a2131);
  --adl-side-active:   light-dark(#eaf1ff, rgba(59, 130, 246, .16));
  --adl-side-active-t: light-dark(#1d4ed8, #a9c6ff);
  --adl-pop:           light-dark(#ffffff, #1b2232);

  --adl-shadow:    0 1px 2px light-dark(rgba(16, 24, 40, .05), rgba(0, 0, 0, .35)), 0 1px 3px light-dark(rgba(16, 24, 40, .04), rgba(0, 0, 0, 0));
  --adl-shadow-lg: 0 12px 32px -12px light-dark(rgba(16, 24, 40, .28), rgba(0, 0, 0, .7)), 0 2px 6px light-dark(rgba(16, 24, 40, .06), rgba(0, 0, 0, .3));
  --adl-radius: 12px;
  --adl-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, "Helvetica Neue", Arial, sans-serif;
  --adl-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* WordPress' own components (7.0+) pick up the accent colour too */
  --wp-admin-theme-color: var(--adl-blue);
  --wp-admin-theme-color-darker-10: var(--adl-blue-h);
  --wp-admin-theme-color-darker-20: var(--adl-blue-h);
}

/* Soft: between Light and Dark, closer to Light. Three clear levels — a soft grey menu,
   a light grey page and white cards on it — so there is less white overall, but the
   cards still lift off the page. Colours that mean something stay as in Light. */
body.adl.adl-soft {
  --adl-bg:            #eef0f3;
  --adl-surface:       #ffffff;
  --adl-surface-2:     #f7f8fa;
  --adl-surface-3:     #eef1f5;
  --adl-input:         #ffffff;
  --adl-border:        #e2e6ec;
  --adl-border-strong: #cdd4de;
  --adl-text:          #1c2433;
  --adl-text-2:        #354052;
  --adl-muted:         #5f6979;
  --adl-control:       #97a0ae;
  --adl-blue-soft:     #e8effc;
  --adl-side-bg:       #d9dee6;
  --adl-side-border:   #c8cfda;
  --adl-side-text:     #2e394a;
  --adl-side-muted:    #535e70;
  --adl-side-hover:    #cdd4de;
  --adl-side-active:   #c7d6f1;
  --adl-side-active-t: #1a46c4;
  --adl-pop:           #ffffff;
  --adl-shadow:    0 1px 2px rgba(16, 24, 40, .05), 0 1px 3px rgba(16, 24, 40, .04);
  --adl-shadow-lg: 0 12px 32px -12px rgba(16, 24, 40, .28), 0 2px 6px rgba(16, 24, 40, .06);
}

/* Dim: between Soft and Dark, closer to Dark. A dark look in lifted slate greys with gentler
   contrast — the menu a step darker than the page, cards a step lighter. It uses the dark half
   of every light-dark() pair, so colours that mean something (and the accent) stay as in Dark. */
body.adl.adl-dim {
  --adl-bg:            #272f3c;
  --adl-surface:       #303948;
  --adl-surface-2:     #353e4e;
  --adl-surface-3:     #3c4657;
  --adl-input:         #2a3240;
  --adl-border:        #3f4959;
  --adl-border-strong: #4f5a6e;
  --adl-text:          #e1e5ec;
  --adl-text-2:        #c5ccd8;
  --adl-muted:         #9ba5b6;
  --adl-control:       #5f6a80;
  --adl-side-bg:       #212833;
  --adl-side-border:   #2f3846;
  --adl-side-text:     #c8cfdb;
  --adl-side-muted:    #97a1b3;
  --adl-side-hover:    #2c3442;
  --adl-pop:           #364050;
  --adl-shadow:    0 1px 2px rgba(0, 0, 0, .22), 0 1px 3px rgba(0, 0, 0, .08);
  --adl-shadow-lg: 0 12px 32px -12px rgba(0, 0, 0, .55), 0 2px 6px rgba(0, 0, 0, .2);
}

/* Accent colours. Blue is the default (the values at the top). Each of the others sets a few
   inputs, and the shared rule below turns them into the same tokens Blue uses:
   --adl-a / -h      buttons in light (and hover)       --adl-a-d / -dh  buttons in dark
   --adl-a-link / -lh links in light                    --adl-a-tint / -th  links and text in dark
   --adl-a-soft       pale wash in light                --adl-a-mid      base of the washes in dark */
body.adl.adl-accent-violet { --adl-a: #7c3aed; --adl-a-h: #6d28d9; --adl-a-d: #7c4ae0; --adl-a-dh: #6d3fd0; --adl-a-link: #6d28d9; --adl-a-lh: #5b21b6; --adl-a-tint: #c4b5fd; --adl-a-th: #ddd6fe; --adl-a-soft: #f3efff; --adl-a-mid: #8b5cf6; }
body.adl.adl-accent-teal   { --adl-a: #0f766e; --adl-a-h: #115e59; --adl-a-d: #0f857b; --adl-a-dh: #0f766e; --adl-a-link: #0f766e; --adl-a-lh: #115e59; --adl-a-tint: #5eead4; --adl-a-th: #99f6e4; --adl-a-soft: #e7f8f5; --adl-a-mid: #14b8a6; }
body.adl.adl-accent-green  { --adl-a: #15803d; --adl-a-h: #166534; --adl-a-d: #18873f; --adl-a-dh: #15803d; --adl-a-link: #15803d; --adl-a-lh: #166534; --adl-a-tint: #86efac; --adl-a-th: #bbf7d0; --adl-a-soft: #e9f8ee; --adl-a-mid: #22c55e; }
body.adl.adl-accent-orange { --adl-a: #c2410c; --adl-a-h: #9a3412; --adl-a-d: #c8500f; --adl-a-dh: #b8450c; --adl-a-link: #c2410c; --adl-a-lh: #9a3412; --adl-a-tint: #fdba74; --adl-a-th: #fed7aa; --adl-a-soft: #fff1e7; --adl-a-mid: #f97316; }
body.adl.adl-accent-pink   { --adl-a: #db2777; --adl-a-h: #be185d; --adl-a-d: #d6337e; --adl-a-dh: #be185d; --adl-a-link: #be185d; --adl-a-lh: #9d174d; --adl-a-tint: #f9a8d4; --adl-a-th: #fbcfe8; --adl-a-soft: #fdedf5; --adl-a-mid: #ec4899; }

body.adl:is(.adl-accent-violet, .adl-accent-teal, .adl-accent-green, .adl-accent-orange, .adl-accent-pink) {
  --adl-blue:          light-dark(var(--adl-a), var(--adl-a-d));
  --adl-blue-h:        light-dark(var(--adl-a-h), var(--adl-a-dh));
  --adl-blue-soft:     light-dark(var(--adl-a-soft), color-mix(in srgb, var(--adl-a-mid) 15%, transparent));
  --adl-link:          light-dark(var(--adl-a-link), var(--adl-a-tint));
  --adl-link-h:        light-dark(var(--adl-a-lh), var(--adl-a-th));
  --adl-focus:         light-dark(color-mix(in srgb, var(--adl-a) 28%, transparent), color-mix(in srgb, var(--adl-a-mid) 42%, transparent));
  --adl-side-active:   light-dark(var(--adl-a-soft), color-mix(in srgb, var(--adl-a-mid) 16%, transparent));
  --adl-side-active-t: light-dark(var(--adl-a-link), var(--adl-a-tint));
  --adl-accent-tint:   var(--adl-a-tint);
}
/* Soft's grey menu needs a stronger wash than white does */
body.adl.adl-soft:is(.adl-accent-violet, .adl-accent-teal, .adl-accent-green, .adl-accent-orange, .adl-accent-pink) {
  --adl-blue-soft:     color-mix(in srgb, var(--adl-a) 9%, #fff);
  --adl-side-active:   color-mix(in srgb, var(--adl-a) 20%, #d9dee6);
  --adl-side-active-t: var(--adl-a-h);
}

/* Which half of each light-dark() pair is used */
body.adl-page.adl-light, body.adl.adl-light #wpadminbar, body.adl.adl-light #adminmenumain, body.adl.adl-light .adl-tip,
body.adl-page.adl-soft,  body.adl.adl-soft #wpadminbar,  body.adl.adl-soft #adminmenumain, body.adl.adl-soft .adl-tip { color-scheme: light; }
body.adl-page.adl-dim,   body.adl.adl-dim #wpadminbar,   body.adl.adl-dim #adminmenumain,  body.adl.adl-dim .adl-tip,
body.adl-page.adl-dark,  body.adl.adl-dark #wpadminbar,  body.adl.adl-dark #adminmenumain, body.adl.adl-dark .adl-tip { color-scheme: dark; }
body.adl-page.adl-auto,  body.adl.adl-auto #wpadminbar,  body.adl.adl-auto #adminmenumain, body.adl.adl-auto .adl-tip { color-scheme: light dark; }