/* Herroepingsknop voor WooCommerce — frontend formulier (v1.1, verbeterde styling) */

.hrknl{
	/* Wil je het exact in je eigen merkfont? Vervang de stack hieronder
	   door bijv. "Poppins", sans-serif (of welke font het thema ook gebruikt). */
	--hrknl-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
	--hrknl-orange:#FF6A2C;--hrknl-orange-deep:#D8480F;--hrknl-orange-tint:#FFEFE6;
	--hrknl-ink:#1b1c20;--hrknl-slate:#5b646f;--hrknl-line:#e1e6ec;
	--hrknl-green:#15936a;--hrknl-green-tint:#e7f5ef;

	max-width:580px;
	margin:40px auto;
	padding:0 20px;
	font-family:var(--hrknl-font);
	color:var(--hrknl-ink);
	line-height:1.55;
	-webkit-font-smoothing:antialiased;
}
.hrknl *{box-sizing:border-box;}

/* Het formulier en het succesblok als nette witte kaart */
.hrknl-form,
.hrknl-success{
	background:#fff;
	border:1px solid var(--hrknl-line);
	border-radius:18px;
	padding:30px;
	box-shadow:0 1px 2px rgba(20,22,26,.04),0 18px 40px -22px rgba(20,22,26,.22);
}

.hrknl-title{
	font-family:var(--hrknl-font);
	font-size:1.55rem;
	font-weight:700;
	line-height:1.15;
	letter-spacing:-.01em;
	margin:0 0 .4em;
	color:var(--hrknl-ink);
}
.hrknl-intro{
	font-family:var(--hrknl-font);
	color:var(--hrknl-slate);
	font-size:.97rem;
	margin:0 0 1.4em;
}

.hrknl-label{
	font-family:var(--hrknl-font);
	display:block;
	font-weight:600;
	font-size:.9rem;
	margin:1.1em 0 .4em;
	color:var(--hrknl-ink);
}
.hrknl-input{
	font-family:var(--hrknl-font);
	width:100%;
	padding:12px 14px;
	border:1px solid var(--hrknl-line);
	border-radius:10px;
	font-size:1rem;
	background:#fff;
	color:var(--hrknl-ink);
}
.hrknl-input::placeholder{color:#9aa3ad;}
.hrknl-hint{display:block;color:var(--hrknl-slate);font-size:.82rem;margin:.35em 0 0;}
.hrknl-input:focus{
	outline:none;
	border-color:var(--hrknl-orange);
	box-shadow:0 0 0 3px rgba(255,106,44,.18);
}
textarea.hrknl-input{min-height:96px;resize:vertical;}

.hrknl-btn{
	font-family:var(--hrknl-font);
	display:block;
	width:100%;
	margin-top:1.6em;
	background:var(--hrknl-orange);
	border:0;
	color:#fff;
	font-weight:600;
	font-size:1.02rem;
	padding:14px 22px;
	border-radius:11px;
	cursor:pointer;
	transition:background .15s ease,transform .05s ease;
}
.hrknl-btn:hover{background:var(--hrknl-orange-deep);}
.hrknl-btn:active{transform:translateY(1px);}
.hrknl-btn:disabled{opacity:.5;cursor:not-allowed;}

/* Meldingen */
.hrknl-error{
	background:#fdeee6;border:1px solid #f6c9b8;color:#a8350f;
	padding:12px 14px;border-radius:10px;margin:0 0 1.2em;font-size:.95rem;
}
.hrknl-warn{
	background:#fff6e5;border:1px solid #f1dca0;color:#8a5a00;
	padding:12px 14px;border-radius:10px;margin:0 0 1.2em;font-size:.95rem;
}

/* Overzicht (stap 2) */
.hrknl-summary{
	list-style:none;padding:0;margin:0 0 1.4em;
	border:1px solid var(--hrknl-line);border-radius:12px;overflow:hidden;
}
.hrknl-summary li{
	display:flex;justify-content:space-between;gap:14px;
	padding:12px 16px;border-bottom:1px solid #eef1f4;font-size:.95rem;
}
.hrknl-summary li:last-child{border-bottom:0;}
.hrknl-summary span{color:var(--hrknl-slate);}

/* Artikelkeuze */
.hrknl-items{
	border:1px solid var(--hrknl-line);border-radius:12px;
	padding:14px 18px;margin:0 0 1.2em;
}
.hrknl-items legend{font-weight:600;padding:0 6px;font-size:.95rem;}
.hrknl-items-heading{font-weight:600;font-size:.95rem;margin:0 0 .5em;}
.hrknl-items-list{margin:0;padding-left:1.2em;color:var(--hrknl-ink);font-size:.97rem;}
.hrknl-items-list li{margin:.2em 0;}
.hrknl-check{display:flex;align-items:center;gap:11px;padding:8px 0;cursor:pointer;font-size:.97rem;}
.hrknl-check input{width:18px;height:18px;accent-color:var(--hrknl-orange);flex:none;}

/* Optionele "Powered by"-regel onder het formulier (opt-in) */
.hrknl-powered{text-align:center;margin:14px 0 0;font-size:.8rem;}
.hrknl-powered a{color:var(--hrknl-slate);text-decoration:none;}
.hrknl-powered a:hover{text-decoration:underline;}

.hrknl-declaration{font-size:.92rem;color:var(--hrknl-slate);margin:0;}
.hrknl-reason-note{color:var(--hrknl-slate);font-size:.95rem;}
.hrknl-actions{margin-top:.2em;}

/* Succes */
.hrknl-success .hrknl-title{color:var(--hrknl-green);}
.hrknl-success{background:var(--hrknl-green-tint);border-color:#bfe5d4;}

/* Honeypot onzichtbaar houden */
.hrknl-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden;}

@media (max-width:600px){
	.hrknl{margin:24px auto;padding:0 14px;}
	.hrknl-form,.hrknl-success{padding:22px;}
}