/* Dashboard + app pages — match home landing aesthetic. Load after styles.css */

.landing-body {
  color: var(--landing-text);
  background: var(--landing-bg);
}

.landing-body.bg-slate-950 {
  background: var(--landing-bg) !important;
  color: var(--landing-text) !important;
}

.landing-body,
.landing-body * {
  scrollbar-color: rgba(255, 255, 255, 0.22) rgba(0, 0, 0, 0.45);
}

.landing-body *::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.45);
}

.landing-body *::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.18);
  border-color: rgba(0, 0, 0, 0.45);
}

.landing-body *::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.28);
}

.landing-body *::-webkit-scrollbar-thumb:active {
  background: var(--landing-accent);
}

.app-main {
  flex: 1;
  width: 100%;
  max-width: 72rem;
  margin: 0 auto;
  padding: 2rem 1.5rem 3.5rem;
}

.landing-body section.rounded-xl {
  border-radius: 1.5rem !important;
  border: 1px solid var(--landing-border) !important;
  background: var(--landing-glass) !important;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.landing-body [class*="border-amber-900"] {
  border-color: rgba(255, 214, 10, 0.22) !important;
}

.landing-body [class*="border-red-900"] {
  border-color: rgba(255, 69, 58, 0.28) !important;
}

.landing-body [class*="border-green-900"] {
  border-color: rgba(48, 209, 88, 0.28) !important;
}

.landing-body .text-green-300,
.landing-body .text-blue-300 {
  color: #64d2ff !important;
}

.landing-body .bg-slate-950,
.landing-body .bg-slate-900,
.landing-body .bg-slate-900\/80,
.landing-body .bg-slate-800,
.landing-body [class*="bg-slate-9"] {
  background-color: rgba(22, 22, 23, 0.72) !important;
}

.landing-body .bg-slate-950 {
  background-color: transparent !important;
}

.landing-body .border-slate-800,
.landing-body .border-slate-700,
.landing-body .border-slate-600,
.landing-body [class*="border-slate-"] {
  border-color: var(--landing-border) !important;
}

.landing-body .text-slate-100,
.landing-body .text-slate-200 {
  color: var(--landing-text) !important;
}

.landing-body .text-slate-300 {
  color: rgba(245, 245, 247, 0.88) !important;
}

.landing-body .text-slate-400,
.landing-body .text-slate-500,
.landing-body .text-slate-600 {
  color: var(--landing-muted) !important;
}

.landing-body .text-amber-200,
.landing-body .text-amber-300,
.landing-body h2.text-amber-300,
.landing-body .text-lg.font-semibold.text-amber-300 {
  color: var(--landing-accent) !important;
}

.landing-body .text-amber-400,
.landing-body .text-amber-300\/80 {
  color: var(--landing-accent) !important;
}

.landing-body .text-red-300,
.landing-body .text-red-400 {
  color: #ff453a !important;
}

.landing-body .text-green-400 {
  color: #30d158 !important;
}

.landing-body code,
.landing-body .text-amber-200 {
  color: #7dc4ff !important;
}

.landing-body .stat-card,
.landing-body .metric-card,
.landing-body .metric-volume-row,
.landing-body .metric-storage-row,
.landing-body .clan-card {
  border: 1px solid var(--landing-border) !important;
  background: rgba(255, 255, 255, 0.04) !important;
  backdrop-filter: blur(16px);
}

.landing-body .stat-value {
  color: var(--landing-text) !important;
  letter-spacing: -0.03em;
}

.landing-body .stat-label,
.landing-body .metric-label,
.landing-body .metric-hint {
  color: var(--landing-muted) !important;
}

.landing-body .metric-value {
  color: var(--landing-text) !important;
}

.landing-body .metric-bar {
  background: rgba(255, 255, 255, 0.08) !important;
}

.landing-body .btn-secondary {
  color: #fff !important;
}

.landing-body .field > span {
  color: var(--landing-muted) !important;
}

.landing-body .input-field,
.landing-body select.input-field,
.landing-body textarea.input-field {
  border-radius: 0.85rem !important;
  border: 1px solid var(--landing-border) !important;
  background: rgba(0, 0, 0, 0.45) !important;
  color: var(--landing-text) !important;
}

.landing-body input.input-field,
.landing-body select.input-field,
.landing-body .combo-select-trigger {
  min-height: 2rem !important;
  height: 2rem !important;
  padding-top: 0.3125rem !important;
  padding-bottom: 0.3125rem !important;
  font-size: 0.8125rem !important;
  line-height: 1.125rem !important;
}

.landing-body select.input-field {
  padding-right: 2rem !important;
}

.landing-body textarea.input-field {
  min-height: 5rem !important;
  height: auto !important;
  padding: 0.5rem 0.75rem !important;
  font-size: 0.875rem !important;
  line-height: 1.25rem !important;
}

.landing-body .input-field::placeholder {
  color: var(--landing-muted) !important;
}

.landing-body .input-field:hover,
.landing-body select.input-field:hover {
  border-color: rgba(255, 255, 255, 0.14) !important;
}

.landing-body .input-field:focus,
.landing-body select.input-field:focus,
.landing-body textarea.input-field:focus {
  border-color: rgba(41, 151, 255, 0.55) !important;
  box-shadow: 0 0 0 4px rgba(41, 151, 255, 0.15) !important;
}

.landing-body .combo-select-trigger {
  border-radius: 0.85rem !important;
  border: 1px solid var(--landing-border) !important;
  background: rgba(0, 0, 0, 0.45) !important;
  color: var(--landing-text) !important;
  padding-left: 0.875rem !important;
  padding-right: 0.875rem !important;
}

.landing-body .combo-select-menu {
  border: 1px solid var(--landing-border) !important;
  background: rgba(18, 18, 19, 0.96) !important;
  backdrop-filter: blur(20px);
}

.landing-body .combo-select-option:hover,
.landing-body .combo-select-option.is-focused {
  background: rgba(255, 255, 255, 0.08) !important;
}

.landing-body .combo-select-option.is-selected {
  background: var(--landing-accent-soft) !important;
  color: var(--landing-text) !important;
}

.landing-body .combo-select-option.is-selected:hover,
.landing-body .combo-select-option.is-selected.is-focused {
  background: rgba(41, 151, 255, 0.22) !important;
  color: var(--landing-text) !important;
}

.landing-body .combo-select-trigger:focus-visible,
.landing-body .combo-select.is-open .combo-select-trigger {
  border-color: rgba(41, 151, 255, 0.55) !important;
  box-shadow: 0 0 0 4px rgba(41, 151, 255, 0.15) !important;
}

.landing-body .combo-select.combo-select-compact.combo-select-staff .combo-select-trigger {
  border-color: rgba(191, 90, 242, 0.4) !important;
  background: rgba(191, 90, 242, 0.1) !important;
}

.landing-body .combo-select.combo-select-compact.combo-select-staff .combo-select-trigger:hover {
  border-color: rgba(191, 90, 242, 0.55) !important;
  background: rgba(191, 90, 242, 0.16) !important;
}

.landing-body .combo-select.combo-select-compact.combo-select-staff.is-open .combo-select-trigger,
.landing-body .combo-select.combo-select-compact.combo-select-staff .combo-select-trigger:focus-visible {
  border-color: #bf5af2 !important;
  box-shadow: 0 0 0 4px rgba(191, 90, 242, 0.2) !important;
}

.landing-body select.input-field option:checked,
.landing-body select.input-field option:hover {
  background-color: rgba(41, 151, 255, 0.2) !important;
  color: var(--landing-text) !important;
}

.landing-body .modal-overlay {
  background: rgba(0, 0, 0, 0.72) !important;
  backdrop-filter: blur(12px);
}

.landing-body .modal-panel {
  border-radius: 1.25rem !important;
  border: 1px solid var(--landing-border) !important;
  background: rgba(22, 22, 23, 0.95) !important;
  backdrop-filter: blur(24px);
  box-shadow: 0 25px 80px rgba(0, 0, 0, 0.55) !important;
}

.landing-body .modal-panel-danger {
  border-color: rgba(255, 69, 58, 0.45) !important;
  background: linear-gradient(180deg, rgba(69, 10, 10, 0.55), rgba(22, 22, 23, 0.98)) !important;
}

.landing-body .modal-panel-success {
  border-color: rgba(48, 209, 88, 0.45) !important;
  background: linear-gradient(180deg, rgba(5, 46, 22, 0.45), rgba(22, 22, 23, 0.98)) !important;
}

.landing-body .admin-msg-history,
.landing-body .admin-dm-user-list,
.landing-body .admin-discord-embed {
  border-color: var(--landing-border) !important;
  background: rgba(0, 0, 0, 0.35) !important;
}

.landing-body .admin-discord-embed-author-name,
.landing-body .admin-discord-embed-title,
.landing-body .admin-discord-embed-field-name {
  color: var(--landing-text) !important;
}

.landing-body .admin-discord-embed-description,
.landing-body .admin-discord-embed-field-value {
  color: rgba(245, 245, 247, 0.85) !important;
}

.landing-body .admin-discord-embed-footer,
.landing-body .admin-msg-extra {
  color: var(--landing-muted) !important;
}

.landing-body .admin-dm-user-row:hover,
.landing-body .admin-dm-user-row.is-selected {
  background: rgba(255, 255, 255, 0.08) !important;
}

.notify-editor-layout {
  display: grid;
  gap: 1.5rem;
}

@media (min-width: 1024px) {
  .notify-editor-layout {
    grid-template-columns: minmax(0, 1.1fr) minmax(18rem, 0.9fr);
    align-items: start;
  }
}

.notify-editor-preview-wrap {
  position: sticky;
  top: 5.5rem;
  padding: 0.75rem;
  border-radius: 0.75rem;
  border: 1px solid var(--landing-border);
  background: rgba(0, 0, 0, 0.35);
}

.notify-placeholder-chip {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.7rem;
  padding: 0.2rem 0.5rem;
  border-radius: 9999px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.06);
  color: rgba(245, 245, 247, 0.9);
  cursor: pointer;
}

