/* ==========================================================
   IMKERIJ BELLA - APP.CSS
   Moderne zakelijke basis
   ========================================================== */

:root {

    /* kleuren */

    --bg: #f3f6fb;
    --card: #ffffff;

    --text: #111827;
    --text-light: #64748b;

    --primary: #2563eb;
    --success: #16a34a;
    --warning: #d97706;
    --danger: #dc2626;

    --border: #e2e8f0;

    --radius-sm: 12px;
    --radius-md: 18px;
    --radius-lg: 24px;

    --shadow:
        0 1px 2px rgba(15, 23, 42, .04),
        0 12px 32px rgba(15, 23, 42, .06);

    /* afstanden */

    --space-xs: 6px;
    --space-sm: 12px;
    --space-md: 18px;
    --space-lg: 24px;
    --space-xl: 32px;
}

/* ==========================================================
   RESET
   ========================================================== */

* {
    box-sizing: border-box;
}

html {
    -webkit-text-size-adjust: 100%;
}

body {

    margin: 0;
    padding: 0;

    background: var(--bg);
    color: var(--text);

    font-family:
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        Roboto,
        Arial,
        sans-serif;

    font-size: 15px;
    line-height: 1.5;
}

/* ==========================================================
   LINKS
   ========================================================== */

a {
    color: var(--primary);
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

/* ==========================================================
   CONTAINERS
   ========================================================== */

.container {

    width: 100%;
    max-width: 1600px;

    margin: 0 auto;

    padding: 24px;
}

/* ==========================================================
   TITELS
   ========================================================== */

h1 {
    margin: 0 0 20px;
    font-size: 30px;
}

h2 {
    margin: 0 0 16px;
    font-size: 24px;
}

h3 {
    margin: 0 0 12px;
    font-size: 18px;
}

.page-header {

    display: flex;

    justify-content: space-between;

    align-items: center;

    gap: 16px;

    margin-bottom: 24px;
}

/* ==========================================================
   CARDS
   ========================================================== */

.card {

    background: var(--card);

    border: 1px solid rgba(226, 232, 240, .9);

    border-radius: 24px;

    box-shadow:
        0 1px 2px rgba(15, 23, 42, .04),
        0 16px 40px rgba(15, 23, 42, .06);

    padding: 28px;
}

.card:hover {

    box-shadow:
        0 1px 2px rgba(15, 23, 42, .04),
        0 24px 48px rgba(15, 23, 42, .08);
}

.card+.card {
    margin-top: 20px;
}

/* ==========================================================
   GRID
   ========================================================== */

.grid {
    display: grid;
    gap: 20px;
}

.grid-2 {
    grid-template-columns: repeat(2, 1fr);
}

.grid-3 {
    grid-template-columns: repeat(3, 1fr);
}

.grid-4 {
    grid-template-columns: repeat(4, 1fr);
}

/* ==========================================================
   FORMULIEREN
   ========================================================== */

.form-group {
    margin-bottom: 24px;
}

label {

    display: block;

    margin-bottom: 8px;

    font-size: 14px;

    font-weight: 700;

    color: #475569;
}

input,
select,
textarea {

    width: 100%;

    min-height: 58px;
        padding: 16px 22px;

    border: 1px solid #e5eaf1;

    border-radius: 18px;

    background: #ffffff;

    color: var(--text);

    font-size: 16px;

    box-shadow:
        inset 0 1px 2px rgba(15, 23, 42, .03);

    transition:
        border-color .18s ease,
        box-shadow .18s ease,
        background .18s ease;
}

input[type="checkbox"],
input[type="radio"] {

    width: 20px;

    height: 20px;

    min-height: 20px;

    accent-color: var(--primary);

    cursor: pointer;
}

/* iOS zoom fix */

input,
select,
textarea {
    font-size: 16px;
}

input::placeholder,
textarea::placeholder {

    color: #94a3b8;

    opacity: 1;

    white-space: normal;
}

textarea {
    min-height: 120px;
    resize: vertical;
}

input:focus,
select:focus,
textarea:focus {

    outline: none;

    border-color: #60a5fa;

    background: #ffffff;

    box-shadow:
        0 0 0 5px rgba(59, 130, 246, .10),
        0 4px 12px rgba(59, 130, 246, .08);
}

/* ==========================================================
   BUTTONS
   ========================================================== */


.btn {

    display: inline-flex;

    align-items: center;

    justify-content: center;

    gap: 8px;

    min-height: 46px;

    padding: 12px 18px;

    border: 1px solid #dbe4ee;

    background: #ffffff;

    color: #111827;

    border-radius: 16px;

    cursor: pointer;

    text-decoration: none;

    font-weight: 700;

    box-shadow:
        0 1px 2px rgba(15, 23, 42, .04),
        0 4px 12px rgba(15, 23, 42, .06);

    transition:
        transform .15s,
        box-shadow .15s;
}

.btn:hover {

    transform: translateY(-2px);

    text-decoration: none;
}

.btn-primary {

    background: var(--primary);

    border-color: var(--primary);

    color: #fff;
}

.btn-success {

    background: var(--success);

    border-color: var(--success);

    color: #fff;
}

.btn-danger {

    background: var(--danger);

    border-color: var(--danger);

    color: #fff;
}

.btn-secondary {

    background: #e2e8f0;

    border-color: #d1d9e3;

    color: #0f172a;
}

.btn-primary:hover {

    background: #1d4ed8;

    border-color: #1d4ed8;

    color: #fff;
}

.btn-success:hover {

    background: #15803d;

    border-color: #15803d;

    color: #fff;
}

.btn-danger:hover {

    background: #b91c1c;

    border-color: #b91c1c;

    color: #fff;
}

.btn:hover {
    text-decoration: none;
}

/* ==========================================================
   BADGES
   ========================================================== */

.badge {

    display: inline-block;

    padding: 4px 10px;

    border-radius: 999px;

    font-size: 12px;

    font-weight: 600;
}

.badge-success {
    background: #dcfce7;
    color: #166534;
}

.badge-warning {
    background: #fef3c7;
    color: #92400e;
}

.badge-danger {
    background: #fee2e2;
    color: #991b1b;
}

/* ==========================================================
   TABELLEN
   ========================================================== */

.table-wrap {
    overflow-x: auto;
}

.table {

    width: 100%;

    border-collapse: collapse;
}

.table th {

    background: #f8fafc;

    color: #475569;

    font-size: 13px;

    text-transform: uppercase;

    letter-spacing: .04em;

    font-weight: 700;
}

.table th,
.table td {

    padding: 16px;

    border-bottom: 1px solid #edf2f7;
}

.table tr:hover {
    background: #fafbfc;
}

/* ==========================================================
   MELDINGEN
   ========================================================== */

.alert {

    padding: 14px 16px;

    border-radius: 14px;

    margin-bottom: 16px;
}

.alert-success {

    background: #dcfce7;

    color: #166534;
}

.alert-warning {

    background: #fef3c7;

    color: #92400e;
}

.alert-danger {

    background: #fee2e2;

    color: #991b1b;
}

/* ==========================================================
   MOBIEL
   ========================================================== */

@media (max-width:900px) {

    .grid-2,
    .grid-3,
    .grid-4 {
        grid-template-columns: 1fr;
    }
    
       .container {
           padding: 16px;
         }

    .page-header {
        flex-direction: column;
        align-items: flex-start;
    }
}

.grid-auto {

    display: grid;

    gap: 20px;
}

@media (min-width:1200px) {

    .grid-auto {
        grid-template-columns: repeat(3, 1fr);
    }

}

@media (min-width:768px) and (max-width:1199px) {

    .grid-auto {
        grid-template-columns: repeat(2, 1fr);
    }

}

@media (max-width:767px) {

    .grid-auto {
        grid-template-columns: 1fr;
    }

}

.muted {
    color: var(--text-light);
}

.row {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-items: flex-end;
}

.btn-sm {
    padding: 8px 12px;
    min-height: 36px;
    font-size: 14px;
}

.disabled {
    opacity: .55;
    pointer-events: none;
}

.msg {
    background: #dcfce7;
    color: #166534;
    padding: 10px 14px;
    border-radius: 12px;
    margin-bottom: 16px;
    display: inline-block;
}

.err {
    background: #fee2e2;
    color: #991b1b;
    padding: 10px 14px;
    border-radius: 12px;
    margin-bottom: 16px;
    display: inline-block;
}

.pill {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: #f8fafc;
    font-size: 13px;
}

details {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 16px;
    padding: 12px;
    margin-bottom: 12px;
}

summary {
    cursor: pointer;
    font-weight: 600;
}

.grid2 {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.grid3 {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

@media (max-width:900px) {

    .grid2,
    .grid3 {
        grid-template-columns: 1fr;
    }

}

.topnav {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.rel {
    position: relative;
}

.mini {
    font-size: 13px;
    color: var(--text-light);
    margin-top: 6px;
}

.idchip {
    display: inline-block;
    margin-top: 6px;
    padding: 3px 8px;
    border-radius: 999px;
    background: #f3f4f6;
    color: #374151;
    font-size: 12px;
}

.errors {
    background: #fee2e2;
    color: #991b1b;
    border-radius: 14px;
    padding: 14px;
    margin-bottom: 20px;
}

.errors ul {
    margin: 0;
    padding-left: 18px;
}

@media (max-width:900px) {

    .grid2,
    .grid3 {
        grid-template-columns: 1fr;
    }
}

.section-card {
    padding: 15px;
    border-radius: 10px;
    margin-bottom: 20px;
}

.section-card-warning {
    border: 2px solid #ffe69c;
    background: #fffdf2;
}

.section-card-success {
    border: 2px solid #d4edda;
    background: #f8fff8;
}

.section-card-info {
    border: 2px solid #cfe2ff;
    background: #f8fbff;
}

.section-actions {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid var(--border);
}

.spacer-md {
    height: 20px;
}

.section-title {
    margin-top: 0;
}

.section-help {
    margin-top: 0;
    color: var(--text-light);
}

.pagination {
    margin-top: 12px;
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

fieldset {

    border: 1px solid var(--border);

    border-radius: 16px;

    padding: 20px;

    background: #fafbfd;

    margin-bottom: 20px;
}

legend {

    padding: 0 10px;

    font-weight: 700;
}

select {

    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

    background-color: #fff;

    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Cpath d='M5 7.5L10 12.5L15 7.5' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

    background-repeat: no-repeat;
    background-position: right 18px center;
    background-size: 18px;

    padding-right: 54px;

    cursor: pointer;

    font-weight: 500;
}

select:hover {
    border-color: #94a3b8;
}

select:focus {

    border-color: #60a5fa;

    box-shadow:
        0 0 0 5px rgba(59, 130, 246, .10),
        0 8px 24px rgba(59, 130, 246, .08);
}

input:hover,
select:hover,
textarea:hover {

    border-color: #cbd5e1;
}

@media (max-width: 900px) {

    .card {
        padding: 18px;
        border-radius: 18px;
    }

    .btn {
        width: 100%;
    }

    .btn-sm {
        width: auto;
    }

    .row {
        flex-direction: column;
        align-items: stretch;
    }

    fieldset {
        padding: 14px;
    }
}

/* ==========================================================
   AUTOCOMPLETE / SUGGESTIONS
   ========================================================== */

.suggestions {

    border: 1px solid var(--border);

    display: none;

    position: absolute;

    top: 100%;
    left: 0;
    right: 0;

    width: 100%;

    background: #fff;

    list-style: none;

    padding: 8px;

    margin-top: 4px;

    border-radius: 16px;

    box-shadow: var(--shadow);

    max-height: 250px;

    overflow-y: auto;

    z-index: 999;
}

.suggestions li {

    padding: 10px 12px;

    border-radius: 10px;

    cursor: pointer;
}

.suggestions li:hover {

    background: #f3f6fb;
}

/* ==========================================================
   AUTOCOMPLETE / SUGGESTIONS
   ========================================================== */

.suggestions {

    border: 1px solid var(--border);

    display: none;

    position: absolute;

    top: 100%;
    left: 0;
    right: 0;

    width: 100%;

    background: #fff;

    list-style: none;

    padding: 8px;

    margin-top: 4px;

    border-radius: 16px;

    box-shadow: var(--shadow);

    max-height: 250px;

    overflow-y: auto;

    z-index: 999;
}

.suggestions li {

    padding: 10px 12px;

    border-radius: 10px;

    cursor: pointer;
}

.suggestions li:hover {

    background: #f3f6fb;
}

.container {
    width: 100%;
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px;
}

@media (max-width:900px) {

    .container {
        padding: 16px;
    }

}

/* ==========================================================
   GLOBALE MOBIELE LAYOUT
   ========================================================== */

@media (max-width: 900px) {

    .grid2,
    .grid3,
    .grid-2,
    .grid-3,
    .grid-4 {
        grid-template-columns: 1fr !important;
    }

    .row {
        flex-direction: column;
        align-items: stretch;
    }

    .topnav {
        flex-direction: column;
        align-items: stretch;
    }

    .topnav>div {
        width: 100%;
    }

    .card {
        padding: 16px;
        border-radius: 18px;
    }

.desktop-view table {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
}

    .container {
        padding: 12px;
    }
}

/* ==========================================================
   DESKTOP / MOBIEL WEERGAVE
   ========================================================== */

.desktop-view{
    display:block;
}

.mobile-view{
    display:none;
}

@media (max-width:900px){

    .desktop-view{
        display:none;
    }

    .mobile-view{
        display:block;
    }

}
/* Koningin detail 2.0 — gedeelde paginalayout (compact) */
/* Koningin detail — Kastkaart 2.0. Only affects this page. */
.queen-detail{--qd-border:#dbe1e8;--qd-ink:#172338;--qd-muted:#65748b;--qd-blue:#2563eb;color:var(--qd-ink);max-width:none;min-width:0}
.queen-detail .qd-header{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:20px;padding:8px 0 22px}
.queen-detail .qd-eyebrow{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--qd-blue);margin-bottom:7px}
.queen-detail .qd-header h1{font-size:clamp(25px,2.5vw,34px);line-height:1.18;margin:0;letter-spacing:-.03em}
.queen-detail .qd-name{font-weight:500;color:#64748b}
.queen-detail .qd-subtitle{color:var(--qd-muted);margin:10px 0 0;font-size:14px}
.queen-detail .qd-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;max-width:650px}
.queen-detail .qd-actions .btn{min-height:42px;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;text-decoration:none}
.queen-detail .qd-section{background:#fff;border:1px solid var(--qd-border);border-radius:18px;padding:clamp(16px,2.2vw,26px);margin:0 0 18px;box-shadow:0 2px 8px rgba(20,38,65,.035);min-width:0}
.queen-detail .qd-section>h2{font-size:19px;font-weight:750;letter-spacing:-.02em;margin:0 0 18px;padding-bottom:14px;border-bottom:1px solid #e9edf2;color:#18243a}
.queen-detail .qd-section h3{font-size:16px;margin:22px 0 12px;color:#243449}
.queen-detail .muted{color:var(--qd-muted)}
.queen-detail .msg,.queen-detail .err{padding:12px 15px;border-radius:12px;display:block;margin:0 0 16px;font-size:14px}
.queen-detail .msg{background:#effaf3;border:1px solid #bce5c9;color:#166534}
.queen-detail .err{background:#fff3f3;border:1px solid #f4c4c4;color:#991b1b}
.queen-detail .disabled{opacity:.48;pointer-events:none}
.queen-detail .btn-sm{font-size:14px;min-height:38px;display:inline-flex;align-items:center;justify-content:center;padding:8px 12px}
.queen-detail .btn-danger{border:1px solid #fecaca;background:#fff5f5;color:#991b1b}
.queen-detail .btn-danger:hover{background:#fee2e2}
.queen-detail .qd-section>.row,.queen-detail .qd-section form.row{display:flex;flex-wrap:wrap;gap:9px;align-items:center}
.queen-detail .qd-section details{border:1px solid var(--qd-border);border-radius:12px;padding:12px 15px;margin:12px 0;background:#fbfcfe}
.queen-detail .qd-section summary{cursor:pointer;font-weight:700;color:#334155}
.queen-detail .qd-section code{background:#f1f5f9;padding:3px 6px;border-radius:6px;overflow-wrap:anywhere;font-size:12px}
.queen-detail .kpi{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.queen-detail .k{border:1px solid #e1e7ee;border-radius:13px;padding:15px;background:#f8fafd;min-width:0}
.queen-detail .k .t{font-size:12px;font-weight:650;color:#64748b}
.queen-detail .k .v{font-size:21px;font-weight:800;margin-top:6px;color:#1e293b}
.queen-detail .pedKpiGrid{display:grid;grid-template-columns:minmax(300px,420px) minmax(0,1fr);gap:18px;align-items:start}
.queen-detail .miniPedWrap{border:1px solid #e1e7ee;border-radius:13px;padding:12px;background:#fff;min-width:0}
.queen-detail .miniPed{width:100%;overflow:hidden}
.queen-detail .miniPed svg{width:100%;height:auto;display:block}
.queen-detail .pbox{rx:12;ry:12;stroke:#334155;stroke-width:1}
.queen-detail .pline{stroke:#64748b;stroke-width:1;opacity:.8}
@media(max-width:1100px){.queen-detail .pedKpiGrid{grid-template-columns:1fr}}
@media(max-width:480px){.queen-detail .kpi{grid-template-columns:1fr}.queen-detail .qd-actions .btn{flex:1 1 auto}.queen-detail .qd-section{padding:15px}}

.queen-detail .qd-header{gap:10px;padding:2px 0 12px}
.queen-detail .qd-eyebrow{margin-bottom:3px;font-size:11px}
.queen-detail .qd-header h1{font-size:clamp(22px,2vw,28px)}
.queen-detail .qd-subtitle{margin:4px 0 0;font-size:13px}
.queen-detail .qd-actions{gap:6px}
.queen-detail .qd-actions .btn{min-height:34px;padding:6px 10px;font-size:13px}
.queen-detail .qd-section{padding:14px 16px;margin:0 0 12px;border-radius:12px;box-shadow:none}
.queen-detail .qd-section>h2{font-size:16px;margin:0 0 10px;padding-bottom:9px}
.queen-detail .qd-section h3{font-size:14px;margin:12px 0 7px}
.queen-detail .kpi{gap:8px}
.queen-detail .k{padding:10px;border-radius:9px}
.queen-detail .k .v{font-size:18px;margin-top:3px}
.queen-detail .pedKpiGrid{gap:12px}
.queen-detail .miniPedWrap{padding:8px;border-radius:9px}
.queen-detail .qd-section details{padding:9px 11px;margin:8px 0}
.queen-detail .btn-sm{min-height:32px;padding:5px 9px;font-size:13px}
@media(max-width:480px){.queen-detail .qd-section{padding:12px}}

/* Kastkaart 2.0: herbruikbare compacte detailkaarten */
.queen-detail .qd-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start;margin-bottom:12px}
.queen-detail .qd-card-grid .qd-section{margin:0;min-width:0;height:100%}
.queen-detail .qd-info-card .qd-info-table{width:100%;table-layout:fixed}
.queen-detail .qd-info-card .qd-info-table th{width:42%;font-weight:650}
.queen-detail .qd-info-card .qd-info-table th,.queen-detail .qd-info-card .qd-info-table td{padding:7px 9px;overflow-wrap:anywhere;word-break:normal}
.queen-detail .qd-mobile-toggle{all:unset;display:block;width:100%;font:inherit;color:inherit;cursor:default}
.queen-detail .qd-mobile-toggle span{display:none}
.queen-detail .qd-collapse-body[hidden]{display:none!important}
@media(max-width:900px){.queen-detail .qd-card-grid{grid-template-columns:1fr}}
@media(max-width:700px){
 .queen-detail .qd-card-grid{gap:8px}
 .queen-detail .qd-section{padding:10px 12px;margin-bottom:8px}
 .queen-detail .qd-info-card .qd-info-table th,.queen-detail .qd-info-card .qd-info-table td{padding:6px 7px;font-size:12px}
 .queen-detail .qd-mobile-toggle{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:8px}
 .queen-detail .qd-mobile-toggle span{display:inline;font-size:18px}
 .queen-detail .qd-collapsed .qd-mobile-toggle span{transform:rotate(-90deg)}
 .queen-detail .qd-foldable .qd-collapse-body{min-width:0}
 .queen-detail .qd-foldable table{width:100%;max-width:100%}
 .queen-detail .qd-foldable .kk-table{table-layout:auto}
 .queen-detail .qd-foldable td,.queen-detail .qd-foldable th{overflow-wrap:anywhere}
 .queen-detail .qd-header .qd-actions{gap:5px}
}

/* Kastkaart 2.0 — herbruikbare compacte kaarten en mobiele kastdetail-layout */
.kast-detail-page .kd-top-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:stretch;margin:0 0 12px}
.kast-detail-page .kd-top-grid>.card{min-width:0;margin:0;padding:14px 16px;border-radius:12px;box-shadow:none}
.kast-detail-page .kd-top-grid h2,.kast-detail-page .kd-top-grid h3{font-size:16px;line-height:1.25;margin:0 0 8px}
.kast-detail-page .kd-top-grid .kd-control-stats{gap:6px}
.kast-detail-page .kd-top-grid .kd-control-stats>div{padding:8px;min-width:0}
.kast-detail-page .kd-top-grid .kd-control-stats strong{font-size:16px}
.kast-detail-page .kd-top-grid .kd-section-heading{gap:8px;flex-wrap:wrap}
.kast-detail-page .kd-top-grid .kd-reminder-card{display:block}
.kast-detail-page .kd-top-grid .kd-reminder{min-width:0}
.kast-detail-page .kd-top-grid .card-body{padding:0}
.kast-detail-page .kd-top-grid .card-header{padding:0;margin-bottom:9px}
.kast-detail-page .kd-top-grid .row{flex-wrap:wrap}
.kast-detail-page .kd-wide-sections{display:grid;gap:10px}
.kast-detail-page .kd-wide-sections>.card{margin:0;min-width:0;border-radius:12px;box-shadow:none}
.kast-detail-page .kd-fold{padding:0;overflow:hidden}
.kast-detail-page .kd-fold>summary{cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:13px 16px;font-size:16px;font-weight:750;list-style:none}
.kast-detail-page .kd-fold>summary::-webkit-details-marker{display:none}
.kast-detail-page .kd-fold>summary::after{content:'+';font-size:21px;line-height:1;color:#64748b;flex-shrink:0}
.kast-detail-page .kd-fold[open]>summary::after{content:'−'}
.kast-detail-page .kd-fold>summary small{font-size:12px;font-weight:500;color:#718198;margin-right:auto}
.kast-detail-page .kd-fold[open]>summary{border-bottom:1px solid #e5ebf2}
.kast-detail-page .kd-fold-body{padding:12px 16px 16px;min-width:0}
.kast-detail-page .kd-fold-body table{width:100%;max-width:100%}
.kast-detail-page .kd-fold-body td,.kast-detail-page .kd-fold-body th{overflow-wrap:anywhere}
.kast-detail-page .kd-hero{margin-bottom:12px}
.kast-detail-page .kd-subtitle{margin-bottom:6px}
.kast-detail-page .kd-inline-meta{gap:7px;flex-wrap:wrap}
.kast-detail-page .kd-fold-body form.row{flex-wrap:wrap;max-width:100%}
.kast-detail-page .kd-fold-body input,.kast-detail-page .kd-fold-body select{max-width:100%}
.kast-detail-page .kd-fold-body .grid25{max-width:100%}
@media(max-width:950px){.kast-detail-page .kd-top-grid{grid-template-columns:1fr}}
@media(max-width:700px){
 .kast-detail-page{padding:12px 10px 36px;max-width:100%;overflow-x:clip}
 .kast-detail-page .kd-top-grid{gap:8px;margin-bottom:8px}
 .kast-detail-page .kd-top-grid>.card{padding:11px 12px}
 .kast-detail-page .kd-top-grid .kd-control-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
 .kast-detail-page .kd-fold>summary{padding:11px 12px;font-size:15px}
 .kast-detail-page .kd-fold-body{padding:10px 12px 12px}
 .kast-detail-page .kd-wide-sections{gap:8px}
 .kast-detail-page .kd-fold-body table{display:block;width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
 .kast-detail-page .kd-fold-body .kk-table{display:table;overflow:visible}
 .kast-detail-page .kd-fold-body .kk-table td,.kast-detail-page .kd-fold-body .kk-table th{max-width:100%;word-break:break-word}
 .kast-detail-page .kd-fold-body form.row>label{min-width:0;max-width:100%;flex:1 1 180px}
}

/* Kastkaart 2.0 — gedeelde compacte standplaatsenweergave */
.sp-page{min-width:0;max-width:100%}.sp-page .sp-heading{margin-bottom:12px}.sp-page .sp-toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 12px}.sp-page .sp-toolbar input,.sp-page .sp-toolbar select,.sp-page .sp-edit input,.sp-page .sp-add input,.sp-page .sp-add select{box-sizing:border-box;min-height:38px;max-width:100%;border:1px solid #dbe3ed;border-radius:8px;padding:8px 10px;background:#fff;color:#172b43;font:inherit}.sp-page .sp-toolbar input{flex:1 1 220px;min-width:0}.sp-page .sp-toolbar form{display:flex;align-items:center;gap:8px;min-width:0}.sp-page .sp-toolbar select{min-width:160px}.sp-page .sp-list-panel{padding:0;overflow:hidden;min-width:0}.sp-page .sp-table-wrap{min-width:0}.sp-page .sp-table{width:100%;border-collapse:collapse;text-align:left}.sp-page .sp-table th{font-size:12px;color:#78899a;font-weight:700;padding:10px 12px;background:#f8fafc}.sp-page .sp-table td{padding:10px 12px;border-top:1px solid #eef2f6;font-size:13px;vertical-align:middle;overflow-wrap:anywhere}.sp-page .sp-table tbody tr:hover{background:#f9fbfe}.sp-page .sp-name{font-weight:750;color:#172b43}.sp-page .sp-muted{color:#78899a;font-size:12px}.sp-page .sp-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.sp-page .sp-action{color:#286db5;font-weight:700;font-size:12px}.sp-page .sp-fav{font-size:20px;color:#c58b20;text-decoration:none}.sp-page .sp-edit{margin-top:7px}.sp-page .sp-edit summary{cursor:pointer;color:#60748a;font-size:12px}.sp-page .sp-edit form,.sp-page .sp-add{display:flex;gap:8px;flex-wrap:wrap;align-items:end;margin-top:10px}.sp-page .sp-btn{background:#2563eb;color:white;border:0;border-radius:8px;padding:8px 12px;font:inherit;font-size:12px;font-weight:700;cursor:pointer;min-height:38px}.sp-page .sp-add label{display:grid;gap:5px;font-size:12px;color:#60748a;min-width:0}.sp-page .sp-feedback{padding:10px 12px;margin-bottom:10px;border-radius:8px;background:white;border:1px solid #e4ebf2}.sp-page .sp-error{color:#b42318}.sp-page .sp-ok{color:#16703d}.sp-page .sp-bottom{margin-top:12px;padding:12px 14px}.sp-page .sp-bottom summary{cursor:pointer}.sp-page .sp-empty{padding:16px;color:#78899a}.sp-page .sp-count{font-weight:750;font-variant-numeric:tabular-nums}.sp-page .sp-data-row[hidden]{display:none!important}.sp-page #sp-no-results[hidden]{display:none!important}
@media(max-width:700px){.sp-page{max-width:100%;overflow-x:clip}.sp-page .sp-toolbar{display:grid;grid-template-columns:1fr;gap:8px}.sp-page .sp-toolbar form,.sp-page .sp-toolbar select,.sp-page .sp-toolbar input{width:100%;min-width:0}.sp-page .sp-list-panel{background:transparent;border:0;box-shadow:none;overflow:visible}.sp-page .sp-table-wrap{overflow:visible}.sp-page .sp-table,.sp-page .sp-table tbody{display:block;width:100%}.sp-page .sp-table thead{display:none}.sp-page .sp-table tr.sp-data-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:5px 10px;background:#fff;border:1px solid #e5ebf2;border-radius:11px;padding:11px 12px;margin-bottom:9px;box-shadow:0 1px 3px rgba(16,32,50,.04)}.sp-page .sp-table td{border:0;padding:0;min-width:0;display:block}.sp-page .sp-table td:nth-child(1){grid-column:1;grid-row:1}.sp-page .sp-table td:nth-child(2){grid-column:1;grid-row:2;color:#60748a;font-size:12px}.sp-page .sp-table td:nth-child(3){grid-column:1/-1;grid-row:3;font-size:12px}.sp-page .sp-table td:nth-child(4){grid-column:2;grid-row:1;text-align:right}.sp-page .sp-table td:nth-child(4)::after{content:' kasten';font-size:11px;font-weight:400;color:#78899a}.sp-page .sp-table td:nth-child(5){grid-column:1/-1;grid-row:4;border-top:1px solid #edf1f5;padding-top:7px}.sp-page .sp-table .sp-location{display:block}.sp-page .sp-actions{gap:12px}.sp-page .sp-edit form{display:grid;grid-template-columns:1fr;align-items:stretch}.sp-page .sp-edit input,.sp-page .sp-edit button,.sp-page .sp-add input,.sp-page .sp-add select,.sp-page .sp-add button{width:100%}.sp-page .sp-add{display:grid;grid-template-columns:1fr}.sp-page .sp-add label{width:100%}}

/* Kastkaart 2.0 — compact koninginnenoverzicht */
.qo-page .page-heading{margin-bottom:14px}
.qo-page .qo-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.qo-page .qo-toolbar .kk-search{flex:2 1 220px;min-width:0}
.qo-page .qo-toolbar .kk-select{flex:1 1 145px;min-width:0}
.qo-page .qo-toolbar .kk-btn{min-height:36px;padding:8px 12px;white-space:nowrap}
.qo-page .qo-help{margin:0 0 12px;font-size:12px}
.qo-page .queen-year{margin:0 0 9px;border:1px solid #e4ebf3;border-radius:11px;background:#fff;overflow:hidden}
.qo-page .queen-year>summary{cursor:pointer;padding:11px 14px;font-weight:750;display:flex;gap:12px;align-items:center;justify-content:space-between}
.qo-page .queen-year-count{font-size:12px;font-weight:600;color:#64748b}
.qo-page .qo-table-panel{margin:0;border:0;border-radius:0;box-shadow:none;padding:0;overflow:visible}
.qo-page .qo-table{width:100%;border-collapse:collapse}
.qo-page .qo-table th{font-size:12px;padding:9px 12px;white-space:nowrap}
.qo-page .qo-table td{font-size:13px;padding:10px 12px;vertical-align:middle;overflow-wrap:anywhere}
.qo-page .ko-name{font-weight:750}
.qo-page .ko-muted{font-size:12px;color:#64748b}
.qo-page .ko-actions a{white-space:nowrap}
.qo-page .queen-result[hidden],.qo-page .queen-year[hidden]{display:none!important}
@media(max-width:760px){
 .qo-page .qo-toolbar{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 .qo-page .qo-toolbar .kk-search{grid-column:1/-1;width:100%}
 .qo-page .qo-toolbar .kk-select{width:100%}
 .qo-page .qo-toolbar .kk-btn{width:100%;text-align:center}
 .qo-page .queen-year>summary{padding:10px 12px}
 .qo-page .qo-table thead{display:none}
 .qo-page .qo-table,.qo-page .qo-table tbody{display:block;width:100%}
 .qo-page .qo-table tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;padding:11px 12px;border-top:1px solid #e9eef5}
 .qo-page .qo-table td{display:block;border:0;padding:0;min-width:0;font-size:13px}
 .qo-page .qo-table td::before{display:none}
 .qo-page .qo-table .ko-main{grid-column:1;grid-row:1}
 .qo-page .qo-table td[data-label="Ouders"]{grid-column:1/-1;grid-row:2;display:flex;gap:12px;flex-wrap:wrap}
 .qo-page .qo-table td[data-label="Kenmerken"]{grid-column:1/-1;grid-row:3}
 .qo-page .qo-table td[data-label="Verwantschap"]{grid-column:1/-1;grid-row:4}
 .qo-page .qo-table .ko-actions{grid-column:2;grid-row:1;align-self:start}
 .qo-page .qo-table .ko-actions a{font-size:12px}
}
@media(max-width:390px){.qo-page .qo-toolbar{grid-template-columns:1fr}.qo-page .qo-toolbar .kk-search{grid-column:1}.qo-page .qo-table tr{grid-template-columns:minmax(0,1fr)}.qo-page .qo-table .ko-actions{grid-column:1;grid-row:5}}

/* Kastkaart 2.0 — gedeelde compacte kaartindeling voor koninginnenformulier */
.qf-page .qf-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start;margin-bottom:14px}
.qf-page .qf-card-grid>.qf-section{min-width:0;margin:0;padding:15px 16px;border-radius:12px}
.qf-page .qf-card-grid>.qf-section .qf-section-head{margin-bottom:12px;gap:8px}
.qf-page .qf-card-grid>.qf-section .qf-section-head h2{font-size:16px;line-height:1.25;margin:0}
.qf-page .qf-card-grid>.qf-section .qf-section-head p{font-size:12px;margin:3px 0 0}
.qf-page .qf-card-grid>.qf-section .qf-toggle{min-height:32px;padding:5px 8px;font-size:12px}
.qf-page .qf-card-grid>.qf-section .grid2,.qf-page .qf-card-grid>.qf-section .grid3{gap:9px}
.qf-page .qf-card-grid>.qf-section label{margin-bottom:4px}
.qf-page .qf-card-grid>.qf-section input:not([type=checkbox]),.qf-page .qf-card-grid>.qf-section select{min-height:36px;padding:7px 9px}
.qf-page .qf-card-grid>.qf-section textarea{min-height:70px}
.qf-page .qf-card-grid>#qf-darren,.qf-page .qf-card-grid>#qf-notities{grid-column:1/-1}
.qf-page .qf-card-grid .qf-section.qf-collapsed{align-self:start}
.qf-page .qf-card-grid .qf-section.qf-collapsed .qf-section-head{margin-bottom:0}
.qf-page .qf-form,.qf-page .qf-card-grid,.qf-page .qf-section{min-width:0}
@media(max-width:850px){.qf-page .qf-card-grid{grid-template-columns:minmax(0,1fr)}.qf-page .qf-card-grid>#qf-darren,.qf-page .qf-card-grid>#qf-notities{grid-column:auto}}
@media(max-width:650px){
 .qf-page .qf-card-grid{gap:9px}
 .qf-page .qf-card-grid>.qf-section{padding:12px}
 .qf-page .qf-card-grid>.qf-section .grid2,.qf-page .qf-card-grid>.qf-section .grid3{grid-template-columns:minmax(0,1fr)}
 .qf-page #father_table,.qf-page #father_table tbody,.qf-page #father_table tr,.qf-page #father_table td{display:block;width:100%;min-width:0!important;box-sizing:border-box}
 .qf-page #father_table thead{display:none}
 .qf-page #father_table tbody{display:grid;gap:12px}
 .qf-page #father_table tr{border:1px solid #e2e9f1;border-radius:11px;padding:10px;background:#fbfcfe}
 .qf-page #father_table td{padding:5px 0;border:0;white-space:normal}
 .qf-page #father_table td:before{display:block;color:#65758b;font-size:11px;font-weight:700;margin-bottom:4px}
 .qf-page #father_table td:nth-child(1):before{content:"Genetische bron (koningin)"}
 .qf-page #father_table td:nth-child(2):before{content:"Genetische bron (kast)"}
 .qf-page #father_table td:nth-child(3):before{content:"Broncode"}
 .qf-page #father_table td:nth-child(4):before{content:"Exacte darrenvolken (notitie)"}
 .qf-page #father_table td:nth-child(5):before{content:"Type"}
 .qf-page #father_table td:nth-child(6):before{content:"Percentage"}
 .qf-page #father_table td:nth-child(7):before{content:"Extra notitie"}
 .qf-page #father_table td input:not([type=hidden]),.qf-page #father_table td select{width:100%;min-width:0!important;max-width:100%;box-sizing:border-box}
 .qf-page .qf-table-scroll{overflow-x:visible!important;max-width:100%}
 .qf-page .qf-sections{overflow-x:auto;max-width:100%}
}


/* Kastkaart 2.0 — stamboom (geïsoleerde pagina-opmaak) */
.pd-page .pd-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.pd-page .pd-card{min-width:0;padding:16px;margin:0 0 12px;border:1px solid #e2e8f0;border-radius:12px;background:#fff}
.pd-page .pd-card h2{font-size:16px;margin:0 0 12px}.pd-page .pd-card h3{font-size:13px;margin:0 0 8px}
.pd-page .pd-toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:8px}
.pd-page .pd-gen-form,.pd-page .pd-zoom{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.pd-page .pd-gen-form label{font-size:13px;font-weight:600}.pd-page .pd-gen-form select{min-height:34px;padding:5px 8px;border:1px solid #d5deea;border-radius:8px;background:white}
.pd-page .pd-zoom button{border:1px solid #d5deea;background:#fff;border-radius:8px;padding:7px 11px;min-height:34px;cursor:pointer;font-weight:600}
.pd-page .pd-zoom button:hover{background:#eef4fb}.pd-page .pd-zoom output{min-width:43px;text-align:center;font-size:12px;font-weight:700}
.pd-page .pd-help,.pd-page .pd-muted{font-size:12px;color:#64748b;margin:6px 0 10px}
.pd-page .pd-viewport{height:min(66vh,650px);min-height:320px;max-width:100%;overflow:auto;overscroll-behavior:contain;border:1px solid #dce4ef;border-radius:10px;background-color:#f8fafc;background-image:linear-gradient(#e8eef5 1px,transparent 1px),linear-gradient(90deg,#e8eef5 1px,transparent 1px);background-size:30px 30px;touch-action:pan-x pan-y pinch-zoom;scrollbar-width:thin}
.pd-page .pd-viewport svg{display:block;max-width:none;max-height:none;flex:none}.pd-page .pd-edge{fill:none;stroke:#a7b6c8;stroke-width:1.4}.pd-page .pd-node-code{font-size:12px;font-weight:700;fill:#253448}.pd-page .pd-node-meta{font-size:10px;fill:#66768a}.pd-page .pd-node a:hover rect{stroke:#2563eb;stroke-width:2}.pd-page .pd-root rect{stroke:#2d435e;stroke-width:2}
.pd-page .pd-legend{display:flex;flex-wrap:wrap;gap:14px;margin-top:11px;font-size:12px;color:#51647b}.pd-page .pd-legend span{display:inline-flex;align-items:center;gap:6px}.pd-page .pd-dot{display:inline-block;width:11px;height:11px;border:1px solid #c5d0df;border-radius:3px}.pd-page .pd-mother{background:#fff4df}.pd-page .pd-father{background:#eaf2ff}.pd-page .pd-unknown-dot{background:#f2f5f9}.pd-page .pd-repeat{background:#fde68a}
.pd-page .pd-lower{display:grid;grid-template-columns:1fr 1fr;gap:12px}.pd-page .pd-rel-grid{display:grid;gap:12px}.pd-page .pd-chips{display:flex;flex-wrap:wrap;gap:6px}.pd-page .pd-chips a{font-size:12px;border-radius:7px;background:#edf4fc;padding:6px 9px;text-decoration:none}.pd-page .pd-source-list{display:grid;gap:7px}.pd-page .pd-source{display:flex;gap:8px;flex-wrap:wrap;align-items:center;border-bottom:1px solid #edf0f5;padding:7px 0;font-size:12px}.pd-page .pd-source small{width:100%;color:#64748b}.pd-page .pd-picker{display:grid;grid-template-columns:minmax(0,2fr) 120px auto;gap:9px;align-items:end}.pd-page .pd-picker label{grid-row:1}.pd-page .pd-picker select{min-width:0;width:100%;padding:8px;border:1px solid #d5deea;border-radius:8px}.pd-page .pd-picker button{align-self:end}
@media(max-width:820px){.pd-page .pd-lower{grid-template-columns:1fr}.pd-page .pd-picker{display:flex;flex-direction:column;align-items:stretch}.pd-page .pd-viewport{height:58vh;min-height:300px}.pd-page .pd-card{padding:12px}.pd-page .pd-zoom{gap:5px}}


/* Kastkaart 2.0 | Stamboom: compacte, navigeerbare voorouderkaarten */
.pd2-page .pd2-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.pd2-page .pd2-card{min-width:0;background:#fff;border:1px solid #e1e8f0;border-radius:12px;padding:16px;margin-bottom:12px}
.pd2-page .pd2-card h2{font-size:16px;margin:0}.pd2-page .pd2-card h3{font-size:13px;margin:0 0 8px}
.pd2-page .pd2-toolbar{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;border-bottom:1px solid #e9eef5;padding-bottom:12px}
.pd2-page .pd2-toolbar p,.pd2-page .pd2-muted{font-size:12px;color:#64748b;margin:4px 0 0}
.pd2-page .pd2-depth{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:12px;font-weight:650}
.pd2-page .pd2-depth select,.pd2-page .pd2-picker select{border:1px solid #cfd9e6;border-radius:8px;padding:8px;background:#fff;min-height:36px}
.pd2-page .pd2-guide{display:flex;flex-wrap:wrap;gap:14px;margin:12px 0 16px}
.pd2-page .pd2-legend{font-size:11px;color:#607087;display:inline-flex;align-items:center;gap:6px}.pd2-page .pd2-swatch{height:11px;width:11px;border-radius:3px;border:1px solid #d5e0ed}.pd2-page .pd2-mother{background:#fff8e9}.pd2-page .pd2-father{background:#edf5ff}.pd2-page .pd2-repeat{background:#e2f5e6}
.pd2-page .pd2-tree{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:stretch}
.pd2-page .pd2-generation{min-width:0;border:1px solid #e4ebf3;border-radius:11px;background:#f8fafc;padding:10px;display:flex;flex-direction:column}
.pd2-page .pd2-generation h3{display:flex;align-items:center;gap:7px;font-size:12px;color:#44556b;margin:0 0 10px}
.pd2-page .pd2-generation h3 span{display:inline-grid;place-items:center;width:20px;height:20px;background:#e7eef7;color:#3c536f;border-radius:6px;font-size:11px}
.pd2-page .pd2-nodes{display:grid;grid-template-rows:repeat(var(--unused,1),auto);gap:8px;flex:1}
.pd2-page .pd2-ancestor{display:flex;flex-direction:column;gap:5px;justify-content:center;min-width:0;background:#fff8e9;border:1px solid #eadfc9;border-left:3px solid #d8b46c;border-radius:9px;padding:11px 10px}
.pd2-page .pd2-ancestor.pd2-paternal{background:#edf5ff;border-color:#d9e6f6;border-left-color:#91b5e0}
.pd2-page .pd2-ancestor.pd2-repeated{background:var(--pd2-repeat);border-color:#91b7a2}
.pd2-page .pd2-ancestor.pd2-empty{background:#f5f7fa;border:1px dashed #d9e1ea;color:#8a97a7}
.pd2-page .pd2-ancestor-type{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#6a7889;font-weight:700}
.pd2-page .pd2-ancestor strong{font-size:13px;line-height:1.3;overflow-wrap:anywhere;color:#22354c}
.pd2-page .pd2-ancestor-meta{font-size:11px;color:#69798a;overflow-wrap:anywhere}
.pd2-page .pd2-ancestor-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:3px}.pd2-page .pd2-ancestor-actions a{font-size:11px;font-weight:650;text-decoration:none;color:#23629e}.pd2-page .pd2-ancestor-actions a:hover{text-decoration:underline}
.pd2-page .pd2-footnote{margin:12px 0 0;font-size:11px;line-height:1.6;color:#65758a}
.pd2-page .pd2-lower{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.pd2-page .pd2-rel-grid{display:grid;gap:11px;margin-top:10px}
.pd2-page .pd2-chips{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}.pd2-page .pd2-chips a{padding:6px 9px;background:#edf4fb;border-radius:7px;font-size:12px;text-decoration:none}
.pd2-page .pd2-source-list{display:grid;gap:6px;margin-top:10px}.pd2-page .pd2-source{padding:8px 0;border-bottom:1px solid #edf1f5;display:flex;flex-wrap:wrap;gap:8px;font-size:12px}.pd2-page .pd2-source small{flex-basis:100%;color:#68788b}
.pd2-page .pd2-picker{display:flex;align-items:end;flex-wrap:wrap;gap:10px;margin-top:10px}.pd2-page .pd2-picker label{font-size:12px;font-weight:650}.pd2-page .pd2-picker select{max-width:100%;min-width:0}
@media(max-width:1000px){.pd2-page .pd2-tree{grid-template-columns:1fr 1fr}.pd2-page .pd2-generation:last-child{grid-column:1/-1}.pd2-page .pd2-generation:last-child .pd2-nodes{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:720px){.pd2-page .pd2-tree,.pd2-page .pd2-lower{grid-template-columns:minmax(0,1fr)}.pd2-page .pd2-generation:last-child{grid-column:auto}.pd2-page .pd2-generation:last-child .pd2-nodes{grid-template-columns:repeat(2,minmax(0,1fr))}.pd2-page .pd2-card{padding:12px}.pd2-page .pd2-ancestor{padding:10px 8px}}
@media(max-width:420px){.pd2-page .pd2-generation:last-child .pd2-nodes{grid-template-columns:1fr}.pd2-page .pd2-depth{width:100%;justify-content:space-between}.pd2-page .pd2-ancestor-actions{gap:7px}}

.pd2-page .pd2-values{font-size:10px;line-height:1.45;color:#50667d;overflow-wrap:anywhere;font-weight:500}

/* Stamboom 2.0: 4-8 generatieniveaus, scroll uitsluitend binnen de stamboom */
.pd2-page .pd2-tree-scroll{max-width:100%;overflow-x:auto;overflow-y:visible;overscroll-behavior-x:contain;border-radius:10px;scrollbar-width:thin;padding-bottom:10px}
.pd2-page .pd2-tree{display:grid;grid-template-columns:repeat(var(--pd2-levels),minmax(210px,1fr));gap:10px;width:max(100%,calc(var(--pd2-levels)*220px));align-items:stretch}
.pd2-page .pd2-generation{grid-column:auto!important;min-width:0}
.pd2-page .pd2-generation .pd2-nodes,.pd2-page .pd2-generation:last-child .pd2-nodes{display:grid;grid-template-columns:minmax(0,1fr);grid-auto-rows:minmax(64px,auto);gap:7px}
.pd2-page .pd2-ancestor{min-width:0;padding:8px 9px}
.pd2-page .pd2-ancestor strong{font-size:12px}
.pd2-page .pd2-ancestor-actions{margin-top:2px}
@media(max-width:720px){.pd2-page .pd2-tree{width:max(100%,calc(var(--pd2-levels)*200px));grid-template-columns:repeat(var(--pd2-levels),minmax(190px,1fr))}}

/* Kastkaart 2.0 — vaste stamboom zonder horizontale of verticale scroll */
.pd2-page .pd3-options{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.pd2-page .pd3-values-toggle{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:650;color:#315273;cursor:pointer}
.pd2-page .pd3-values-toggle input{accent-color:#2772b9}
.pd2-page .pd3-blue{background:#e8f2ff}
.pd2-page .pd3-tree{display:grid;grid-template-columns:repeat(var(--pd3-levels),minmax(0,1fr));gap:3px;width:100%;height:clamp(360px,64vh,640px);max-width:100%;overflow:hidden;box-sizing:border-box}
.pd2-page .pd3-generation{min-width:0;min-height:0;display:flex;flex-direction:column;background:#f7faff;border:1px solid #e4ebf4;border-radius:8px;padding:3px}
.pd2-page .pd3-generation h3{flex:0 0 22px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:clamp(8px,.9vw,12px);line-height:22px;text-align:center;color:#355679;margin:0}
.pd2-page .pd3-column{display:grid;grid-template-rows:repeat(var(--pd3-count),minmax(0,1fr));gap:1px;flex:1;min-height:0}
.pd2-page .pd3-node{min-height:0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;box-sizing:border-box;background:#e8f2ff;border:1px solid #bfd6f1;border-radius:4px;padding:0 2px;text-align:center}
.pd2-page .pd3-node.pd3-duplicate{background:var(--pd3-duplicate);border-color:rgba(50,70,85,.22)}
.pd2-page .pd3-node.pd3-unknown{background:#f3f6fa;border-color:#e3eaf2;color:#788699}
.pd2-page .pd3-code{display:block;max-width:100%;overflow:hidden;text-overflow:clip;white-space:nowrap;color:#235487;font-weight:700;font-size:clamp(5px, .78vw, 12px);line-height:1.1;text-decoration:none}
.pd2-page .pd3-code:hover{text-decoration:underline}
.pd2-page .pd3-unknown .pd3-code{color:#718096;font-weight:500}
.pd2-page .pd3-breeding{display:none;color:#355d7d;font-size:clamp(4px,.56vw,9px);line-height:1.1;max-width:100%;max-height:65%;overflow:hidden;overflow-wrap:anywhere}
.pd2-page .pd3-show-values .pd3-breeding{display:block}
.pd2-page .pd3-tree[style*="--pd3-depth:6"] .pd3-code,.pd2-page .pd3-tree[style*="--pd3-depth:7"] .pd3-code{font-size:clamp(4px,.60vw,9px)}
.pd2-page .pd3-tree[style*="--pd3-depth:7"] .pd3-breeding{font-size:clamp(3px,.4vw,7px)}
@media(max-width:850px){.pd2-page .pd3-tree{height:clamp(310px,57vh,520px);gap:2px}.pd2-page .pd3-generation{padding:1px}.pd2-page .pd3-generation h3{font-size:7px;flex-basis:18px;line-height:18px}.pd2-page .pd3-code{font-size:clamp(4px,1vw,8px)}.pd2-page .pd3-breeding{font-size:4px}.pd2-page .pd3-node{padding:0 1px;border-radius:2px}.pd2-page .pd3-options{gap:8px}}

/* Kastkaart 2.0 – Koninginnenrapport */
.kr-report{background:#f4f7fb;color:#21344e}
.kr-report .kr-container{max-width:1440px;margin:0 auto;padding:0 18px 32px}
.kr-main{display:grid;gap:16px;margin-top:20px}
.kr-heading{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;padding:20px 24px;background:linear-gradient(120deg,#173e69,#2865a0);color:#fff;border-radius:16px}
.kr-eyebrow{font-size:11px;font-weight:800;letter-spacing:.13em;opacity:.8}
.kr-heading h1{margin:5px 0;font-size:clamp(22px,2.5vw,31px);color:#fff}
.kr-subtitle{font-size:13px;opacity:.86}
.kr-actions{display:flex;gap:8px;flex-wrap:wrap}
.kr-button{display:inline-flex;align-items:center;padding:8px 12px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.35);border-radius:9px;color:#fff!important;text-decoration:none;font-size:13px;font-weight:700}
.kr-button:hover{background:rgba(255,255,255,.24)}
.kr-context{color:#536983;font-size:13px;padding:0 4px}
.kr-panel{min-width:0;background:#fff;border:1px solid #dfe7f0;border-radius:14px;padding:18px;box-shadow:0 2px 8px rgba(24,58,96,.04)}
.kr-panel-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.kr-panel-heading h2,.kr-panel>h2{margin:0;font-size:17px;font-weight:750;color:#183d68}
.kr-panel-heading p{margin:4px 0 0;font-size:12px;color:#6b7c91}
.kr-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.kr-summary .kr-honey{grid-column:1/-1}
.kr-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(128px,1fr));gap:8px}
.kr-metric{background:#f3f7fc;border:1px solid #e7eef6;border-radius:10px;padding:11px;min-width:0}
.kr-metric-label{display:block;color:#5c7088;font-size:11px;margin-bottom:5px}
.kr-metric strong{font-size:clamp(17px,2vw,23px);color:#204d80;font-variant-numeric:tabular-nums}
.kr-metric small{font-size:11px;color:#6d8196;margin-left:4px}
.kr-chart-options{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;font-size:12px;margin:10px 0 14px}
.kr-chart-options label{display:inline-flex;align-items:center;gap:5px}
.kr-chart-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:14px}
.kr-chart-grid>div{min-width:0;border:1px solid #e7eef6;background:#fafcff;border-radius:11px;padding:12px;font-size:12px}
.kr-chart-box{height:310px;position:relative}
.kr-chart-box canvas{width:100%!important;height:100%!important}
.kr-table-scroll{max-width:100%;overflow-x:auto}
.kr-table-scroll table{width:100%;border-collapse:collapse;font-size:12px}
.kr-table-scroll th,.kr-table-scroll td{padding:9px;border-bottom:1px solid #e6edf5;vertical-align:top;text-align:left}
.kr-table-scroll th{background:var(--kk-table-head-bg);color:var(--kk-table-head-text);white-space:nowrap}
.kr-report .oldwrap summary{cursor:pointer;font-size:13px;font-weight:700;color:#24598b;padding:10px 0}
.kr-report .tag{display:inline-block;padding:3px 8px;background:#eef4fa;border-radius:20px;font-size:11px}
.kr-report .muted{color:#74849a}
.kr-report .btn{display:inline-flex;padding:6px 10px;border-radius:8px;background:#eaf2fb;color:#24598b;text-decoration:none;border:1px solid #d3e3f5;font-size:12px}
.kr-report .err{padding:12px;background:#fff2f1;color:#a12d23;border-radius:9px}
@media(max-width:850px){.kr-summary,.kr-chart-grid{grid-template-columns:1fr}.kr-heading{padding:18px}.kr-report .kr-container{padding:0 10px 20px}.kr-panel{padding:14px}.kr-chart-box{height:270px}}

/* Teeltrapport 2.0: compacte, duidelijke grafiekkeuzes */
.kr-report .kr-chart-options{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:12px 0 15px;padding:11px 12px;background:#f4f8fd;border:1px solid #dce8f5;border-radius:12px}
.kr-report .kr-chart-options-sub{background:#fbfcfe;margin-top:-5px}
.kr-report .kr-options-title{font-size:12px;font-weight:750;color:#244d79;margin-right:5px}
.kr-report .kr-toggle{position:relative;display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:7px 11px;border:1px solid #d5e1ef;border-radius:9px;background:#fff;color:#53667c;font-size:12px;font-weight:600;line-height:1.3;cursor:pointer;transition:background .15s,border-color .15s,color .15s;user-select:none}
.kr-report .kr-toggle:has(input:checked){background:#e4f0ff;border-color:#87b6e9;color:#164b80}
.kr-report .kr-toggle:hover{border-color:#5c99d2}
.kr-report .kr-toggle:focus-within{outline:2px solid #377fbe;outline-offset:2px}
.kr-report .kr-toggle input[type=checkbox]{appearance:none;-webkit-appearance:none;position:relative;display:inline-grid;place-content:center;flex:0 0 17px;width:17px;height:17px;margin:0;border:1.5px solid #9eb2c7;border-radius:5px;background:#fff;cursor:pointer}
.kr-report .kr-toggle input[type=checkbox]:checked{background:#2471b7;border-color:#2471b7}
.kr-report .kr-toggle input[type=checkbox]:checked:after{content:'✓';color:#fff;font-size:12px;line-height:1;font-weight:800}
.kr-report .kr-chart-grid>div{border-radius:12px;background:#fff;border:1px solid #dce7f3;box-shadow:0 2px 7px rgba(25,67,108,.035)}
.kr-report .kr-chart-grid>div>strong{display:block;color:#264d76;font-size:12px;line-height:1.5;margin-bottom:8px}
@media(max-width:620px){.kr-report .kr-chart-options{gap:6px;padding:9px}.kr-report .kr-options-title{width:100%;margin-bottom:2px}.kr-report .kr-toggle{min-height:32px;padding:6px 8px;font-size:11px}}

/* Teeltrapport: drie gelijkwaardige kolommen en een consistente blauwe grafiekstijl */
@media(min-width:1100px){
  .kr-report .kr-summary{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:14px}
  .kr-report .kr-summary .kr-honey{grid-column:auto}
  .kr-report .kr-summary .kr-panel{height:100%;box-sizing:border-box}
  .kr-report .kr-summary .kr-metrics{grid-template-columns:minmax(0,1fr);gap:7px}
  .kr-report .kr-summary .kr-metric{display:flex;align-items:center;gap:8px;padding:8px 10px;min-height:40px}
  .kr-report .kr-summary .kr-metric-label{flex:1;min-width:0;margin:0;font-size:12px}
  .kr-report .kr-summary .kr-metric strong{font-size:17px;white-space:nowrap}
  .kr-report .kr-summary .kr-metric small{margin:0;white-space:nowrap}
}
@media(min-width:850px) and (max-width:1099px){
  .kr-report .kr-summary{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kr-report .kr-summary .kr-honey{grid-column:1/-1}
}
@media(max-width:849px){
  .kr-report .kr-summary{grid-template-columns:minmax(0,1fr)}
  .kr-report .kr-summary .kr-honey{grid-column:auto}
}

/* Rapport 2.0: drie hoofdgroepen, telkens twee afzonderlijke waardekaarten */
.kr-report .kr-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:stretch}
.kr-report .kr-summary .kr-panel{height:100%;min-width:0;box-sizing:border-box}
.kr-report .kr-summary .kr-honey{grid-column:auto}
.kr-report .kr-summary .kr-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.kr-report .kr-summary .kr-metric{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:3px;min-width:0;min-height:75px;padding:10px 5px;text-align:center;background:#f0f6fd;border:1px solid #d9e8f8;border-radius:10px}
.kr-report .kr-summary .kr-metric-label{flex:none;min-width:0;margin:0;color:#526d8c;font-size:11px;line-height:1.25;overflow-wrap:anywhere}
.kr-report .kr-summary .kr-metric strong{font-size:clamp(16px,1.65vw,23px);line-height:1.15;color:#1d5186;white-space:normal}
.kr-report .kr-summary .kr-metric small{font-size:10px;margin:0;color:#617b98}
@media(max-width:1050px){.kr-report .kr-summary{grid-template-columns:1fr}.kr-report .kr-summary .kr-honey{grid-column:auto}.kr-report .kr-summary .kr-metric strong{font-size:21px}}
@media(min-width:680px) and (max-width:1050px){.kr-report .kr-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.kr-report .kr-summary .kr-honey{grid-column:1/-1}}

/* Rapport: zijmenu in de bestaande Kastkaart 2.0 blauwe stijl. */
.kr-report .kr-layout{display:grid;grid-template-columns:218px minmax(0,1fr);gap:18px;align-items:start}
.kr-report .kr-main{min-width:0}
.kr-sidebar{position:sticky;top:16px;margin-top:20px;background:#fff;border:1px solid #dfe7f0;border-radius:14px;padding:14px 10px;box-shadow:0 2px 8px rgba(24,58,96,.04);font-size:13px}
.kr-sidebar-label{padding:7px 10px 12px;color:#66829f;font-size:10px;font-weight:800;letter-spacing:.09em}
.kr-side-section{padding:14px 10px 6px;color:#6b7d92;font-size:10px;font-weight:800;letter-spacing:.07em;text-transform:uppercase}
.kr-sidebar nav>a,.kr-side-nested a{display:block;padding:9px 10px;border-radius:8px;color:#234d79;text-decoration:none;font-weight:600;overflow-wrap:anywhere}
.kr-sidebar nav>a:hover,.kr-side-nested a:hover{background:#e8f2ff;color:#123e6b}
.kr-side-details{margin-top:9px;border-top:1px solid #e7edf4;padding-top:8px}
.kr-side-details summary{cursor:pointer;padding:9px 10px;color:#234d79;font-weight:700}
.kr-side-nested{padding-left:10px}
.kr-sidebar-back{display:block;margin-top:16px;padding:11px 10px;border-top:1px solid #e7edf4;color:#345e88;text-decoration:none}
.kr-report [id^="kr-"]{scroll-margin-top:16px}
@media(max-width:950px){.kr-report .kr-layout{grid-template-columns:1fr;gap:0}.kr-sidebar{position:static;margin-top:12px}.kr-sidebar nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 8px}.kr-side-section{grid-column:1/-1}.kr-side-details{grid-column:1/-1}.kr-report .kr-main{margin-top:12px}}
@media(max-width:460px){.kr-sidebar nav{grid-template-columns:1fr}}

/* Kastkaart 2.0 – herbruikbare inklapbare panelen */
.kk-collapse{min-width:0;border:1px solid #dce7f3;border-radius:13px;background:#fff;overflow:hidden;margin:0 0 12px;box-shadow:0 2px 8px rgba(23,61,104,.035)}
.kk-collapse-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:13px 15px;cursor:pointer;list-style:none;background:var(--kk-table-head-bg);color:var(--kk-table-head-text);user-select:none}
.kk-collapse-head::-webkit-details-marker{display:none}
.kk-collapse-head:hover{background:var(--kk-table-row-hover-bg)}
.kk-collapse-head:focus-visible{outline:3px solid #76a9e8;outline-offset:-3px}
.kk-collapse-heading{display:flex;flex-direction:column;gap:3px;min-width:0}
.kk-collapse-heading strong{font-size:14px;line-height:1.35}
.kk-collapse-heading small{font-size:11px;color:#64809f;font-weight:400}
.kk-collapse-chevron{width:9px;height:9px;flex:none;border-right:2px solid #3b6d9d;border-bottom:2px solid #3b6d9d;transform:rotate(45deg);transition:transform .16s ease}
.kk-collapse[open]>.kk-collapse-head .kk-collapse-chevron{transform:rotate(225deg)}
.kk-collapse-body{min-width:0;padding:13px}
.kk-collapse-body>.kr-panel{margin:0;border:0;box-shadow:none;padding:0}
.kk-collapse-body>.kr-panel>.kr-panel-heading:first-child{display:none}
.kk-collapse-body>.kr-panel>h2:first-child{display:none}
.kr-report .kr-summary .kk-collapse{height:100%;margin:0}
.kr-report .kr-summary .kk-collapse-body{padding:10px}
.kr-report .kr-summary .kk-collapse .kr-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.kr-report .kr-summary .kk-collapse .kr-panel{height:auto}
@media(max-width:650px){.kk-collapse-head{padding:11px 12px}.kk-collapse-body{padding:10px}.kk-collapse-heading strong{font-size:13px}}
@media(prefers-reduced-motion:reduce){.kk-collapse-chevron{transition:none}}

/* Teeltmoercontrole – gedeelde Kastkaart 2.0 formuliercomponenten, gebaseerd op queen_form.php. */
.tm-page .tm-main {min-width:0; flex:1 1 auto; width:auto;}
.tm-page .tm-content {min-width:0; width:100%; max-width:100%;}
.tm-page .tm-content *, .tm-page .tm-content *::before, .tm-page .tm-content *::after {box-sizing:border-box;}
.tm-page .qf-hero {display:flex; flex-wrap:wrap; gap:16px; align-items:center; justify-content:space-between; margin-bottom:18px;}
.tm-page .qf-eyebrow {font-size:.75rem; font-weight:800; letter-spacing:.09em; color:#3c74ac;}
.tm-page .qf-hero h1 {margin:6px 0 8px; overflow-wrap:anywhere;}
.tm-page .qf-hero p {margin:0; color:#64748b;}
.tm-page .qf-back {display:inline-flex; align-items:center; text-decoration:none; padding:10px 14px; border-radius:10px; background:#eef5fd; color:#1b538b; font-weight:700;}
.tm-page .qf-sections {display:flex; flex-wrap:wrap; gap:8px; margin:12px 0 20px;}
.tm-page .qf-sections a {padding:8px 12px; border-radius:9px; background:#eef5fd; color:#1d527e; text-decoration:none; font-weight:650; font-size:.89rem;}
.tm-page .tm-form-card,.tm-page .tm-history {min-width:0; overflow:visible;}
.tm-page .tm-form .row {display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; align-items:start;}
.tm-page .tm-form .row > label {display:block; min-width:0; max-width:100%; overflow-wrap:anywhere;}
.tm-page .tm-form input:not([type=hidden]):not([type=checkbox]):not([type=radio]),
.tm-page .tm-form select,.tm-page .tm-form textarea {display:block; width:100%; max-width:100%; min-width:0; padding:10px 11px; border:1px solid #cbd5e1; border-radius:9px; font:inherit; background:#fff; color:inherit;}
.tm-page .tm-form textarea {min-height:90px; resize:vertical;}
.tm-page .tm-form input:focus,.tm-page .tm-form select:focus,.tm-page .tm-form textarea:focus {outline:2px solid #93c5fd; outline-offset:1px;}
.tm-page .tm-form fieldset {min-width:0; max-width:100%; border:0; padding:12px 0; margin:0;}
.tm-page .tm-form legend {max-width:100%; white-space:normal; font-size:.94rem; color:#334155;}
.tm-page .tm-form .tm-primary-fields {grid-template-columns:minmax(0,1fr) minmax(0,2fr) auto auto; align-items:end!important;}
.tm-page .tm-form .tm-primary-fields > button {min-height:42px;}
.tm-page .tm-form .datewrap {display:flex; gap:8px; align-items:center;}
.tm-page .tm-form .datewrap input {flex:1 1 auto;}
.tm-page .tm-form .datewrap button {flex:0 0 auto;}
.tm-page .tm-form .datepick {position:absolute; width:0; height:0; opacity:0; pointer-events:none;}
.tm-page .tm-table-scroll {max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch;}
.tm-page .tm-table-scroll table {min-width:760px;}
.tm-page .tm-actions {display:flex; gap:10px; flex-wrap:wrap; align-items:center; margin:10px 0 14px;}
.tm-page .weekend {color:#b00000;font-weight:700;}
.tm-page .warn {background:#fffbe6;border:1px solid #f0e3a1;color:#6b5a00;padding:8px 12px;border-radius:10px;display:inline-block;}
.tm-page .danger {border-color:#e7b1b1;background:#fff3f3;}
.tm-page .hint {font-size:.92em;color:#64748b;margin-top:6px;}
.tm-page .meta {display:flex;gap:10px;flex-wrap:wrap;margin:14px 0;}
.tm-page .calcbox {display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:8px;}
.tm-page .calcval {display:inline-block;padding:2px 10px;border-radius:999px;border:1px solid #ddd;background:#f7f7f7;}
.tm-page .ro {background:#f7f7f7;}
@media(max-width:1080px){.tm-page .tm-form .row {grid-template-columns:repeat(2,minmax(0,1fr));}.tm-page .tm-form .tm-primary-fields {grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:620px){.tm-page .tm-form .row,.tm-page .tm-form .tm-primary-fields {grid-template-columns:minmax(0,1fr);}.tm-page .tm-form .row > * {min-width:0;}.tm-page .tm-content {padding-inline:0;}}

/* Kastkaart 2.0 – uniforme rapport- en formulierweergave: teeltmoercontrole */
.tm-page .tm-main{min-width:0;flex:1 1 auto;width:auto;max-width:none;margin:0}
.tm-page .tm-content{max-width:1320px;margin:0 auto;padding:18px clamp(12px,2.2vw,28px) 36px}
.tm-page .tm-content .card{min-width:0;max-width:100%;background:#fff;border:1px solid #dce7f3;border-radius:13px;box-shadow:0 2px 8px rgba(23,61,104,.035);padding:16px;margin:12px 0}
.tm-page .tm-form .kk-collapse{margin:12px 0;border-color:#dce7f3}
.tm-page .tm-form .kk-collapse-head,.tm-page .tm-history .kk-collapse-head{background:var(--kk-table-head-bg);color:var(--kk-table-head-text)}
.tm-page .tm-form .kk-collapse-head:hover,.tm-page .tm-history .kk-collapse-head:hover{background:var(--kk-table-row-hover-bg)}
.tm-page .tm-form .kk-collapse-chevron,.tm-page .tm-history .kk-collapse-chevron{border-color:#3b6d9d}
.tm-page .tm-form .kk-collapse-body,.tm-page .tm-history .kk-collapse-body{padding:14px}
.tm-page .tm-form fieldset{padding:0;margin:0;border:0;min-width:0}
.tm-page .tm-form fieldset>legend{display:none}
.tm-page .tm-form .row>label{font-weight:600;color:#334f6c;font-size:13px;line-height:1.4}
.tm-page .tm-form input:not([type=hidden]):not([type=checkbox]):not([type=radio]),.tm-page .tm-form select,.tm-page .tm-form textarea{box-sizing:border-box;min-width:0;max-width:100%;font-weight:400;line-height:1.4}
.tm-page .tm-form .datewrap input{min-width:0}
.tm-page .tm-form .datewrap #datum_btn{width:auto;flex:0 0 auto}
.tm-page .tm-form .datepick{width:0!important;height:0!important;padding:0!important;opacity:0;position:absolute;pointer-events:none}
.tm-page .tm-history .tm-table-scroll{max-width:100%;overflow-x:auto;border:1px solid #dce7f3;border-radius:10px}
.tm-page .tm-history table{width:100%;min-width:800px;border-collapse:collapse;font-size:13px}
.tm-page .tm-history th{background:#f2f7fe;color:#1d4f80;font-weight:700;text-align:left;padding:11px 12px;border-bottom:1px solid #dce7f3;white-space:nowrap}
.tm-page .tm-history td{padding:10px 12px;border-bottom:1px solid #e7edf4;vertical-align:top;overflow-wrap:anywhere}
.tm-page .tm-history tbody tr:nth-child(even){background:#f8fbff}
.tm-page .tm-history tbody tr:hover{background:#eff6ff}
.tm-page .tm-history .kk-collapse{margin:0}
.tm-page .tm-content [id^="kk-teelt-"]{scroll-margin-top:20px}
@media(max-width:900px){.tm-page .tm-content{padding:12px}.tm-page .tm-form .row{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.tm-page .tm-form .row,.tm-page .tm-form .tm-primary-fields{grid-template-columns:1fr}.tm-page .tm-content .card{padding:10px}.tm-page .tm-form .kk-collapse-body{padding:10px}.tm-page .tm-form input:not([type=hidden]):not([type=checkbox]):not([type=radio]),.tm-page .tm-form select,.tm-page .tm-form textarea{font-size:16px}}

/* Kastkaart 2.0 – centraal formulierdesign (queen_form-stijl), ook voor teeltmoercontrole. */
.kk-form-modern .kk-field{display:flex!important;flex-direction:column;align-items:stretch;gap:7px;min-width:0;max-width:100%;font-size:13px;font-weight:700;color:#254c72;line-height:1.45;overflow-wrap:anywhere}
.kk-form-modern .kk-field-break{display:none}
.kk-form-modern .kk-field>br{display:none}
.kk-form-modern .kk-field input:not([type=hidden]):not([type=checkbox]):not([type=radio]),
.kk-form-modern .kk-field select,.kk-form-modern .kk-field textarea{display:block;width:100%;min-width:0;max-width:100%;min-height:43px;margin:0;padding:10px 12px;border:1px solid #c9d9ea;border-radius:10px;background:#f8fbff;color:#203e5e;font-family:inherit;font-size:14px;font-weight:400;line-height:1.4;box-shadow:0 1px 2px rgba(22,57,96,.03);transition:border-color .15s,box-shadow .15s,background .15s}
.kk-form-modern .kk-field input:focus-visible,.kk-form-modern .kk-field select:focus-visible,.kk-form-modern .kk-field textarea:focus-visible{outline:none;border-color:#4d8bd2;box-shadow:0 0 0 3px rgba(77,139,210,.16);background:#fff}
.kk-form-modern .kk-field input:disabled,.kk-form-modern .kk-field select:disabled,.kk-form-modern .kk-field textarea:disabled{background:#edf2f8;color:#66788b;cursor:not-allowed}
.kk-form-modern .kk-field textarea{min-height:112px;resize:vertical}
.kk-form-modern .row{gap:16px!important;margin:0 0 14px}
.kk-form-modern .row>.kk-field{min-width:0}
.kk-form-modern .tm-primary-fields{padding:16px;border:1px solid #dce7f3;border-radius:12px;background:#f8fbff;margin-bottom:14px}
.kk-form-modern .tm-primary-fields .datewrap{min-width:0;align-items:stretch}
.kk-form-modern .tm-primary-fields .datewrap input{flex:1 1 auto}
.kk-form-modern .tm-primary-fields .datewrap button{min-height:43px}
.kk-form-modern .kk-collapse-body{padding:18px}
.kk-form-modern .calcbox{padding:11px 13px;background:#f5f9fe;border:1px solid #dce7f3;border-radius:10px}
@media(max-width:620px){.kk-form-modern .tm-primary-fields{padding:12px}.kk-form-modern .kk-field input:not([type=hidden]):not([type=checkbox]):not([type=radio]),.kk-form-modern .kk-field select,.kk-form-modern .kk-field textarea{font-size:16px}.kk-form-modern .kk-collapse-body{padding:12px}}


/* Kastkaart 2.0 – gedeelde compacte formulierindeling.
   Container queries laten de indeling reageren op de beschikbare inhoudsbreedte,
   inclusief de ruimte die het zijmenu inneemt. */
.kk-form-modern.tm-form {
  display: grid;
  grid-template-columns: minmax(0,1fr);
  gap: 12px 16px;
  align-items: start;
}
.kk-form-modern.tm-form > * { min-width:0; }
.kk-form-modern.tm-form > .tm-primary-fields,
.kk-form-modern.tm-form > .tm-submit,
.kk-form-modern.tm-form > .tm-form-wide { grid-column: 1 / -1; }
.kk-form-modern.tm-form > .kk-collapse {
  min-width:0;
  width:100%;
  max-width:100%;
  margin:0;
  align-self:start;
}
.kk-form-modern.tm-form .kk-collapse-body { min-width:0; }
.kk-form-modern.tm-form .row {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px 12px !important;
  align-items:start;
}
.kk-form-modern.tm-form .row > * { min-width:0; max-width:100%; }
.kk-form-modern.tm-form .kk-field textarea { width:100%; }
.kk-form-modern.tm-form .calcbox { min-width:0; overflow-wrap:anywhere; }
@container tmform (min-width: 650px) {
  .kk-form-modern.tm-form > .kk-collapse { width:100%; }
  .kk-form-modern.tm-form .tm-primary-fields { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@container tmform (min-width: 920px) {
  .kk-form-modern.tm-form .row { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@container tmform (max-width: 420px) {
  .kk-form-modern.tm-form .row,
  .kk-form-modern.tm-form .tm-primary-fields { grid-template-columns:minmax(0,1fr); }
}
/* Historische metingen: compacte tabel met horizontale scroll in plaats van
   uitgerekte invoervakken of overlopende kolommen. */
.tm-page .tm-history .tm-table-scroll { overflow-x:auto; overscroll-behavior-x:contain; }
.tm-page .tm-history table { table-layout:auto; width:100%; }
.tm-page .tm-history th,.tm-page .tm-history td { padding:8px 10px; }

/* Twee kaarten naast elkaar zodra de inhoudsruimte dit toelaat. */
.kk-form-modern.tm-form { grid-template-columns:repeat(auto-fit,minmax(min(100%,310px),1fr)); }
.kk-form-modern.tm-form > .tm-primary-fields { grid-column:1/-1; }
.kk-form-modern.tm-form > .row { grid-column:1/-1; }

/* Herbruikbare info-uitleg: op desktop hover, op touch tikken. */
.kk-info-area{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin:10px 0 16px;min-width:0}
.kk-info-label{font-size:.9rem;color:#52677e}
.kk-info-wrap{position:relative;display:inline-flex;align-items:center;z-index:1}
.kk-info-wrap.kk-info-open{z-index:50}
.kk-info-trigger{display:inline-grid;place-items:center;width:25px;height:25px;padding:0;border:1.5px solid #3476b8;border-radius:50%;background:#e8f4ff;color:#195b99;font-size:15px;font-weight:750;font-family:Georgia,serif;line-height:1;cursor:pointer;touch-action:manipulation}
.kk-info-trigger:hover,.kk-info-trigger:focus-visible,.kk-info-open .kk-info-trigger{background:#d4eaff;outline-offset:2px}
.kk-info-popover{position:absolute;top:calc(100% + 9px);left:0;width:min(340px,calc(100vw - 32px));box-sizing:border-box;padding:14px 16px;background:#fff;color:#22364c;border:1px solid #bdd6ee;border-radius:11px;box-shadow:0 10px 30px rgba(25,56,92,.2);font-size:.88rem;line-height:1.45;overflow-wrap:anywhere}
.kk-info-popover[hidden]{display:none!important}
.kk-info-popover strong{display:block;color:#185a96;margin-top:9px}
.kk-info-popover strong:first-child{margin-top:0}
.kk-info-popover span{display:block;margin-top:3px}
.kk-info-popover code{font-size:.84em;overflow-wrap:anywhere}

/* Informatie-icoon buiten de formulierkaarten: rechts in de paginakop.
   Het uitlegvenster zweeft boven de inhoud en beïnvloedt de layout niet. */
.tm-page .tm-hero-actions,.tm-main .tm-hero-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap;min-width:0}
.tm-main .tm-header-info{margin:0;flex:0 0 auto}
.tm-main .tm-header-info .kk-info-trigger{width:28px;height:28px}
.tm-main .tm-header-info .kk-info-popover{position:fixed;z-index:9999;max-height:calc(100dvh - 24px);overflow-y:auto;left:12px;top:64px}
@media(max-width:650px){.tm-main .tm-hero-actions{width:100%;justify-content:space-between}}

/* ===== Kastkaart 2.0: gecentraliseerde vormgeving koningindetail ===== */

/* Voorheen: css/tables.css */
/* Kastkaart 2.0 - gedeelde tabellen. Alleen .kk-table, zodat oude pagina's veilig blijven. */
.kk-table{width:100%;border-collapse:collapse;border-spacing:0;table-layout:auto}
.kk-table thead th,.kc-page .kk-table thead th{
 padding:13px;text-align:left;background:#f8fafc;color:#78899a;
 font-family:inherit;font-size:12px;font-weight:700;letter-spacing:normal;
 text-transform:none;line-height:1.4;border:0;box-shadow:none}
.kk-table tbody td,.kc-page .kk-table tbody td{
 padding:14px 13px;vertical-align:top;font-family:inherit;font-size:14px;
 font-weight:400;line-height:1.45;text-transform:none;letter-spacing:normal;
 border:0;box-shadow:none;overflow-wrap:anywhere}
.kk-table tbody tr,.kc-page .kk-table tbody tr{border:0;box-shadow:none}
.kk-table tbody tr:hover{background:#f9fbfe}
.kk-table .ko-name,.kc-page .kk-table .ko-name{font-weight:750}
.kk-table .ko-muted{color:#708197;font-size:12px}
.kk-table .ko-note{max-width:320px;overflow-wrap:anywhere}
.kk-table .ko-actions a{font-weight:700;color:#2563eb;text-decoration:none}
.kk-table .ko-actions a:hover{text-decoration:underline}
.kk-table .ko-main{font-weight:inherit}
.kk-table [hidden],.kk-year[hidden],.queen-result[hidden]{display:none!important}
.kk-panel{padding:0!important;overflow:hidden}
.kk-year{margin:0 0 14px;border:1px solid #e2e8f0;border-radius:12px;overflow:hidden;background:#fff}
.kk-year>summary{cursor:pointer;padding:14px 16px;background:#f8fafc;
 font-weight:750;display:flex;align-items:center;justify-content:space-between;gap:12px;list-style:none}
.kk-year>summary::-webkit-details-marker{display:none}
.kk-year>summary::marker{content:""}
.kk-year>summary .queen-year-label{display:inline-flex;align-items:center;gap:10px}
.kk-year>summary .queen-year-label::before{content:"";display:inline-block;width:8px;height:8px;
 border-right:2px solid #2563eb;border-bottom:2px solid #2563eb;transform:rotate(-45deg);transition:transform .15s}
.kk-year[open]>summary .queen-year-label::before{transform:rotate(45deg)}
.kk-year .panel{margin:0;border:0;border-radius:0;box-shadow:none}
.kk-year .kk-table{table-layout:fixed}
.kk-year .kk-table th:nth-child(1){width:17%}
.kk-year .kk-table th:nth-child(2){width:25%}
.kk-year .kk-table th:nth-child(3){width:19%}
.kk-year .kk-table th:nth-child(4){width:23%}
.kk-year .kk-table th:nth-child(5){width:16%}
.queen-relation[hidden],.queen-no-relation[hidden],.queen-year[hidden],#queenEmpty[hidden],#ko-empty[hidden],#ko-elsewhere[hidden]{display:none!important}
.queen-relation{font-size:13px;font-weight:700;color:#2563eb}
.queen-year-count{color:#708197;font-size:13px}
.ko-empty{padding:18px;color:#708197}
.ko-result{padding:14px;border:1px solid #e2e8f0;border-radius:10px;margin:12px 0}
.ko-result a{color:#2563eb;font-weight:700}
@media(max-width:680px){
 .kk-table thead{display:none}
 .kk-table,.kk-table tbody,.kk-table tr,.kk-table td,
 .kc-page .kk-table,.kc-page .kk-table tbody,.kc-page .kk-table tr,.kc-page .kk-table td{display:block;width:100%}
 .kk-table tbody tr,.kc-page .kk-table tbody tr{padding:10px 14px;border:0}
 .kk-table tbody td,.kc-page .kk-table tbody td{border:0;padding:5px 0;display:flex;gap:12px;justify-content:space-between;align-items:flex-start;text-align:right}
 .kk-table tbody td::before,.kc-page .kk-table tbody td::before{
 content:attr(data-label);font-size:12px;color:#78899a;font-weight:650;text-align:left;
 flex:0 0 86px;display:block;text-transform:none;margin:0}
 .kk-table tbody td.ko-main,.kc-page .kk-table tbody td.ko-main{font-size:16px;text-align:left;justify-content:flex-start}
 .kk-table tbody td.ko-main::before,.kc-page .kk-table tbody td.ko-main::before{display:none}
 .kk-table .ko-note{max-width:65%}
 .kk-year .kk-table{table-layout:auto}
}

/* Koningin detail: gebruikt dezelfde kk-table als overige Kastkaart 2.0-pagina's. */
.queen-detail .qd-section .kk-table{width:100%;border-collapse:collapse;border-spacing:0;font-size:13px;display:table}
.queen-detail .qd-section .kk-table thead th{padding:9px 10px;font-size:12px;background:#f8fafc;color:#78899a;text-transform:none;letter-spacing:normal;border:0}
.queen-detail .qd-section .kk-table tbody td{padding:9px 10px;font-size:13px;line-height:1.35;border:0;vertical-align:top}
.queen-detail .qd-section .kk-table tbody tr:hover{background:#f9fbfe}
.queen-detail .qd-section .kk-table tbody th{padding:8px 10px;text-align:left;background:transparent;color:#64748b;font-size:13px;font-weight:650;text-transform:none;letter-spacing:normal;border:0;white-space:nowrap}
.queen-detail .qd-section .kk-table a{color:#2563eb;text-decoration:none}
.queen-detail .qd-section .kk-table a:hover{text-decoration:underline}
@media(max-width:680px){
 .queen-detail .qd-section .kk-table:not(.qd-info-table) thead{display:none}
 .queen-detail .qd-section .kk-table:not(.qd-info-table),.queen-detail .qd-section .kk-table:not(.qd-info-table) tbody,.queen-detail .qd-section .kk-table:not(.qd-info-table) tr,.queen-detail .qd-section .kk-table:not(.qd-info-table) td{display:block;width:100%;min-width:0}
 .queen-detail .qd-section .kk-table:not(.qd-info-table) tbody td{display:flex;justify-content:space-between;gap:10px;padding:5px 0;text-align:right}
 .queen-detail .qd-section .kk-table:not(.qd-info-table) tbody td::before{content:attr(data-label);font-size:12px;color:#78899a;font-weight:650;text-align:left;flex:0 0 100px}
 .queen-detail .qd-section .qd-info-table{min-width:0}
 .queen-detail .qd-section .qd-info-table tbody th{white-space:normal}
}

/* Voorheen: css/forms.css */
/* Kastkaart 2.0 - gedeelde zoek-, keuze- en datumvelden. Alleen expliciete kk-klassen. */
.kk-toolbar{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin:0 0 18px}
.kk-toolbar .kk-input,.kk-toolbar .kk-select{flex:1;min-width:130px}
.kk-toolbar .kk-search{flex:2;min-width:190px}
.kk-input,.kk-select,.kk-textarea{box-sizing:border-box;min-height:44px;padding:10px 13px;
 border:1px solid #dbe3ed;border-radius:10px;background:#fff;color:#172b43;
 font:inherit;font-size:16px;max-width:100%}
.kk-input:focus-visible,.kk-select:focus-visible,.kk-textarea:focus-visible{
 outline:2px solid #2563eb;outline-offset:2px}
.kk-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.kk-field>label{font-weight:650}
.kk-date{min-width:0}
@media(max-width:680px){.kk-toolbar .kk-input,.kk-toolbar .kk-select,.kk-toolbar .kk-btn{
 flex:1 1 100%;width:100%;min-width:0}}


/* Alleen formulieren met .kk-form krijgen de 2.0 formulierlayout. */
/* Kastkaart 2.0 – uniforme formuliercomponenten. Alleen .kk-form activeert ze. */
.kk-form,.kk-form *{box-sizing:border-box}
.kk-form{display:grid;gap:20px;min-width:0}
.kk-form .card{min-width:0}
.kk-form .grid2,.kk-form .grid3{display:grid;gap:18px;margin:0 0 18px}
.kk-form .grid2{grid-template-columns:repeat(2,minmax(0,1fr))}
.kk-form .grid3{grid-template-columns:repeat(3,minmax(0,1fr))}
.kk-form .grid2>*,.kk-form .grid3>*{min-width:0}
.kk-form label{display:block;font-size:13px;font-weight:700;color:#40546b;margin:0 0 7px}
.kk-form input:not([type="checkbox"]):not([type="hidden"]),.kk-form select,.kk-form textarea{display:block;width:100%;max-width:100%;min-width:0;min-height:46px;padding:11px 13px;background:#f9fbfe;border:1px solid #d6e0ec;border-radius:11px;color:#152b43;font:inherit;font-size:16px;line-height:1.35;box-shadow:none}
.kk-form textarea{min-height:110px;resize:vertical}
.kk-form input:focus-visible,.kk-form select:focus-visible,.kk-form textarea:focus-visible{outline:2px solid #2563eb;outline-offset:1px;background:white}
.kk-form input[type="checkbox"]{width:19px;height:19px;vertical-align:middle;accent-color:#2563eb}
.kk-form input::placeholder,.kk-form textarea::placeholder{color:#8b9db0;opacity:1}
.kk-form .mini{color:#718399;font-size:12px;line-height:1.6;margin:8px 0 12px}
.kk-form .hr{height:1px;background:#e7edf4;margin:20px 0}
.kk-form .rel{position:relative}
.kk-form .suggestions{position:absolute;z-index:30;left:0;right:0;top:100%;background:#fff;max-height:240px;overflow:auto;list-style:none;margin:0;padding:0;box-shadow:0 12px 32px #152b4322;border:1px solid #d6e0ec;border-radius:10px}
.kk-form .suggestions li{padding:10px 12px;cursor:pointer}
.kk-form .suggestions li:hover{background:#eff6ff}
.kk-form .idchip{font-size:11px;color:#8593a6;margin-top:5px}
.kk-form .pill{display:inline-block;font-size:12px;white-space:normal;color:#59718a;margin-top:9px}
.kk-form .kk-submit-bar{display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap}
.kk-form .kk-btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;border:1px solid #2563eb;background:#2563eb;color:#fff;border-radius:11px;padding:11px 19px;font-size:14px;font-weight:700;text-decoration:none;cursor:pointer}
.kk-form .kk-btn--secondary{background:white;border-color:#d6e0ec;color:#334e68}
.kk-form .kk-form-errors{border:1px solid #fecaca;background:#fff1f2;color:#9f1239;border-radius:12px;padding:16px}
@media(max-width:760px){.kk-form .grid2,.kk-form .grid3{grid-template-columns:minmax(0,1fr)}.kk-form .kk-submit-bar>*{flex:1}}

/* Voorheen: css/buttons.css */
/* Kastkaart 2.0 - gedeelde actieknoppen. Alleen expliciete kk-klassen. */
.kk-btn,.kc-page .kk-btn{box-sizing:border-box;display:inline-flex;align-items:center;
 justify-content:center;gap:7px;min-height:44px;padding:10px 14px;border:1px solid #2563eb;
 border-radius:10px;background:#2563eb;color:#fff;text-decoration:none;
 font:inherit;font-size:14px;font-weight:700;line-height:1.25;cursor:pointer;white-space:normal}
.kk-btn:hover,.kc-page .kk-btn:hover{background:#1d4ed8;color:#fff}
.kk-btn:focus-visible{outline:2px solid #1d4ed8;outline-offset:3px}
.kk-btn:disabled{opacity:.5;cursor:not-allowed}
.kk-btn--secondary,.kc-page .kk-btn--secondary{background:#fff;color:#2563eb}
.kk-btn--secondary:hover,.kc-page .kk-btn--secondary:hover{background:#eff6ff;color:#1d4ed8}
.kk-action{color:#2563eb;font-weight:700;text-decoration:none}
.kk-action:hover{text-decoration:underline}

/* Voorheen: css/koninginnen-modern.css */
/* Shared Queen workspace. Existing dashboard-modern.css owns shell and navigation. */
.queen-detail{min-width:0}.queen-detail>h1{margin:0 0 12px}.queen-detail .card{margin:16px 0}.queen-detail .table{display:table}.queen-detail table{max-width:100%}.queen-detail .pedKpiGrid{grid-template-columns:minmax(0,420px) minmax(0,1fr)}
.queen-search .kc-form-grid{align-items:end}.queen-search-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding-bottom:5px}.queen-results-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.queen-results-heading h2{margin:0}.queen-count{color:#64748b;font-size:14px}
.queen-list{display:grid;gap:10px;margin-top:16px}.queen-result{border:1px solid #dbe1e8;background:#fff;border-radius:14px;padding:16px;display:flex;justify-content:space-between;gap:16px;align-items:center}.queen-result-info{min-width:0}.queen-code{font-weight:750;font-size:17px;color:#2563eb;text-decoration:none;overflow-wrap:anywhere}.queen-result-info p{margin:6px 0;color:#64748b}.queen-relation{display:inline-block;margin-left:10px;font-size:12px;background:#eff6ff;color:#1d4ed8;border-radius:99px;padding:4px 9px}.queen-meta{display:flex;gap:12px;flex-wrap:wrap;color:#475569;font-size:13px}.queen-result-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end;flex-shrink:0}
@media(max-width:850px){.queen-result{display:block}.queen-result-actions{justify-content:flex-start;margin-top:12px}.queen-detail .pedKpiGrid{grid-template-columns:1fr}.queen-detail .kpi{grid-template-columns:repeat(2,minmax(0,1fr))}.queen-detail .card{overflow-x:auto}.queen-detail{overflow-wrap:anywhere}}
@media(max-width:480px){.queen-detail .kpi{grid-template-columns:1fr}.queen-result-actions .btn{min-height:44px}.queen-search input,.queen-search select{font-size:16px}}

.queen-filter-grid{display:grid;grid-template-columns:minmax(220px,2fr) minmax(130px,1fr) minmax(180px,1fr) auto;gap:14px;align-items:end}.queen-filter-grid label{display:flex;flex-direction:column;gap:7px;font-weight:600;min-width:0}.queen-filter-grid input,.queen-filter-grid select{width:100%;min-width:0;min-height:44px;padding:10px 12px;border:1px solid #cbd5e1;border-radius:10px;background:#fff;color:#172033;font-size:16px}.queen-reset{min-height:44px;white-space:nowrap}.queen-year-list{display:grid;gap:12px;margin-top:16px}.queen-year{border:1px solid #dbe1e8;border-radius:14px;background:#f8fafc;overflow:hidden}.queen-year>summary{cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:15px 18px;font-weight:750}.queen-year-count{font-size:13px;color:#64748b;font-weight:500}.queen-year .queen-list{padding:0 12px 12px;margin:0}.queen-year .queen-result{background:#fff}.queen-result[hidden],.queen-year[hidden],.queen-relation[hidden],#queenEmpty[hidden]{display:none!important}@media(max-width:950px){.queen-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:550px){.queen-filter-grid{grid-template-columns:minmax(0,1fr)}.queen-reset{width:100%}.queen-year>summary{padding:14px}}


/* Koninginnenoverzicht: exact dezelfde .table/.card desktop/mobile-basis als kasten_overzicht.php. */
.queen-table-section{min-width:0}.queen-table-section .table-wrap{overflow-x:auto;width:100%}
.queen-table-section .table{width:100%;border-collapse:collapse}
.queen-table-section .table th{background:#f8fafc;color:#475569;font-size:13px;text-transform:uppercase;letter-spacing:.04em;font-weight:700}
.queen-table-section .table th,.queen-table-section .table td{padding:16px;border-bottom:1px solid #edf2f7;text-align:left;vertical-align:top}
.queen-table-section .table tr:hover{background:#fafbfc}
.queen-table-section .desktop-view{display:block}.queen-table-section .mobile-view{display:none}
.queen-year .desktop-view{padding:0 12px 12px}.queen-year .mobile-view{padding:12px}
.queen-mobile-item{margin-bottom:15px}.queen-mobile-item h3{margin-top:0}.queen-mobile-links a{color:#2563eb;font-weight:650}
.queen-year .queen-result{display:table-row;padding:0;border:0;border-radius:0;background:transparent}
.queen-year .queen-result[hidden],.queen-year[hidden],.queen-relation[hidden],.queen-no-relation[hidden],#queenEmpty[hidden]{display:none!important}
.queen-year .queen-mobile-item.queen-result{display:block;border:1px solid #dbe1e8;border-radius:14px;background:white;padding:16px}
.queen-year .queen-mobile-item.queen-result[hidden]{display:none!important}
.queen-year .queen-relation{margin-left:0}
@media(max-width:900px){.queen-table-section .desktop-view{display:none}.queen-table-section .mobile-view{display:block}}

/* Voorheen: css/koningin-detail-modern.css */
/* Koningin detail — Kastkaart 2.0. Only affects this page. */
.queen-detail{--qd-border:#dbe1e8;--qd-ink:#172338;--qd-muted:#65748b;--qd-blue:#2563eb;color:var(--qd-ink);max-width:none;min-width:0}
.queen-detail .qd-header{display:flex;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;gap:20px;padding:8px 0 22px}
.queen-detail .qd-eyebrow{font-size:12px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--qd-blue);margin-bottom:7px}
.queen-detail .qd-header h1{font-size:clamp(25px,2.5vw,34px);line-height:1.18;margin:0;letter-spacing:-.03em}
.queen-detail .qd-name{font-weight:500;color:#64748b}
.queen-detail .qd-subtitle{color:var(--qd-muted);margin:10px 0 0;font-size:14px}
.queen-detail .qd-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;max-width:650px}
.queen-detail .qd-actions .btn{min-height:42px;display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;text-decoration:none}
.queen-detail .qd-section{background:#fff;border:1px solid var(--qd-border);border-radius:18px;padding:clamp(16px,2.2vw,26px);margin:0 0 18px;box-shadow:0 2px 8px rgba(20,38,65,.035);min-width:0}
.queen-detail .qd-section>h2{font-size:19px;font-weight:750;letter-spacing:-.02em;margin:0 0 18px;padding-bottom:14px;border-bottom:1px solid #e9edf2;color:#18243a}
.queen-detail .qd-section h3{font-size:16px;margin:22px 0 12px;color:#243449}
.queen-detail .muted{color:var(--qd-muted)}
.queen-detail .msg,.queen-detail .err{padding:12px 15px;border-radius:12px;display:block;margin:0 0 16px;font-size:14px}
.queen-detail .msg{background:#effaf3;border:1px solid #bce5c9;color:#166534}
.queen-detail .err{background:#fff3f3;border:1px solid #f4c4c4;color:#991b1b}
.queen-detail .disabled{opacity:.48;pointer-events:none}
.queen-detail .btn-sm{font-size:14px;min-height:38px;display:inline-flex;align-items:center;justify-content:center;padding:8px 12px}
.queen-detail .btn-danger{border:1px solid #fecaca;background:#fff5f5;color:#991b1b}
.queen-detail .btn-danger:hover{background:#fee2e2}
.queen-detail .qd-section>.row,.queen-detail .qd-section form.row{display:flex;flex-wrap:wrap;gap:9px;align-items:center}
.queen-detail .qd-section .table{width:100%;border-collapse:separate;border-spacing:0;font-size:14px;display:table}
.queen-detail .qd-section .table th{background:#f5f7fb;color:#475569;font-size:12px;text-transform:uppercase;letter-spacing:.035em;text-align:left;font-weight:700}
.queen-detail .qd-section .table th,.queen-detail .qd-section .table td{padding:11px 12px;border-bottom:1px solid #e8edf3;vertical-align:top}
.queen-detail .qd-section .table tr:last-child td{border-bottom:0}
.queen-detail .qd-section .table a{color:#2563eb;text-decoration:none}
.queen-detail .qd-section .table a:hover{text-decoration:underline}
.queen-detail .qd-section details{border:1px solid var(--qd-border);border-radius:12px;padding:12px 15px;margin:12px 0;background:#fbfcfe}
.queen-detail .qd-section summary{cursor:pointer;font-weight:700;color:#334155}
.queen-detail .qd-section code{background:#f1f5f9;padding:3px 6px;border-radius:6px;overflow-wrap:anywhere;font-size:12px}
.queen-detail .kpi{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.queen-detail .k{border:1px solid #e1e7ee;border-radius:13px;padding:15px;background:#f8fafd;min-width:0}
.queen-detail .k .t{font-size:12px;font-weight:650;color:#64748b}
.queen-detail .k .v{font-size:21px;font-weight:800;margin-top:6px;color:#1e293b}
.queen-detail .pedKpiGrid{display:grid;grid-template-columns:minmax(300px,420px) minmax(0,1fr);gap:18px;align-items:start}
.queen-detail .miniPedWrap{border:1px solid #e1e7ee;border-radius:13px;padding:12px;background:#fff;min-width:0}
.queen-detail .miniPed{width:100%;overflow:hidden}
.queen-detail .miniPed svg{width:100%;height:auto;display:block}
.queen-detail .pbox{rx:12;ry:12;stroke:#334155;stroke-width:1}
.queen-detail .pline{stroke:#64748b;stroke-width:1;opacity:.8}
@media(max-width:1100px){.queen-detail .pedKpiGrid{grid-template-columns:1fr}}
@media(max-width:780px){.queen-detail .qd-header{display:block}.queen-detail .qd-actions{margin-top:16px}.queen-detail .kpi{grid-template-columns:repeat(2,minmax(0,1fr))}.queen-detail .qd-section{overflow-x:auto}.queen-detail .qd-section .table{min-width:580px}}
@media(max-width:480px){.queen-detail .kpi{grid-template-columns:1fr}.queen-detail .qd-actions .btn{flex:1 1 auto}.queen-detail .qd-section{padding:15px}}


/* Koningindetail: dezelfde inklapbare kaartbediening op elk schermformaat. */
.queen-detail .qd-foldable .qd-mobile-toggle {
  all: unset;
  box-sizing: border-box;
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.queen-detail .qd-foldable .qd-mobile-toggle span {
  display: inline-block;
  font-size: 20px;
  line-height: 1;
  transition: transform .18s ease;
}
.queen-detail .qd-foldable.qd-collapsed .qd-mobile-toggle span {transform: rotate(-90deg);}
.queen-detail .qd-foldable .qd-mobile-toggle:focus-visible {
  outline: 2px solid #2563eb;
  outline-offset: 4px;
  border-radius: 4px;
}
.queen-detail .qd-foldable .qd-collapse-body[hidden] {display:none!important;}


/* ================================================================
   Kastkaart 2.0: gedeelde rapportstijl voor ALLE pagina's.
   Gebruik kk-collapse + kk-panel-grid + kk-table, niet pagina-CSS.
   ================================================================ */
.kk-panel-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:start;margin:0 0 14px;}
.kk-panel-grid > .kk-collapse {min-width:0;width:100%;margin:0;}
@media (max-width:850px){.kk-panel-grid{grid-template-columns:1fr;}}
.kk-collapse > .kk-collapse-body {min-width:0;overflow-x:auto;}
.kk-collapse .kk-table {width:100%;border-collapse:collapse;}
.kk-collapse .kk-table th,.kk-collapse .kk-table td {padding:9px 11px;vertical-align:top;}
/* Gelijke app-shell als het teeltrapport, zonder een tweede zijmenu. */
.kk-queen-detail .app-shell {display:flex;width:100%;}
.kk-queen-detail .app-shell > .dashboard-main {flex:1 1 auto;width:auto;min-width:0;max-width:none;margin:0;}
.kk-queen-detail .dashboard-main .kr-container {max-width:none;width:100%;margin:0;padding:0;}
.kk-queen-detail .kr-report-content {display:block;width:100%;min-width:0;}
.kk-queen-detail .app-shell > #dashboard-sidebar {flex:0 0 238px;width:238px;}
@media(max-width:1150px){.kk-queen-detail .app-shell > #dashboard-sidebar {flex-basis:205px;width:205px;}}
@media(max-width:850px){.kk-queen-detail .app-shell > #dashboard-sidebar {display:none;position:absolute;}.kk-queen-detail .app-shell > #dashboard-sidebar.open{display:flex;}}
.kk-queen-detail .queen-detail {min-width:0;}
.kk-queen-detail .qd-card-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
@media(max-width:850px){.kk-queen-detail .qd-card-grid{grid-template-columns:1fr;}}
.kk-queen-detail .queen-detail > .kr-container > .kr-report-content > .kk-collapse {margin-bottom:12px;}
.kk-queen-detail .qd-header {border:1px solid #dce7f3;border-radius:13px;background:#fff;padding:18px 20px;margin-bottom:14px;box-shadow:0 2px 8px rgba(23,61,104,.035);}
.kk-queen-detail .qd-header .qd-eyebrow{color:#1d4f80;}
.kk-queen-detail .qd-header h1{color:#21344e;}
.kk-queen-detail .qd-info-table {table-layout:auto;}
.kk-queen-detail .qd-info-table th {width:38%;}
.kk-queen-detail .kk-collapse-body .pedKpiGrid {min-width:0;}

/* Koninginnenoverzicht: uitsluitend pagina-indeling, gedeelde kaarten/tabellen/formulieren
   komen uit de algemene kk-* regels van app.css. */
.qo-overview .app-shell{display:flex;width:100%}
.qo-overview .app-shell>.dashboard-main{flex:1 1 auto;min-width:0;width:auto;max-width:none;margin:0}
.qo-overview .dashboard-main .kr-container{max-width:none;width:100%;margin:0;padding:0}
.qo-overview .app-shell>#dashboard-sidebar{flex:0 0 238px;width:238px}
.qo-overview .qo-page .queen-year.kk-collapse{margin-bottom:12px;border-radius:13px;overflow:hidden}
.qo-overview .qo-page .queen-year.kk-collapse>.kk-collapse-head{padding:14px 16px}
.qo-overview .qo-page .queen-year.kk-collapse .kk-collapse-heading{display:flex;flex-direction:column;gap:3px}
.qo-overview .qo-page .queen-year.kk-collapse .queen-year-count{font-size:12px;font-weight:500}
.qo-overview .qo-page .queen-year.kk-collapse>.kk-collapse-body{padding:0;overflow-x:auto}
.qo-overview .qo-page .queen-year.kk-collapse .qo-table-panel{margin:0;padding:0;border:0;box-shadow:none}
.qo-overview .qo-page .queen-year.kk-collapse .qo-table{width:100%}
.qo-overview .qo-page .queen-year.kk-collapse .qo-table th,
.qo-overview .qo-page .queen-year.kk-collapse .qo-table td{padding:10px 12px}
@media(max-width:1150px){.qo-overview .app-shell>#dashboard-sidebar{flex-basis:205px;width:205px}}
@media(max-width:850px){.qo-overview .app-shell>#dashboard-sidebar{display:none;position:absolute}.qo-overview .app-shell>#dashboard-sidebar.open{display:flex}}


/* ================================================================
   KASTKAART 2.0 — CANONIEKE TABELSTIJL
   Visuele standaard: teeltrapport. Gebruik voor elke nieuwe tabel
   class="kk-table" (eventueel samen met table voor legacy markup).
   Kleuren komen uitsluitend uit deze tokens; paginaspecifieke
   selectors mogen uitsluitend indeling en responsive gedrag regelen.
   ================================================================ */
:root {
  --kk-table-head-bg: #f3f7fc;
  --kk-panel-head-bg: var(--kk-table-head-bg);
  --kk-panel-head-text: var(--kk-table-head-text);
  --kk-table-head-text: #35577c;
  --kk-table-border: #e6edf5;
  --kk-table-row-bg: #ffffff;
  --kk-table-row-alt-bg: #f8fbff;
  --kk-table-row-hover-bg: #edf5ff;
  --kk-table-text: #243449;
  --kk-table-link: #2563eb;
}
/* Dezelfde tokens voor oude .table, de algemene .kk-table en rapporttabellen.
   !important is hier bewust beperkt tot de uniforme kleuren: oude
   .qo-page/.queen-detail-specificiteit mag die niet overschrijven. */
:where(.dashboard-main, .kr-report-content, .queen-detail, .kc-page)
:is(.kk-table, .table, .kr-table-scroll table, .qo-table) thead th,
:where(.dashboard-main, .kr-report-content, .queen-detail, .kc-page)
:is(.kk-table, .table, .kr-table-scroll table, .qo-table) thead td,
:where(.dashboard-main, .kr-report-content, .queen-detail, .kc-page)
:is(.kk-table, .table, .kr-table-scroll table, .qo-table) > tbody > tr > th {
  background: var(--kk-table-head-bg) !important;
  color: var(--kk-table-head-text) !important;
}
:where(.dashboard-main, .kr-report-content, .queen-detail, .kc-page)
:is(.kk-table, .table, .kr-table-scroll table, .qo-table) tbody td {
  color: var(--kk-table-text);
  border-bottom-color: var(--kk-table-border);
}
:where(.dashboard-main, .kr-report-content, .queen-detail, .kc-page)
:is(.kk-table, .table, .kr-table-scroll table, .qo-table) tbody tr:hover {
  background-color: var(--kk-table-row-hover-bg) !important;
}
/* Hoge specificiteit voor oude pagina- en tabelvarianten. */
body .dashboard-main table.kk-table thead th,
body .dashboard-main table.table thead th,
body .dashboard-main table.qo-table thead th,
body .dashboard-main .kr-table-scroll table thead th,
body .queen-detail table.kk-table thead th,
body .queen-detail table.table thead th {
  background-color: var(--kk-table-head-bg) !important;
  color: var(--kk-table-head-text) !important;
}
body .dashboard-main table.kk-table tbody tr:hover,
body .dashboard-main table.table tbody tr:hover,
body .dashboard-main table.qo-table tbody tr:hover,
body .dashboard-main .kr-table-scroll table tbody tr:hover {
  background-color: var(--kk-table-row-hover-bg) !important;
}
/* Gedeelde tabelranden, ook voor oudere tabellen. */
body .dashboard-main table.kk-table :is(th,td),
body .dashboard-main table.table :is(th,td),
body .dashboard-main .kr-table-scroll table :is(th,td) {
  border-bottom-color: var(--kk-table-border);
}

/* CANONIEK: tabelkop en inklapkop gebruiken exact dezelfde centrale tokens. */
.kk-collapse > .kk-collapse-head {
  background-color: var(--kk-panel-head-bg);
  color: var(--kk-panel-head-text);
}
.kk-collapse > .kk-collapse-head:hover {
  background-color: var(--kk-table-row-hover-bg);
}
.kk-collapse > .kk-collapse-head .kk-collapse-heading strong {
  color: var(--kk-panel-head-text);
}

/* Kalender 2.0: herbruikbare algemene stijlen blijven centraal. */
:root{--kk-cal-surface:var(--kk-table-head-bg,#f3f7fc);--kk-cal-border:var(--kk-table-border,#dbe5ef);--kk-cal-heading:var(--kk-panel-head-text,#35577c)}
.cal-page .kk-btn,.cal-embed-body .kk-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--kk-cal-border);border-radius:8px;padding:7px 11px;background:#fff;color:var(--kk-cal-heading);font-weight:600;text-decoration:none;cursor:pointer;font:inherit;font-size:.88rem}
.cal-page .kk-btn:hover,.cal-embed-body .kk-btn:hover{background:var(--kk-cal-surface)}
.cal-page .kk-btn-primary{background:var(--kk-cal-heading);color:#fff;border-color:var(--kk-cal-heading)}
.cal-page .kk-btn-primary:hover{background:#274564;color:#fff}
.cal-page .cal-card{background:#fff;border:1px solid var(--kk-cal-border);border-radius:12px;box-shadow:0 1px 4px rgba(15,23,42,.04)}
.cal-page .cal-card h2{color:var(--kk-cal-heading)}
.cal-page .cal-form input:not([type=checkbox]):not([type=color]),.cal-page .cal-form select,.cal-page .cal-form textarea{padding:9px 10px;border:1px solid var(--kk-cal-border);border-radius:8px;background:#f8fbff;color:#1e293b}
.cal-page .cal-form label{font-size:.9rem;font-weight:550}
.cal-page .cal-card summary{color:var(--kk-cal-heading)}
.cal-page .kk-table thead th{background:var(--kk-cal-surface);color:var(--kk-cal-heading)}

/* Kastkaart 2.0: centrale stijl voor sectiekoppen, detailvensters en zijmenuformulieren */
.kk-section-heading{font-family:inherit!important;color:#1e4d82!important;font-size:clamp(1.2rem,2vw,1.55rem)!important;font-weight:750!important;letter-spacing:-.025em!important;line-height:1.3!important}
.kk-popover-heading{font-size:1.08rem;font-weight:750;color:#1e4d82;line-height:1.3}
.kk-popover-actions{display:flex!important;flex-direction:row!important;align-items:center!important;gap:10px!important;flex-wrap:nowrap!important;width:100%}
.kk-popover-actions>a,.kk-popover-actions>button{flex:1 1 0;display:inline-flex!important;align-items:center;justify-content:center;white-space:nowrap;min-height:40px;border-radius:9px;padding:9px 10px;border:1px solid #cbd5e1;background:#f8fafc;color:#234568;font:inherit;font-size:.9rem;font-weight:600;text-decoration:none;cursor:pointer}
.kk-popover-actions>.cal-pop-delete{color:#b42318;border-color:#f3c5c5;background:#fffafa}
.kk-side-filter{margin:18px 10px 12px;padding:13px 10px;border:1px solid #dce5ef;border-radius:12px;background:#fff}
.kk-side-filter-title{font-size:.9rem;line-height:1.3;color:#1e4d82;font-weight:750;margin:0 0 6px}
.kk-side-filter-help{font-size:.75rem;line-height:1.35;color:#64748b;margin:0 0 12px}
.kk-side-filter-form{display:flex;flex-direction:column;gap:10px}
.kk-side-filter-options{max-height:290px;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:2px}
.kk-side-filter-choice{display:flex;align-items:flex-start;gap:8px;font-size:.8rem;line-height:1.35;color:#334155;cursor:pointer}
.kk-side-filter-choice input{margin:2px 0 0;flex:none;accent-color:#1e4d82}
.kk-side-filter-choice small{display:block;font-size:.7rem;color:#64748b}
.kk-side-filter-apply{border:0;border-radius:8px;background:#1e4d82;color:#fff;min-height:36px;font-weight:650;cursor:pointer}

/* Gedeelde Kastkaart 2.0 kopstijl, gebaseerd op koningin-jaarkoppen */
.kk-calendar-month-heading{font-family:inherit;font-weight:750;color:#1e4d82;background:#f8fafc;border-bottom:1px solid #e2e8f0;letter-spacing:normal}

/* Kastkaart 2.0 — centrale, uitbreidbare zijbalk met formuliersecties */
.kk-sidebar-section{margin:16px 10px;padding:14px 12px;border:1px solid #dce5ef;border-radius:12px;background:#fff;box-shadow:0 2px 9px #15395709}
.kk-sidebar-section-heading{font-size:1rem;font-weight:750;color:#1e4d82;margin:0 0 14px;padding-bottom:9px;border-bottom:1px solid #e2e8f0}
.kk-sidebar-form{display:flex;flex-direction:column;gap:13px}
.kk-sidebar-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.kk-sidebar-label{font-size:.78rem;font-weight:700;color:#344861}
.kk-sidebar-select{display:block;width:100%;max-width:100%;min-height:38px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;color:#243b53;font:inherit;font-size:.82rem;padding:7px 9px}
.kk-sidebar-select:focus{outline:2px solid #a7c9ed;outline-offset:1px}
.kk-sidebar-details{border-top:1px solid #e2e8f0;padding-top:10px}
.kk-sidebar-details summary{cursor:pointer;font-size:.78rem;font-weight:650;color:#1e4d82}
.kk-sidebar-details .kk-side-filter-options{margin-top:10px}
.kk-sidebar-reset{border:1px solid #c6d7e8;border-radius:8px;min-height:36px;background:#eef5fc;color:#1e4d82;font:inherit;font-size:.82rem;font-weight:700;cursor:pointer}
.kk-sidebar-note{font-size:.72rem;color:#64748b;margin:0;line-height:1.45}

/* Kastkaart 2.0: één systeemlettertype op alle pagina's en formulierelementen. */
:root{--kk-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
html,body,button,input,select,textarea{font-family:var(--kk-font)!important}
.kk-calendar-month-heading.kk-collapse-head{font-family:var(--kk-font)!important;background:#f2f7fe!important;color:#1d4f80!important;font-size:14px!important;font-weight:750!important;line-height:1.35!important;letter-spacing:normal!important;text-transform:none!important;border-radius:0!important;padding:14px 16px!important;margin:0!important;border:0!important}
.kk-today-button{border-color:#b9d4f3!important;background:#edf5ff!important;color:#1d4f80!important;font-weight:700!important}

/* Dezelfde zoekbalk voor kalender en koninginnen: herbruikbare 2.0-toolbar. */
.kk-toolbar.queen-filter-bar{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:12px 14px;border:1px solid #dce5ef;border-radius:12px;background:#fff;margin-bottom:14px}
.kk-toolbar .kk-input.kk-search{flex:1 1 260px;min-width:160px;min-height:40px;border:1px solid #cbd5e1;border-radius:8px;padding:9px 12px;background:#fff;color:#26374a;font:inherit}
.kk-toolbar .kk-input.kk-search:focus{outline:2px solid #b6d3f5;outline-offset:1px;border-color:#5b92d4}
.kk-toolbar .ko-btn.kk-btn{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:9px 15px;border:1px solid #cbd5e1;border-radius:8px;background:#f8fafc;color:#1d4f80;font:inherit;font-weight:650;cursor:pointer}

/* Kastkaart 2.0 — uniforme, compacte formulieren, tabellen en knoppen. */
:root{--kk-ui-blue:#1d4f80;--kk-ui-border:#dce5ef;--kk-ui-muted:#64748b;--kk-ui-bg:#f7f9fc;--kk-ui-radius:12px}
.kk-ui-page{max-width:1160px;margin:0 auto}
.kk-ui-header{margin:0 0 14px}.kk-ui-header h1{font:750 clamp(1.35rem,2.4vw,1.75rem)/1.25 var(--kk-font,inherit);color:var(--kk-ui-blue);margin:3px 0 5px}
.kk-ui-header p{color:var(--kk-ui-muted);font-size:.85rem;margin:0}
.kk-ui-kicker{color:var(--kk-ui-blue)!important;text-transform:uppercase;letter-spacing:.08em;font-size:.69rem!important;font-weight:750}
.kk-ui-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:start}
.kk-ui-wide{grid-column:1/-1}
.kk-ui-card{background:#fff;border:1px solid var(--kk-ui-border);border-radius:var(--kk-ui-radius);padding:16px;box-shadow:0 2px 8px #1d35570a;min-width:0}
.kk-ui-card h2,.kk-ui-card h3{color:var(--kk-ui-blue);font-size:1rem;line-height:1.3;font-weight:750;margin:0 0 12px;padding:0 0 10px;border-bottom:1px solid #e6edf4}
.kk-ui-form{display:flex;flex-direction:column;gap:11px}
.kk-ui-form label{display:flex;flex-direction:column;gap:5px;color:#344861;font-size:.82rem;font-weight:650;min-width:0}
.kk-ui-form input:not([type=hidden]):not([type=color]),.kk-ui-form select,.kk-ui-form textarea,.kk-ui-control{width:100%;min-width:0;min-height:37px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;color:#26374a;padding:7px 10px;font:inherit;font-size:.85rem}
.kk-ui-form textarea{min-height:65px;resize:vertical}
.kk-ui-form input[type=color]{height:36px;width:65px;padding:2px;border:1px solid #cbd5e1;border-radius:8px}
.kk-ui-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.kk-ui-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:5px}
.kk-ui-btn{display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:8px 12px;min-height:36px;border:1px solid #cbd5e1;border-radius:8px;background:#f8fafc;color:#1d4f80;text-decoration:none;font:650 .83rem var(--kk-font,inherit);cursor:pointer;white-space:nowrap}
.kk-ui-btn-primary{background:#1d4f80;color:#fff;border-color:#1d4f80}
.kk-ui-btn-danger{color:#b42318;border-color:#f2caca;background:#fffafa}
.kk-ui-table-wrap{overflow-x:auto}
.kk-ui-table{width:100%;border-collapse:collapse;font-size:.83rem}
.kk-ui-table th{background:#f2f7fe;color:#1d4f80;font-weight:750;text-align:left;padding:9px 10px;border-bottom:1px solid #dce5ef}
.kk-ui-table td{padding:9px 10px;border-bottom:1px solid #edf1f6;vertical-align:middle}
.kk-ui-table tr:last-child td{border-bottom:0}
.kk-ui-table td:last-child{white-space:nowrap}
.kk-ui-details{border:1px solid #e0e9f2;border-radius:10px;background:#fff;overflow:hidden}
.kk-ui-details summary{padding:11px 13px;cursor:pointer;color:#1d4f80;font-weight:700;font-size:.86rem;background:#f8fafc}
.kk-ui-details-body{padding:12px}
.kk-ui-muted{color:#64748b;font-size:.81rem}
@media(max-width:760px){.kk-ui-grid,.kk-ui-fields{grid-template-columns:1fr}.kk-ui-card{padding:13px}.kk-ui-wide{grid-column:auto}.kk-ui-table td:last-child{white-space:normal}}

/* Compacte kalenderformulieren: herbruikbare layoutcomponenten */
.kk-ui-page .kk-ui-form{gap:8px;margin-top:8px}
.kk-ui-page .kk-ui-fields{gap:8px 12px}
.kk-ui-page .kk-ui-form label{gap:4px}
.kk-ui-page .kk-ui-card{padding:13px 15px}
.kk-ui-page .kk-ui-card h2{margin-bottom:9px;padding-bottom:8px}
.kk-ui-page .cal-manual{display:grid;gap:8px}
.kk-ui-embed-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;align-items:start}
.kk-ui-embed-grid .kk-ui-details{min-width:0}
.kk-ui-embed-grid .kk-ui-details summary{overflow-wrap:anywhere;line-height:1.4}
.kk-ui-copy-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end}
.kk-ui-copy-row label{min-width:0}
.kk-ui-copy-row .kk-ui-btn{margin-bottom:1px}
.kk-ui-step-list{display:grid;gap:8px;margin-top:12px}
.kk-ui-step-item{padding:10px;border:1px solid #e2eaf2;border-radius:9px;background:#fafcff}
.kk-ui-step-item .kk-ui-form{margin:0}
.kk-ui-step-fields{grid-template-columns:75px minmax(130px,1.4fr) minmax(100px,.75fr) minmax(160px,1.4fr)}
.kk-ui-forms-grid{margin-top:12px}
.kk-ui-forms-grid .kk-ui-card{min-width:0}
.kk-ui-execution-tasks{margin-top:12px;scroll-margin-top:25px}
.kk-ui-execution-tasks .kk-ui-actions{justify-content:space-between}
.kk-ui-execution-tasks h2{border:0;margin:0}
@media(max-width:1100px){.kk-ui-step-fields{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){.kk-ui-embed-grid{grid-template-columns:1fr}}
@media(max-width:600px){.kk-ui-step-fields,.kk-ui-copy-row{grid-template-columns:1fr}.kk-ui-copy-row .kk-ui-btn{justify-self:start}}

/* Tabelstijl identiek aan kasten_overzicht.php; gedeelde ko-table component */
.ko-table{width:100%;border-collapse:collapse}
.ko-table th{padding:13px;text-align:left;background:#f8fafc;color:#78899a;font-size:12px}
.ko-table td{padding:14px 13px;border-top:1px solid #edf1f5;vertical-align:top;font-size:14px}
.ko-table tbody tr:hover{background:#f9fbfe}
.ko-muted{color:#708197;font-size:12px}
.ko-name{font-weight:750}
.ko-actions a{font-weight:700;color:#2563eb;text-decoration:none}
@media(max-width:680px){.ko-toolbar input,.ko-toolbar .ko-btn{width:100%;min-width:0}.ko-table thead{display:none}.ko-table,.ko-table tbody,.ko-table tr,.ko-table td{display:block;width:100%}.ko-table tr{padding:10px 14px;border-top:1px solid #edf1f5}.ko-table td{border:0;padding:5px 0;display:flex;gap:12px;justify-content:space-between;align-items:flex-start;text-align:right}.ko-table td:before{content:attr(data-label);font-size:12px;color:#78899a;font-weight:650;text-align:left;flex:0 0 86px}.ko-table td.ko-main{font-size:16px;text-align:left;justify-content:flex-start}.ko-table td.ko-main:before{display:none}.ko-note{max-width:65%}}

/* Kastkaart 2.0 · teeltrapport: algemene pagina-indeling staat in de
   hoofdstylesheet, niet meer als inline CSS in koningin_rapport.php. */
.kr-report .app-shell {display:flex;width:100%}
.kr-report .app-shell > .dashboard-main {flex:1 1 auto;width:auto;min-width:0;max-width:none;margin:0}
.kr-report .dashboard-main .kr-container {max-width:none;width:100%;margin:0;padding:0}
.kr-report .kr-report-content {display:block;width:100%;min-width:0}
.kr-report .kr-report-content > * {min-width:0}
.kr-report .app-shell > #dashboard-sidebar {flex:0 0 238px;width:238px}
@media(max-width:1150px){.kr-report .app-shell > #dashboard-sidebar {flex-basis:205px;width:205px}}
@media(max-width:850px){.kr-report .app-shell > #dashboard-sidebar {display:none;position:absolute}.kr-report .app-shell > #dashboard-sidebar.open {display:flex}}