/*
 * CodifyAI estate — visual system
 * Copyright (c) 2026 CODIFY AI S.R.L. (CUI 51174729). All rights reserved.
 * Licensed OPL-1. The design, layout, motion and shader work in this file are
 * proprietary and protected as a design and by copyright. Reuse, redistribution
 * or derivative works require written permission: hello@codifyai.eu
 * Provenance: cai-7f3a91d4
 */
/* CodifyAI — estate chrome for pages that render through website.layout.
 *
 * The 35 marketing pages call cai_v2_shell and carry the estate look already.
 * Everything else on this site — the shop, the Help Center, /contactus, the
 * Danish pages, the customer portal — goes through Odoo's stock frontend
 * layout, which is why they still read as a different product.
 *
 * This is deliberately a small sheet: it restyles the frame (ground, nav,
 * footer, type) and leaves each page's own content markup alone. Odoo's
 * frontend ships Bootstrap, so a handful of rules here have to out-specify it;
 * where that happens it is noted rather than sprayed with !important.
 */

:root{--cai-rev:cai-7f3a91d4;
  --cai-bg:#04060B; --cai-panel:#0A0F1B; --cai-panel-2:#0E1526;
  --cai-ink:#F2F5FF; --cai-dim:#9AA7C7; --cai-faint:#5E6A88;
  --cai-line:rgba(160,180,230,.14); --cai-line-2:rgba(160,180,230,.30);
  --cai-acc:#6D9BFF; --cai-acc-2:#A8C4FF;
  --cai-mono:"DM Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --cai-sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  color-scheme:dark;
}

/* ---------- ground ---------- */
body{
  background:var(--cai-bg);
  color:var(--cai-ink);
  font-family:var(--cai-sans);
  -webkit-font-smoothing:antialiased;
}
#cai-v2-bg{
  position:fixed;inset:0;width:100vw;height:100vh;
  z-index:0;display:block;pointer-events:none;
}
/* Odoo wraps every frontend page in #wrapwrap; lift it over the canvas. */
/* The reading column sits over a live galaxy now. This scrim is what makes
   that possible: dense behind the copy on the left, gone by the right edge so
   the arms stay visible. Sits between the canvas (z0) and content (z2). */
body::before{
  content:"";position:fixed;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(100deg,
    rgba(4,6,11,.95) 0%, rgba(4,6,11,.90) 26%,
    rgba(4,6,11,.62) 48%, rgba(4,6,11,.18) 72%, rgba(4,6,11,0) 100%);
}
@media (max-width:900px){
  /* on phones the copy spans the width, so the scrim has to be even */
  body::before{background:linear-gradient(180deg,
    rgba(4,6,11,.55) 0%, rgba(4,6,11,.86) 42%, rgba(4,6,11,.95) 100%)}
}
#wrapwrap{position:relative;z-index:2;background:transparent}
#wrapwrap main{background:transparent}

/* Stock pages assume a light ground: panels, cards and section bands all
   default to white. Neutralise the common ones so text stays legible. */
#wrapwrap .bg-white,#wrapwrap .bg-light,#wrapwrap .bg-body,
#wrapwrap .o_colored_level.bg-white,#wrapwrap .card,
/* .card-body carries its own rgba(255,255,255,.9) — the card goes dark and
   the body stays white on top of it, which is worse than not theming at all */
#wrapwrap .card-body,#wrapwrap .card-header,#wrapwrap .card-footer,
#wrapwrap .list-group-item,#wrapwrap .accordion-item,#wrapwrap .accordion-button,
#wrapwrap .form-control,#wrapwrap .form-select,#wrapwrap .input-group-text{
  background-color:var(--cai-panel)!important;   /* beats Bootstrap's own !important */
  color:var(--cai-ink);
  border-color:var(--cai-line);
}
#wrapwrap .text-muted,#wrapwrap .text-black-50{color:var(--cai-dim)!important}
/* Bootstrap sets text colour on the element itself rather than inheriting from
   the surface, so card and list bodies keep a near-black colour and disappear
   once the panel behind them goes dark. */
#wrapwrap .card,#wrapwrap .card *,#wrapwrap .list-group-item,#wrapwrap .list-group-item *,
#wrapwrap .accordion-item,#wrapwrap .accordion-body{color:var(--cai-ink)}
#wrapwrap .list-group-item.active,#wrapwrap .list-group-item:hover{
  background-color:var(--cai-panel-2)!important;border-color:var(--cai-line-2)}
