/* Exact Pterodactyl 1.x Styling & Component Rules */
body {
  background-color: hsl(209, 20%, 25%);
  color: hsl(210, 16%, 82%);
}

/* Top Navigation Bar Active Link (NavigationBar.tsx) */
.ptero-nav-link {
  display: flex;
  align-items: center;
  height: 100%;
  padding: 0 1.25rem;
  color: hsl(211, 13%, 65%);
  transition: all 150ms ease;
  cursor: pointer;
}

.ptero-nav-link:hover,
.ptero-nav-link.active {
  color: hsl(214, 15%, 91%);
  background-color: #131a20;
  box-shadow: inset 0 -2px #0891b2;
}

/* SubNavigation Bar (SubNavigation.tsx) */
.ptero-subnav {
  width: 100%;
  background-color: hsl(209, 18%, 30%);
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.25);
  overflow-x: auto;
}

.ptero-subnav-item {
  display: inline-flex;
  align-items: center;
  padding: 0.75rem 1rem;
  color: hsl(211, 13%, 65%);
  font-size: 0.875rem;
  white-space: nowrap;
  transition: all 150ms ease;
  cursor: pointer;
  border-bottom: 2px solid transparent;
}

.ptero-subnav-item:hover {
  color: hsl(214, 15%, 91%);
}

.ptero-subnav-item.active {
  color: hsl(214, 15%, 91%);
  box-shadow: inset 0 -2px #0891b2;
}

/* GreyRowBox & ServerRow (ServerRow.tsx) */
.ptero-server-row {
  background-color: hsl(209, 18%, 30%);
  border-radius: 0.25rem;
  padding: 1rem 1.25rem;
  position: relative;
  transition: background-color 150ms ease, border-color 150ms ease;
  border: 1px solid transparent;
}

.ptero-server-row:hover {
  background-color: hsl(209, 14%, 34%);
  border-color: hsl(211, 12%, 43%);
}

.ptero-status-bar {
  width: 0.5rem;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 20;
  border-radius: 9999px;
  margin: 0.25rem;
  height: calc(100% - 0.5rem);
  opacity: 0.65;
  transition: all 150ms ease;
}

.ptero-server-row:hover .ptero-status-bar {
  opacity: 0.95;
}

/* File Manager Rows (files/style.module.css) */
.ptero-file-row {
  display: flex;
  align-items: center;
  cursor: pointer;
  background-color: hsl(209, 18%, 30%);
  border-radius: 0.125rem;
  margin-bottom: 1px;
  font-size: 0.875rem;
  transition: background-color 100ms ease, color 100ms ease;
}

.ptero-file-row:hover {
  color: hsl(214, 15%, 91%);
  background-color: hsl(209, 14%, 37%);
}

/* Pterodactyl Custom Checkbox */
.ptero-checkbox {
  appearance: none;
  width: 1rem;
  height: 1rem;
  background-color: hsl(210, 24%, 16%);
  border: 1px solid hsl(211, 10%, 53%);
  border-radius: 0.15rem;
  cursor: pointer;
  display: inline-grid;
  place-content: center;
}

.ptero-checkbox:checked {
  background-color: #2563eb;
  border-color: #3b82f6;
}

.ptero-checkbox:checked::before {
  content: "";
  width: 0.5rem;
  height: 0.5rem;
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
  background-color: white;
}

/* Terminal / Console Styling (console/style.module.css) */
.ptero-terminal-output {
  background-color: #131a20;
  font-family: "JetBrains Mono", monospace;
  font-size: 12.5px;
  line-height: 1.55;
  overflow-y: auto;
  height: 410px;
  padding: 0.75rem 1rem;
  border-top-left-radius: 0.25rem;
  border-top-right-radius: 0.25rem;
  color: #d0d0d0;
}

.ptero-terminal-output::-webkit-scrollbar {
  width: 8px;
}

.ptero-terminal-output::-webkit-scrollbar-track {
  background: #131a20;
}

.ptero-terminal-output::-webkit-scrollbar-thumb {
  background: hsl(209, 18%, 30%);
  border-radius: 4px;
}

/* Obfuscated / Blurred Daemon Internal Logs (Permanently Redacted) */
.ptero-blurred-log {
  filter: blur(5.5px) !important;
  opacity: 0.35 !important;
  user-select: none !important;
  pointer-events: none !important;
  cursor: default !important;
  color: #7f8c9a !important;
  letter-spacing: 1px !important;
  line-height: 1.4 !important;
  transform: translateZ(0);
}

.ptero-command-input {
  background-color: hsl(210, 24%, 16%);
  color: hsl(214, 15%, 91%);
  font-family: "JetBrains Mono", monospace;
  font-size: 0.875rem;
  border-bottom: 2px solid transparent;
  transition: border-color 150ms ease;
}

.ptero-command-input:focus {
  outline: none;
  border-bottom-color: #06b6d4;
}

/* Code Editor Styling */
.ptero-code-editor-wrap {
  position: relative;
  display: flex;
  background-color: #131a20;
  border: 1px solid hsl(209, 18%, 30%);
  border-radius: 0.25rem;
  height: 520px;
  overflow: hidden;
}

