/*
 * Holinnova for Forgejo 15 LTS.
 * Brand palette observed at https://holinnova.com/es/ on 2026-10-01.
 * The native light theme remains the base for code, diffs and semantic states.
 * Install as $FORGEJO_CUSTOM/public/assets/css/theme-holinnova.css.
 */
@import url("theme-forgejo-light.css");

@font-face {
  font-family: "Hanken Grotesk";
  src: url("../fonts/hanken-grotesk-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

@font-face {
  font-family: "Fraunces";
  src: url("../fonts/fraunces-latin.woff2") format("woff2");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --holinnova-ivory: #f4f1ea;
  --holinnova-surface: #fbfaf6;
  --holinnova-ink: #1b1a17;
  --holinnova-secondary-text: #4a4640;
  --holinnova-border: #e0d9cc;
  --holinnova-sand: #eae3d6;
  --holinnova-terracotta: #b65a3c;
  --holinnova-terracotta-hover: #964127;
  --holinnova-olive: #6e7155;
  --holinnova-serif: "Fraunces", Georgia, serif;

  --fonts-proportional: "Hanken Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --border-radius: 8px;
  --border-radius-medium: 12px;

  /* Deeper brand tone gives small text an accessible contrast on ivory. */
  --color-primary: var(--holinnova-terracotta-hover);
  --color-primary-contrast: #ffffff;
  --color-primary-dark-1: #873921;
  --color-primary-dark-2: #873921;
  --color-primary-dark-3: #873921;
  --color-primary-dark-4: #75301c;
  --color-primary-dark-5: #652919;
  --color-primary-dark-6: #542215;
  --color-primary-dark-7: #451c12;
  --color-primary-light-1: #bd684c;
  --color-primary-light-2: #c77c62;
  --color-primary-light-3: #d2947e;
  --color-primary-light-4: #deb09e;
  --color-primary-light-5: #ead0c3;
  --color-primary-light-6: #f3e3da;
  --color-primary-light-7: #fbf3ee;
  --color-primary-alpha-10: #b65a3c19;
  --color-primary-alpha-20: #b65a3c33;
  --color-primary-alpha-30: #b65a3c4d;
  --color-primary-alpha-40: #b65a3c66;
  --color-primary-alpha-50: #b65a3c80;
  --color-primary-alpha-60: #b65a3c99;
  --color-primary-alpha-70: #b65a3cb3;
  --color-primary-alpha-80: #b65a3ccc;
  --color-primary-alpha-90: #b65a3ce6;
  --color-primary-hover: #873921;
  --color-primary-active: #75301c;

  --color-secondary: var(--holinnova-border);
  --color-secondary-dark-1: #d8cfbf;
  --color-secondary-dark-2: #cec3b1;
  --color-secondary-dark-3: #c4b8a5;
  --color-secondary-dark-4: #b8ab97;
  --color-secondary-dark-5: #aa9c87;
  --color-secondary-dark-6: #998b76;
  --color-secondary-dark-7: #877966;
  --color-secondary-dark-8: #756957;
  --color-secondary-dark-9: #665b4c;
  --color-secondary-dark-10: #574e42;
  --color-secondary-dark-11: #4a4238;
  --color-secondary-dark-12: #39342b;
  --color-secondary-dark-13: #2c2821;
  --color-secondary-light-1: var(--holinnova-sand);
  --color-secondary-light-2: #f0eae0;
  --color-secondary-light-3: var(--holinnova-ivory);
  --color-secondary-light-4: var(--holinnova-surface);
  --color-secondary-alpha-10: #e0d9cc19;
  --color-secondary-alpha-20: #e0d9cc33;
  --color-secondary-alpha-30: #e0d9cc4d;
  --color-secondary-alpha-40: #e0d9cc66;
  --color-secondary-alpha-50: #e0d9cc80;
  --color-secondary-alpha-60: #e0d9cc99;
  --color-secondary-alpha-70: #e0d9ccb3;
  --color-secondary-alpha-80: #e0d9cccc;
  --color-secondary-alpha-90: #e0d9cce6;

  --color-body: var(--holinnova-ivory);
  --color-box-header: #eee8de;
  --color-box-body: var(--holinnova-surface);
  --color-box-body-highlight: var(--holinnova-sand);
  --color-text-dark: var(--holinnova-ink);
  --color-text: var(--holinnova-ink);
  --color-text-light: var(--holinnova-secondary-text);
  --color-text-light-1: #514c44;
  --color-text-light-2: #59534a;
  --color-text-light-3: #6a6257;
  --color-footer: var(--holinnova-ivory);
  --color-timeline: var(--holinnova-border);
  --color-input-text: var(--holinnova-ink);
  --color-input-background: var(--holinnova-surface);
  --color-input-toggle-background: var(--holinnova-surface);
  --color-input-border: #8b8273;
  --color-input-border-hover: #716858;
  --color-header-wrapper: var(--holinnova-surface);
  --color-header-wrapper-transparent: #fbfaf600;
  --color-hover: #eae3d6b3;
  --color-active: var(--holinnova-sand);
  --color-menu: var(--holinnova-surface);
  --color-card: var(--holinnova-surface);
  --fancy-card-bg: var(--holinnova-surface);
  --fancy-card-border: var(--holinnova-border);
  --color-markup-code-block: #eee9e0;
  --color-markup-code-inline: #eae3d6;
  --color-button: #eee8de;
  --color-code-bg: var(--holinnova-surface);
  --color-shadow: #1b1a1726;
  --color-secondary-bg: #f0eae0;
  --color-expand-button: var(--holinnova-sand);
  --color-editor-line-highlight: #f0eae0;
  --color-project-board-bg: #eee8de;
  --color-nav-bg: var(--holinnova-surface);
  --color-nav-hover-bg: var(--holinnova-sand);
  --color-secondary-nav-bg: var(--holinnova-ivory);
  --color-accent: var(--holinnova-terracotta);
  --color-small-accent: #ead0c3;
  --color-highlight-fg: #75301c;
  --color-highlight-bg: #f3e3da;
  --color-selection-bg: #dcb7a5;
  --color-selection-fg: var(--holinnova-ink);
  color-scheme: light;
}

/* A wordmark added without replacing Forgejo's navigation template. */
#navbar {
  padding-inline: 18px;
}

#navbar .navbar-left,
#navbar .navbar-right {
  min-height: 60px;
}

