/* ========================================================================
 * The Sims 2 GameCube Decomp — MkDocs Material custom theme
 *
 * Palette inspired by The Sims:
 *   Plumbob green (primary)  — the iconic crystal diamond above sims' heads
 *   Motive orange (accent)   — the warm motive-bar accents in the UI
 *   Build/Buy teal           — Sims 2 specific UI accent
 *   Cream off-white          — Sims UI panels
 *   Deep-green dark mode     — for night-mode reading
 *
 * Typography: Quicksand (text) + JetBrains Mono (code) — rounded, friendly,
 * with the chunky readable feel of Sims UI labels.
 * ====================================================================== */

/* ---------------- Light scheme (default) ---------------- */
[data-md-color-scheme="sims-light"] {
  /* Plumbob green primary */
  --md-primary-fg-color:                  #02BC4D;
  --md-primary-fg-color--light:           #43D979;
  --md-primary-fg-color--dark:            #018C39;
  --md-primary-bg-color:                  #FFFFFF;
  --md-primary-bg-color--light:           #F9FFF9;

  /* Motive-bar orange accent (clicks, links, highlights) */
  --md-accent-fg-color:                   #FF8C00;
  --md-accent-fg-color--transparent:      rgba(255, 140, 0, 0.10);
  --md-accent-bg-color:                   #FFFFFF;
  --md-accent-bg-color--light:            #FFF6E5;

  /* Sims-paper cream background */
  --md-default-bg-color:                  #FAFFF7;
  --md-default-bg-color--light:           #FFFFFF;
  --md-default-fg-color:                  #1A2418;
  --md-default-fg-color--light:           #354430;
  --md-default-fg-color--lighter:         #6B7E66;
  --md-default-fg-color--lightest:        #BDD0B8;

  /* Code block */
  --md-code-bg-color:                     #F2F8EE;
  --md-code-fg-color:                     #0F1F0D;

  /* Footer */
  --md-footer-bg-color:                   #1F2D1B;
  --md-footer-bg-color--dark:             #14201A;
  --md-footer-fg-color:                   #E8F5E1;

  /* Admonition palette */
  --md-admonition-bg-color:               #F5FBF1;
}

/* ---------------- Dark scheme (night-mode reading) ---------------- */
[data-md-color-scheme="sims-dark"] {
  --md-primary-fg-color:                  #43D979;
  --md-primary-fg-color--light:           #6EE89C;
  --md-primary-fg-color--dark:            #028C39;
  --md-primary-bg-color:                  #0A1610;
  --md-primary-bg-color--light:           #12241A;

  --md-accent-fg-color:                   #FFA64D;
  --md-accent-fg-color--transparent:      rgba(255, 166, 77, 0.16);
  --md-accent-bg-color:                   #0A1610;
  --md-accent-bg-color--light:            #1F1810;

  --md-default-bg-color:                  #0E1B14;
  --md-default-bg-color--light:           #14241A;
  --md-default-fg-color:                  #E1F0DA;
  --md-default-fg-color--light:           #BAD5B0;
  --md-default-fg-color--lighter:         #8BAF82;
  --md-default-fg-color--lightest:        #4D6845;

  --md-code-bg-color:                     #0A1610;
  --md-code-fg-color:                     #D8F2CD;

  --md-footer-bg-color:                   #06100A;
  --md-footer-bg-color--dark:             #040A06;
  --md-footer-fg-color:                   #B8DAB0;

  --md-admonition-bg-color:               #12241A;
}

/* ---------------- Typography polish ---------------- */
.md-header__title,
.md-nav__title,
.md-tabs__link {
  font-weight: 600;
  letter-spacing: 0.01em;
}

.md-typeset h1,
.md-typeset h2,
.md-typeset h3 {
  font-weight: 700;
  letter-spacing: -0.005em;
}

.md-typeset h1 {
  color: var(--md-primary-fg-color--dark);
}

[data-md-color-scheme="sims-dark"] .md-typeset h1 {
  color: var(--md-primary-fg-color);
}

/* ---------------- Plumbob diamond accent for h1 ---------------- */
.md-typeset h1::before {
  content: "◆ ";
  color: var(--md-primary-fg-color);
  margin-right: 0.15em;
  text-shadow: 0 0 6px var(--md-primary-fg-color--light);
}

/* ---------------- Header chrome ---------------- */
.md-header {
  background: linear-gradient(
    90deg,
    var(--md-primary-fg-color--dark) 0%,
    var(--md-primary-fg-color) 100%
  );
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.18);
}

.md-tabs {
  background: var(--md-primary-fg-color--dark);
}