.ptero-line-numbers {
  background-color: hsl(210, 24%, 16%);
  color: hsl(211, 10%, 53%);
  font-family: "JetBrains Mono", monospace;
  font-size: 13px;
  line-height: 1.6;
  padding: 0.75rem 0.75rem;
  text-align: right;
  user-select: none;
  border-right: 1px solid hsl(209, 18%, 30%);
  min-width: 3.25rem;
  overflow: hidden;
}

.ptero-code-textarea {
  flex: 1;
  background-color: #131a20;
  color: #f8fafc;
  font-family: "JetBrains Mono", monospace;
  font-size: 13px;
  line-height: 1.6;
  padding: 0.75rem 1rem;
  resize: none;
  outline: none;
  border: none;
  white-space: pre;
  overflow: auto;
  tab-size: 2;
}

/* TitledGreyBox */
.ptero-titled-box {
  background-color: hsl(209, 18%, 30%);
  border-radius: 0.25rem;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.2);
  overflow: hidden;
}

.ptero-titled-box-header {
  background-color: hsl(210, 24%, 16%);
  padding: 0.75rem 1rem;
  border-bottom: 1px solid hsl(209, 20%, 25%);
  font-family: "IBM Plex Sans", sans-serif;
  font-size: 0.875rem;
  text-transform: uppercase;
  letter-spacing: 0.025em;
  color: hsl(214, 15%, 91%);
  font-weight: 500;
}

/* Inputs */
.ptero-input {
  width: 100%;
  background-color: hsl(209, 20%, 25%);
  border: 2px solid hsl(209, 14%, 37%);
  border-radius: 0.25rem;
  padding: 0.55rem 0.75rem;
  font-size: 0.875rem;
  color: hsl(214, 15%, 91%);
  transition: border-color 150ms ease, box-shadow 150ms ease;
}

.ptero-input:focus {
  outline: none;
  border-color: #3b82f6;
}

.ptero-input-light {
  width: 100%;
  background-color: #f8fafc;
  border: 2px solid #cbd5e1;
  border-radius: 0.25rem;
  padding: 0.65rem 0.75rem;
  font-size: 0.875rem;
  color: #1e293b;
  transition: border-color 150ms ease;
}

.ptero-input-light:focus {
  outline: none;
  border-color: #3b82f6;
}

/* ==================== ACTIVE NAV HIGHLIGHTS ==================== */
.ptero-nav-link.active {
  box-shadow: inset 0 -2px #06b6d4 !important;
}

.ptero-subnav-item.active {
  box-shadow: inset 0 -2px #06b6d4 !important;
}

/* ==================== COMPREHENSIVE LIGHT THEME (html.light) ==================== */
html.light body {
  background-color: #f1f5f9 !important;
  color: #1e293b !important;
}

html.light .bg-neutral-900,
html.light .bg-neutral-800,
html.light .bg-black {
  background-color: #ffffff !important;
}

html.light .bg-neutral-950 {
  background-color: #f8fafc !important;
}

html.light .border-neutral-800,
html.light .border-neutral-700,
html.light .border-neutral-600 {
  border-color: #e2e8f0 !important;
}

html.light .text-gray-50,
html.light .text-neutral-100,
html.light .text-neutral-200 {
  color: #0f172a !important;
}

html.light .text-neutral-300,
html.light .text-neutral-400 {
  color: #475569 !important;
}

html.light .text-neutral-500 {
  color: #64748b !important;
}

html.light .ptero-nav-link {
  color: #475569 !important;
}

html.light .ptero-nav-link:hover,
html.light .ptero-nav-link.active {
  color: #0f172a !important;
  background-color: #f8fafc !important;
}

html.light .ptero-subnav {
  background-color: #ffffff !important;
  border-bottom: 1px solid #e2e8f0 !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) !important;
}

html.light .ptero-subnav-item {
  color: #64748b !important;
}

html.light .ptero-subnav-item:hover,
html.light .ptero-subnav-item.active {
  color: #0f172a !important;
}

html.light .ptero-titled-box {
  background-color: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
}

html.light .ptero-titled-box-header {
  background-color: #f8fafc !important;
  color: #0f172a !important;
  border-bottom: 1px solid #e2e8f0 !important;
  font-weight: 600 !important;
}

html.light .ptero-input {
  background-color: #ffffff !important;
  border: 1.5px solid #cbd5e1 !important;
  color: #0f172a !important;
}

html.light .ptero-input:focus {
  border-color: #2563eb !important;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.15) !important;
}

html.light .ptero-server-row {
  background-color: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
}

html.light .ptero-server-row:hover {
  background-color: #f8fafc !important;
  border-color: #cbd5e1 !important;
}

html.light .ptero-file-row {
  background-color: #ffffff !important;
  border-bottom: 1px solid #f1f5f9 !important;
  color: #1e293b !important;
}

html.light .ptero-file-row:hover {
  background-color: #f1f5f9 !important;
  color: #0f172a !important;
}

html.light .ptero-modal-card {
  background-color: #ffffff !important;
  color: #0f172a !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1) !important;
}

html.light .bg-gray-600,
html.light .bg-gray-700 {
  background-color: #ffffff !important;
  border: 1px solid #e2e8f0 !important;
  color: #0f172a !important;
}

html.light .text-gray-200 {
  color: #64748b !important;
}

html.light footer {
  border-color: #e2e8f0 !important;
  color: #64748b !important;
}
