/* DiscordPrime — dashboard shell (Proiectele mele, Tickete) */
body { margin: 0; }
.dash { display: grid; grid-template-rows: auto 1fr; min-height: 100vh; }
.dash-top {
  position: sticky; top: 0; z-index: 20;
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 18px;
  padding: 12px 22px; border-bottom: 1px solid rgba(140, 130, 255, 0.18);
  background: rgba(10, 9, 28, 0.9); backdrop-filter: blur(12px);
}
.dash-top .df-brand { font-weight: 800; color: #fff; text-decoration: none; display: inline-flex; align-items: center; gap: 10px; }
.dash-search { position: relative; max-width: 320px; width: 100%; justify-self: start; }
.dash-search svg, .dash-filter svg { position: absolute; left: 12px; top: 50%; width: 16px; height: 16px; transform: translateY(-50%); color: #8f8bb5; }
.dash-search input, .dash-filter input {
  width: 100%; box-sizing: border-box; padding: 10px 12px 10px 36px; border-radius: 12px;
  font: inherit; font-size: 13px; color: #fff; background: rgba(8, 7, 24, 0.85); border: 1px solid rgba(140, 130, 255, 0.2);
}
.dash-search input:focus, .dash-filter input:focus, .dash-select:focus, .dash-input:focus, .dash-textarea:focus { outline: none; border-color: rgba(167, 139, 250, 0.7); box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.2); }
.dash-who { display: inline-flex; align-items: center; gap: 10px; justify-self: end; }
.dash-user { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; color: inherit; }
.dash-notify { position: relative; }
.dash-notify[hidden] { display: none !important; }
.dash-bell { position: relative; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 10px; color: #c7c3ea; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); cursor: pointer; }
.dash-bell i { position: absolute; top: 8px; right: 9px; width: 7px; height: 7px; border-radius: 50%; background: #fb7185; box-shadow: 0 0 8px #fb7185; }
.dash-bell i[hidden] { display: none; }
.dash-bell svg { width: 18px; height: 18px; }
.dash-notifs {
  position: absolute; right: 0; top: calc(100% + 8px); z-index: 30; width: min(320px, 78vw);
  display: grid; gap: 8px; padding: 12px; border-radius: 14px;
  background: rgba(16, 14, 44, 0.98); border: 1px solid rgba(140, 130, 255, 0.3); box-shadow: 0 20px 44px rgba(0,0,0,.5);
}
.dash-notifs[hidden] { display: none !important; }
.dash-notifs > strong { color: #fff; font-size: 13px; }
.dash-notifs ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; max-height: 360px; overflow: auto; }
.dash-notifs a { display: grid; gap: 2px; padding: 10px 12px; border-radius: 10px; text-decoration: none; background: rgba(8, 7, 24, 0.7); border: 1px solid rgba(140, 130, 255, 0.16); }
.dash-notifs a:hover { border-color: rgba(167, 139, 250, 0.45); }
.dash-notifs a strong { color: #fff; font-size: 13px; }
.dash-notifs a small { color: #8f8bb5; font-size: 12px; }
.dash-notifs-empty { color: #8f8bb5; font-size: 13px; padding: 10px 4px; }
.dash-avatar { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; overflow: hidden; color: #fff; background: linear-gradient(160deg, #a78bfa, #5865f2); font-weight: 800; font-size: 13px; }
.dash-avatar img { width: 100%; height: 100%; object-fit: cover; }
.dash-user strong { display: block; color: #fff; font-size: 13px; }
.dash-user small { color: #8f8bb5; font-size: 11px; }

.dash-body { display: grid; grid-template-columns: 220px 1fr; }
.dash-side { padding: 18px 14px; border-right: 1px solid rgba(140, 130, 255, 0.14); display: grid; align-content: start; gap: 10px; }
.dash-nav { display: grid; gap: 4px; }
.dash-nav a {
  display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 10px;
  color: #c7c3ea; font-size: 13px; font-weight: 600; text-decoration: none; border: 1px solid transparent;
}
.dash-nav a svg { width: 17px; height: 17px; color: #9a96c2; }
.dash-nav a:hover { background: rgba(255,255,255,0.04); }
.dash-nav a.active { color: #fff; background: rgba(88, 101, 242, 0.22); border-color: rgba(140, 130, 255, 0.4); }
.dash-nav a.active svg { color: #c4b5fd; }
.dash-nav a[href="/panou.html"],
.dash-nav a[href="/inbox.html"] { display: none; }
body.is-moderator .dash-nav a[href="/panou.html"],
body.is-moderator .dash-nav a[href="/inbox.html"] { display: flex; }
body:not(.is-moderator) .dash-staff-only { display: none; }
.dash-card { margin-top: 10px; padding: 16px; border-radius: 16px; background: rgba(16, 14, 44, 0.9); border: 1px solid rgba(140, 130, 255, 0.22); }
.dash-card h3 { margin: 10px 0 6px; font-size: 14px; color: #fff; }
.dash-card p { margin: 0 0 12px; font-size: 12px; color: #8f8bb5; line-height: 1.45; }
.dash-card .icon { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; color: #c4b5fd; background: rgba(139, 92, 246, 0.16); border: 1px solid rgba(167, 139, 250, 0.32); }
.dash-card .icon svg { width: 18px; height: 18px; }
.dash-mini { display: inline-flex; align-items: center; justify-content: center; min-height: 36px; padding: 0 16px; border-radius: 10px; color: #fff; font-size: 12px; font-weight: 700; text-decoration: none; background: linear-gradient(90deg, #5865f2, #a855f7); }
.dash-quota strong { display: block; font-size: 20px; color: #fff; margin-top: 4px; }
.dash-quota .bar { height: 6px; margin-top: 10px; border-radius: 999px; background: rgba(255,255,255,0.08); overflow: hidden; }
.dash-quota .bar span { display: block; height: 100%; width: 0; border-radius: 999px; background: linear-gradient(90deg, #5865f2, #a78bfa); transition: width .4s ease; }
.dash-quota small { color: #8f8bb5; font-size: 12px; display: inline-flex; align-items: center; gap: 6px; }
.dash-quota small svg { width: 14px; height: 14px; color: #a78bfa; }
.dash-version { margin-top: auto; padding: 14px 6px 4px; font-size: 11px; color: #6f6c97; line-height: 1.5; }

.dash-main { padding: 26px 28px 40px; min-width: 0; }
.dash-head { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 16px; margin-bottom: 22px; }
.dash-head-icon { width: 54px; height: 54px; border-radius: 14px; display: grid; place-items: center; color: #fff; background: linear-gradient(160deg, #a78bfa, #5865f2); box-shadow: 0 14px 30px rgba(88, 101, 242, 0.4); }
.dash-head-icon svg { width: 26px; height: 26px; }
.dash-kicker { margin: 0 0 4px; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #a78bfa; }
.dash-head h1 { margin: 0; font-size: clamp(24px, 3vw, 32px); color: #fff; letter-spacing: -0.02em; }
.dash-head p { margin: 6px 0 0; font-size: 13px; color: #9a96c2; max-width: 520px; }
.dash-new { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 18px; border: 0; border-radius: 12px; color: #fff; font: inherit; font-size: 13px; font-weight: 800; text-decoration: none; cursor: pointer; background: linear-gradient(90deg, #5865f2, #7c5cff 55%, #a855f7); box-shadow: 0 14px 30px rgba(88, 101, 242, 0.4); white-space: nowrap; }
.dash-new svg { width: 16px; height: 16px; }

.dash-tools { display: grid; grid-template-columns: 1fr auto auto auto; gap: 12px; align-items: center; margin-bottom: 18px; }
.dash-filter { position: relative; }
.dash-select, .dash-input, .dash-textarea { padding: 10px 14px; border-radius: 12px; font: inherit; font-size: 13px; color: #fff; background: rgba(8, 7, 24, 0.85); border: 1px solid rgba(140, 130, 255, 0.2); }
.dash-view { display: inline-flex; border-radius: 12px; overflow: hidden; border: 1px solid rgba(140, 130, 255, 0.2); }
.dash-view button { width: 38px; height: 38px; border: 0; display: grid; place-items: center; color: #9a96c2; background: rgba(8, 7, 24, 0.85); cursor: pointer; }
.dash-view button.active { color: #fff; background: rgba(88, 101, 242, 0.35); }
.dash-view svg { width: 16px; height: 16px; }

.dash-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.dash-grid.list { grid-template-columns: 1fr; }
.proj {
  position: relative; display: grid; gap: 12px; padding: 16px; border-radius: 16px;
  background: linear-gradient(180deg, rgba(20, 17, 52, 0.96), rgba(12, 10, 32, 0.98));
  border: 1px solid rgba(140, 130, 255, 0.24); box-shadow: 0 16px 36px rgba(0, 0, 0, 0.35);
  transition: transform .2s ease, border-color .2s ease;
}
.proj:hover { transform: translateY(-2px); border-color: rgba(167, 139, 250, 0.5); }
.proj-top { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: start; }
.proj-icon { width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center; color: #fff; background: linear-gradient(160deg, #7c5cff, #4f46e5); }
.proj-icon svg { width: 22px; height: 22px; }
.proj-icon.c1 { background: linear-gradient(160deg, #a78bfa, #6d28d9); }
.proj-icon.c2 { background: linear-gradient(160deg, #7aa7ff, #2563eb); }
.proj-icon.c3 { background: linear-gradient(160deg, #c084fc, #7e22ce); }
.proj-icon.c4 { background: linear-gradient(160deg, #5865f2, #312e81); }
.proj h2 { margin: 0; font-size: 14px; color: #fff; }
.proj h2 i { font-style: normal; color: #a78bfa; margin-left: 2px; }
.proj .pid { display: block; margin-top: 3px; font-size: 11px; color: #8f8bb5; }
.proj-badge { padding: 4px 9px; border-radius: 999px; font-size: 10px; font-weight: 800; white-space: nowrap; border: 1px solid transparent; }
.proj-badge.lucru { color: #93c5fd; background: rgba(59, 130, 246, 0.16); border-color: rgba(59, 130, 246, 0.4); }
.proj-badge.asteptare { color: #fcd34d; background: rgba(245, 158, 11, 0.14); border-color: rgba(245, 158, 11, 0.4); }
.proj-badge.terminat { color: #86efac; background: rgba(34, 197, 94, 0.14); border-color: rgba(34, 197, 94, 0.4); }
.proj-actions { position: relative; overflow: visible; }
.proj-menu { position: absolute; right: 0; top: calc(100% + 6px); z-index: 20; display: none; width: max-content; min-width: 220px; padding: 6px; border-radius: 12px; background: rgba(16, 14, 44, 0.98); border: 1px solid rgba(140, 130, 255, 0.3); box-shadow: 0 20px 44px rgba(0,0,0,.5); }
.proj-menu.open { display: grid; }
.proj-menu button { box-sizing: border-box; width: 100%; min-width: 0; height: auto; min-height: 36px; justify-content: flex-start; display: flex; align-items: center; padding: 9px 12px; border: 0; border-radius: 8px; background: transparent; font: inherit; font-size: 13px; font-weight: 600; color: #c7c3ea; text-align: left; white-space: nowrap; cursor: pointer; }
.proj-menu button:hover { background: rgba(139, 92, 246, 0.22); color: #fff; }
.proj-menu button.danger { color: #fda4af; }
.proj-menu button.danger:hover { background: rgba(239, 68, 68, 0.2); }
.proj-desc { margin: 0; font-size: 13px; color: #c7c3ea; line-height: 1.45; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.proj-meta { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 8px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,0.07); }
.proj-meta small { display: inline-flex; align-items: center; gap: 6px; font-size: 11px; color: #8f8bb5; }
.proj-meta small svg { width: 13px; height: 13px; }
.proj-actions { display: inline-flex; gap: 6px; }
.proj-actions > button { width: 30px; height: 30px; border-radius: 8px; border: 1px solid rgba(140, 130, 255, 0.22); background: rgba(255,255,255,0.03); color: #c7c3ea; display: grid; place-items: center; cursor: pointer; transition: background .15s ease, color .15s ease; }
.proj-actions > button:hover { background: rgba(139, 92, 246, 0.25); color: #fff; }
.proj-actions > button.del:hover { background: rgba(239, 68, 68, 0.25); border-color: rgba(239, 68, 68, 0.4); }
.proj-actions svg { width: 14px; height: 14px; }

.dash-empty { grid-column: 1 / -1; display: grid; place-items: center; gap: 10px; padding: 48px 20px; text-align: center; border-radius: 16px; border: 1px dashed rgba(140, 130, 255, 0.3); color: #9a96c2; }
.dash-empty strong { color: #fff; font-size: 16px; }

.dash-foot { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 20px; font-size: 12px; color: #8f8bb5; }
.dash-pages { display: inline-flex; gap: 6px; }
.dash-pages button { min-width: 32px; height: 32px; padding: 0 8px; border-radius: 8px; border: 1px solid rgba(140, 130, 255, 0.22); background: rgba(8, 7, 24, 0.85); color: #c7c3ea; font: inherit; font-size: 12px; cursor: pointer; }
.dash-pages button.active { color: #fff; background: rgba(88, 101, 242, 0.45); border-color: rgba(140, 130, 255, 0.5); }
.dash-pages button:disabled { opacity: .4; cursor: default; }
.dash-toast { position: fixed; left: 50%; bottom: 22px; transform: translateX(-50%) translateY(20px); opacity: 0; padding: 10px 16px; border-radius: 12px; font-size: 13px; color: #fff; background: rgba(20, 16, 48, 0.95); border: 1px solid rgba(167, 139, 250, 0.4); box-shadow: 0 16px 36px rgba(0,0,0,.45); transition: opacity .25s ease, transform .25s ease; pointer-events: none; z-index: 50; }
.dash-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

/* Modal */
.dash-modal { position: fixed; inset: 0; z-index: 60; display: none; place-items: center; padding: 20px; background: rgba(5, 4, 16, 0.72); backdrop-filter: blur(6px); }
.dash-modal.open { display: grid; }
.dash-modal-card { width: min(560px, 100%); display: grid; gap: 14px; padding: 22px; border-radius: 20px; background: linear-gradient(180deg, rgba(20, 17, 52, 0.98), rgba(12, 10, 32, 0.99)); border: 1px solid rgba(140, 130, 255, 0.32); box-shadow: 0 30px 70px rgba(0, 0, 0, 0.6); }
.dash-modal-card h2 { margin: 0; font-size: 18px; color: #fff; }
.dash-modal-card p { margin: 0; font-size: 12px; color: #9a96c2; }
.dash-field { display: grid; gap: 6px; }
.dash-field > span { font-size: 12px; font-weight: 700; color: #e9e6ff; }
.dash-field .dash-input, .dash-field .dash-select, .dash-field .dash-textarea { width: 100%; box-sizing: border-box; }
.dash-textarea { min-height: 96px; resize: vertical; }
.dash-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.dash-modal-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 4px; }
.dash-ghost { min-height: 42px; padding: 0 16px; border-radius: 12px; border: 1px solid rgba(140, 130, 255, 0.3); background: transparent; color: #c7c3ea; font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }

@media (max-width: 980px) {
  .dash-body { grid-template-columns: 1fr; }
  .dash-side { border-right: 0; border-bottom: 1px solid rgba(140, 130, 255, 0.14); }
  .dash-card, .dash-version { display: none; }
  .dash-nav { grid-auto-flow: column; overflow-x: auto; }
  .dash-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dash-tools { grid-template-columns: 1fr 1fr; }
  .dash-tools .dash-filter { grid-column: 1 / -1; }
  .dash-row { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .dash-top { grid-template-columns: auto auto; }
  .dash-search { display: none; }
  .dash-head { grid-template-columns: 1fr; }
  .dash-grid { grid-template-columns: 1fr; }
  .dash-main { padding: 18px 14px 30px; }
}

/* Suport pill button (top-right) */
.dp-support-btn { display:inline-flex; align-items:center; gap:7px; padding:7px 13px; border-radius:999px;
  background:rgba(139,123,255,.12); border:1px solid rgba(139,123,255,.35); color:#fff; text-decoration:none;
  font-family:Inter, system-ui, -apple-system, "Segoe UI", sans-serif; font-size:13px; font-weight:600; line-height:1; white-space:nowrap;
  transition:box-shadow .2s, border-color .2s, background .2s; }
.dp-support-btn svg { width:16px; height:16px; flex:none; color:#b8adff; }
.dp-support-btn:hover, .dp-support-btn:focus-visible { background:rgba(139,123,255,.2); border-color:rgba(139,123,255,.6);
  box-shadow:0 0 18px rgba(139,123,255,.35); outline:none; color:#fff; }
.dash-top { grid-template-columns:auto 1fr auto auto auto; }
.dash-top .dp-lang { justify-self: end; }
.dash-top .dp-support-btn { justify-self:end; }
@media (max-width:760px) { .dp-support-btn { padding:8px; } .dp-support-btn span { display:none; } }

/* staff/admin: sidebar keeps only Panou; other destinations are cards inside panou.html */
body.is-moderator .dash-nav a:not([href="/panou.html"]) { display: none !important; }

/* staff notifications: count badge, panel header, unread rows, card badges, toasts */
.dash-bell i { top: 3px; right: 3px; width: auto; height: 16px; min-width: 16px; padding: 0 4px; box-sizing: border-box; border-radius: 999px; font-style: normal; font-size: 10px; font-weight: 800; line-height: 16px; color: #fff; text-align: center; }
.dash-notifs-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.dash-notifs-read { padding: 5px 10px; border-radius: 999px; border: 1px solid rgba(139,123,255,.35); background: rgba(139,123,255,.12); color: #fff; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
.dash-notifs-read:hover { box-shadow: 0 0 14px rgba(139,123,255,.35); }
.dash-notifs li.is-unread a { border-color: rgba(139,123,255,.55); background: rgba(139,123,255,.12); }
.dash-notifs li.is-unread a strong::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 6px; border-radius: 50%; background: #8b7bff; box-shadow: 0 0 8px #8b7bff; vertical-align: 1px; }
[data-notif-cat] { position: relative; }
.dp-notif-badge { position: absolute; top: 10px; right: 10px; min-width: 22px; height: 22px; padding: 0 7px; box-sizing: border-box; display: grid; place-items: center; border-radius: 999px; background: #fb7185; color: #fff; font-size: 12px; font-weight: 800; box-shadow: 0 0 12px rgba(251,113,133,.6); }
.dp-notif-badge[hidden] { display: none; }
.dp-toasts { position: fixed; right: 18px; bottom: 18px; z-index: 100; display: grid; gap: 8px; max-width: min(360px, calc(100vw - 36px)); }
.dp-toast { display: block; padding: 12px 14px; border-radius: 12px; background: rgba(16, 13, 40, .95); border: 1px solid rgba(139,123,255,.45); color: #fff; font-size: 13px; font-weight: 600; text-decoration: none; box-shadow: 0 10px 30px rgba(0,0,0,.4), 0 0 18px rgba(139,123,255,.25); transition: opacity .5s, transform .5s; }
.dp-toast.is-out { opacity: 0; transform: translateY(8px); }

/* mandatory category */
.dp-chat-topic-error, .dp-cat-error { margin: 8px 0 0; padding: 8px 12px; border-radius: 10px; border: 1px solid rgba(251,113,133,.5); background: rgba(251,113,133,.12); color: #fecdd3; font-size: 13px; font-weight: 600; }
select[aria-invalid="true"] { border-color: rgba(251,113,133,.8) !important; box-shadow: 0 0 0 3px rgba(251,113,133,.18); }

/* member notifications */
.dash-nav [data-notif-cat] .dp-notif-badge { position: static; margin-left: auto; min-width: 20px; height: 20px; font-size: 11px; box-shadow: none; }
.dash-nav a[data-notif-cat] { display: flex; align-items: center; }
.dp-chat-unread { position: absolute; top: 6px; right: 6px; width: 14px; height: 14px; border-radius: 50%; background: #fb7185; border: 2px solid #0b0e18; box-shadow: 0 0 10px #fb7185; animation: dp-unread-pulse 1.6s ease-in-out infinite; }
.dp-chat-unread[hidden] { display: none; }
@keyframes dp-unread-pulse { 50% { transform: scale(1.25); } }
.dash-notify.is-nav .dash-bell { width: 36px; height: 36px; border-radius: 999px; }
@media (prefers-reduced-motion: reduce) { .dp-chat-unread { animation: none; } }

.dp-chat-btn { margin-right:8px; }
.dp-chat-btn + .dp-support-btn { margin-left:0; }