:root{--bg:#070914;--panel:#111527;--panel-deep:#0c0f1d;--line:rgba(184,163,255,.15);--text:#f5f3ff;--muted:#9b9eaf;--purple:#9068f8}*{box-sizing:border-box}body{min-height:100vh;margin:0;background:var(--bg);color:var(--text);font-family:Tajawal,Arial,sans-serif}.page-grid,.page-glow{position:fixed;inset:0;pointer-events:none;z-index:-1}.page-grid{background-image:linear-gradient(rgba(140,104,251,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(140,104,251,.035) 1px,transparent 1px);background-size:54px 54px;mask-image:linear-gradient(#000,transparent 75%)}.page-glow{background:radial-gradient(circle at 93% 3%,rgba(89,54,205,.24),transparent 30%),radial-gradient(circle at 25% 85%,rgba(52,47,171,.12),transparent 30%)}.server-header {
  position: relative;
  top: auto;
  z-index: 9000;
  width: calc(100% - (2 * var(--dash-gutter, clamp(20px, 2.5vw, 48px))));
  max-width: none;
  margin: 14px auto 0;
  height: 74px;
  padding: 0 24px;
  border: 1px solid rgba(184, 163, 255, 0.16);
  border-radius: 20px;
  background: rgba(14, 16, 30, 0.88);
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
  box-shadow: 0 12px 36px rgba(0, 0, 0, 0.28);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  box-sizing: border-box;
  transition: background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}
