/* hadjikyriakos-core — contact / quote forms + dialog. Uses theme tokens (--hk-*) with safe fallbacks. */

.hk-form-wrap { --hkf-ink: var(--hk-ink, #16181D); --hkf-muted: var(--hk-muted, #6B7280); --hkf-line: var(--hk-line, #E3E6EB); --hkf-surface: var(--hk-surface, #F5F6F8); --hkf-danger: var(--hk-sale, #DC2626); --hkf-accent: var(--hk-accent, #F2A900); --hkf-radius: var(--hk-radius, 16px); --hkf-radius-sm: var(--hk-radius-sm, 8px); --hkf-ease: var(--hk-ease-fast, 160ms cubic-bezier(.2,.7,.2,1));
  position: relative; max-width: 720px; color: var(--hkf-ink); scroll-margin-top: calc(var(--hk-header-h, 72px) + 96px); }

.hk-form { display: grid; gap: 1.5rem; }
.hk-form__grid { display: grid; gap: 1.125rem 1rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 640px) {
  .hk-form__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hk-form__field[data-field="message"] { grid-column: 1 / -1; }
}

.hk-form__field { display: grid; gap: .45rem; align-content: start; }
.hk-form__label { font-size: var(--wp--preset--font-size--sm, .9375rem); font-weight: 600; color: var(--hkf-ink); line-height: 1.3; }
.hk-form__optional { font-weight: 450; color: var(--hkf-muted); }
.hk-form__hint { margin: -.15rem 0 0; font-size: var(--wp--preset--font-size--xs, .8125rem); color: var(--hkf-muted); }

.hk-form :where(input[type=text], input[type=email], input[type=tel], textarea) {
  width: 100%; min-height: 50px; padding: .8rem 1rem; font: inherit; font-size: 1rem; color: var(--hkf-ink);
  background: #fff; border: 1px solid var(--hkf-line); border-radius: var(--hk-radius-md, 12px);
  box-shadow: inset 0 1px 2px rgba(22,24,29,.03);
  transition: border-color var(--hkf-ease), box-shadow var(--hkf-ease), background-color var(--hkf-ease);
}
.hk-form textarea { min-height: 148px; resize: vertical; line-height: 1.55; }
.hk-form :where(input, textarea):hover { border-color: #C9CED6; }
.hk-form :where(input, textarea):focus { outline: none; border-color: var(--hkf-ink); box-shadow: 0 0 0 4px var(--hk-accent-soft, #FFF6DD); }
.hk-form__field.is-invalid :where(input, textarea) { border-color: var(--hkf-danger); background: #FFFBFB; }
.hk-form__field.is-invalid :where(input, textarea):focus { box-shadow: 0 0 0 4px rgba(220, 38, 38, .12); }

.hk-form__error { display: flex; align-items: flex-start; gap: .4rem; margin: 0; font-size: var(--wp--preset--font-size--xs, .8125rem); font-weight: 550; color: #B91C1C; line-height: 1.4; }
.hk-form__error[hidden] { display: none; }
.hk-form__error-icon { width: 16px; height: 16px; flex: none; margin-top: 1px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }

.hk-form__alert { padding: .85rem 1rem; border-radius: var(--hk-radius-md, 12px); background: #FEF2F2; color: #991B1B; font-size: var(--wp--preset--font-size--sm, .9375rem); font-weight: 550; border: 1px solid #FECACA; }
.hk-form__alert[hidden] { display: none; }

.hk-form__trap { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.hk-form__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; }
.hk-form__submit { position: relative; min-height: 52px; padding-inline: 2rem; font-size: var(--wp--preset--font-size--sm, .9375rem); }
.hk-form__submit:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(242, 169, 0, .28); }
.hk-form__submit[aria-busy="true"] { pointer-events: none; }
.hk-form__submit[aria-busy="true"] .hk-form__submit-label { opacity: 0; }
.hk-form__spinner { position: absolute; inset: 0; margin: auto; width: 20px; height: 20px; border-radius: 50%; border: 2px solid rgba(22,24,29,.25); border-top-color: var(--hkf-ink); opacity: 0; }
.hk-form__submit[aria-busy="true"] .hk-form__spinner { opacity: 1; animation: hkc-spin .7s linear infinite; }
@keyframes hkc-spin { to { transform: rotate(360deg); } }
.hk-form__privacy { flex: 1 1 220px; margin: 0; font-size: var(--wp--preset--font-size--xs, .8125rem); color: var(--hkf-muted); line-height: 1.5; }
.hk-form__privacy a { color: inherit; }

/* Product being enquired about */
.hk-form__product { display: flex; align-items: center; gap: 1rem; padding: .75rem; background: var(--hkf-surface); border-radius: var(--hkf-radius); }
.hk-form__product-img { width: 72px; height: 72px; flex: none; object-fit: contain; background: #fff; border-radius: var(--hk-radius-md, 12px); padding: 6px; mix-blend-mode: multiply; }
.hk-form__product-body { display: grid; gap: .15rem; min-width: 0; }
.hk-form__product-label { font-size: 11px; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; color: var(--hk-accent-strong, #D99500); }
.hk-form__product-name { font-weight: 600; line-height: 1.35; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.hk-form__product-sku { font-size: var(--wp--preset--font-size--xs, .8125rem); color: var(--hkf-muted); }

/* Success */
.hk-form__success { display: grid; justify-items: start; gap: .5rem; padding: clamp(1.5rem, 4vw, 2.5rem); background: var(--hkf-surface); border-radius: var(--hk-radius-xl, 24px); animation: hkc-rise .42s cubic-bezier(.2,.7,.2,1); }
.hk-form__success[hidden] { display: none; }
.hk-form__success:focus { outline: none; }
.hk-form__success-icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: var(--hkf-accent); margin-bottom: .5rem; }
.hk-form__success-icon svg { width: 24px; height: 24px; fill: none; stroke: var(--hkf-ink); stroke-width: 2.25; stroke-linecap: round; stroke-linejoin: round; }
.hk-form__success-title { margin: 0; font-family: var(--wp--preset--font-family--display, inherit); font-size: var(--wp--preset--font-size--lg, 1.375rem); font-weight: 650; letter-spacing: -.01em; }
.hk-form__success-text { margin: 0; color: var(--hk-ink-2, #2A2E37); max-width: 46ch; }
@keyframes hkc-rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* Dialog (quote) */
.hk-dialog { width: min(600px, calc(100vw - 2rem)); max-height: calc(100dvh - 2rem); padding: 0; border: 0; border-radius: var(--hk-radius-xl, 24px); background: #fff; color: var(--hk-ink, #16181D); box-shadow: var(--hk-shadow-lg, 0 24px 48px rgba(22,24,29,.12)); overflow: auto; overscroll-behavior: contain; }
.hk-dialog::backdrop { background: rgba(22, 24, 29, .42); backdrop-filter: blur(6px); }
.hk-dialog[open] { animation: hkc-dialog-in .26s cubic-bezier(.2,.7,.2,1); }
.hk-dialog[open]::backdrop { animation: hkc-fade .26s ease; }
@keyframes hkc-dialog-in { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes hkc-fade { from { opacity: 0; } to { opacity: 1; } }
.hk-dialog__head { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.25rem 1.25rem 1rem 1.75rem; background: rgba(255,255,255,.92); backdrop-filter: blur(10px); }
.hk-dialog__title { margin: 0; font-family: var(--wp--preset--font-family--display, inherit); font-size: var(--wp--preset--font-size--lg, 1.375rem); font-weight: 650; letter-spacing: -.015em; }
.hk-dialog__close { display: grid; place-items: center; width: 44px; height: 44px; flex: none; border: 0; border-radius: 50%; background: var(--hk-surface, #F5F6F8); color: inherit; cursor: pointer; transition: background-color var(--hk-ease-fast, .16s); }
.hk-dialog__close:hover { background: var(--hk-surface-2, #ECEEF2); }
.hk-dialog__close svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.hk-dialog .hk-form-wrap { padding: 0 1.75rem 1.75rem; }
@media (max-width: 599px) {
  .hk-dialog { width: 100vw; max-width: 100vw; max-height: 92dvh; margin: auto 0 0; border-radius: var(--hk-radius-xl, 24px) var(--hk-radius-xl, 24px) 0 0; }
  .hk-dialog[open] { animation-name: hkc-sheet-in; }
  @keyframes hkc-sheet-in { from { transform: translateY(40px); opacity: 0; } to { transform: none; opacity: 1; } }
  .hk-dialog__head { padding: 1rem 1rem .75rem 1.25rem; }
  .hk-dialog .hk-form-wrap { padding: 0 1.25rem 1.5rem; }
}
html:has(.hk-dialog[open]) { overflow: hidden; }

@media (prefers-reduced-motion: reduce) {
  .hk-form__success, .hk-dialog[open], .hk-dialog[open]::backdrop { animation: none; }
  .hk-form__submit[aria-busy="true"] .hk-form__spinner { animation-duration: 1.6s; }
}