/*
Theme Name: SC Divi 5 Child Theme
Theme URI: https://www.elegantthemes.com/gallery/divi/
Description: Divi Child Theme
Author: spicy concepts
Author URI: https://spicy-concepts.de
Template: Divi
Version: 2.0.0
*/

/* =Theme customization starts here
------------------------------------------------------- */
/* ================================================
   FARBIGES NAVIGATIONS-MENÜ – Berufskolleg Ennepetal
   ================================================ */

/* Grundfarbe weiß für alle Links + flüssige Schriftgröße */
.et_pb_menu nav ul.et-menu > li > a,
.et_pb_menu nav ul.et-menu > li > a:hover {
  color: #ffffff !important;
  font-size: clamp(11px, 1.2vw, 15px) !important;
  padding: 5px clamp(4px, 0.8vw, 10px) !important;
}

/* ===== HAUPTMENÜ-FARBEN ===== */

/* 1. Startseite – Orange-Rot */
.et_pb_menu nav ul.et-menu > li:nth-child(1) > a {
  background-color: #ef7d00 !important;
}
.et_pb_menu nav ul.et-menu > li:nth-child(1) > a:hover {
  background-color: #d46e00 !important;
}

/* 2. Berufskolleg – Helles Orange/Gelb */
.et_pb_menu nav ul.et-menu > li:nth-child(2) > a {
  background-color: #efa415 !important;
}
.et_pb_menu nav ul.et-menu > li:nth-child(2) > a:hover {
  background-color: #d89010 !important;
}

/* 3. Bildungswege – Hellblau */
.et_pb_menu nav ul.et-menu > li:nth-child(3) > a {
  background-color: #86a0c5 !important;
}
.et_pb_menu nav ul.et-menu > li:nth-child(3) > a:hover {
  background-color: #7090b5 !important;
}

/* 4. Beratung – Türkis/Teal */
.et_pb_menu nav ul.et-menu > li:nth-child(4) > a {
  background-color: #7ec7b9 !important;
}
.et_pb_menu nav ul.et-menu > li:nth-child(4) > a:hover {
  background-color: #6ab5a8 !important;
}

/* 5. Kalender – Dunkelblau */
.et_pb_menu nav ul.et-menu > li:nth-child(5) > a {
  background-color: #014999 !important;
}
.et_pb_menu nav ul.et-menu > li:nth-child(5) > a:hover {
  background-color: #013d80 !important;
}

/* ===== UNTERMENÜS (Dropdowns) ===== */

/* Berufskolleg – Untermenüpunkte */
.et_pb_menu nav ul.et-menu > li:nth-child(2) ul li > a {
  background-color: #efa415 !important;
  color: #ffffff !important;
}
.et_pb_menu nav ul.et-menu > li:nth-child(2) ul li > a:hover {
  background-color: #d89010 !important;
}

/* Bildungswege – Untermenüpunkte */
.et_pb_menu nav ul.et-menu > li:nth-child(3) ul li > a {
  background-color: #86a0c5 !important;
  color: #ffffff !important;
}
.et_pb_menu nav ul.et-menu > li:nth-child(3) ul li > a:hover {
  background-color: #7090b5 !important;
}

/* ===== LAYOUT: GLEICH BREITE TABS, 100% BREITE ===== */

/* Menü-Wrap darf nicht umbrechen */
.et_pb_menu .et_pb_menu__wrap {
  flex-wrap: nowrap !important;
}

/* Menü-Div auf volle Breite zwingen */
.et_pb_menu .et_pb_menu__menu {
  flex: 1 1 100% !important;
  width: 100% !important;
}

/* Nav auf volle Breite */
.et_pb_menu .et_pb_menu__menu nav {
  width: 100% !important;
}

/* Menü-Liste nimmt volle Breite ein, kein Umbruch */
.et_pb_menu nav ul.et-menu {
  width: 100% !important;
  flex-wrap: nowrap !important;
  justify-content: stretch !important;
}

/* Jeder Menüpunkt bekommt gleich viel Platz */
.et_pb_menu nav ul.et-menu > li {
  flex: 1 1 0 !important;
  text-align: center !important;
  margin: 0 !important;
}

/* Links füllen den ganzen li-Bereich aus */
.et_pb_menu nav ul.et-menu > li > a {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  box-sizing: border-box !important;
}
/* Abstand zwischen Menüpunkten reduzieren – z.B. auf 5px */
.et_pb_menu .et-menu > li {
  padding-left: 3px !important;
  padding-right: 3px !important;
}