.notify-placeholder-chip:hover {
  border-color: rgba(245, 158, 11, 0.45);
  color: #fbbf24;
}

[data-notify-tab].is-active {
  border-color: rgba(245, 158, 11, 0.55) !important;
  color: #fbbf24 !important;
}

.landing-body .guild-picker-card,
.landing-body .channel-picker-card {
  cursor: pointer;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    background-color 0.15s ease;
}

.landing-body .guild-picker-card:hover,
.landing-body .channel-picker-card:hover {
  border-color: rgba(255, 255, 255, 0.18) !important;
}

.landing-body .guild-picker-card.is-selected,
.landing-body .channel-picker-card.is-selected {
  border-color: rgba(41, 151, 255, 0.55) !important;
  box-shadow: 0 0 0 1px rgba(41, 151, 255, 0.25);
  background: rgba(41, 151, 255, 0.08) !important;
}

.landing-body .admin-msg-row.is-outgoing .admin-msg-bubble {
  background: var(--landing-accent-soft) !important;
  border-color: rgba(41, 151, 255, 0.35) !important;
}

.landing-body .admin-msg-bubble {
  border: 1px solid var(--landing-border) !important;
  background: rgba(255, 255, 255, 0.06) !important;
  color: var(--landing-text) !important;
}

.landing-body .leaderboard-table th {
  color: var(--landing-muted) !important;
  border-color: var(--landing-border) !important;
}

