.hlb-builder{max-width:1100px;margin:0 auto;padding:24px 0}
.hlb-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}
.hlb-config,.hlb-preview-panel,.hlb-order-form-wrap{background:#fff;border:1px solid #e5e0d8;border-radius:12px;padding:20px;box-shadow:0 2px 8px rgba(0,0,0,.04)}
.hlb-options{display:grid;gap:12px}
.hlb-size-options{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.hlb-material-options{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}
.hlb-option-card{display:flex;gap:10px;align-items:center;border:1px solid #d9d2c7;border-radius:10px;padding:12px;cursor:pointer;background:#faf8f4}
.hlb-option-card input{margin:0}
.hlb-material-card{flex-direction:column;text-align:center;align-items:center}
.hlb-material-card img{width:70px;height:70px;object-fit:cover;border-radius:8px;border:1px solid #ddd;background:#fff}
.hlb-preview-wrap{background:#fcfaf6;border:1px dashed #d4c9bb;border-radius:10px;padding:15px;overflow:auto}
.hlb-preview-box{min-height:220px;display:flex;align-items:center;justify-content:center;background:#f7f3eb;border-radius:10px;padding:20px;text-align:center}
.hlb-preview-text{font-size:64px;line-height:1.1;color:#4f3729;word-break:break-word;max-width:100%}
.hlb-price-box{background:#f5efe5;border-radius:10px;padding:14px;font-size:20px;margin-top:16px}
.hlb-order-form-wrap{margin-top:24px}
.hlb-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.hlb-order-form input[type="text"],.hlb-order-form input[type="email"],.hlb-order-form textarea,.hlb-order-form select,.hlb-config input[type="text"],.hlb-config select{width:100%;padding:10px;border:1px solid #ccc;border-radius:8px}
.hlb-letter-limit{color:#6b6255;font-size:14px}
@media (max-width: 800px){.hlb-grid,.hlb-form-grid{grid-template-columns:1fr}}

.hlb-preview-help{color:#6b6255;font-size:14px;margin:-4px 0 12px}

.hlb-success-message{margin:0 0 24px;padding:16px 18px;border:1px solid #b7d7a8;background:#edf8e7;color:#245b1a;border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,.04)}
.hlb-success-message:focus{outline:2px solid #245b1a;outline-offset:2px}


/* Expliciete UI-stijl voor font, tekst en actieknoppen */
.hlb-field{margin:0 0 16px}
.hlb-field label{display:block;margin:0 0 8px;font-size:14px;font-weight:700;color:#3d2f25}
.hlb-select,.hlb-input,.hlb-textarea,#hlb_font,#hlb_text,#hlb_name,#hlb_email,#hlb_message{appearance:none;-webkit-appearance:none;width:100%;min-height:48px;padding:12px 14px;border:1px solid #cdbfae;border-radius:12px;background:#fffdf9;color:#2f241c;font-size:16px;line-height:1.4;box-shadow:inset 0 1px 2px rgba(0,0,0,.03);transition:border-color .2s ease, box-shadow .2s ease, background-color .2s ease}
.hlb-textarea,#hlb_message{min-height:120px;resize:vertical}
.hlb-select:hover,.hlb-input:hover,.hlb-textarea:hover,#hlb_font:hover,#hlb_text:hover,#hlb_name:hover,#hlb_email:hover,#hlb_message:hover{border-color:#b3997f;background:#fff}
.hlb-select:focus,.hlb-input:focus,.hlb-textarea:focus,#hlb_font:focus,#hlb_text:focus,#hlb_name:focus,#hlb_email:focus,#hlb_message:focus{outline:none;border-color:#8a6748;box-shadow:0 0 0 4px rgba(138,103,72,.16);background:#fff}
.hlb-select{background-image:linear-gradient(45deg, transparent 50%, #8a6748 50%),linear-gradient(135deg, #8a6748 50%, transparent 50%);background-position:calc(100% - 20px) calc(50% - 3px),calc(100% - 14px) calc(50% - 3px);background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:42px}
.hlb-action-row{margin:18px 0 0}
.hlb-btn,#hlb_generate_preview,.hlb-order-form .button-primary{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 18px;border:0;border-radius:12px;font-size:15px;font-weight:700;letter-spacing:.01em;text-decoration:none;cursor:pointer;transition:transform .06s ease, box-shadow .2s ease, opacity .2s ease}
.hlb-btn:hover,#hlb_generate_preview:hover,.hlb-order-form .button-primary:hover{transform:translateY(-1px)}
.hlb-btn:active,#hlb_generate_preview:active,.hlb-order-form .button-primary:active{transform:translateY(0)}
.hlb-btn:focus-visible,#hlb_generate_preview:focus-visible,.hlb-order-form .button-primary:focus-visible{outline:none;box-shadow:0 0 0 4px rgba(138,103,72,.18)}
.hlb-btn-generate,#hlb_generate_preview{background:#8a6748;color:#fff;box-shadow:0 8px 18px rgba(138,103,72,.18)}
.hlb-btn-generate:hover,#hlb_generate_preview:hover{background:#75563c;color:#fff}
.hlb-btn-submit,.hlb-order-form .button-primary{width:100%;background:#2f6e3d;color:#fff;box-shadow:0 10px 22px rgba(47,110,61,.18)}
.hlb-btn-submit:hover,.hlb-order-form .button-primary:hover{background:#255a31;color:#fff}