/*
 * BOSpilot Design System
 * Product: BOSpilot
 * Manufacturer: ResQNec
 */

:root{
  --bp-navy:#0B2D4A;
  --bp-navy-dark:#061B2E;
  --bp-navy-soft:#EAF0F5;
  --bp-red:#E30613;
  --bp-red-dark:#B6040E;
  --bp-red-soft:#FFF0F1;
  --bp-slate:#667C93;
  --bp-bg:#F4F6F8;
  --bp-surface:#FFFFFF;
  --bp-text:#0F172A;
  --bp-muted:#64748B;
  --bp-border:#E2E8F0;

  /* bestehende BRK-Variablen kompatibel überschreiben */
  --brk:var(--bp-red);
  --brk-dark:var(--bp-red-dark);
  --brk-soft:var(--bp-red-soft);
  --ink:var(--bp-text);
  --muted:var(--bp-muted);
  --line:var(--bp-border);
  --surface:var(--bp-surface);
  --canvas:var(--bp-bg);

  --radius:16px;
  --shadow:0 8px 26px rgba(11,45,74,.07);
  --nav:76px;
}

html{
  background:var(--bp-bg);
}

body{
  background:
    radial-gradient(circle at 90% -10%,rgba(11,45,74,.045),transparent 30rem),
    var(--bp-bg);
  color:var(--bp-text);
}

/* -------------------------------------------------
   GLOBAL HEADER
-------------------------------------------------- */

.brk-header{
  height:var(--nav);
  background:rgba(255,255,255,.96);
  border-bottom:1px solid rgba(11,45,74,.10);
  box-shadow:0 3px 16px rgba(11,45,74,.035);
}

.brk-brand{
  min-width:245px;
  gap:11px;
}

.brk-brand .bospilot-mark{
  width:42px;
  height:42px;
  flex:0 0 42px;
  display:block;
}

.bospilot-brand-text{
  display:flex;
  flex-direction:column;
  line-height:1;
}

.bospilot-brand-text strong{
  color:var(--bp-navy);
  font-size:22px;
  line-height:1;
  letter-spacing:-.045em;
  font-weight:850;
}

.bospilot-brand-text small{
  color:var(--bp-muted);
  font-size:10px;
  margin-top:5px;
  letter-spacing:.06em;
  font-weight:700;
}

.brk-main-nav a,
.brk-modules-trigger{
  color:#405268;
}

.brk-main-nav a:hover,
.brk-modules-trigger:hover,
.brk-modules-trigger[aria-expanded="true"]{
  color:var(--bp-navy);
  background:var(--bp-navy-soft);
}

.brk-main-nav a.active{
  color:var(--bp-red);
  background:var(--bp-red-soft);
}

.brk-avatar{
  background:var(--bp-navy);
  color:#fff;
  box-shadow:0 0 0 3px var(--bp-navy-soft);
}

.brk-logout{
  color:#405268;
  background:#F1F5F8;
}

.brk-logout:hover{
  color:var(--bp-red);
  background:var(--bp-red-soft);
}

/* -------------------------------------------------
   MODULE LAUNCHER
-------------------------------------------------- */

.brk-module-menu{
  border-color:rgba(11,45,74,.12);
  box-shadow:0 25px 65px rgba(6,27,46,.16);
}

.brk-module-menu-head strong{
  color:var(--bp-navy);
}

.brk-module-item:hover{
  background:#F4F7FA;
}

.brk-module-item-icon{
  color:var(--bp-navy);
  background:var(--bp-navy-soft);
}

/* -------------------------------------------------
   PAGE / CARDS
-------------------------------------------------- */

.brk-container,
.brk-app-page .container{
  max-width:1400px;
}

.brk-eyebrow{
  color:var(--bp-red);
}

.brk-page-head h1,
.brk-container>h1{
  color:var(--bp-navy-dark);
}

.brk-card,
.brk-app-page .card,
.brk-app-page .section{
  border-color:rgba(11,45,74,.10);
  box-shadow:var(--shadow);
}

.brk-card:hover{
  border-color:rgba(11,45,74,.19);
}

.brk-card-header{
  color:var(--bp-navy-dark);
}

