/* EquiWas+ Plugin Stijlen */
:root {
    --ew-groen:  #2d6a4f;
    --ew-licht:  #b7e4c7;
    --ew-wit:    #ffffff;
    --ew-grijs:  #f4f4f4;
    --ew-rand:   #d0e8d8;
    --ew-tekst:  #1b4332;
}

/* Wrap */
.equiwas-wrap, .equiwas-admin { max-width: 860px; }

.equiwas-header {
    background: var(--ew-groen);
    color: var(--ew-wit);
    padding: 20px 28px;
    border-radius: 10px 10px 0 0;
    margin-bottom: 0;
}
.equiwas-header h2 { margin: 0 0 4px; font-size: 1.5rem; color: #fff; }
.equiwas-header p  { margin: 0; opacity: .85; }

/* Formulier */
.equiwas-form {
    background: var(--ew-wit);
    border: 1px solid var(--ew-rand);
    border-radius: 0 0 10px 10px;
    padding: 28px;
}
.equiwas-form h3 {
    color: var(--ew-groen);
    border-bottom: 2px solid var(--ew-licht);
    padding-bottom: 6px;
    margin-top: 24px;
}
.equiwas-rij {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    margin-bottom: 16px;
}
.equiwas-rij.equiwas-vol { grid-template-columns: 1fr; }
.equiwas-rij label {
    display: flex;
    flex-direction: column;
    font-weight: 600;
    color: var(--ew-tekst);
    font-size: .92rem;
    gap: 5px;
}
.equiwas-rij input,
.equiwas-rij select,
.equiwas-rij textarea {
    padding: 9px 12px;
    border: 1px solid #c8ddd1;
    border-radius: 6px;
    font-size: .95rem;
    background: var(--ew-grijs);
    transition: border .2s;
}
.equiwas-rij input:focus,
.equiwas-rij select:focus,
.equiwas-rij textarea:focus {
    outline: none;
    border-color: var(--ew-groen);
    background: #fff;
}

.equiwas-btn {
    margin-top: 20px;
    background: var(--ew-groen);
    color: #fff;
    border: none;
    padding: 12px 28px;
    border-radius: 7px;
    font-size: 1rem;
    cursor: pointer;
    font-weight: 700;
    transition: background .2s;
}
.equiwas-btn:hover { background: #1b4332; }

/* Meldingen */
.equiwas-melding {
    padding: 16px 20px;
    border-radius: 8px;
    margin-bottom: 20px;
    font-size: 1rem;
}
.equiwas-fout  { background: #ffeaea; border: 1px solid #f5c6c6; color: #7b1818; }
.equiwas-info  { background: #e6f4ea; border: 1px solid var(--ew-licht); color: var(--ew-tekst); }
.equiwas-ok    { background: #e6f4ea; border: 1px solid #74c69d; color: #1b4332; }

/* Admin */
.equiwas-scan-box {
    background: var(--ew-grijs);
    border: 1px solid var(--ew-rand);
    border-radius: 10px;
    padding: 24px;
    margin-bottom: 28px;
}
.equiwas-kaart {
    background: #fff;
    border: 1px solid var(--ew-rand);
    border-radius: 10px;
    padding: 24px;
}
.equiwas-kaart h3 { margin-top: 0; color: var(--ew-groen); }

.equiwas-info { width: 100%; border-collapse: collapse; margin-bottom: 20px; }
.equiwas-info th, .equiwas-info td { padding: 8px 12px; border: 1px solid var(--ew-rand); font-size: .9rem; }
.equiwas-info th { background: var(--ew-grijs); font-weight: 600; width: 120px; }

.equiwas-status-form { background: #f9fdfb; border: 1px solid var(--ew-rand); border-radius: 8px; padding: 18px; margin-bottom: 20px; }
.equiwas-status-form h4 { margin-top: 0; color: var(--ew-groen); }
.equiwas-status-form select { padding: 7px 10px; border-radius: 5px; border: 1px solid #ccc; }

/* Badges */
.equiwas-badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: .8rem;
    font-weight: 700;
}
.equiwas-geregistreerd  { background: #e3f2fd; color: #1565c0; }
.equiwas-ontvangen       { background: #fff3e0; color: #e65100; }
.equiwas-in_behandeling  { background: #fce4ec; color: #880e4f; }
.equiwas-gewassen        { background: #e8f5e9; color: #1b5e20; }
.equiwas-klaar           { background: #ede7f6; color: #4527a0; }
.equiwas-afgehaald       { background: #f5f5f5; color: #616161; }

/* Statussen orderflow */
.equiwas-order_aangenomen { background: #fff3e0; color: #e65100; }
.equiwas-in_wasmachine    { background: #e0f7fa; color: #00838f; }
.equiwas-in_droger        { background: #fff8e1; color: #ff8f00; }
.equiwas-gereed_ophalen   { background: #e8f5e9; color: #1b5e20; }
.equiwas-opgehaald        { background: #f5f5f5; color: #616161; }

.equiwas-historie h4 { color: var(--ew-groen); }

@media (max-width: 600px) {
    .equiwas-rij { grid-template-columns: 1fr; }
}

/* ── Klant-statuspagina ─────────────────────────────────────────────── */
.equiwas-status-pagina {
    background: var(--ew-wit);
    border: 1px solid var(--ew-rand);
    border-radius: 0 0 10px 10px;
    padding: 28px;
}
.equiwas-huidig {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 26px;
    flex-wrap: wrap;
}
.equiwas-huidig-label { font-weight: 600; color: var(--ew-tekst); }
.equiwas-huidig .equiwas-badge { font-size: .9rem; padding: 5px 14px; }

/* Voortgangsbalk */
.equiwas-stappen { list-style: none; margin: 0 0 26px; padding: 0; }
.equiwas-stap {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 9px 0;
    position: relative;
}
.equiwas-stap:not(:last-child)::after {
    content: "";
    position: absolute;
    left: 15px;
    top: 38px;
    bottom: -1px;
    width: 2px;
    background: var(--ew-rand);
}
.equiwas-stap-bol {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: .9rem;
    background: var(--ew-grijs);
    color: #9bb3a6;
    border: 2px solid var(--ew-rand);
    z-index: 1;
}
.equiwas-stap-tekst { font-weight: 600; color: #9bb3a6; }

.equiwas-stap-gedaan .equiwas-stap-bol { background: var(--ew-licht); color: var(--ew-groen); border-color: var(--ew-licht); }
.equiwas-stap-gedaan .equiwas-stap-tekst { color: var(--ew-tekst); }
.equiwas-stap-gedaan:not(:last-child)::after { background: var(--ew-licht); }

.equiwas-stap-actief .equiwas-stap-bol {
    background: var(--ew-groen);
    color: #fff;
    border-color: var(--ew-groen);
    box-shadow: 0 0 0 4px rgba(45, 106, 79, .15);
}
.equiwas-stap-actief .equiwas-stap-tekst { color: var(--ew-groen); font-weight: 700; }

/* Verloop / tijdlijn */
.equiwas-historie-kop {
    color: var(--ew-groen);
    border-bottom: 2px solid var(--ew-licht);
    padding-bottom: 6px;
    margin-bottom: 8px;
}
.equiwas-tijdlijn { list-style: none; margin: 0; padding: 0; }
.equiwas-tijdlijn li {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 2px;
    border-bottom: 1px solid var(--ew-grijs);
    font-size: .92rem;
}
.equiwas-tijdlijn-status { font-weight: 600; color: var(--ew-tekst); }
.equiwas-tijdlijn-datum  { color: #6b8f7d; white-space: nowrap; }
