/**
 * MUD3 Client - WP Client Theme
 * Replica of classic WP MUD client: parchment scroll, wooden frame, purple/gold nav
 * Reference: wpclient.jpg
 */

[data-theme="wpclient"] {
  /* Color Palette - Parchment & Wood */
  --bg-primary: #2c2218;
  --bg-secondary: #3d3024;
  --bg-tertiary: #4a3c2e;
  --bg-accent: #5c4a38;

  /* Parchment scroll */
  --parchment: #e8dcb8;
  --parchment-dark: #d4c49a;
  --parchment-shadow: #b8a878;

  --text-primary: #3d2e1f;
  --text-secondary: #4a3828;
  --text-muted: #6b5a48;

  /* Purple banners, gold accents */
  --nav-purple: #4a3a6a;
  --nav-purple-light: #5c4a7a;
  --gold: #c9a227;
  --gold-light: #e8c84a;
  --gold-dark: #9a7b1a;

  --wood-dark: #1a1510;
  --border-color: rgba(201, 162, 39, 0.25);
  --border-accent: rgba(201, 162, 39, 0.5);

  --menu-text: #e8dcb8;
  --footer-text: #d4c49a;
  --footer-link: #e8c84a;

  --shadow-soft: 0 4px 20px rgba(0, 0, 0, 0.5);
  --shadow-inset: inset 0 2px 8px rgba(0, 0, 0, 0.2);
}

/* ==================== Body & Background ==================== */

[data-theme="wpclient"] body {
  background: 
    repeating-linear-gradient(
      90deg,
      var(--bg-primary) 0px,
      var(--bg-primary) 2px,
      var(--wood-dark) 2px,
      var(--wood-dark) 4px
    ),
    linear-gradient(135deg, var(--bg-secondary) 0%, var(--bg-primary) 50%, var(--bg-tertiary) 100%);
  color: var(--text-primary);
  font-family: 'Crimson Pro', 'Times New Roman', serif;
}

[data-theme="wpclient"] .bg-pattern {
  background-image:
    url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 20h40M20 0v40' stroke='%233d3024' stroke-width='0.5' opacity='0.5'/%3E%3C/svg%3E");
  background-size: 40px 40px;
  opacity: 0.6;
}

[data-theme="wpclient"] .bg-vignette {
  background: radial-gradient(ellipse at center, transparent 30%, rgba(0,0,0,0.6) 100%);
}

/* ==================== Header ==================== */

[data-theme="wpclient"] .top-bar {
  background: linear-gradient(180deg, var(--bg-secondary) 0%, transparent 100%);
  border-bottom: 2px solid var(--gold-dark);
  box-shadow: 0 2px 8px rgba(0,0,0,0.4);
}

[data-theme="wpclient"] .logo {
  font-family: 'Cinzel', serif;
  color: var(--gold);
  text-shadow: 1px 1px 0 var(--gold-dark), 0 0 8px rgba(201, 162, 39, 0.4);
}

[data-theme="wpclient"] .logo-accent {
  color: #2d5a3d;
  text-shadow: 1px 1px 0 #1a3d28;
}

[data-theme="wpclient"] .theme-icon-btn {
  color: var(--gold);
}

[data-theme="wpclient"] .theme-icon-btn:hover {
  color: var(--gold-light);
}

[data-theme="wpclient"] .tagline {
  color: var(--gold-dark);
  font-family: 'Crimson Pro', serif;
}

[data-theme="wpclient"] .icon-btn {
  background: var(--nav-purple);
  border: 1px solid var(--gold-dark);
  color: var(--gold-light);
}

[data-theme="wpclient"] .icon-btn:hover {
  background: var(--nav-purple-light);
  border-color: var(--gold);
  color: var(--gold);
}

[data-theme="wpclient"] .btn-connect {
  background: linear-gradient(180deg, var(--gold-light) 0%, var(--gold) 50%, var(--gold-dark) 100%);
  color: var(--wood-dark);
  border: 1px solid var(--gold-dark);
  box-shadow: var(--shadow-soft), inset 0 1px 0 rgba(255,255,255,0.3);
  font-weight: 700;
}

[data-theme="wpclient"] .btn-connect:hover {
  filter: brightness(1.1);
}