.brk-card--accent{
  background:linear-gradient(145deg,#fff 35%,#F3F7FA);
  border-color:#DAE4EC;
}

.brk-card--dark{
  background:
    radial-gradient(circle at 100% 0,rgba(227,6,19,.18),transparent 16rem),
    linear-gradient(145deg,var(--bp-navy-dark),var(--bp-navy));
  border-color:var(--bp-navy);
}

.brk-stat-value{
  color:var(--bp-navy-dark);
}

/* -------------------------------------------------
   BUTTONS / FORMS
-------------------------------------------------- */

.brk-btn-primary{
  background:var(--bp-red);
  box-shadow:0 7px 18px rgba(227,6,19,.18);
}

.brk-btn-primary:hover{
  background:var(--bp-red-dark);
}

.brk-btn-secondary{
  color:var(--bp-navy);
  border-color:#CBD7E1;
}

.brk-btn-secondary:hover{
  background:#F4F7FA;
  border-color:#B9C8D5;
}

input:focus,
select:focus,
textarea:focus{
  border-color:var(--bp-navy);
  box-shadow:0 0 0 4px rgba(11,45,74,.10);
}

/* -------------------------------------------------
   TABLES
-------------------------------------------------- */

.brk-table th{
  background:#F3F6F8;
  color:#53677A;
}

.brk-table tbody tr:hover{
  background:#F8FAFB;
}

/* -------------------------------------------------
   LOGIN
-------------------------------------------------- */

.login-page{
  background:#fff;
}

.login-visual{
  position:relative;
  background:
    radial-gradient(circle at 85% 14%,rgba(227,6,19,.29),transparent 19rem),
    radial-gradient(circle at 0 100%,rgba(102,124,147,.22),transparent 25rem),
    linear-gradient(145deg,var(--bp-navy-dark) 0%,var(--bp-navy) 62%,#123D60 100%);
  color:#fff;
}

.login-visual:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.23;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:52px 52px;
  mask-image:linear-gradient(to bottom right,#000,transparent 85%);
}

.login-visual:after{
  border-color:rgba(255,255,255,.055);
}

.bospilot-login-brand{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  gap:14px;
}

.bospilot-login-brand img{
  display:block;
  width:54px;
  height:54px;
}

.bospilot-login-brand-copy{
  display:flex;
  flex-direction:column;
}

.bospilot-login-brand-copy strong{
  color:#fff;
  font-size:28px;
  line-height:1;
  letter-spacing:-.045em;
}

.bospilot-login-brand-copy small{
  margin-top:6px;
  color:rgba(255,255,255,.68);
  font-size:11px;
  font-weight:700;
  letter-spacing:.08em;
}

.login-statement{
  max-width:650px;
}

.login-statement h1{
  font-size:clamp(42px,5vw,72px);
  letter-spacing:-.052em;
  line-height:1.02;
}

.login-statement h1 span{
  color:#fff;
}

.login-statement h1 em{
  color:#FF5360;
  font-style:normal;
}

.login-statement p{
  max-width:590px;
}

.login-visual-foot{
  display:flex;
  flex-direction:column;
  gap:3px;
}

.login-visual-foot strong{
  color:#fff;
  font-size:13px;
}

.login-visual-foot span{
  color:rgba(255,255,255,.58);
}

.login-panel{
  background:#fff;
}

.login-card{
  width:min(450px,100%);
}

.bospilot-login-mobile{
  display:none;
  width:220px;
  max-width:65vw;
  margin:0 0 38px;
}

.login-kicker{
  color:var(--bp-red);
}

.login-card h2{
  color:var(--bp-navy-dark);
  letter-spacing:-.035em;
}

.brkid-login{
  background:var(--bp-red);
}

.local-login{
  background:#F7F9FA;
  border-color:#DDE5EB;
}

/* -------------------------------------------------
   RESQNEC / FOOTER
-------------------------------------------------- */

.resqnec-footer{
  min-height:68px;
  background:transparent;
  border-top:1px solid rgba(11,45,74,.09);
  color:#8A9AA8;
}

.resqnec-footer .bospilot-footer-product{
  font-weight:800;
  color:var(--bp-navy);
}

.resqnec-footer img{
  width:118px;
  max-height:28px;
  object-fit:contain;
}

.login-panel>.resqnec-footer{
  background:transparent;
}

/* -------------------------------------------------
   MOBILE
-------------------------------------------------- */

@media(max-width:1120px){
  .brk-brand{
    min-width:190px;
  }

  .bospilot-brand-text small{
    display:none;
  }
}

@media(max-width:820px){
  .brk-brand{
    min-width:0;
  }

  .brk-brand .bospilot-mark{
    width:39px;
    height:39px;
    flex-basis:39px;
  }

  .bospilot-brand-text strong{
    font-size:20px;
  }

  .bospilot-brand-text small{
    display:none;
  }

  .brk-mobile-nav{
    background:rgba(6,27,46,.96);
    box-shadow:0 20px 45px rgba(6,27,46,.30);
  }

  .brk-mobile-nav a.active{
    background:var(--bp-red);
  }

  .bospilot-login-mobile{
    display:block;
  }
}

@media(max-width:600px){
  .bospilot-brand-text strong{
    font-size:18px;
  }
}