/* ---------------- Buttons / links ---------------- */
.md-button {
  border-radius: 24px;
  font-weight: 600;
  text-transform: none;
  letter-spacing: 0.01em;
  padding: 0.55em 1.4em;
  transition: transform 0.12s ease, box-shadow 0.12s ease;
}

.md-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(2, 188, 77, 0.25);
}

.md-button--primary {
  background: linear-gradient(135deg,
    var(--md-primary-fg-color) 0%,
    var(--md-primary-fg-color--dark) 100%);
  color: #FFFFFF !important;
  border: none;
}

/* ---------------- Code blocks ---------------- */
.md-typeset code,
.md-typeset pre > code {
  border-radius: 6px;
  font-feature-settings: "calt", "liga";
}

.md-typeset pre > code {
  border-left: 3px solid var(--md-primary-fg-color);
  padding-left: calc(1em - 3px);
}

/* ---------------- Admonitions — Sims style chunky cards ---------------- */
.md-typeset .admonition,
.md-typeset details {
  border-radius: 10px;
  border-left-width: 6px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

/* ---------------- Tables ---------------- */
.md-typeset table:not([class]) {
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
  border: 1px solid var(--md-default-fg-color--lightest);
}

.md-typeset table:not([class]) th {
  background: var(--md-primary-fg-color);
  color: #FFFFFF;
  font-weight: 600;
  letter-spacing: 0.02em;
}

[data-md-color-scheme="sims-dark"] .md-typeset table:not([class]) th {
  background: var(--md-primary-fg-color--dark);
}

/* ---------------- Hero block on landing page ---------------- */
.sims-hero {
  background: linear-gradient(135deg,
    var(--md-primary-fg-color--dark) 0%,
    var(--md-primary-fg-color) 100%);
  color: #FFFFFF;
  border-radius: 20px;
  padding: 2.4em 2em 2em;
  margin: 0 0 2em;
  text-align: center;
  box-shadow: 0 8px 28px rgba(2, 140, 57, 0.32);
  position: relative;
  overflow: hidden;
}

.sims-hero::before {
  /* Plumbob crystal — a CSS-only diamond shape floating above */
  content: "";
  position: absolute;
  top: -28px;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
  width: 56px;
  height: 56px;
  background: linear-gradient(135deg, #5FFF8A 0%, #02BC4D 100%);
  box-shadow:
    0 0 20px rgba(95, 255, 138, 0.6),
    inset -8px -8px 16px rgba(1, 140, 57, 0.3),
    inset 6px 6px 12px rgba(255, 255, 255, 0.3);
  border-radius: 4px;
}

.sims-hero h1 {
  color: #FFFFFF !important;
  font-size: 2.4em;
  margin: 0.4em 0 0.2em;
  font-weight: 800;
  letter-spacing: -0.01em;
}

.sims-hero h1::before {
  display: none;
}

.sims-hero p {
  color: rgba(255, 255, 255, 0.92);
  font-size: 1.1em;
  margin: 0.4em 0;
}

.sims-hero .sims-metric {
  display: inline-block;
  background: rgba(255, 255, 255, 0.16);
  border-radius: 14px;
  padding: 0.4em 1em;
  margin: 0.3em 0.4em;
  font-weight: 600;
  backdrop-filter: blur(8px);
}

/* ---------------- Stat card grid ---------------- */
.sims-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1em;
  margin: 1.5em 0;
}

.sims-stat {
  background: var(--md-default-bg-color--light);
  border: 1px solid var(--md-default-fg-color--lightest);
  border-left: 4px solid var(--md-primary-fg-color);
  border-radius: 10px;
  padding: 1em 1.2em;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.sims-stat:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(2, 188, 77, 0.18);
}

.sims-stat .stat-label {
  display: block;
  font-size: 0.85em;
  color: var(--md-default-fg-color--lighter);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin-bottom: 0.3em;
}

.sims-stat .stat-value {
  display: block;
  font-size: 1.8em;
  font-weight: 800;
  color: var(--md-primary-fg-color--dark);
  line-height: 1.1;
}

[data-md-color-scheme="sims-dark"] .sims-stat .stat-value {
  color: var(--md-primary-fg-color);
}

.sims-stat .stat-sub {
  display: block;
  font-size: 0.78em;
  color: var(--md-default-fg-color--lighter);
  margin-top: 0.2em;
}

/* ---------------- Focused content polish ---------------- */
.md-typeset blockquote {
  border-left: 4px solid var(--md-accent-fg-color);
  background: var(--md-accent-fg-color--transparent);
  border-radius: 0 8px 8px 0;
  padding: 0.6em 1em;
}

/* Footer logo bit */
.md-footer {
  background-image: linear-gradient(180deg,
    var(--md-footer-bg-color) 0%,
    var(--md-footer-bg-color--dark) 100%);
}