[data-theme="wpclient"] .btn-disconnect {
  background: linear-gradient(180deg, #8b4513 0%, #6b3410 100%);
  color: var(--gold-light);
  border: 1px solid var(--gold-dark);
}

/* ==================== Status Bar ==================== */

[data-theme="wpclient"] .status-bar {
  background: var(--parchment-dark);
  border-bottom: 1px solid var(--gold-dark);
  box-shadow: var(--shadow-inset);
}

[data-theme="wpclient"] .stat-label {
  color: var(--text-secondary);
  font-family: 'Cinzel', serif;
}

[data-theme="wpclient"] .stat-value {
  color: var(--text-primary);
}

[data-theme="wpclient"] .stat-score .stat-value {
  color: var(--gold-dark);
}

[data-theme="wpclient"] .weather-sunny { color: #9a7b1a; }
[data-theme="wpclient"] .weather-cloudy { color: #6b5a48; }
[data-theme="wpclient"] .weather-raining { color: #4a6a8a; }
[data-theme="wpclient"] .weather-snowing { color: #c4b59d; }
[data-theme="wpclient"] .weather-foggy { color: #5c4a38; }
[data-theme="wpclient"] .weather-stormy { color: #6a4a5a; }

/* ==================== Button Panel - Purple banners with gold text ==================== */

[data-theme="wpclient"] .button-panel {
  background: linear-gradient(180deg, var(--nav-purple-light) 0%, var(--nav-purple) 100%);
  border: 2px solid var(--gold-dark);
  border-radius: 8px;
  box-shadow: var(--shadow-soft), inset 0 1px 0 rgba(255,255,255,0.1);
}

[data-theme="wpclient"] .section-title {
  color: var(--gold-light);
  font-family: 'Cinzel', serif;
  border-bottom: 1px solid var(--gold-dark);
}

/* Command Buttons - Metallic gold/bronze */
[data-theme="wpclient"] .cmd-btn {
  background: linear-gradient(180deg, var(--gold-light) 0%, var(--gold) 50%, var(--gold-dark) 100%);
  border: 1px solid var(--gold-dark);
  border-radius: 6px;
  color: var(--wood-dark);
  font-family: 'Cinzel', serif;
  font-weight: 700;
  box-shadow: 0 2px 4px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.3);
}

[data-theme="wpclient"] .cmd-btn:hover {
  filter: brightness(1.15);
  box-shadow: 0 4px 8px rgba(0,0,0,0.4);
}

[data-theme="wpclient"] .compass-main {
  background: linear-gradient(180deg, var(--gold-light) 0%, var(--gold) 100%);
  border-color: var(--gold-dark);
  color: var(--wood-dark);
}

[data-theme="wpclient"] .compass-main:hover {
  filter: brightness(1.1);
}

[data-theme="wpclient"] .compass-center {
  background: var(--nav-purple);
  border-color: var(--gold);
  color: var(--gold-light);
}

[data-theme="wpclient"] .swamp-btn {
  background: linear-gradient(180deg, #4a7c59 0%, #2d5a3d 100%);
  border-color: #1a3d28;
  color: #c8e6c9;
}

[data-theme="wpclient"] .combat-btn {
  background: linear-gradient(180deg, #8b4513 0%, #6b3410 100%);
  border-color: #4a2a08;
  color: var(--gold-light);
}

[data-theme="wpclient"] .combat-flee {
  background: linear-gradient(180deg, #a67c3d 0%, #8b6914 100%);
  border-color: var(--gold-dark);
  color: var(--wood-dark);
}

[data-theme="wpclient"] .action-quit {
  background: linear-gradient(180deg, #5c4a38 0%, #3d3024 100%);
  border-color: var(--gold-dark);
  color: var(--parchment);
}

/* ==================== Terminal - Parchment scroll ==================== */

[data-theme="wpclient"] .terminal-frame {
  background:
    linear-gradient(135deg, var(--parchment) 0%, var(--parchment-dark) 50%, var(--parchment) 100%);
  border: 3px solid var(--gold-dark);
  box-shadow:
    var(--shadow-soft),
    var(--shadow-inset),
    inset 0 0 60px rgba(184, 168, 120, 0.3);
}

[data-theme="wpclient"] .terminal {
  background: transparent;
  color: var(--text-primary);
}

[data-theme="wpclient"] .terminal .terminal-line span {
  color: inherit;
}

[data-theme="wpclient"] .system-message {
  color: var(--gold-dark);
}

/* ==================== Input Area - Light beige ==================== */

[data-theme="wpclient"] .input-wrapper {
  background: var(--parchment);
  border: 2px solid var(--gold-dark);
  box-shadow: var(--shadow-inset);
}

[data-theme="wpclient"] .input-wrapper:focus-within {
  border-color: var(--gold);
  box-shadow: 0 0 0 1px var(--gold);
}

[data-theme="wpclient"] .input-prompt {
  color: var(--gold-dark);
}

[data-theme="wpclient"] .command-input {
  color: var(--text-primary);
  background: transparent;
}

[data-theme="wpclient"] .command-input::placeholder {
  color: var(--text-muted);
}

[data-theme="wpclient"] .send-btn {
  background: linear-gradient(180deg, var(--gold-light) 0%, var(--gold) 100%);
  color: var(--wood-dark);
  font-family: 'Cinzel', serif;
  font-weight: 700;
  border: 1px solid var(--gold-dark);
  box-shadow: 0 2px 4px rgba(0,0,0,0.3);
}

[data-theme="wpclient"] .send-btn:hover {
  filter: brightness(1.1);
}

[data-theme="wpclient"] .hint {
  color: var(--text-muted);
}

/* ==================== Footer ==================== */

[data-theme="wpclient"] .app-footer {
  color: var(--footer-text);
  background: linear-gradient(0deg, var(--bg-secondary) 0%, transparent 100%);
  border-top: 1px solid var(--gold-dark);
}

[data-theme="wpclient"] .app-footer a {
  color: var(--footer-link);
}

[data-theme="wpclient"] .app-footer a:hover {
  color: var(--gold-light);
}

/* ==================== Scrollbar - Gold/bronze ==================== */

[data-theme="wpclient"] ::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

[data-theme="wpclient"] ::-webkit-scrollbar-track {
  background: var(--parchment-shadow);
  border-radius: 4px;
}

[data-theme="wpclient"] ::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--gold) 0%, var(--gold-dark) 100%);
  border-radius: 4px;
  border: 2px solid var(--parchment-shadow);
}

[data-theme="wpclient"] ::-webkit-scrollbar-thumb:hover {
  background: var(--gold-light);
}

[data-theme="wpclient"] ::selection {
  background: rgba(201, 162, 39, 0.4);
  color: var(--text-primary);
}