.landing-body .leaderboard-table td {
  border-color: var(--landing-border) !important;
  color: var(--landing-text) !important;
}

.landing-body .leaderboard-table tbody tr:hover {
  background: rgba(255, 255, 255, 0.04) !important;
}

.landing-body .player-stats-table th {
  color: var(--landing-muted) !important;
  border-color: var(--landing-border) !important;
}

.landing-body .player-stats-table td {
  border-color: var(--landing-border) !important;
  color: var(--landing-text) !important;
}

.landing-body .player-stats-table tbody tr:hover {
  background: rgba(255, 255, 255, 0.04) !important;
}

.landing-body .member-roster-row,
.landing-body .wom-preview-row,
.landing-body .rank-ladder-row,
.landing-body .application-row {
  border-color: var(--landing-border) !important;
  background: rgba(255, 255, 255, 0.03) !important;
}

.landing-body .member-roster-row:hover,
.landing-body .rank-ladder-row:hover {
  background: rgba(255, 255, 255, 0.06) !important;
}

.landing-body .nav-link {
  color: var(--landing-muted);
}

.landing-body .nav-link:hover {
  color: var(--landing-text);
}

.landing-body .nav-link-active {
  color: #fff;
}

.landing-body table {
  color: var(--landing-text);
}

.landing-body hr {
  border-color: var(--landing-border) !important;
}

