/* House of Zejd — adjustments for WordPress markup (menus as <li>, admin bar, editor output) */

/* wp_nav_menu prints <li><a>; let the links lay out exactly like the designed <a> lists */
.hz-nav li, .hz-drawer nav li, .hz-footer nav li { display: contents; list-style: none; }
.hz-nav .current-menu-item > a, .hz-nav .current_page_item > a { border-bottom-color: var(--olive); color: var(--olive); }
.hz-header--overlay.is-top .hz-nav .current-menu-item > a { color: var(--gold); border-bottom-color: var(--gold); }

/* logged-in admin bar */
.admin-bar .hz-header--overlay { top: 32px; }
@media (max-width: 782px) { .admin-bar .hz-header--overlay { top: 46px; } }

/* the page content is one Custom HTML block: no extra spacing from WordPress */
main#main > p:empty { display: none; }

/* honeypot field added by the form script */
.hz-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* form error message */
.hz-form-error { margin: var(--space-4) 0 0; color: #a4402c; font-size: 14px; }

/* ===== Contact Form 7: make its markup match the designed forms exactly ===== */
.wpcf7 .hidden-fields-container { display: none; }
.wpcf7 .screen-reader-response { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.hz-xform .wpcf7-form-control-wrap { display: block; }
.hz-xform .wpcf7-form-control-wrap .hz-input { width: 100%; }
.hz-xform .hz-q > .wpcf7-form-control-wrap, .hz-xform .hz-fs > .wpcf7-form-control-wrap { margin-top: 0; }
.hz-xform .wpcf7-checkbox, .hz-xform .wpcf7-radio { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3) var(--space-6); }
.hz-xform .wpcf7-list-item { margin: 0; display: inline-flex; align-items: center; }
.hz-xform .wpcf7-list-item label { display: inline-flex; align-items: center; gap: var(--space-2); font-size: 15px; color: var(--ink); cursor: pointer; }
.hz-xform .wpcf7-list-item input[type="checkbox"], .hz-xform .wpcf7-list-item input[type="radio"] { width: 16px; height: 16px; margin: 0; accent-color: var(--olive); }
.hz-xform .wpcf7-free-text { width: 140px; margin-left: 6px; border: 0; border-bottom: 1px solid var(--line-strong); background: transparent; font: inherit; font-size: 15px; color: var(--ink); padding: 2px 4px; }
.hz-xform .wpcf7-free-text:focus { outline: 2px solid var(--focus); outline-offset: 2px; }
/* single-choice ("exclusive") checkboxes look like the radios they replace */
.hz-xform .wpcf7-exclusive-checkbox input[type="checkbox"] { appearance: none; -webkit-appearance: none; border: 1px solid var(--line-strong); border-radius: 50%; background: var(--surface); display: inline-grid; place-content: center; cursor: pointer; }
.hz-xform .wpcf7-exclusive-checkbox input[type="checkbox"]::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--olive); transform: scale(0); transition: transform .15s; }
.hz-xform .wpcf7-exclusive-checkbox input[type="checkbox"]:checked { border-color: var(--olive); }
.hz-xform .wpcf7-exclusive-checkbox input[type="checkbox"]:checked::before { transform: scale(1); }
.hz-xform .hz-consent .wpcf7-checkbox { display: block; }
.hz-xform .hz-consent .wpcf7-form-control-wrap + .wpcf7-form-control-wrap { margin-top: var(--space-3); }
.hz-xform .hz-consent .wpcf7-list-item label { align-items: flex-start; }
.hz-xform .hz-consent .wpcf7-list-item input { margin-top: 3px; }
.hz-xform .hz-fs > .wpcf7-form-control-wrap + .hz-field { margin-top: var(--space-4); }
.hz-xform input.hz-btn[type="submit"] { width: auto; border: 1px solid transparent; }
.hz-xform .wpcf7-spinner { margin: 0 0 0 var(--space-3); }
/* validation */
.wpcf7-not-valid-tip { display: block; margin-top: 4px; font-size: 12px; color: #a4402c; }
.hz-xform .wpcf7-not-valid.hz-input { border-color: #a4402c; }
/* response message: the designed thank-you box; fields disappear once sent */
.hz-xform .wpcf7-response-output { margin: var(--space-6) 0 0 252px !important; padding: var(--space-4) var(--space-6) !important; border: 1px solid #a4402c !important; color: var(--ink); font-size: 15px; line-height: 24px; }
.hz-xform .wpcf7-response-output:empty { display: none; }
.wpcf7 form.hz-xform.sent .hz-fs, .wpcf7 form.hz-xform.sent .hz-form-actions { display: none; }
.wpcf7 form.hz-xform.sent .wpcf7-response-output { margin: 0 !important; border-color: var(--olive) !important; background: var(--paper); padding: var(--space-6) var(--space-6) var(--space-6) 60px !important; position: relative; }
.wpcf7 form.hz-xform.sent .wpcf7-response-output::before { content: ""; position: absolute; left: var(--space-6); top: var(--space-6); width: 22px; height: 22px; background: no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235d6b4a' stroke-width='1.6'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M7 12.5l3.2 3L17 9'/%3E%3C/svg%3E"); }
@media (max-width: 860px) { .hz-xform .wpcf7-response-output { margin-left: 0 !important; } }

/* newsletter (CF7) keeps its one-row layout */
.hz-subscribe .wpcf7 { min-width: 0; }
.hz-subscribe form.wpcf7-form { display: flex; flex-wrap: wrap; align-items: stretch; }
.hz-subscribe form.wpcf7-form .wpcf7-form-control-wrap { flex: 1; min-width: 0; }
.hz-subscribe form.wpcf7-form .hz-input { width: 100%; height: 48px; border-right: 0; border-radius: 0; }
.hz-subscribe form.wpcf7-form input.hz-btn { height: 48px; }
.hz-subscribe form.wpcf7-form .wpcf7-spinner { display: none; }
.hz-subscribe form.wpcf7-form .wpcf7-response-output { flex-basis: 100%; margin: var(--space-3) 0 0 !important; padding: 0 !important; border: 0 !important; font-size: 14px; color: #a4402c; }
.hz-subscribe form.wpcf7-form.sent .wpcf7-response-output { color: var(--olive); font-weight: 700; }
.hz-subscribe form.wpcf7-form.sent .wpcf7-form-control-wrap, .hz-subscribe form.wpcf7-form.sent input.hz-btn { opacity: .5; pointer-events: none; }

/* CF7 gives textareas rows="10": keep the designed height */
.hz-xform textarea.hz-input { height: 88px; min-height: 88px; }
.hz-xform .wpcf7-list-item input[type="checkbox"], .hz-xform .wpcf7-list-item input[type="radio"] { width: 16px !important; height: 16px !important; flex: none; }

/* footer: the footer row is also a .hz-container — keep its side padding */
.hz-footer .hz-container.hz-footer-top { padding-left: var(--space-8); padding-right: var(--space-8); }
@media (max-width: 860px) { .hz-footer .hz-container.hz-footer-top { padding-left: var(--space-4); padding-right: var(--space-4); } }

/* awards on phones: two-column grid of every medal, no carousel */
@media (max-width: 640px) {
  .hz-awards .hz-awards-nav { display: none; }
  .hz-awards .hz-awards-track { grid-auto-flow: row; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-columns: auto; gap: var(--space-8) var(--space-4); overflow: visible; scroll-snap-type: none; padding-bottom: 0; }
  .hz-awards .hz-award-img { height: 96px; margin-bottom: var(--space-3); }
  .hz-awards .hz-award h3 { font-size: 16px; line-height: 21px; }
  .hz-awards .hz-award-medal { font-size: 9.5px; letter-spacing: .08em; }
  .hz-awards .hz-award-prod { font-size: 12.5px; line-height: 18px; }
}

/* gift tabs: number of tabs comes from the page (--tabs) */
.hz-ctabs { grid-template-columns: repeat(var(--tabs, 4), minmax(0, 1fr)); }
@media (max-width: 860px) { .hz-ctabs { grid-template-columns: repeat(var(--tabs, 4), max-content); } }

/* ordinary pages (privacy policy etc.) */
.hz-plain-page { padding-top: calc(var(--section-y) + 120px); }
.hz-plain-page h1 { margin-bottom: var(--space-8); }
.hz-prose { font-size: 17px; line-height: 29px; }
.hz-prose h2, .hz-prose h3 { font-family: var(--font-display); color: var(--ink); margin: var(--space-8) 0 var(--space-3); }
.hz-prose a { color: var(--olive); text-decoration: underline; }
.hz-prose ul, .hz-prose ol { padding-left: 1.2em; }
.hz-prose img { height: auto; }

/* ---------- client revisions (Oct 2026) ---------- */
/* WordPress prints each photo's real height: let the designed proportions (aspect-ratio / cover) decide instead */
:where(main) img { height: auto; }
/* "House of Zejd" logo (wider and taller than the zejd mark) */
.hz-headrow .hz-logo img { height: 78px; }
.hz-footer-logo { height: 92px; }
@media (max-width: 860px) { .hz-headrow .hz-logo img { height: 50px; } }
/* gift collections: gallery + catalogue buttons side by side */
.hz-cpanel-btns { display: flex; flex-wrap: wrap; gap: var(--space-3); }
/* newsletter: 2 x 2 grid, first name | last name, email | Subscribe */
.hz-subscribe--slim { grid-template-columns: auto minmax(0, 620px); }
.hz-subscribe form.wpcf7-form { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2); }
.hz-subscribe form.wpcf7-form .hz-input { border-right: 1px solid var(--line-strong); }
.hz-subscribe form.wpcf7-form input.hz-btn { width: 100%; }
.hz-subscribe form.wpcf7-form .wpcf7-response-output { grid-column: 1 / -1; }
@media (max-width: 860px) { .hz-subscribe--slim { grid-template-columns: 1fr; } }
@media (max-width: 480px) {
  .hz-subscribe form.wpcf7-form { grid-template-columns: 1fr; }
  .hz-subscribe form.wpcf7-form [data-name] { grid-column: auto; }
}
/* gifts: bigger photos (more room for the photo column, larger main photo and thumbnails) */
.hz-collections .hz-cpanel { grid-template-columns: 4fr 7fr; }
.hz-collections .hz-cpanel-stage { max-width: 540px; }
.hz-collections .hz-cpanel-stage img { padding: 3%; }
.hz-collections .hz-cpanel-thumbs { max-width: 600px; }
.hz-collections .hz-cpanel-thumbs button { flex-basis: 80px; width: 80px; height: 80px; }
@media (max-width: 860px) {
  .hz-collections .hz-cpanel { grid-template-columns: 1fr; }
  .hz-collections .hz-cpanel-stage { max-width: 100%; }
  .hz-collections .hz-cpanel-thumbs button { flex-basis: 64px; width: 64px; height: 64px; }
}
/* gifts: the collection tabs stay at the top while scrolling through the collections (below the header when it shows) */
.hz-collections .hz-ctabs { position: sticky; top: 0; z-index: 20; background: var(--paper); padding-top: var(--space-3); transition: top .3s ease; }
html.hz-header-shown .hz-collections .hz-ctabs { top: var(--hz-header-h, 89px); }
.hz-collections .hz-ctabs.is-stuck { box-shadow: 0 12px 18px -16px rgba(44, 44, 44, .35); }