html[data-theme="light"] .server-header {
  background: rgba(255, 255, 255, 0.90) !important;
  border-color: rgba(91, 66, 160, 0.16) !important;
  box-shadow: 0 12px 36px rgba(55, 39, 99, 0.08) !important;
}
.server-header-start {
  display: flex;
  align-items: center;
  gap: 16px;
  min-width: 0;
}
.server-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #fff;
  text-decoration: none;
  font-size: 20px;
  font-weight: 800;
  flex-shrink: 0;
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.server-brand:hover {
  opacity: 0.92;
  transform: translateY(-1px);
}
html[data-theme="light"] .server-brand {
  color: #211d32 !important;
}
.header-divider {
  width: 1px;
  height: 26px;
  background: rgba(184, 163, 255, 0.2);
  flex-shrink: 0;
}
html[data-theme="light"] .header-divider {
  background: rgba(91, 66, 160, 0.18) !important;
}
.guild-switcher {
  position: relative;
  z-index: 9500;
  flex-shrink: 0;
}
.guild-switcher-trigger {
  min-width: 175px;
  max-width: 230px;
  height: 42px;
  padding: 5px 10px;
  border: 1px solid rgba(184, 163, 255, 0.22);
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.04);
  color: #f2efff;
  font: inherit;
  font-size: 13px;
  font-weight: 700;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  transition: all 0.2s ease;
}
.guild-switcher-trigger:hover,
.guild-switcher-trigger[aria-expanded="true"] {
  border-color: rgba(168, 130, 255, 0.65);
  background: rgba(144, 104, 248, 0.14);
  box-shadow: 0 4px 16px rgba(124, 83, 233, 0.2);
}
html[data-theme="light"] .guild-switcher-trigger {
  background: rgba(255, 255, 255, 0.95) !important;
  border-color: rgba(91, 66, 160, 0.22) !important;
  color: #2a2540 !important;
}
html[data-theme="light"] .guild-switcher-trigger:hover,
html[data-theme="light"] .guild-switcher-trigger[aria-expanded="true"] {
  background: #fff !important;
  border-color: #8b60ee !important;
  box-shadow: 0 4px 18px rgba(120, 80, 220, 0.12) !important;
}
.guild-switcher-trigger strong {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: right;
  font-size: 13px;
  font-weight: 700;
}
.guild-avatar {
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  overflow: hidden;
  border-radius: 9px;
  background: linear-gradient(135deg, #9068f8, #5940d8);
  display: grid;
  place-items: center;
}
.guild-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.guild-avatar span {
  display: none;
  font-weight: 800;
  color: #fff;
  font-size: 12px;
}
.guild-avatar.no-icon img { display: none; }
.guild-avatar.no-icon span { display: block; }
.switcher-arrow {
  width: 8px;
  height: 8px;
  flex-shrink: 0;
  border-left: 2px solid #bda8f7;
  border-bottom: 2px solid #bda8f7;
  transform: rotate(-45deg);
  transition: transform 0.22s ease, margin 0.22s ease;
  margin: 0 2px 3px 0;
}
.guild-switcher-trigger[aria-expanded="true"] .switcher-arrow {
  transform: rotate(135deg);
  margin-bottom: -3px;
}
.guild-switcher-menu {
  position: absolute;
  top: calc(100% + 8px);
  inset-inline-start: 0;
  width: 260px;
  max-height: 340px;
  padding: 8px;
  overflow-y: auto;
  scrollbar-width: thin;
  border: 1px solid rgba(180, 154, 255, 0.35);
  border-radius: 16px;
  background: rgba(17, 20, 39, 0.96);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.65);
  z-index: 10000;
}
html[data-theme="light"] .guild-switcher-menu {
  background: rgba(255, 255, 255, 0.98) !important;
  border-color: rgba(91, 66, 160, 0.22) !important;
  box-shadow: 0 20px 50px rgba(55, 39, 99, 0.16) !important;
}
.guild-option {
  width: 100%;
  padding: 8px 10px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: #ded9ec;
  font: inherit;
  display: flex;
  align-items: center;
  gap: 10px;
  text-align: right;
  cursor: pointer;
  transition: background 0.15s ease;
}
.guild-option:hover {
  background: rgba(147, 105, 245, 0.15);
}
.guild-option.active {
  background: rgba(173, 128, 249, 0.2);
  color: #fff;
}
html[data-theme="light"] .guild-option {
  color: #383142 !important;
}
html[data-theme="light"] .guild-option:hover {
  background: rgba(144, 104, 248, 0.1) !important;
}
html[data-theme="light"] .guild-option.active {
  background: linear-gradient(135deg, #7861b6, #9378cc) !important;
  color: #fff !important;
}
.guild-option strong {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
  font-weight: 700;
}
.guild-option-avatar {
  width: 30px;
  height: 30px;
  flex-shrink: 0;
  overflow: hidden;
  border-radius: 9px;
  background: linear-gradient(135deg, #9068f8, #3f47dc);
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 800;
}
.guild-option-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.server-header-nav {
  display: flex;
  align-items: center;
  gap: 6px;
}
@media (min-width: 761px) {
  .server-header-nav {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
  }
}
.header-nav-link {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 14px;
  border-radius: 12px;
  color: var(--muted, #9b9eaf);
  text-decoration: none;
  font-size: 13px;
  font-weight: 700;
  transition: color 0.2s ease, background 0.2s ease;
}
.header-nav-link:hover {
  color: #fff;
  background: rgba(154, 121, 227, 0.12);
}
html[data-theme="light"] .header-nav-link {
  color: #635b76 !important;
}
html[data-theme="light"] .header-nav-link:hover {
  color: #211d32 !important;
  background: rgba(120, 80, 220, 0.1) !important;
}
.header-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.server-header .theme-toggle,
.header-actions .theme-toggle {
  position: static !important;
  inset: auto !important;
  box-shadow: none !important;
  width: 38px !important;
  height: 38px !important;
  min-width: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  border: 1px solid rgba(177, 151, 255, 0.32);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.05);
  color: #ded4ff;
  cursor: pointer;
  display: inline-grid !important;
  place-items: center !important;
  transition: all 0.2s ease;
  flex-shrink: 0;
}
.server-header .theme-toggle:hover,
.header-actions .theme-toggle:hover {
  border-color: #b494ff;
  background: rgba(144, 104, 248, 0.18);
  color: #fff;
  transform: translateY(-1px);
}
.server-header .theme-toggle .theme-icon,
.header-actions .theme-toggle .theme-icon {
  display: block;
  pointer-events: none;
  transition: transform 0.25s ease;
}
.server-header .theme-toggle:hover .theme-icon,
.header-actions .theme-toggle:hover .theme-icon {
  transform: rotate(15deg) scale(1.08);
}
html[data-theme="light"] .server-header .theme-toggle,
html[data-theme="light"] .header-actions .theme-toggle {
  background: rgba(255, 255, 255, 0.95) !important;
  color: #4b367c !important;
  border-color: rgba(91, 66, 160, 0.25) !important;
  box-shadow: 0 4px 14px rgba(70, 45, 120, 0.08) !important;
}
html[data-theme="light"] .server-header .theme-toggle:hover,
html[data-theme="light"] .header-actions .theme-toggle:hover {
  border-color: #7b4ee7 !important;
  background: #fff !important;
  color: #1a162b !important;
}
.header-action-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 40px;
  padding: 8px 14px;
  border: 1px solid rgba(184, 163, 255, 0.22);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.04);
  color: #d8cefc;
  text-decoration: none;
  font-size: 13px;
  font-weight: 700;
  transition: all 0.2s ease;
}
.header-action-btn:hover {
  border-color: rgba(168, 130, 255, 0.55);
  background: rgba(144, 104, 248, 0.14);
  color: #fff;
}
html[data-theme="light"] .header-action-btn {
  background: rgba(255, 255, 255, 0.95) !important;
  border-color: rgba(91, 66, 160, 0.22) !important;
  color: #3b3252 !important;
}
html[data-theme="light"] .header-action-btn:hover {
  border-color: #7b4ee7 !important;
  background: #fff !important;
  color: #1a162b !important;
}
.server-layout {
  width: calc(100% - (2 * var(--dash-gutter, clamp(20px, 2.5vw, 48px))));
  max-width: none;
  min-height: calc(100vh - 100px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(260px, 19vw) minmax(0, 1fr);
  gap: clamp(16px, 1.8vw, 24px);
  padding: 24px 0 40px;
  box-sizing: border-box;
}.server-sidebar{height:fit-content;padding:16px;border:1px solid var(--line);border-radius:19px;background:linear-gradient(150deg,rgba(20,24,44,.93),rgba(10,13,27,.9));box-shadow:0 20px 50px rgba(0,0,0,.14)}.sidebar-heading{display:flex;align-items:center;justify-content:space-between;padding:5px 7px 16px;border-bottom:1px solid rgba(255,255,255,.08)}.sidebar-heading span{font-size:14px;font-weight:800}.sidebar-heading small{border-radius:99px;padding:4px 7px;background:rgba(144,104,248,.14);color:#c3afff;font-size:10px}.server-nav{display:grid;gap:4px;padding-top:12px}.nav-item{width:100%;padding:10px;border:0;border-radius:11px;background:transparent;color:#d7d3e4;text-align:right;font:inherit;display:flex;align-items:center;gap:9px}.nav-item.active{background:linear-gradient(135deg,rgba(126,82,236,.26),rgba(96,66,183,.15));color:#fff}.nav-item:disabled{opacity:.48;cursor:not-allowed}.nav-index{display:grid;place-items:center;width:27px;height:27px;border-radius:8px;background:rgba(255,255,255,.07);color:#a78bfa;font-size:10px;font-weight:800}.nav-item.active .nav-index{background:#8962f2;color:#fff}.nav-item strong,.nav-item small{display:block}.nav-item strong{font-size:12px}.nav-item small{margin-top:2px;color:#9497aa;font-size:10px}.sidebar-note{display:flex;gap:8px;margin-top:14px;padding:11px 7px 2px;border-top:1px solid rgba(255,255,255,.08)}.sidebar-note span{width:7px;height:7px;flex:none;margin-top:5px;border-radius:50%;background:#4ee09a;box-shadow:0 0 12px #4ee09a}.sidebar-note p{margin:0;color:#8e92a5;font-size:11px;line-height:1.6}.server-main{min-width:0}.page-title{padding:9px 4px 25px}.page-title p{margin:0 0 8px;color:#bca7ff;font-size:13px;font-weight:800}.page-title h1{margin:0;font-size:clamp(28px,4vw,39px)}.page-title h1 strong{color:#a47bff}.page-title>span{display:block;margin-top:8px;color:var(--muted);font-size:14px}.workspace{min-height:520px;padding:23px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(145deg,rgba(17,21,39,.91),rgba(9,12,24,.87));box-shadow:0 24px 65px rgba(0,0,0,.16)}.workspace-top{display:flex;align-items:center;gap:12px;padding-bottom:20px;border-bottom:1px solid rgba(255,255,255,.08)}.workspace-marker{width:11px;height:11px;border-radius:50%;background:#9270f5;box-shadow:0 0 18px #9270f5}.workspace-top h2{margin:0;font-size:17px}.workspace-top p{margin:3px 0 0;color:#8d91a4;font-size:12px}.empty-workspace{min-height:385px;display:grid;place-content:center;justify-items:center;text-align:center}.empty-orbit{position:relative;width:88px;height:88px;padding:8px;border:1px solid rgba(160,130,255,.34);border-radius:50%;box-shadow:0 0 0 15px rgba(135,95,246,.04),0 0 0 30px rgba(135,95,246,.025)}.empty-orbit img{width:100%;height:100%;border-radius:50%;object-fit:cover}.empty-workspace h2{margin:27px 0 7px;font-size:20px}.empty-workspace p{max-width:380px;margin:0;color:#9599ac;font-size:13px;line-height:1.8}@media(max-width:760px){.server-header{width:min(100% - 24px,1440px);margin-top:10px;height:66px;padding:0 12px;gap:8px}.server-header-nav{display:none}.guild-switcher-trigger{min-width:0;max-width:150px;padding:4px 8px}.guild-switcher-trigger strong{max-width:90px}.header-action-btn{display:none!important}.server-header .theme-toggle{width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;padding:0!important}.server-layout{width:min(100% - 24px,1440px);grid-template-columns:1fr;gap:15px;padding-top:14px}.server-sidebar{padding:10px}.sidebar-heading,.sidebar-note{display:none}.server-nav{grid-template-columns:repeat(3,1fr);padding:0;overflow:auto}.nav-item{min-width:135px}.workspace{min-height:460px;padding:18px}.page-title{padding-bottom:16px}}
.server-main{transition:opacity .14s ease,transform .14s ease}.server-main.is-page-leaving{opacity:0;transform:translateY(8px)}.server-main.is-page-entering{animation:dashboard-page-enter .22s ease}@keyframes dashboard-page-enter{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
body{animation:dashboard-load .2s ease}.server-header,.server-layout{transition:opacity .15s ease,transform .15s ease}body.is-dashboard-switching .server-header,body.is-dashboard-switching .server-layout{opacity:0;transform:translateY(8px)}@keyframes dashboard-load{from{opacity:0}to{opacity:1}}
.module-workspace-canvas{display:grid;gap:16px;min-height:420px;padding:20px;border:1px solid rgba(180,154,255,.16);border-radius:16px;background:linear-gradient(145deg,rgba(25,29,53,.58),rgba(12,16,32,.64))}.module-workspace-toolbar{display:flex;gap:8px;padding-bottom:16px;border-bottom:1px solid rgba(187,163,255,.12)}.module-workspace-toolbar span{width:64px;height:8px;border-radius:999px;background:rgba(160,129,245,.18)}.module-workspace-toolbar span:first-child{width:112px;background:rgba(148,105,240,.38)}.module-workspace-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,.38fr);gap:16px;min-height:330px}.module-workspace-layout section,.module-workspace-layout aside{border:1px dashed rgba(187,163,255,.2);border-radius:12px;background:rgba(255,255,255,.018)}@media(max-width:700px){.module-workspace-layout{grid-template-columns:1fr;min-height:300px}.module-workspace-layout aside{min-height:100px}}
.ticket-options{grid-column:1/-1!important;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:8px}.ticket-options .ticket-check{display:flex!important;align-items:center;justify-content:space-between;min-height:42px;padding:8px 12px!important;font-size:12px!important;line-height:1.4;border:1px solid rgba(187,163,255,.18)!important;border-radius:10px!important;background:rgba(255,255,255,.03)!important}.ticket-options .ticket-check input{position:relative;width:34px!important;height:19px!important;margin:0;padding:0!important;border:0!important;border-radius:99px!important;appearance:none;background:#4a4c62!important;cursor:pointer;flex:none}.ticket-options .ticket-check input:after{content:"";position:absolute;top:3px;right:3px;width:13px;height:13px;border-radius:50%;background:#fff;transition:transform .2s}.ticket-options .ticket-check input:checked{background:linear-gradient(135deg,#6f52e3,#9b6dff)!important}.ticket-options .ticket-check input:checked:after{transform:translateX(-15px)}
.ticket-system>.ticket-content>.ticket-fields>label:nth-child(2) input[type="color"]{width:100%;height:46px;padding:5px;border:1px solid rgba(187,163,255,.32);border-radius:9px;background:#25233f;cursor:pointer}.ticket-system>.ticket-content>.ticket-fields>label:nth-child(2) input[type="color"]::-webkit-color-swatch-wrapper{padding:0}.ticket-system>.ticket-content>.ticket-fields>label:nth-child(2) input[type="color"]::-webkit-color-swatch{border:2px solid rgba(255,255,255,.7);border-radius:7px}
.ticket-add small{display:none}
.ticket-color-control{position:relative;display:flex;align-items:center;gap:8px;min-height:36px;padding:3px 8px;border:1px solid rgba(187,163,255,.25);border-radius:8px;background:#171832}.ticket-color-control:before{content:"";width:22px;height:22px;border:2px solid rgba(255,255,255,.72);border-radius:6px;background:var(--ticket-color)}.ticket-color-control input{position:absolute!important;inset:0;width:100%!important;height:100%!important;padding:0!important;opacity:0;cursor:pointer}.ticket-color-control output{direction:ltr;color:#ded9ed;font:700 11px monospace}

/* Brand Logo Reset for Dashboard */
.server-brand .brand-mark {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
  border-radius: 0 !important;
  overflow: visible !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  height: auto !important;
}

.server-brand .smsar-brand-svg {
  display: block;
  width: 32px;
  height: 32px;
  flex: none;
  overflow: visible;
  filter: drop-shadow(0 2px 8px rgba(147, 64, 246, 0.42));
  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1), filter 0.25s ease;
  pointer-events: none;
}

.server-brand:hover .smsar-brand-svg {
  transform: scale(1.08) rotate(-2deg);
  filter: drop-shadow(0 4px 14px rgba(168, 85, 255, 0.65));
}

.empty-orbit img,
.empty-state img {
  object-fit: contain !important;
  background: transparent !important;
  border-radius: 0 !important;
  filter: drop-shadow(0 4px 16px rgba(154, 75, 246, 0.45));
}