/* Ranks page — remap slate/amber ladder UI to landing palette */
.landing-body .text-violet-300,
.landing-body .landing-staff-heading {
  color: #bf5af2 !important;
}

.landing-body #hierarchy-dropzone {
  --rank-panel-accent: 41 151 255;
}

.landing-body #staff-dropzone {
  --rank-panel-accent: 191 90 242;
}

.landing-body .rank-tab {
  color: var(--landing-muted) !important;
}

.landing-body .rank-icon-library,
.landing-body .rank-hierarchy-panel,
.landing-body .rank-readonly-banner {
  border: 1px solid var(--landing-border) !important;
  background: rgba(255, 255, 255, 0.04) !important;
  backdrop-filter: blur(16px);
  color: var(--landing-text) !important;
}

.landing-body .rank-readonly-banner {
  color: rgba(245, 245, 247, 0.88) !important;
}

.landing-body .rank-icon-tile {
  border: 1px solid var(--landing-border) !important;
  background: rgba(0, 0, 0, 0.35) !important;
  color: rgba(245, 245, 247, 0.9) !important;
}

.landing-body .rank-icon-tile:hover {
  border-color: rgba(41, 151, 255, 0.45) !important;
  background: rgba(255, 255, 255, 0.08) !important;
}

.landing-body .rank-hierarchy {
  border: 1px dashed rgba(255, 255, 255, 0.14) !important;
  background: rgba(0, 0, 0, 0.2) !important;
}

.landing-body #hierarchy-dropzone.rank-drop-active {
  border-color: rgba(41, 151, 255, 0.55) !important;
  background: var(--landing-accent-soft) !important;
}

.landing-body #staff-dropzone.rank-drop-active,
.landing-body .rank-hierarchy-staff {
  border-color: rgba(191, 90, 242, 0.35) !important;
}

.landing-body #staff-dropzone.rank-drop-active {
  background: rgba(191, 90, 242, 0.08) !important;
}

.landing-body .rank-hierarchy-item,
.landing-body .rank-progress-item {
  border: 1px solid var(--landing-border) !important;
  background: rgba(255, 255, 255, 0.04) !important;
}

.landing-body .rank-hierarchy-item-staff {
  border-color: rgba(191, 90, 242, 0.35) !important;
  background: rgba(191, 90, 242, 0.08) !important;
}

.landing-body .rank-hierarchy-base-card {
  border: 1px solid rgba(41, 151, 255, 0.35) !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.06), rgba(0, 0, 0, 0.35)) !important;
}

.landing-body .rank-staff-section {
  border-top-color: var(--landing-border) !important;
}

.landing-body .rank-hierarchy-handle {
  color: var(--landing-muted) !important;
}

.landing-body .rank-hierarchy-empty,
.landing-body .rank-progress-joined,
.landing-body .rank-progress-muted,
.landing-body .rank-progress-field-label,
.landing-body .rank-progress-loading-stats {
  color: var(--landing-muted) !important;
}

.landing-body .rank-progress-name {
  color: var(--landing-text) !important;
}

.landing-body .rank-progress-item.is-eligible {
  background: rgba(48, 209, 88, 0.1) !important;
  border-color: rgba(48, 209, 88, 0.28) !important;
}

