:root {
    --background-color: #1a1a1a;
    --bright-green: #00CC7C; /* Slightly brighter green */
    --white-text: #FFFFFF; /* Pure white for post content and terminal output/input */
    --purple-title: #8A2BE2; /* Purple for titles */
    --action-approve-color: #00BFFF; /* Deep Sky Blue for approve/toggle */
    --action-reject-color: #FF4500; /* Orange Red for reject */
    --light-blue: #ADD8E6; /* Light blue for terminal links */

    --text-color: var(--bright-green);
    --link-color: var(--bright-green);
    --link-hover-color: #ffff00;
    --header-background: #333333;
    --header-text-color: var(--bright-green);
    --button-background: #000000; /* Black */
    --button-text-color: var(--bright-green);
    --button-hover-background: #000000; /* Black */
    --button-hover-text-color: var(--bright-green);

    --terminal-red: #8B0000; /* Dark Red */
    --terminal-red-dark: #550000; /* Even darker red for border */
    --terminal-red-text: #FFFFFF; /* White text for error messages */
}

* {
    background-color: transparent !important;
}

html, body {
    height: 100%;
    background-color: var(--background-color) !important;
}

body {
    font-family: 'Courier New', Courier, monospace;
}

/* New terminal classes */
.terminal-body {
    background-color: var(--background-color) !important;
    color: var(--text-color) !important;
}

.terminal-header {
    background-color: var(--header-background) !important;
    color: var(--header-text-color) !important;
    box-shadow: none !important; /* Remove shadow */
}

.terminal-main {
    background-color: var(--background-color) !important;
    color: var(--text-color) !important;
}

/* Override Tailwind defaults for text and links */
.text-gray-800 {
    color: var(--header-text-color) !important;
}

.text-blue-500 {
    color: var(--link-color) !important;
}

.text-blue-500:hover {
    color: var(--link-hover-color) !important;
}

.text-red-500 {
    color: #ff0000 !important; /* Keep red for logout, but make it strong */
}

.text-red-500:hover {
    text-decoration: underline !important;
}

.text-green-500 {
    color: var(--link-color) !important;
}

.text-green-500:hover {
    color: var(--link-hover-color) !important;
}

/* Flash message colors */
.bg-terminal-red {
    background-color: var(--terminal-red) !important;
}

.border-terminal-red-dark {
    border-color: var(--terminal-red-dark) !important;
}

.text-terminal-red-text {
    color: var(--terminal-red-text) !important;
}

/* General overrides for elements that might have default Tailwind styling */
.bg-gray-100 {
    background-color: var(--background-color) !important;
}

.bg-white {
    background-color: var(--header-background) !important;
}

.shadow-md {
    box-shadow: none !important;
}

/* Full-screen terminal styling */
.terminal-full-screen {
    background-color: var(--background-color) !important;
    width: 100%;
    height: 100%;
    padding: 1rem;
    box-sizing: border-box;
}

#terminal-output {
    color: var(--white-text) !important;
}

#terminal-output div {
    white-space: pre-wrap;
    word-wrap: break-word;
}

#terminal-output img {
    max-width: 50%;
    height: auto;
}

.terminal-link {
    color: var(--light-blue) !important;
    text-decoration: underline !important;
}

.terminal-link:hover {
    color: var(--link-hover-color) !important;
}

/* Terminal input area styling */
.terminal-input-area {
    border: none !important;
    outline: none !important;
    background-color: transparent !important;
    color: var(--white-text) !important;
}

/* Ensure all text within the body respects the terminal text color */
p, div, span, h1, h2, h3, h4, h5, h6, li, ul, ol, table, th, td {
    color: var(--text-color) !important;
}

/* Post content text white */
.prose,
.bg-gray-50 p {
    color: var(--white-text) !important;
}

/* Purple for titles */
h1, h2, h3, h4, h5, h6 {
    color: var(--purple-title) !important;
}

/* Specific overrides for links within the main content */
main a {
    color: var(--link-color) !important;
}

main a:hover {
    color: var(--link-hover-color) !important;
}

/* Action link colors */
.text-red-600, .text-red-900 {
    color: var(--action-reject-color) !important;
}

.text-green-600, .text-green-900,
.text-blue-600, .text-blue-900,
.text-indigo-600, .text-indigo-900 {
    color: var(--action-approve-color) !important;
}

/* Buttons */
button, input[type="submit"], .btn {
    background-color: #000000 !important;
    color: var(--text-color) !important;
    border: none !important;
    padding: 0.5rem 1rem !important;
    border-radius: 0 !important;
    cursor: pointer !important;
}

button:hover, input[type="submit"]:hover, .btn:hover {
    background-color: #000000 !important;
    color: var(--text-color) !important;
    font-weight: bold !important;
    text-decoration: underline !important;
    border: none !important;
}

/* Input fields */
input[type="text"], input[type="email"], input[type="password"], textarea {
    background-color: #000000 !important;
    color: var(--text-color) !important;
    border: 1px solid var(--text-color) !important;
    padding: 0.5rem !important;
    border-radius: 0 !important;
}

input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus, textarea:focus {
    outline: none !important;
    border-color: var(--link-hover-color) !important;
}

/* Table styling for admin pages */
table {
    width: 100% !important;
    border-collapse: collapse !important;
    margin-top: 1rem !important;
}

th, td {
    border: 1px solid var(--text-color) !important;
    padding: 0.5rem !important;
    text-align: left !important;
}

th {
    background-color: var(--header-background) !important;
    color: var(--header-text-color) !important;
}

/* Checkbox flag color */
input[type="checkbox"].form-checkbox {
    accent-color: var(--action-approve-color) !important;
}

/* Checkbox and associated text */
.form-checkbox + label,
.form-checkbox + span {
    color: var(--text-color) !important;
}

.terminal-input-line .cursor {
  animation: blink 1s linear infinite;
}

@keyframes blink {
  0% {
    color: var(--white-text); 
  }
  50% {
    opacity: 0;
  }
  50.01%, 100% {
    opacity: 1;
  }
}

.terminal-main::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%);
  background-size: 100% 2px;
  pointer-events: none;
  animation: scanlines 90s linear infinite;
}

@keyframes scanlines {
  from {
    background-position: 0 0;
  }
  to {
    background-position: 0 100%;
  }
}