/* ===== Lizmap AEE-INTEC inspired theme =====
   Feintuning: passe die Variablen an (per Farbpicker vom AEE-Auftritt).
   Quelle für Theming-Mechanik & Variablen: Lizmap-Doku. */

/* 1) Zentrale Variablen (ab Lizmap 3.7 besonders wirksam) */
:root{
  /* Farbbasis – bitte bei Bedarf exakt matchen */
  --brand-primary:   #003C7E; /* Navy-Blau (Header, Links, aktive Menüs) */
  --brand-accent:    #00A6B1; /* Türkis (Hover/Akzent) */
  --brand-secondary: #F39200; /* Optionaler Akzent (Warnhinweise/Badges) */
  --surface-0:       #ffffff; /* Karten-UI Cards/Modals */
  --surface-1:       #f5f8fa; /* Leichte Panels/Hintergrund */
  --text-strong:     #0f172a;
  --text-default:    #1f2937;
  --text-muted:      #6b7280;
  --border-soft:     #e5e7eb;
  --shadow:          0 6px 18px rgba(0,0,0,.08);
  --radius:          10px;

  /* Typografie – AEE nutzt eine klare Sans; hier pragmatisch & DSGVO-freundlich */
  --font-sans: ui-sans-serif, system-ui, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, Liberation Sans, sans-serif;
}

/* 2) Grundtypografie */
body, .liz-content, .panel, .modal, .dropdown-menu{
  font-family: var(--font-sans);
  color: var(--text-default);
}
h1, h2, h3, .navbar-brand{
  font-weight: 700;
  letter-spacing: .2px;
  color: var(--text-strong);
}

/* 3) Header/Navi */
.navbar, .navbar-default{
  background: var(--surface-0);
  border-bottom: 1px solid var(--border-soft);
  box-shadow: var(--shadow);
}
.navbar-default .navbar-brand,
.navbar-default .navbar-nav>li>a{
  color: var(--brand-primary) !important;
}
.navbar-default .navbar-nav>li>a:hover,
.navbar-default .navbar-nav>.active>a{
  color: #fff !important;
  background: var(--brand-primary) !important;
  border-radius: var(--radius);
}

/* 4) Links & Fokus */
a{ color: var(--brand-primary); }
a:hover{ color: var(--brand-accent); text-decoration: none; }
:focus{ outline: 2px solid color-mix(in srgb, var(--brand-accent) 60%, transparent); outline-offset: 2px; }

/* 5) Buttons */
.btn, .btn-default{
  border-radius: var(--radius);
  border: 1px solid var(--border-soft);
  background: var(--surface-0);
  color: var(--text-default);
}
.btn:hover, .btn:focus{
  border-color: color-mix(in srgb, var(--brand-primary) 25%, var(--border-soft));
}
.btn-primary{
  background: var(--brand-primary);
  border-color: var(--brand-primary);
  color: #fff;
}
.btn-primary:hover, .btn-primary:focus{
  background: color-mix(in srgb, var(--brand-primary) 85%, var(--brand-accent));
  border-color: color-mix(in srgb, var(--brand-primary) 85%, var(--brand-accent));
}
.btn-warning{ /* optional zweiter Akzent */
  background: var(--brand-secondary);
  border-color: var(--brand-secondary);
  color: #111;
}

/* 6) Panels, Cards, Modals, Tabs */
.panel, .modal-content{
  background: var(--surface-0);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.panel-heading, .modal-header{
  background: var(--surface-0);
  border-bottom: 1px solid var(--border-soft);
  color: var(--text-strong);
  font-weight: 600;
}
.nav-tabs>li>a{
  border-radius: var(--radius) var(--radius) 0 0;
}
.nav-tabs>li.active>a, .nav-tabs>li.active>a:focus, .nav-tabs>li.active>a:hover{
  background: var(--surface-0);
  border: 1px solid var(--border-soft);
  border-bottom-color: transparent;
  color: var(--brand-primary);
}

/* 7) Formulare & Suche */
.form-control{
  border-radius: 8px;
  border: 1px solid var(--border-soft);
  box-shadow: none;
}
.form-control:focus{
  border-color: var(--brand-accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-accent) 20%, transparent);
}

/* 8) Footer / kleine Meta */
.footer, .liz-footer{
  border-top: 1px solid var(--border-soft);
  color: var(--text-muted);
  background: var(--surface-0);
}

/* 9) Logo-Platzhalter – wenn du /img/logo.png setzt */
#logo, .navbar-brand{
  background-image: url(/index.php/view/media/getMedia?repository=ship&project=ship_edit&path=media%2Fthemes%2Fdefault%2Fcss%2F/'../img/logo.png');
  background-size: contain;
  background-repeat: no-repeat;
}