#navbar #navbar-logo {
  gap: 9px;
  margin-inline-end: 14px;
  color: var(--holinnova-ink);
  padding-inline: 0;
}

#navbar-logo::after {
  content: "Holinnova";
  font-family: var(--holinnova-serif);
  font-size: 24px;
  font-weight: 500;
  letter-spacing: -0.055em;
  line-height: 1.1;
}

#navbar-logo img {
  width: 30px;
  height: 30px;
}

#navbar #navbar-logo:hover,
#navbar #navbar-logo:focus {
  background: transparent;
}

/* Keep repo names, code, diffs, and tool headings in native readable fonts. */
.home .hero h1,
.home .hero .title,
.page-content.user.signin h4.ui.top.attached.header,
.page-content.user.signup h4.ui.top.attached.header {
  font-family: var(--holinnova-serif);
  font-weight: 500;
  letter-spacing: -0.045em;
  color: var(--holinnova-ink);
}

.home .hero h1,
.home .hero .title {
  font-size: clamp(2.6rem, 5.5vw, 5rem);
  line-height: 1.07;
}

.home .hero h2 {
  font-size: clamp(1.15rem, 2vw, 1.5rem);
  font-weight: 400;
  line-height: 1.5;
  color: var(--holinnova-secondary-text);
  margin-top: 18px;
}

.home .logo {
  width: 104px;
  height: 104px;
  margin-top: 40px;
  margin-bottom: 20px;
}

.page-content.user.signin,
.page-content.user.signup {
  padding-top: clamp(30px, 7vh, 76px);
}

.page-content.user.signin h4.ui.top.attached.header,
.page-content.user.signup h4.ui.top.attached.header {
  font-size: 28px;
  line-height: 1.25;
  padding-block: 22px;
  background: var(--holinnova-surface);
}

.page-content.user.signin .ui.attached.segment,
.page-content.user.signup .ui.attached.segment {
  padding: 24px;
}

.ui.primary.button {
  border-radius: 8px;
}

/* Solid primary actions match the charcoal buttons of holinnova.com. */
.ui.primary.button:not(.basic),
.ui.primary.buttons:not(.basic) .button,
.button.primary:not(.ui) {
  background: var(--holinnova-ink);
  color: var(--holinnova-ivory);
}

.ui.primary.button:not(.basic):hover,
.ui.primary.button:not(.basic):focus,
.ui.primary.buttons:not(.basic) .button:hover,
.ui.primary.buttons:not(.basic) .button:focus,
.button.primary:not(.ui):hover,
.button.primary:not(.ui):focus {
  background: #39342b;
  color: var(--holinnova-ivory);
}

.ui.primary.button:not(.basic):active,
.ui.primary.buttons:not(.basic) .button:active,
.button.primary:not(.ui):active {
  background: #11100e;
}

/* An explicit keyboard outline remains visible on ivory and white surfaces. */
a:focus-visible,
button:focus-visible,
summary:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--holinnova-terracotta-hover);
  outline-offset: 3px;
}

.page-footer {
  padding-block: 12px;
}

@media (max-width: 767.98px) {
  #navbar {
    padding-inline: 12px;
  }

  #navbar #navbar-logo {
    margin-inline-end: 6px;
    gap: 7px;
  }

  #navbar-logo::after {
    font-size: 22px;
  }

  .page-content.user.signin .ui.attached.segment,
  .page-content.user.signup .ui.attached.segment {
    padding: 20px;
  }
}