/* HONOKO Forms — polished frontend UI, independent from the active theme. */
.honoko-form{
  --honoko-form-accent:var(--honoko-accent,#a83df0);
  --honoko-form-accent-strong:#8f2ddd;
  --honoko-form-text:var(--honoko-text,#171a21);
  --honoko-form-muted:var(--honoko-muted,#667085);
  --honoko-form-surface:var(--honoko-surface,#fff);
  --honoko-form-soft:var(--honoko-soft,#f7f7fa);
  --honoko-form-border:var(--honoko-border,#e4e7ec);
  --honoko-form-danger:#d92d20;
  width:min(100%,960px);
  margin-inline:auto;
  padding:clamp(24px,4vw,44px);
  box-sizing:border-box;
  border:1px solid var(--honoko-form-border);
  border-radius:22px;
  background:var(--honoko-form-surface);
  color:var(--honoko-form-text);
  box-shadow:0 16px 50px rgba(15,23,42,.06);
}
.honoko-form,.honoko-form *{box-sizing:border-box}
.honoko-form__title{
  margin:0 0 8px;
  color:inherit;
  font-size:clamp(1.7rem,3vw,2.25rem);
  line-height:1.15;
  letter-spacing:-.025em;
}
.honoko-form__text{
  margin:0 0 26px;
  max-width:68ch;
  color:var(--honoko-form-muted);
  font-size:1rem;
  line-height:1.65;
}
.honoko-form__form{margin:0}
.honoko-form__fields{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:18px;
  row-gap:20px;
}
.honoko-form__field,
.honoko-form__choice{
  min-width:0;
  margin:0;
  padding:0;
  border:0;
}
.honoko-form__field--full,.honoko-form__choice.honoko-form__field--full{grid-column:1/-1}
.honoko-form__field--half,.honoko-form__choice.honoko-form__field--half{grid-column:span 1}
.honoko-form__field>span,
.honoko-form__choice>legend{
  display:block;
  margin:0 0 8px;
  padding:0;
  color:var(--honoko-form-text);
  font-size:.94rem;
  font-weight:700;
  line-height:1.35;
}
.honoko-form__required{color:var(--honoko-form-danger);font-weight:800}

/* Normalize every control so themes cannot leave date/tel/select inputs unstyled. */
.honoko-form .honoko-form__field :where(input[type="text"],input[type="email"],input[type="tel"],input[type="number"],input[type="date"],input[type="url"],select,textarea){
  display:block;
  width:100%;
  max-width:none;
  min-width:0;
  margin:0;
  border:1px solid var(--honoko-form-border);
  border-radius:12px;
  background:var(--honoko-form-surface);
  color:var(--honoko-form-text);
  font:inherit;
  font-size:1rem;
  line-height:1.4;
  box-shadow:0 1px 2px rgba(16,24,40,.03);
  transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease;
  outline:0;
}
.honoko-form .honoko-form__field :where(input[type="text"],input[type="email"],input[type="tel"],input[type="number"],input[type="date"],input[type="url"],select){height:54px;padding:0 15px}
.honoko-form .honoko-form__field textarea{min-height:150px;padding:13px 15px;resize:vertical}
.honoko-form .honoko-form__field select{padding-right:42px;cursor:pointer}
.honoko-form .honoko-form__field :where(input,select,textarea)::placeholder{color:color-mix(in srgb,var(--honoko-form-muted) 78%,transparent);opacity:1}
.honoko-form .honoko-form__field :where(input,select,textarea):hover{border-color:color-mix(in srgb,var(--honoko-form-accent) 32%,var(--honoko-form-border))}
.honoko-form .honoko-form__field :where(input,select,textarea):focus{
  border-color:var(--honoko-form-accent);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--honoko-form-accent) 14%,transparent);
}

/* Radio and checkbox choices. */
.honoko-form__choice{display:grid;gap:9px}
.honoko-form__choice>label,
.honoko-form__choice--single{
  display:flex;
  align-items:flex-start;
  gap:10px;
  width:fit-content;
  max-width:100%;
  color:var(--honoko-form-text);
  cursor:pointer;
}
.honoko-form__choice input[type="radio"],
.honoko-form__choice input[type="checkbox"],
.honoko-form__consent input[type="checkbox"]{
  appearance:none;
  -webkit-appearance:none;
  flex:0 0 19px;
  width:19px;
  height:19px;
  min-width:19px;
  margin:1px 0 0;
  border:1.5px solid color-mix(in srgb,var(--honoko-form-muted) 65%,transparent);
  background:var(--honoko-form-surface);
  display:grid;
  place-content:center;
  transition:.16s ease;
  cursor:pointer;
}
.honoko-form__choice input[type="checkbox"],.honoko-form__consent input[type="checkbox"]{border-radius:5px}
.honoko-form__choice input[type="radio"]{border-radius:50%}
.honoko-form__choice input:checked,.honoko-form__consent input:checked{border-color:var(--honoko-form-accent);background:var(--honoko-form-accent)}
.honoko-form__choice input[type="checkbox"]:checked::after,.honoko-form__consent input[type="checkbox"]:checked::after{
  content:"";width:8px;height:4px;border:solid #fff;border-width:0 0 2px 2px;transform:rotate(-45deg) translate(1px,-1px)
}
.honoko-form__choice input[type="radio"]:checked::after{content:"";width:7px;height:7px;border-radius:50%;background:#fff}
.honoko-form__choice input:focus-visible,.honoko-form__consent input:focus-visible{outline:3px solid color-mix(in srgb,var(--honoko-form-accent) 22%,transparent);outline-offset:2px}

.honoko-form__consent{
  display:flex;
  align-items:flex-start;
  gap:11px;
  margin:22px 0 0;
  padding:14px 16px;
  border:1px solid var(--honoko-form-border);
  border-radius:12px;
  background:color-mix(in srgb,var(--honoko-form-soft) 72%,transparent);
  color:var(--honoko-form-muted);
  font-size:.94rem;
  line-height:1.5;
  cursor:pointer;
}
.honoko-form__consent span{display:block}

.honoko-form .honoko-form__submit{
  appearance:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:150px;
  min-height:52px;
  margin-top:18px;
  padding:0 24px;
  border:1px solid transparent!important;
  border-radius:12px!important;
  background:linear-gradient(135deg,var(--honoko-form-accent),var(--honoko-form-accent-strong))!important;
  color:#fff!important;
  font:inherit;
  font-weight:750;
  line-height:1;
  text-decoration:none;
  box-shadow:0 8px 22px color-mix(in srgb,var(--honoko-form-accent) 24%,transparent);
  cursor:pointer;
  transition:transform .16s ease,box-shadow .16s ease,filter .16s ease;
}
.honoko-form .honoko-form__submit:hover{transform:translateY(-1px);filter:saturate(1.05);box-shadow:0 11px 28px color-mix(in srgb,var(--honoko-form-accent) 30%,transparent)}
.honoko-form .honoko-form__submit:active{transform:translateY(0)}
.honoko-form .honoko-form__submit:focus-visible{outline:3px solid color-mix(in srgb,var(--honoko-form-accent) 28%,transparent);outline-offset:3px}

.honoko-form__notice{
  margin:0 0 22px;
  padding:13px 15px;
  border:1px solid;
  border-radius:11px;
  font-size:.95rem;
  font-weight:600;
  line-height:1.5;
}
.honoko-form__notice--success{background:#ecfdf3;border-color:#abefc6;color:#067647}
.honoko-form__notice--error{background:#fef3f2;border-color:#fecdca;color:#b42318}
.honoko-form__hp{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important}

/* Native HONOKO dark mode. Third-party themes can override the variables above. */
html[data-honoko-theme="dark"] .honoko-form{
  --honoko-form-text:var(--honoko-text,#f4f6f8);
  --honoko-form-muted:var(--honoko-muted,#aab4c0);
  --honoko-form-surface:var(--honoko-surface,#171c24);
  --honoko-form-soft:var(--honoko-soft,#202733);
  --honoko-form-border:var(--honoko-border,#394354);
  box-shadow:0 18px 54px rgba(0,0,0,.18);
}
html[data-honoko-theme="dark"] .honoko-form__notice--success{background:#10291c;border-color:#235c3b;color:#9ce3b4}
html[data-honoko-theme="dark"] .honoko-form__notice--error{background:#321917;border-color:#6a2b26;color:#ffb4ad}

@media(max-width:680px){
  .honoko-form{padding:22px 18px;border-radius:16px}
  .honoko-form__fields{grid-template-columns:1fr;gap:17px}
  .honoko-form__field--half{grid-column:1/-1}
  .honoko-form .honoko-form__submit{width:100%}
}