.mdj-aip-ui{border:1px solid #e5e7eb;background:#f9fafb;padding:16px;border-radius:10px;font-size:14px}
.mdj-aip-header{margin-bottom:12px}
.mdj-aip-grid{display:flex;flex-wrap:wrap;gap:16px}
.mdj-aip-col{flex:1 1 280px;min-width:0}
.mdj-aip-label{font-weight:600;display:block;margin-bottom:4px}
.mdj-aip-instructions{width:100%;margin-bottom:8px}
.mdj-aip-result{min-height:220px;border:1px solid #e5e7eb;background:#fff;border-radius:8px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.mdj-aip-result img{max-width:100%;height:auto;display:block}
.mdj-aip-result-placeholder{padding:12px;color:#6b7280;text-align:center}
.mdj-aip-actions{margin-top:8px;display:flex;gap:8px;flex-wrap:wrap}
.mdj-aip-status{margin-top:6px;font-size:12px;color:#374151}
.mdj-aip-status.is-error{color:#b91c1c}
.mdj-aip-template-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.55);z-index:9999;display:flex;align-items:center;justify-content:center}
.mdj-aip-template-modal{background:#fff;max-width:760px;width:100%;max-height:80vh;border-radius:12px;padding:16px;overflow:hidden;display:flex;flex-direction:column}
.mdj-aip-template-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
.mdj-aip-template-list{overflow:auto;border-top:1px solid #e5e7eb;margin-top:8px;padding-top:8px}
.mdj-aip-template-group{margin-bottom:12px}
.mdj-aip-template-group-title{font-weight:600;margin-bottom:4px}
.mdj-aip-template-item{border:1px solid #e5e7eb;border-radius:8px;padding:8px;margin-bottom:6px;cursor:pointer}
.mdj-aip-template-item:hover{background:#f3f4f6}
.mdj-aip-template-item-label{font-weight:600;margin-bottom:2px}
.mdj-aip-template-item-prompt{font-size:12px;color:#4b5563}


.mdj-aip-template-item-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2px}
.mdj-aip-template-fav{border:none;background:transparent;cursor:pointer;font-size:14px;line-height:1;padding:0 4px;color:#f59e0b}
.mdj-aip-template-fav:hover{transform:scale(1.1);}

.mdj-aip-maintenance-wrapper{border:1px solid #e5e7eb;background:#f9fafb;padding:32px;border-radius:10px;text-align:center}
.mdj-aip-maintenance-card{max-width:680px;margin:0 auto}
.mdj-aip-maintenance-card h2{margin-bottom:12px;font-size:20px}
.mdj-aip-maintenance-card p{margin-bottom:8px}
.mdj-aip-maintenance-link .button{margin-top:8px}

.mdj-aip-popup-overlay{position:fixed;inset:0;background:rgba(15,23,42,0.55);z-index:9999;display:none;align-items:center;justify-content:center;padding:16px;}
.mdj-aip-popup-window{background:#ffffff;border-radius:10px;max-width:900px;width:100%;max-height:90vh;overflow:auto;box-shadow:0 20px 40px rgba(15,23,42,0.25);padding:16px;position:relative;}
.mdj-aip-popup-close{position:absolute;top:8px;right:8px;border:none;background:transparent;font-size:20px;cursor:pointer;line-height:1;}
.mdj-aip-popup-content table{width:100%;}



/* Prompt Library Frontend Page */
.mdj-aip-prompt-page .mdj-aip-layout {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
}

.mdj-aip-prompt-page .mdj-aip-left {
    flex: 1 1 420px;
    max-width: 640px;
}

.mdj-aip-prompt-page .mdj-aip-right {
    flex: 1 1 360px;
    min-width: 320px;
}

.mdj-aip-prompt-page .mdj-aip-title {
    font-size: 1.6rem;
    margin-bottom: 0.25rem;
}

.mdj-aip-prompt-page .mdj-aip-subtitle {
    margin-bottom: 1.25rem;
    color: #555;
}

.mdj-aip-prompt-page .mdj-aip-field {
    margin-bottom: 1rem;
}

.mdj-aip-prompt-page .mdj-aip-select,
.mdj-aip-prompt-page .mdj-aip-textarea {
    width: 100%;
    max-width: 100%;
}

.mdj-aip-preview-panel {
    display: flex;
    align-items: stretch;
}

.mdj-aip-preview-card {
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 10px 35px rgba(0,0,0,0.08);
    padding: 20px 22px;
    width: 100%;
    min-height: 260px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.mdj-aip-preview-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.85rem;
    color: #555;
}

.mdj-aip-pill {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 999px;
    background: #ffe7c0;
    color: #6b4000;
    font-weight: 600;
}

.mdj-aip-preview-label {
    font-weight: 600;
}

.mdj-aip-preview-body {
    flex: 1;
    font-size: 0.95rem;
    line-height: 1.5;
    color: #333;
}

.mdj-aip-preview-footer {
    font-size: 0.8rem;
    color: #777;
}

/* Diamond quality toggle */
.mdj-aip-diamond-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.mdj-aip-diamond-toggle-wrap{display:flex;flex-direction:column;gap:4px}
.mdj-aip-switch{display:inline-flex;align-items:center;gap:8px;cursor:pointer}
.mdj-aip-switch-track{position:relative;width:50px;height:24px;border-radius:999px;background:#7f1d1d;transition:background .2s ease}
.mdj-aip-switch-thumb{position:absolute;top:2px;left:2px;width:20px;height:20px;border-radius:999px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.3);transition:transform .2s ease}
.mdj-aip-diamond-toggle{display:none}
.mdj-aip-diamond-toggle:checked+.mdj-aip-switch-track{background:#15803d}
.mdj-aip-diamond-toggle:checked+.mdj-aip-switch-track .mdj-aip-switch-thumb{transform:translateX(26px)}
.mdj-aip-switch-label{font-size:12px;color:#374151}
.mdj-aip-switch-label-no{color:#991b1b}
.mdj-aip-switch-label-yes{color:#166534;font-weight:600;opacity:.75}
.mdj-aip-diamond-toggle:checked~.mdj-aip-switch-label-no{opacity:.35}
.mdj-aip-diamond-toggle:not(:checked)~.mdj-aip-switch-label-yes{opacity:.4}


/* Output settings row */
.mdj-aip-output-row .mdj-aip-output-controls{
    display:flex;
    flex-wrap:wrap;
    gap:16px;
    align-items:flex-end;
}
.mdj-aip-output-control{
    display:flex;
    flex-direction:column;
}
.mdj-aip-output-control select{
    min-width:140px;
}
.mdj-aip-output-label{
    font-size:12px;
    color:#374151;
    margin-bottom:2px;
}


.mdj-aip-file-reset{
    margin-left:8px;
    font-size:11px;
}


/* Debug monitor */
.mdj-aip-debug-monitor{
    margin-top:15px;
}
.mdj-aip-debug-box{
    background:#1e1e1e;
    color:#e5e5e5;
    padding:10px;
    border-radius:4px;
    max-height:260px;
    overflow:auto;
    font-family:Menlo,Consolas,monospace;
    font-size:11px;
}
.mdj-aip-debug-output{
    white-space:pre-wrap;
}


/* Loader / zandloper voor generatie */

.mdj-aip-loader-row{
    display:none;
    justify-content:center;
    margin-top:8px;
}
.mdj-aip-loader-row.is-visible{
    display:flex;
}
.mdj-aip-loader{
    text-align:center;
}

/* Rustige, ronddraaiende spinner */
.mdj-aip-loader-icon{
    width:40px;
    height:40px;
    border-radius:50%;
    box-sizing:border-box;
    margin:0 auto;
    border:3px solid #e5e7eb;
    border-top-color:#00a7c4;
    animation:mdjAipLoaderSpin .7s linear infinite;
}

/* Oude ::before niet meer gebruiken */
.mdj-aip-loader-icon::before{
    content:none;
}

@keyframes mdjAipLoaderSpin{
    from{transform:rotate(0deg);}
    to{transform:rotate(360deg);}
}
.mdj-aip-loader-label{
    margin-top:6px;
    font-size:13px;
    color:#0f766e;
    font-weight:500;
}
tiefoto */
.mdj-aip-file-preview{
    margin-top:8px;
}
.mdj-aip-file-preview img{
    max-width:140px;
    height:auto;
    border-radius:6px;
    border:1px solid #e5e7eb;
    display:block;
}

/* Webcam capture button next to file input */
.mdj-aip-webcam-button{
    margin-left:6px;
    padding:2px 6px;
    border-radius:4px;
    border:1px solid #d1d5db;
    background:#f9fafb;
    cursor:pointer;
    font-size:12px;
    line-height:1;
    display:inline-flex;
    align-items:center;
    justify-content:center;
}
.mdj-aip-webcam-button:hover{
    background:#e5e7eb;
}
.mdj-aip-webcam-icon{
    font-size:15px;
}

/* Webcam overlay */
.mdj-aip-webcam-overlay{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,0.55);
    z-index:9999;
    display:flex;
    align-items:center;
    justify-content:center;
}
.mdj-aip-webcam-inner{
    background:#ffffff;
    padding:16px;
    border-radius:8px;
    box-shadow:0 10px 25px rgba(0,0,0,0.25);
    max-width:520px;
    width:90%;
    text-align:center;
}
.mdj-aip-webcam-video{
    max-width:100%;
    height:auto;
    border-radius:6px;
    margin-bottom:12px;
}
.mdj-aip-webcam-controls .button{
    margin:0 4px;
}