/*
 * Dashboard theme palettes
 * Required public tokens:
 * --primary, --primary-light, --primary-dark, --bg-body, --bg-card,
 * --bg-sidebar, --text-main, --text-muted, --text-on-primary, --border,
 * --success, --danger, --warning, --info, --shadow
 */

html[data-theme="light"],
html[data-theme="light-1"] {
  --primary: #6D5BD0;
  --primary-light: #ECE9FF;
  --primary-dark: #4C3FB1;
  --bg-body: #F7F7FB;
  --bg-card: #FFFFFF;
  --bg-sidebar: #332A7C;
  --text-main: #1F2937;
  --text-muted: #64748B;
  --text-on-primary: #FFFFFF;
  --border: #E6E8F0;
  --success: #168A56;
  --danger: #C2415B;
  --warning: #A16207;
  --info: #2563EB;
  --shadow: 0 18px 42px rgba(67, 56, 202, 0.12);

  --primary-rgb: 109, 91, 208;
  --primary-light-rgb: 236, 233, 255;
  --primary-dark-rgb: 76, 63, 177;
  --success-rgb: 22, 138, 86;
  --danger-rgb: 194, 65, 91;
  --warning-rgb: 161, 98, 7;
  --info-rgb: 37, 99, 235;
  --secondary: #8B5CF6;
  --secondary-rgb: 139, 92, 246;
  --accent: #7C3AED;
  --accent-rgb: 124, 58, 237;
  --surface-muted: #F1F2F8;
  --input-bg: #FFFFFF;
  --input-muted: #F6F7FB;
  --text-soft: #94A3B8;
  --border-strong: #CBCFE0;
  --sidebar-start: #5A49C8;
  --sidebar-card: rgba(255, 255, 255, 0.14);
  --sidebar-card-strong: rgba(255, 255, 255, 0.24);
  --sidebar-text: rgba(255, 255, 255, 0.96);
  --sidebar-muted: rgba(241, 245, 249, 0.78);
  --sidebar-active-bg: #FFFFFF;
  --sidebar-active-text: #372E8F;
  --sidebar-active-icon: #6D5BD0;
  --sidebar-active-icon-bg: rgba(109, 91, 208, 0.12);
  --gradient: linear-gradient(135deg, #8B5CF6 0%, #6D5BD0 52%, #4C3FB1 100%);
  --gradient-soft: linear-gradient(135deg, rgba(139, 92, 246, 0.12), rgba(109, 91, 208, 0.1));
}

html[data-theme="light-2"] {
  --primary: #0B6EBD;
  --primary-light: #E7F3FF;
  --primary-dark: #084F8A;
  --bg-body: #F4F8FB;
  --bg-card: #FFFFFF;
  --bg-sidebar: #083E6F;
  --text-main: #102A43;
  --text-muted: #5E7188;
  --text-on-primary: #FFFFFF;
  --border: #DDEAF5;
  --success: #0F8A5F;
  --danger: #C2415B;
  --warning: #98630D;
  --info: #2563EB;
  --shadow: 0 18px 42px rgba(11, 110, 189, 0.12);

  --primary-rgb: 11, 110, 189;
  --primary-light-rgb: 231, 243, 255;
  --primary-dark-rgb: 8, 79, 138;
  --success-rgb: 15, 138, 95;
  --danger-rgb: 194, 65, 91;
  --warning-rgb: 152, 99, 13;
  --info-rgb: 37, 99, 235;
  --secondary: #0284C7;
  --secondary-rgb: 2, 132, 199;
  --accent: #38BDF8;
  --accent-rgb: 56, 189, 248;
  --surface-muted: #EDF5FB;
  --input-bg: #FFFFFF;
  --input-muted: #F2F8FD;
  --text-soft: #8AA1B7;
  --border-strong: #B7D2E8;
  --sidebar-start: #0B6EBD;
  --sidebar-card: rgba(255, 255, 255, 0.14);
  --sidebar-card-strong: rgba(255, 255, 255, 0.24);
  --sidebar-text: rgba(255, 255, 255, 0.96);
  --sidebar-muted: rgba(230, 246, 255, 0.78);
  --sidebar-active-bg: #FFFFFF;
  --sidebar-active-text: #084F8A;
  --sidebar-active-icon: #0B6EBD;
  --sidebar-active-icon-bg: rgba(11, 110, 189, 0.12);
  --gradient: linear-gradient(135deg, #38BDF8 0%, #0B6EBD 54%, #084F8A 100%);
  --gradient-soft: linear-gradient(135deg, rgba(56, 189, 248, 0.14), rgba(11, 110, 189, 0.1));
}

html[data-theme="light-3"] {
  --primary: #A21CAF;
  --primary-light: #FCE7F3;
  --primary-dark: #7E1B83;
  --bg-body: #FFF7FB;
  --bg-card: #FFFFFF;
  --bg-sidebar: #6B1A73;
  --text-main: #31202F;
  --text-muted: #715C6E;
  --text-on-primary: #FFFFFF;
  --border: #F2D7EA;
  --success: #168A56;
  --danger: #BE123C;
  --warning: #A16207;
  --info: #4F46E5;
  --shadow: 0 18px 42px rgba(162, 28, 175, 0.12);

  --primary-rgb: 162, 28, 175;
  --primary-light-rgb: 252, 231, 243;
  --primary-dark-rgb: 126, 27, 131;
  --success-rgb: 22, 138, 86;
  --danger-rgb: 190, 18, 60;
  --warning-rgb: 161, 98, 7;
  --info-rgb: 79, 70, 229;
  --secondary: #DB2777;
  --secondary-rgb: 219, 39, 119;
  --accent: #EC4899;
  --accent-rgb: 236, 72, 153;
  --surface-muted: #FFF1F7;
  --input-bg: #FFFFFF;
  --input-muted: #FFF5FA;
  --text-soft: #A890A3;
  --border-strong: #E9B8DB;
  --sidebar-start: #A21CAF;
  --sidebar-card: rgba(255, 255, 255, 0.14);
  --sidebar-card-strong: rgba(255, 255, 255, 0.24);
  --sidebar-text: rgba(255, 255, 255, 0.96);
  --sidebar-muted: rgba(255, 238, 247, 0.78);
  --sidebar-active-bg: #FFFFFF;
  --sidebar-active-text: #7E1B83;
  --sidebar-active-icon: #A21CAF;
  --sidebar-active-icon-bg: rgba(162, 28, 175, 0.12);
  --gradient: linear-gradient(135deg, #EC4899 0%, #A21CAF 52%, #7E1B83 100%);
  --gradient-soft: linear-gradient(135deg, rgba(236, 72, 153, 0.12), rgba(162, 28, 175, 0.1));
}

html[data-theme="dark"],
html[data-theme="dark-1"] {
  --primary: #A78BFA;
  --primary-light: #C4B5FD;
  --primary-dark: #7C3AED;
  --bg-body: #0F1020;
  --bg-card: #18172B;
  --bg-sidebar: #131022;
  --text-main: #F8FAFC;
  --text-muted: #CBD5E1;
  --text-on-primary: #1B1038;
  --border: #2E2A48;
  --success: #34D399;
  --danger: #FB7185;
  --warning: #FBBF24;
  --info: #60A5FA;
  --shadow: 0 22px 56px rgba(0, 0, 0, 0.36);

  --primary-rgb: 167, 139, 250;
  --primary-light-rgb: 196, 181, 253;
  --primary-dark-rgb: 124, 58, 237;
  --success-rgb: 52, 211, 153;
  --danger-rgb: 251, 113, 133;
  --warning-rgb: 251, 191, 36;
  --info-rgb: 96, 165, 250;
  --secondary: #C084FC;
  --secondary-rgb: 192, 132, 252;
  --accent: #A78BFA;
  --accent-rgb: 167, 139, 250;
  --surface-muted: #211F39;
  --input-bg: #211F39;
  --input-muted: #262341;
  --text-soft: #A8B1C2;
  --border-strong: #4A416C;
  --sidebar-start: #211642;
  --sidebar-card: rgba(255, 255, 255, 0.11);
  --sidebar-card-strong: rgba(255, 255, 255, 0.19);
  --sidebar-text: rgba(255, 255, 255, 0.96);
  --sidebar-muted: rgba(226, 232, 240, 0.76);
  --sidebar-active-bg: rgba(255, 255, 255, 0.95);
  --sidebar-active-text: #1B1038;
  --sidebar-active-icon: #7C3AED;
  --sidebar-active-icon-bg: rgba(124, 58, 237, 0.16);
  --gradient: linear-gradient(135deg, #C084FC 0%, #A78BFA 52%, #7C3AED 100%);
  --gradient-soft: linear-gradient(135deg, rgba(192, 132, 252, 0.18), rgba(167, 139, 250, 0.12));
}

html[data-theme="dark-2"] {
  --primary: #22D3EE;
  --primary-light: #67E8F9;
  --primary-dark: #0891B2;
  --bg-body: #071A1D;
  --bg-card: #0E252A;
  --bg-sidebar: #092126;
  --text-main: #ECFEFF;
  --text-muted: #B7D4D8;
  --text-on-primary: #06262C;
  --border: #1F4047;
  --success: #34D399;
  --danger: #FB7185;
  --warning: #FBBF24;
  --info: #38BDF8;
  --shadow: 0 22px 56px rgba(0, 0, 0, 0.34);

  --primary-rgb: 34, 211, 238;
  --primary-light-rgb: 103, 232, 249;
  --primary-dark-rgb: 8, 145, 178;
  --success-rgb: 52, 211, 153;
  --danger-rgb: 251, 113, 133;
  --warning-rgb: 251, 191, 36;
  --info-rgb: 56, 189, 248;
  --secondary: #2DD4BF;
  --secondary-rgb: 45, 212, 191;
  --accent: #22D3EE;
  --accent-rgb: 34, 211, 238;
  --surface-muted: #123139;
  --input-bg: #123139;
  --input-muted: #153943;
  --text-soft: #8FB6BE;
  --border-strong: #2D5D67;
  --sidebar-start: #0D3038;
  --sidebar-card: rgba(255, 255, 255, 0.1);
  --sidebar-card-strong: rgba(255, 255, 255, 0.18);
  --sidebar-text: rgba(255, 255, 255, 0.96);
  --sidebar-muted: rgba(207, 250, 254, 0.76);
  --sidebar-active-bg: rgba(236, 254, 255, 0.94);
  --sidebar-active-text: #06262C;
  --sidebar-active-icon: #0891B2;
  --sidebar-active-icon-bg: rgba(8, 145, 178, 0.16);
  --gradient: linear-gradient(135deg, #2DD4BF 0%, #22D3EE 52%, #0891B2 100%);
  --gradient-soft: linear-gradient(135deg, rgba(45, 212, 191, 0.16), rgba(34, 211, 238, 0.12));
}

html[data-theme="dark-3"] {
  --primary: #F59E0B;
  --primary-light: #FBBF24;
  --primary-dark: #B45309;
  --bg-body: #17120B;
  --bg-card: #241A0F;
  --bg-sidebar: #20150B;
  --text-main: #FFF7ED;
  --text-muted: #D7C2A8;
  --text-on-primary: #241507;
  --border: #46331F;
  --success: #34D399;
  --danger: #FB7185;
  --warning: #FBBF24;
  --info: #60A5FA;
  --shadow: 0 22px 56px rgba(0, 0, 0, 0.36);

  --primary-rgb: 245, 158, 11;
  --primary-light-rgb: 251, 191, 36;
  --primary-dark-rgb: 180, 83, 9;
  --success-rgb: 52, 211, 153;
  --danger-rgb: 251, 113, 133;
  --warning-rgb: 251, 191, 36;
  --info-rgb: 96, 165, 250;
  --secondary: #F97316;
  --secondary-rgb: 249, 115, 22;
  --accent: #F59E0B;
  --accent-rgb: 245, 158, 11;
  --surface-muted: #2E2113;
  --input-bg: #2E2113;
  --input-muted: #352716;
  --text-soft: #BFA88B;
  --border-strong: #65482A;
  --sidebar-start: #34200D;
  --sidebar-card: rgba(255, 255, 255, 0.1);
  --sidebar-card-strong: rgba(255, 255, 255, 0.18);
  --sidebar-text: rgba(255, 255, 255, 0.96);
  --sidebar-muted: rgba(254, 243, 199, 0.76);
  --sidebar-active-bg: rgba(255, 247, 237, 0.94);
  --sidebar-active-text: #241507;
  --sidebar-active-icon: #B45309;
  --sidebar-active-icon-bg: rgba(180, 83, 9, 0.16);
  --gradient: linear-gradient(135deg, #F97316 0%, #F59E0B 52%, #B45309 100%);
  --gradient-soft: linear-gradient(135deg, rgba(249, 115, 22, 0.16), rgba(245, 158, 11, 0.12));
}

html[data-theme] {
  --monawib-primary: var(--primary);
  --monawib-primary-rgb: var(--primary-rgb);
  --monawib-primary-hover: var(--primary-dark);
  --monawib-primary-hover-rgb: var(--primary-dark-rgb);
  --monawib-secondary: var(--secondary);
  --monawib-secondary-rgb: var(--secondary-rgb);
  --monawib-accent: var(--accent);
  --monawib-accent-rgb: var(--accent-rgb);
  --monawib-success: var(--success);
  --monawib-success-rgb: var(--success-rgb);
  --monawib-warning: var(--warning);
  --monawib-warning-rgb: var(--warning-rgb);
  --monawib-danger: var(--danger);
  --monawib-danger-rgb: var(--danger-rgb);
  --monawib-info: var(--info);
  --monawib-info-rgb: var(--info-rgb);
  --monawib-page: var(--bg-body);
  --monawib-surface: var(--bg-card);
  --monawib-surface-raised: var(--bg-card);
  --monawib-surface-muted: var(--surface-muted);
  --monawib-input: var(--input-bg);
  --monawib-input-muted: var(--input-muted);
  --monawib-text: var(--text-main);
  --monawib-text-muted: var(--text-muted);
  --monawib-text-soft: var(--text-soft);
  --monawib-border: var(--border);
  --monawib-border-strong: var(--border-strong);
  --monawib-gradient: var(--gradient);
  --monawib-gradient-soft: var(--gradient-soft);
  --monawib-shadow-xs: 0 4px 14px rgba(var(--primary-rgb), 0.08);
  --monawib-shadow-sm: var(--shadow);
  --monawib-shadow-md: 0 26px 58px rgba(var(--primary-rgb), 0.18);
  --monawib-header-shadow: 0 18px 44px rgba(var(--primary-rgb), 0.12);

  --theme-primary: var(--primary);
  --theme-primary-rgb: var(--primary-rgb);
  --theme-primary-hover: var(--primary-dark);
  --theme-primary-hover-rgb: var(--primary-dark-rgb);
  --theme-primary-soft: rgba(var(--primary-rgb), 0.14);
  --theme-primary-softer: rgba(var(--primary-rgb), 0.07);
  --theme-primary-contrast: var(--text-on-primary);
  --theme-secondary: var(--secondary);
  --theme-secondary-rgb: var(--secondary-rgb);
  --theme-accent: var(--accent);
  --theme-accent-rgb: var(--accent-rgb);
  --theme-success: var(--success);
  --theme-success-rgb: var(--success-rgb);
  --theme-success-soft: rgba(var(--success-rgb), 0.14);
  --theme-warning: var(--warning);
  --theme-warning-rgb: var(--warning-rgb);
  --theme-warning-soft: rgba(var(--warning-rgb), 0.16);
  --theme-danger: var(--danger);
  --theme-danger-rgb: var(--danger-rgb);
  --theme-danger-soft: rgba(var(--danger-rgb), 0.14);
  --theme-info: var(--info);
  --theme-info-rgb: var(--info-rgb);
  --theme-info-soft: rgba(var(--info-rgb), 0.14);
  --theme-page: var(--bg-body);
  --theme-surface: var(--bg-card);
  --theme-surface-raised: var(--bg-card);
  --theme-surface-muted: var(--surface-muted);
  --theme-sidebar: linear-gradient(180deg, var(--sidebar-start) 0%, var(--primary-dark) 50%, var(--bg-sidebar) 100%);
  --theme-sidebar-card: var(--sidebar-card);
  --theme-sidebar-card-strong: var(--sidebar-card-strong);
  --theme-sidebar-text: var(--sidebar-text);
  --theme-sidebar-muted: var(--sidebar-muted);
  --theme-sidebar-active-bg: var(--sidebar-active-bg);
  --theme-sidebar-active-text: var(--sidebar-active-text);
  --theme-sidebar-active-icon: var(--sidebar-active-icon);
  --theme-sidebar-active-icon-bg: var(--sidebar-active-icon-bg);
  --theme-border: var(--border);
  --theme-border-strong: var(--border-strong);
  --theme-text: var(--text-main);
  --theme-text-muted: var(--text-muted);
  --theme-text-soft: var(--text-soft);
  --theme-input: var(--input-bg);
  --theme-input-muted: var(--input-muted);
  --theme-shadow-xs: var(--monawib-shadow-xs);
  --theme-shadow-sm: var(--monawib-shadow-sm);
  --theme-shadow-md: var(--monawib-shadow-md);
  --theme-header-shadow: var(--monawib-header-shadow);
  --theme-auth-gradient-end-rgb: var(--accent-rgb);

  --mshaweer-primary: var(--theme-primary);
  --mshaweer-primary-rgb: var(--theme-primary-rgb);
  --mshaweer-primary-hover: var(--theme-primary-hover);
  --mshaweer-primary-hover-rgb: var(--theme-primary-hover-rgb);
  --mshaweer-primary-700: var(--theme-primary-hover);
  --mshaweer-primary-contrast: var(--theme-primary-contrast);
  --mshaweer-danger: var(--theme-danger);
  --mshaweer-danger-rgb: var(--theme-danger-rgb);
  --mshaweer-danger-soft: var(--theme-danger-soft);
  --mshaweer-success: var(--theme-success);
  --mshaweer-success-rgb: var(--theme-success-rgb);
  --mshaweer-warning: var(--theme-warning);
  --mshaweer-warning-rgb: var(--theme-warning-rgb);
  --mshaweer-info: var(--theme-info);
  --mshaweer-info-rgb: var(--theme-info-rgb);
  --mshaweer-bg: var(--theme-page);
  --mshaweer-card: var(--theme-surface);
  --mshaweer-card-muted: var(--theme-surface-muted);
  --mshaweer-text: var(--theme-text);
  --mshaweer-muted: var(--theme-text-muted);
  --mshaweer-soft: var(--theme-text-soft);
  --mshaweer-border: var(--theme-border);
  --mshaweer-border-strong: var(--theme-border-strong);
  --mshaweer-input: var(--theme-input);
  --mshaweer-input-muted: var(--theme-input-muted);
  --mshaweer-shadow: var(--theme-shadow-sm);
  --mshaweer-header-shadow: var(--theme-header-shadow);

  --show-bg-primary: transparent;
  --show-bg-secondary: var(--theme-surface-muted);
  --show-text-primary: var(--theme-text);
  --show-text-secondary: var(--theme-text-muted);
  --show-text-muted: var(--theme-text-soft);
  --show-border-color: var(--theme-border);
  --show-accent-primary: var(--theme-primary);
  --show-accent-secondary: var(--theme-primary-hover);
  --show-accent-light: var(--theme-primary-soft);

  --bs-primary: var(--theme-primary);
  --bs-primary-rgb: var(--theme-primary-rgb);
  --bs-warning: var(--theme-warning);
  --bs-warning-rgb: var(--theme-warning-rgb);
  --bs-link-color: var(--theme-primary);
  --bs-link-hover-color: var(--theme-primary-hover);
}

.admin-theme-switcher {
  position: relative;
}

.admin-theme-trigger {
  align-items: center;
  display: inline-flex;
  justify-content: center;
}

.admin-theme-menu {
  background: color-mix(in srgb, var(--theme-surface) 94%, transparent) !important;
  border: 1px solid var(--theme-border) !important;
  border-radius: 12px !important;
  box-shadow: var(--theme-shadow-md) !important;
  min-width: 184px;
  padding: 0.75rem !important;
}

.admin-theme-grid {
  display: grid;
  gap: 0.65rem;
  grid-template-columns: repeat(3, 44px);
}

.admin-theme-option {
  align-items: center;
  background: color-mix(in srgb, var(--theme-surface) 82%, var(--theme-primary) 6%);
  border: 1px solid var(--theme-border);
  border-radius: 999px;
  box-shadow: var(--theme-shadow-xs);
  display: inline-flex;
  height: 44px;
  justify-content: center;
  padding: 0;
  position: relative;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
  width: 44px;
}

.admin-theme-option:hover,
.admin-theme-option:focus-visible {
  border-color: var(--theme-primary);
  box-shadow: 0 8px 20px rgba(var(--theme-primary-rgb), 0.18);
  outline: none;
  transform: translateY(-1px);
}

.admin-theme-option.active,
.admin-theme-option.selected,
.admin-theme-option[aria-checked="true"] {
  border-color: var(--theme-primary);
  box-shadow: 0 0 0 3px var(--theme-primary-soft), var(--theme-shadow-xs);
}

.admin-theme-swatch {
  background:
    radial-gradient(circle at 30% 30%, var(--swatch-accent), transparent 34%),
    linear-gradient(135deg, var(--swatch-primary) 0%, var(--swatch-bg) 100%);
  border: 1px solid rgba(255, 255, 255, 0.52);
  border-radius: 50%;
  display: block;
  height: 30px;
  width: 30px;
}

.admin-theme-check {
  align-items: center;
  background: var(--theme-primary);
  border: 2px solid var(--theme-surface);
  border-radius: 50%;
  color: var(--theme-primary-contrast);
  display: none;
  font-size: 0.72rem;
  height: 18px;
  inset-block-end: -2px;
  inset-inline-end: -2px;
  justify-content: center;
  line-height: 1;
  position: absolute;
  width: 18px;
}

.admin-theme-option.active .admin-theme-check,
.admin-theme-option.selected .admin-theme-check,
.admin-theme-option[aria-checked="true"] .admin-theme-check {
  display: inline-flex;
}
