/**
 * NOSTR_LOGIN_LITE - Dark Monospace Theme
 */

:root {
  /* Core Variables (6) */
  --nl-primary-color: #white;
  --nl-secondary-color: #black;
  --nl-accent-color: #ff0000;
  --nl-muted-color: #666666;
  --nl-font-family: "Courier New", Courier, monospace;
  --nl-border-radius: 15px;
  --nl-border-width: 3px;
  
  /* Floating Tab Variables (8) */
  --nl-tab-bg-logged-out: #ffffff;
  --nl-tab-bg-logged-in: #000000;
  --nl-tab-bg-opacity-logged-out: 0.9;
  --nl-tab-bg-opacity-logged-in: 0.8;
  --nl-tab-color-logged-out: #000000;
  --nl-tab-color-logged-in: #ffffff;
  --nl-tab-border-logged-out: #000000;
  --nl-tab-border-logged-in: #ff0000;
  --nl-tab-border-opacity-logged-out: 1.0;
  --nl-tab-border-opacity-logged-in: 0.9;
}

/* Base component styles using simplified variables */
.nl-component {
  font-family: var(--nl-font-family);
  color: var(--nl-primary-color);
}

.nl-button {
  background: var(--nl-secondary-color);
  color: var(--nl-primary-color);
  border: var(--nl-border-width) solid var(--nl-primary-color);
  border-radius: var(--nl-border-radius);
  font-family: var(--nl-font-family);
  cursor: pointer;
  transition: all 0.2s ease;
}

.nl-button:hover {
  border-color: var(--nl-accent-color);
}

.nl-button:active {
  background: var(--nl-accent-color);
  color: var(--nl-secondary-color);
}

.nl-input {
  background: var(--nl-secondary-color);
  color: var(--nl-primary-color);
  border: var(--nl-border-width) solid var(--nl-primary-color);
  border-radius: var(--nl-border-radius);
  font-family: var(--nl-font-family);
  box-sizing: border-box;
}

.nl-input:focus {
  border-color: var(--nl-accent-color);
  outline: none;
}

.nl-container {
  background: var(--nl-secondary-color);
  border: var(--nl-border-width) solid var(--nl-primary-color);
  border-radius: var(--nl-border-radius);
}

.nl-title, .nl-heading {
  font-family: var(--nl-font-family);
  color: var(--nl-primary-color);
  margin: 0;
}

.nl-text {
  font-family: var(--nl-font-family);
  color: var(--nl-primary-color);
}

.nl-text--muted {
  color: var(--nl-muted-color);
}

.nl-icon {
  font-family: var(--nl-font-family);
  color: var(--nl-primary-color);
}

/* Floating tab styles */
.nl-floating-tab {
  font-family: var(--nl-font-family);
  border-radius: var(--nl-border-radius);
  border: var(--nl-border-width) solid;
  transition: all 0.2s ease;
}

.nl-floating-tab--logged-out {
  background: rgba(255, 255, 255, var(--nl-tab-bg-opacity-logged-out));
  color: var(--nl-tab-color-logged-out);
  border-color: rgba(0, 0, 0, var(--nl-tab-border-opacity-logged-out));
}

.nl-floating-tab--logged-in {
  background: rgba(0, 0, 0, var(--nl-tab-bg-opacity-logged-in));
  color: var(--nl-tab-color-logged-in);
  border-color: rgba(255, 0, 0, var(--nl-tab-border-opacity-logged-in));
}

.nl-transition {
  transition: all 0.2s ease;
}