/* Tveter & Lund – kundeprofil lagt over standarddesignet (style.css).
   Kilde: Tveter & Lund Design System (Profilmanual 2024), kopi i branding/kunde/.
   Oransje #FF6B00 er hovedfarge, grønn #80BC00 tilleggsfarge, Roboto for all tekst,
   funksjonelle avrundede hjørner (4–14 px) i stedet for Inside IT sine skrå hjørner. */

@font-face {
  font-family: "Roboto";
  src: url(/static/fonts/roboto-variable.ttf) format("truetype-variations");
  font-weight: 100 900;
  font-display: swap;
}

.theme-kunde {
  --navy: #1a1a1a;          /* mørk flate: grå 900 */
  --navy-deep: #000;
  --navy-soft: #2b2b2b;
  --navy-glow: #2b2b2b;
  --purple: #ff6b00;        /* aksent: oransje */
  --purple-ink: #c24f00;    /* oransje tekst på hvitt (WCAG AA) */
  --purple-soft: #fff0e5;
  --bg: #f2f2f2;
  --surface: #fff;
  --surface-2: #f2f2f2;
  --text: #1a1a1a;
  --muted: #5c5c5c;
  --line: #e4e4e4;
  --ok: #4f7a00;            /* grønn tekst med god kontrast */
  --err: #d64500;
  --green: #80bc00;
  --radius: 8px;
  --shadow: 0 1px 2px rgb(0 0 0 / 8%);
  --shadow-lg: 0 12px 32px rgb(0 0 0 / 14%);
  --font: "Roboto", Arial, "Helvetica Neue", Helvetica, sans-serif;
}

/* Ingen skrå hjørner – avrundede i stedet */
.theme-kunde .cut, .theme-kunde .btn, .theme-kunde .chip, .theme-kunde .pill, .theme-kunde .page-title,
.theme-kunde .flash, .theme-kunde .avatar, .theme-kunde .success-icon, .theme-kunde .values li::before { clip-path: none; }
.theme-kunde .btn { border-radius: var(--radius); font-weight: 700; }
.theme-kunde .btn-sm { border-radius: 6px; }
.theme-kunde .pill, .theme-kunde .chip, .theme-kunde .crit li, .theme-kunde .cpv-chip { border-radius: 999px; }
.theme-kunde .panel, .theme-kunde .empty, .theme-kunde .card, .theme-kunde .tender, .theme-kunde .user-pop,
.theme-kunde .cpv-results, .theme-kunde fieldset.panel.field { border-radius: 14px; }
.theme-kunde .flash { border-radius: var(--radius); }
.theme-kunde input, .theme-kunde textarea, .theme-kunde select { border-radius: var(--radius); border-color: #c7c7c7; }
.theme-kunde .avatar { border-radius: 50%; background: var(--green); }
.theme-kunde .search-card, .theme-kunde .tender { overflow: hidden; }

/* Hovedknapp i oransje, sekundær i grått */
.theme-kunde .btn { background: var(--purple); color: #fff; }
.theme-kunde .btn:hover { background: #e55f00; }
.theme-kunde .btn-accent { background: var(--navy); color: #fff; }
.theme-kunde .btn-accent:hover { background: var(--navy-soft); }
.theme-kunde .btn-ghost { background: #fff; color: var(--text); box-shadow: inset 0 0 0 1px #c7c7c7; }
.theme-kunde .btn-ghost:hover { background: #f8f8f8; }
.theme-kunde .btn-danger { background: #fbe3da; color: var(--err); }
.theme-kunde .btn-ms { background: #fff; color: var(--text); border-radius: var(--radius); }
.theme-kunde .pill-ok { background: #e6f1cc; color: var(--ok); }
.theme-kunde .pill-accent { background: #ffe1cc; color: #a84400; }

/* Overskrifter: kraftige, tette (Black for hovedtitler) */
.theme-kunde h1 { font-weight: 900; letter-spacing: -.01em; }
.theme-kunde .page-title {
  background: none; color: var(--text); padding: 0; font-weight: 900;
  border-left: 6px solid var(--purple); padding-left: 16px;
}
.theme-kunde .tagline, .theme-kunde .eyebrow { letter-spacing: .14em; font-weight: 700; }
.theme-kunde .lines th { border-bottom: 1px solid var(--line); letter-spacing: .06em; color: #9a9a9a; }
.theme-kunde .lines tfoot td { border-top-color: var(--line); }

/* Logo */
.customer-logo { display: block; height: auto; }
.theme-kunde .brand .customer-logo { width: 150px; }
.theme-kunde .login-brand .customer-logo { width: min(320px, 70vw); margin-bottom: 40px; }

/* Hero: mørk flate med TL-symbolet som vannmerke (10 %) som går ut over kanten */
.theme-kunde .hero { background: var(--navy); }
.theme-kunde .hero::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--purple); }
.hero-mark { position: absolute; right: -60px; top: 50%; width: 360px; transform: translateY(-50%); opacity: .1; pointer-events: none; }
.theme-kunde .hero .tagline { color: var(--purple); }

/* Innlogging: dokumentarfoto med mørk toning nedenfra (fra designsystemet) */
.theme-kunde .login-brand { background: var(--navy); align-items: flex-end; }
.theme-kunde .login-brand::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 6px; background: var(--purple); z-index: 2; }
.login-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% 30%; }
.theme-kunde .login-brand::before {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(180deg, rgb(0 0 0 / 10%) 0%, rgb(0 0 0 / 50%) 40%, rgb(0 0 0 / 88%) 100%);
}
.theme-kunde .login-brand-inner { z-index: 2; }
.theme-kunde .values li::before { border-radius: 3px; }
.theme-kunde .demo-note { border-radius: var(--radius); border-left-color: var(--purple); }
.theme-kunde .demo-note strong { color: var(--purple-ink); }

/* Topbar og meny */
.theme-kunde .nav a.active { border-bottom-color: var(--purple); }
.theme-kunde .user-pop { border-top-color: var(--purple); }
.theme-kunde .search-card { border-top-color: var(--purple); }

@media (max-width: 760px) {
  .theme-kunde .brand .customer-logo { width: 120px; }
  .hero-mark { width: 220px; right: -50px; }
}

/* Forside og admin */
.theme-kunde .app-icon { border-radius: 12px; }
.theme-kunde .app-tile:hover { border-color: var(--purple); }
.theme-kunde .notice, .theme-kunde .code { border-radius: var(--radius); }
.theme-kunde .cpv-pick, .theme-kunde .cpv-select { border-radius: 999px; }
.theme-kunde .cpv-browser { border-radius: var(--radius); }