.landing-body .rank-progress-ready {
  color: #30d158 !important;
}

.landing-body .rank-progress-stats-banner {
  color: rgba(41, 151, 255, 0.9) !important;
}

.landing-body .rank-progress-arrow {
  color: var(--landing-muted) !important;
}

.landing-body .rank-progress-chip {
  border: 1px solid var(--landing-border) !important;
  background: rgba(0, 0, 0, 0.35) !important;
}

.landing-body .rank-progress-chip-label {
  color: var(--landing-muted) !important;
}

.landing-body .rank-progress-chip-values {
  color: var(--landing-text) !important;
}

.landing-body .rank-progress-chip.is-met {
  border-color: rgba(48, 209, 88, 0.35) !important;
  background: rgba(48, 209, 88, 0.12) !important;
}

.landing-body .rank-progress-chip.is-met .rank-progress-chip-values {
  color: #30d158 !important;
}

.landing-body .rank-chip {
  border: 1px solid var(--landing-border) !important;
  background: rgba(255, 255, 255, 0.06) !important;
  color: var(--landing-text) !important;
}

.landing-body .rank-chip-staff {
  border-color: rgba(191, 90, 242, 0.45) !important;
  background: rgba(191, 90, 242, 0.12) !important;
}

.landing-body .rank-chip-owner {
  border-color: rgba(41, 151, 255, 0.45) !important;
  background: var(--landing-accent-soft) !important;
}

.landing-body .rank-progress-field-staff .rank-progress-field-label {
  color: #bf5af2 !important;
}

.landing-body #hierarchy-dropzone .rank-hierarchy-item.rank-drag-over,
.landing-body #hierarchy-dropzone .rank-hierarchy-item.rank-drag-over-before,
.landing-body #hierarchy-dropzone .rank-hierarchy-item.rank-drag-over-after {
  border-color: rgb(41 151 255) !important;
  box-shadow: inset 0 3px 0 0 rgb(41 151 255);
}

.landing-body #staff-dropzone .rank-hierarchy-item.rank-drag-over,
.landing-body #staff-dropzone .rank-hierarchy-item.rank-drag-over-before,
.landing-body #staff-dropzone .rank-hierarchy-item.rank-drag-over-after {
  border-color: rgb(191 90 242) !important;
}

.landing-body .rank-panel-header h3,
.landing-body .rank-panel-header h4,
.landing-body .modal-header h2,
.landing-body h3.font-semibold {
  color: var(--landing-text) !important;
}

.landing-body .font-semibold {
  color: var(--landing-text);
}

.landing-body .text-sm.font-medium.text-slate-300 {
  color: rgba(245, 245, 247, 0.9) !important;
}

.landing-body .rank-progress-bar {
  height: 0.35rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  overflow: hidden;
}

.landing-body .rank-progress-bar-fill {
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--landing-accent), #30d158);
  transition: width 0.35s ease;
}

.landing-body .rank-req-row .input-field,
.landing-body .rank-req-row .btn-secondary {
  border-radius: 0.65rem !important;
}

.landing-body .rank-modal-rank-preview .rank-chip-lg {
  border-color: rgba(41, 151, 255, 0.35) !important;
  background: rgba(255, 255, 255, 0.06) !important;
}

.landing-body #staff-dropzone .rank-hierarchy-item.rank-drag-over-before {
  box-shadow: inset 0 3px 0 0 rgb(191 90 242) !important;
}

.landing-body #staff-dropzone .rank-hierarchy-item.rank-drag-over-after {
  box-shadow: inset 0 -3px 0 0 rgb(191 90 242) !important;
}

.landing-body .rank-progress-staff-label {
  color: var(--landing-muted) !important;
}

.landing-body .rank-progress-table {
  color: var(--landing-muted);
}

/* Dashboard combo menus extend over cards below — lift open section above siblings */
.landing-body section.rounded-xl:has(.combo-select.is-open) {
  position: relative;
  z-index: 45;
}

#schedule-section,
#schedule-form,
#schedule-section .field {
  overflow: visible;
}
