/* Extra styling voor section-blokken (bonusmanager.css wordt al sitebreed geladen) */

.of-form {
  margin-top: 30px;
}

.of-section {
  background: #f9f9f9;
  padding: 20px;
  border-radius: 12px;
  margin: 18px 0;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
  border: 1px solid #e0e0e0;
}

.of-title {
  margin: 0 0 12px 0;
  font-size: 20px;
  color: #272240;
}

.of-notice {
  padding: 14px 16px;
  border-radius: 10px;
  margin: 12px 0 18px 0;
  border: 1px solid transparent;
}

.of-success {
  background: #e9fff1;
  border-color: #b7f5cc;
}

.of-error {
  background: #fff0f0;
  border-color: #ffb3b3;
}

/* Forceer alles links in order overzicht */
#orderform-overzicht th,
#orderform-overzicht td {
    text-align: left !important;
}

/* Ook DataTables sorting icons netjes links houden */
#orderform-overzicht thead th {
    text-align: left !important;
}



.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter {
    margin-bottom: 25px;
}

.dataTables_wrapper .dataTables_info,
.dataTables_wrapper .dataTables_paginate {
    margin-top: 20px;
}


/* ===== DataTables bovenbalk layout ===== */

.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter {
    margin-bottom: 25px;
}

/* Zet beide in flex layout */
.dataTables_wrapper .dataTables_length,
.dataTables_wrapper .dataTables_filter {
    display: inline-block;
}

/* Draai volgorde om */
.dataTables_wrapper .dataTables_filter {
    float: left !important;
    text-align: left !important;
}

.dataTables_wrapper .dataTables_length {
    float: right !important;
    text-align: right !important;
}

/* Zorg dat het netjes uitgelijnd blijft */
.dataTables_wrapper:after {
    content: "";
    display: block;
    clear: both;
}


/* Maak 'Toon X rijen' dropdown wit */
.dataTables_wrapper .dataTables_length select {
    background-color: #ffffff !important;
    border: 1px solid #dcdcdc;
    border-radius: 6px;
    padding: 4px 8px;
}

/* Zorg dat tekst ook netjes donker is */
.dataTables_wrapper .dataTables_length select {
    color: #1d1d1d;
}



.cv-btn{
    background-color: #ff195d;
    color: white;
    font-size: 14px;
    font-weight: bold;
    padding: 3px 10px!important;
    border-radius: 8px;
    border: 1px solid #ff195d;
    cursor: pointer;
    transition: background-color 0.2s ease, transform 0.1s ease;
    white-space: nowrap;
    display: inline-block;
    text-decoration: none;
    margin-right: 10px;
    height: 35px;}