#wrapwrap .form-control,#wrapwrap .form-select{color:var(--cai-ink);border-color:var(--cai-line-2)}
#wrapwrap .form-control::placeholder{color:var(--cai-faint)}
#wrapwrap .table{--bs-table-color:var(--cai-ink);--bs-table-border-color:var(--cai-line)}
#wrapwrap a{color:var(--cai-acc-2)}
#wrapwrap a:hover{color:var(--cai-ink)}
#wrapwrap hr{border-color:var(--cai-line)}

/* ---------- display type: the journey's voice ---------- */
#wrapwrap h1,#wrapwrap h2,#wrapwrap h3,#wrapwrap h4{
  font-family:var(--cai-mono);font-weight:500;letter-spacing:-.01em;
  color:var(--cai-ink);overflow-wrap:break-word;text-wrap:balance;
}
#wrapwrap h1{font-size:clamp(1.8rem,4vw,3.2rem);line-height:1.12}
#wrapwrap h2{font-size:clamp(1.4rem,2.8vw,2.2rem);line-height:1.2}
#wrapwrap h3{font-size:clamp(1.05rem,1.7vw,1.35rem)}

/* ---------- nav ---------- */
.cai-front-nav{
  position:sticky;top:0;z-index:1000;height:64px;color:var(--cai-ink);
  background:rgba(4,6,11,.55);border-bottom:1px solid var(--cai-line);
  backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);
}
.cai-front-nav__inner{
  display:flex;align-items:center;gap:16px;height:100%;
  padding:0 clamp(16px,3vw,40px);max-width:1440px;margin:0 auto;
}
.cai-front-nav__mark{
  flex:0 0 auto;color:var(--cai-ink);font:600 16px/1 var(--cai-mono);
  letter-spacing:.01em;text-decoration:none;
}
.cai-front-nav__mark span{color:var(--cai-acc)}
.cai-front-nav__mark:hover{color:var(--cai-ink)}
.cai-front-nav__links{display:flex;align-items:center;gap:4px;margin-left:auto}
.cai-front-nav__links a{
  padding:7px 10px;color:var(--cai-dim);border-radius:99px;
  font:500 10.5px/1 var(--cai-mono);letter-spacing:.14em;text-transform:uppercase;
  white-space:nowrap;text-decoration:none;transition:color 180ms ease,background 180ms ease;
}
.cai-front-nav__links a:hover{color:var(--cai-ink);background:rgba(109,155,255,.10)}
.cai-front-nav__links a.is-active{color:var(--cai-ink);background:rgba(109,155,255,.14)}
.cai-front-nav__actions{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.cai-front-nav__signin{
  color:var(--cai-dim);font:500 10.5px/1 var(--cai-mono);letter-spacing:.14em;
  text-transform:uppercase;text-decoration:none;white-space:nowrap;
}
.cai-front-nav__signin:hover{color:var(--cai-ink)}
.cai-front-nav__build{
  display:flex;align-items:center;gap:8px;padding:9px 15px;color:#05070d;
  background:linear-gradient(120deg,var(--cai-acc-2),var(--cai-acc));
  border-radius:999px;font:600 10.5px/1 var(--cai-mono);letter-spacing:.16em;
  text-transform:uppercase;white-space:nowrap;text-decoration:none;
  box-shadow:0 0 22px rgba(109,155,255,.40);transition:filter .2s ease;
}
.cai-front-nav__build:hover{filter:brightness(1.08);color:#05070d}
.cai-front-nav__toggle{display:none}

@media (max-width:900px){
  .cai-front-nav__links{display:none}
  .cai-front-nav__signin{display:none}
}

/* ---------- footer ---------- */
.cai-frontend-footer{
  position:relative;z-index:1;margin-top:80px;padding:44px clamp(16px,3vw,40px) 40px;
  border-top:1px solid var(--cai-line);background:rgba(4,6,11,.72);
}
.cai-frontend-footer__inner{
  max-width:1180px;margin:0 auto;display:flex;flex-wrap:wrap;gap:24px 40px;
  align-items:baseline;justify-content:space-between;
}
.cai-frontend-footer a{
  color:var(--cai-dim);text-decoration:none;
  font:400 12px/1.9 var(--cai-mono);letter-spacing:.06em;
}
.cai-frontend-footer a:hover{color:var(--cai-ink)}
.cai-frontend-footer nav{display:flex;flex-wrap:wrap;gap:6px 22px}
.cai-frontend-footer .cai-ff__legal{
  width:100%;border-top:1px solid var(--cai-line);padding-top:18px;margin-top:6px;
  font:400 10.5px/1.9 var(--cai-mono);letter-spacing:.1em;color:var(--cai-faint);
}

@media (prefers-reduced-motion:reduce){
  #cai-v2-bg{display:none}
}