/* =========================================================
   KOMBI RAIL EUROPE – TABS
   Groen / Blauw / Wit
   Versie 1.0 – november 2026
========================================================= */


/* =========================================================
   01 BASIS
========================================================= */

.tabs.kombi-tabs {
  background: #000;
  color: #fff;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}


/* =========================================================
   02 TAB KNOPPEN
========================================================= */

.tabs.kombi-tabs .tab-header {
  position: relative;

  background: #006FAF;
  color: #fff;

  border: 2px solid #8DC63F;
  border-radius: 8px 8px 0 0;

  padding: 6px 14px;
  margin-right: 4px;

  font-weight: bold;
  cursor: pointer;

  box-shadow: 2px 2px 5px rgba(0,0,0,0.3);

  transition:
    background-color 0.2s ease,
    color 0.2s ease;
}


/* =========================================================
   03 HOVER
========================================================= */

.tabs.kombi-tabs .tab-header:hover {
  background: #00558A;
  color: #fff;
}


/* =========================================================
   04 ACTIEVE TAB
========================================================= */

.tabs.kombi-tabs .tab-header.active {
  background: #00558A;
  color: #fff;
  border-color: #8DC63F;
}


/* =========================================================
   05 GROEN STREEPJE ACTIEVE TAB
========================================================= */

.tabs.kombi-tabs .tab-header.active::after {
  content: "";

  position: absolute;
  left: 15%;
  right: 15%;
  bottom: 4px;

  height: 3px;

  background: #8DC63F;
  border-radius: 3px;

  box-shadow: 0 0 6px rgba(141,198,63,0.6);
}


/* =========================================================
   06 TAB CONTENT
========================================================= */

.tabs.kombi-tabs .tab-content {
  background: #000;
  color: #fff;

  border: 2px solid #006FAF;
  border-radius: 0 8px 8px 8px;

  padding: 12px;
  box-shadow: 2px 2px 5px rgba(0,0,0,0.3);
}

/* =========================================================
   KOMBI RAIL – FOTOBLOKKEN EN OPENINGSFOTO
========================================================= */

/* Openingsfoto */
.openingsblok.kombi-rail {
  border: 2px solid #006FAF;
  background: #000;
  color: #fff;
}

.openingsblok.kombi-rail .openingsinfo {
  background: #006FAF;
  color: #fff;
  border-top: 4px solid #8DC63F;
}

.openingsblok.kombi-rail:hover {
  box-shadow: 0 0 12px rgba(141,198,63,.4);
}


/* Fotoblokken */
.tab-fotoblok.kombi-rail {
  border: 3px solid #006FAF;
  background: #fff;
}

.tab-fotoblok.kombi-rail .info {
  background: #8DC63F;
  color: #002b5c;
}