/*
 * KiwiStack portal styling for the Nubus portal.
 *
 * Loaded via theme.styles.portal.main in opendesk/overlays/default/values.yaml.gotmpl.
 * Token values intentionally inline (not @import-ed) so this file works
 * standalone if Nubus injects it without our fonts.css.
 */

@import url("https://fonts.googleapis.com/css2?family=Quicksand:wght@400;500;600;700&family=Nunito:wght@400;600;700;900&display=swap");

:root {
  --kw-bg:           #FAFFF5;
  --kw-surface:      #FFFFFF;
  --kw-surface-alt:  #F5F5EE;
  --kw-text:         #1A1A1A;
  --kw-text-muted:   #6A6760;
  --kw-rule:         rgba(26, 26, 26, 0.14);
  --kw-primary:      #33691E;
  --kw-primary-15:   #e7f0d6;
  --kw-accent:       #7CB342;
}

body, .portal, .portal-frame {
  background: var(--kw-bg);
  color: var(--kw-text);
  font-family: "Nunito", -apple-system, system-ui, "Segoe UI", sans-serif;
}

.portal-header,
.portal-header-bar,
header.portal {
  background: var(--kw-surface);
  border-bottom: 1px solid var(--kw-rule);
  font-family: "Quicksand", system-ui, -apple-system, sans-serif;
}

.portal-title,
.portal-brand {
  font-family: "Quicksand", system-ui, -apple-system, sans-serif;
  font-weight: 700;
  letter-spacing: -0.01em;
}

/* Dual-colour wordmark: when the portal renders the brand text inline */
.portal-brand .brand-prefix { color: var(--kw-primary); }
.portal-brand .brand-suffix { color: var(--kw-text); }

a, .portal-link {
  color: var(--kw-primary);
  text-decoration-color: var(--kw-primary);
}

.btn-primary,
button.primary,
.portal-cta-primary {
  background: var(--kw-primary);
  color: var(--kw-bg);
  border: 0;
  font-family: "Quicksand", system-ui, sans-serif;
  font-weight: 600;
}
.btn-primary:hover,
button.primary:hover,
.portal-cta-primary:hover {
  background: #2C5917;
}

.btn-accent,
.portal-cta-accent {
  background: var(--kw-accent);
  color: var(--kw-text);
}

.tile,
.portal-app-tile,
.app-card {
  background: var(--kw-surface);
  border: 1px solid var(--kw-rule);
  transition: border-color 150ms ease, transform 150ms ease;
}
.tile:hover,
.portal-app-tile:hover,
.app-card:hover {
  border-color: var(--kw-text);
  transform: translateY(-1px);
}

.muted, .portal-meta { color: var(--kw-text-muted); }