/* Tripont / digitalizalas.eu skin for the listmonk public pages (loaded after the stock style.css).
   Tokens mirror digitalizalas_eu/apps/web (tailwind.config.ts + the .theme-light block of globals.css):
   paper #FAF8F3, surface-low #F4F1EA, ink #1A1714, body #2E2A24, orange #CF5A2E (fills / large text),
   #A64520 (small orange text, AA), header band #151515 (official logo = white lettering).
   Font: Inter, self-hosted (OFL). */
@font-face { font-family: 'Inter'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('fonts/Inter-Variable.woff2') format('woff2'); }

:root {
  --tp-paper: #FAF8F3;
  --tp-low: #F4F1EA;
  --tp-card: #FFFFFF;
  --tp-ink: #1A1714;
  --tp-body: #2E2A24;
  --tp-mute: #6E6860;
  --tp-rule: #E0DBD0;
  --tp-orange: #CF5A2E;
  --tp-orange-text: #A64520;
  --tp-orange-deep: #8A3A16;
  --tp-orange-tint: #FBEDE5;
  --tp-band: #151515;
  --tp-on-orange: #140600;
  --tp-sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

body.tp {
  background: var(--tp-paper);
  color: var(--tp-body);
  font-family: var(--tp-sans);
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

/* ---- top band ---- */
.tp-top { background: var(--tp-band); }
.tp-top-in {
  max-width: 1100px;
  margin: 0 auto;
  padding: 20px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.tp .tp-brand, .tp .tp-brand:hover { display: inline-flex; background: none; text-decoration: none; }
.tp-brand img { display: block; height: 24px; width: auto; }
.tp-tag { font-size: 11px; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase; color: #948F87; }

/* ---- card ---- */
.container.wrap.tp-card {
  width: 100%;
  max-width: 600px;
  margin: 40px auto 56px;
  padding: 0;
  background: var(--tp-card);
  border: 1px solid var(--tp-rule);
  border-radius: 0;
  box-shadow: none;
  align-self: center;
  flex: 0 0 auto;
}
.tp-body { padding: 40px 40px 44px; }
.tp-eyebrow {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--tp-orange-text);
  margin-bottom: 16px;
}

/* ---- type ---- */
.tp h1, .tp h2, .tp h3 {
  font-family: var(--tp-sans);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.12;
  color: var(--tp-ink);
  margin: 0 0 18px;
}
.tp h2 { font-size: 34px; }
.tp h3 { font-size: 18px; letter-spacing: -0.01em; margin-top: 30px; }
.tp h4 { font-weight: 600; font-size: 1em; }
.tp em { color: var(--tp-orange); }
.tp p { margin: 0 0 16px; }
.tp a { color: var(--tp-orange-text); text-decoration: underline; text-decoration-color: rgba(166, 69, 32, 0.4); text-underline-offset: 3px; }
.tp a:hover { color: var(--tp-orange-deep); text-decoration-color: currentColor; background: none; }
.tp label { color: var(--tp-ink); font-weight: 600; font-size: 14px; }
.tp .small { font-size: 13.5px; color: var(--tp-mute); }
.tp .error { color: #B3261E; font-weight: 600; }

/* ---- form controls ---- */
.tp input[type="text"], .tp input[type="email"], .tp input[type="password"], .tp select {
  border: 1px solid #C9C4B8;
  border-radius: 0;
  background: var(--tp-paper);
  box-shadow: none;
  padding: 11px 14px;
  font: inherit;
  color: var(--tp-ink);
  margin-top: 6px;
}
.tp input:focus, .tp select:focus { outline: none; border-color: var(--tp-orange); box-shadow: 0 0 0 3px rgba(207, 90, 46, 0.22); }
.tp input[type="checkbox"], .tp input[type="radio"] { accent-color: var(--tp-orange); width: 18px; height: 18px; vertical-align: -3px; margin: 0 8px 0 0; }

.tp .button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 0;
  background: var(--tp-orange);
  color: var(--tp-on-orange);
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 15px 28px;
  font-family: var(--tp-sans);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.22s;
}
.tp .button:hover { background: #E27148; color: var(--tp-on-orange); }
.tp .button.button-outline { background: var(--tp-orange-tint); color: var(--tp-orange-deep); border: 0; }
.tp .button.button-outline:hover { background: #F6DCCD; color: var(--tp-orange-deep); }
.tp input[type="submit"].button { -webkit-appearance: none; appearance: none; }
.tp .button:focus-visible, .tp a:focus-visible { outline: 2px solid var(--tp-orange); outline-offset: 2px; }

/* ---- lists (optin / manage / form) ---- */
.tp .lists { list-style: none; padding: 0; margin: 0 0 22px; }
.tp .optin-form ul { list-style: none; padding: 0; margin: 0 0 22px; }
.tp .optin-form ul li {
  display: inline-block;
  background: var(--tp-orange-tint);
  color: var(--tp-orange-deep);
  padding: 7px 14px;
  margin: 0 8px 8px 0;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.tp .optin-form ul li::before { content: '\2713'; color: var(--tp-orange); margin-right: 8px; font-weight: 700; }
.tp .lists li { margin: 0 0 10px; }
.tp .lists .description { color: var(--tp-mute); margin-left: 26px; }

/* ---- sections ---- */
.tp .section { margin-bottom: 0; }
.tp .data-form { margin-top: 30px; padding-top: 26px; border-top: 1px solid var(--tp-rule); }
.tp .data-form h2 { font-size: 22px; }
.tp .row { margin-bottom: 16px; font-size: 14.5px; }
.tp .tp-note { font-size: 13.5px; line-height: 1.6; color: var(--tp-mute); }
.tp .tp-back { margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--tp-rule); font-size: 14.5px; }
.tp .archive li { margin-bottom: 18px; }
.tp .archive .date { font-size: 11px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--tp-mute); }
.tp .home-options a { margin: 0 10px; }
.tp .pagination a { margin-right: 8px; }

/* ---- footer ---- */
footer.tp-foot {
  margin-top: auto;
  background: var(--tp-low);
  border-top: 1px solid var(--tp-rule);
  text-align: center;
  color: var(--tp-mute);
  font-size: 13px;
  line-height: 1.7;
  flex-shrink: 0;
}
.tp-foot-in { max-width: 600px; margin: 0 auto; padding: 28px 24px 32px; }
.tp-foot-name { font-size: 11px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--tp-ink); margin-bottom: 6px; }
.tp-foot p { margin: 0; }
footer.tp-foot a { color: var(--tp-mute); }
footer.tp-foot a:hover { color: var(--tp-ink); }

@media screen and (max-width: 650px) {
  .tp-top-in { padding: 18px 20px; }
  .container.wrap.tp-card { margin: 0 auto 40px; border-left: 0; border-right: 0; }
  .tp-body { padding: 30px 22px 34px; }
  .tp h2 { font-size: 28px; }
}
