/* HU copy and legacy layout with the shared responsive form geometry. */
:root { --clr-primary: #0066b3; --clr-secondary: #ffda00; --color-white: #fff; }
.np-order-form [hidden] { display: none !important; }
.np-order-form .form-group { width: 100%; min-width: 0; }
.np-order-form input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]) { width:100%; box-sizing:border-box; }
.np-order-form fieldset { min-width:0; }
.np-order-form label { max-width:100%; }
.np-order-form .form-table { width:100%; overflow-wrap:anywhere; }
.np-order-form .checkoutBtnFirst { display:block; cursor:pointer; }
.np-order-form .invalid-feedback { display:block; }
.np-order-form .form-group label.error { color:#e00023; }
.np-order-form .check { border-color:#0066b3; }
.np-order-form input:checked + .check::after { border-color:#0066b3; }

.wpcf7-form { --form-accent-color:#0066b3; --form-accent-hover:#005493; --form-check-color:#0066b3; --form-choice-color:#0066b3; --form-border-color:#0066b3; }
.np-order-form .d-flex > p { width:100%; margin:0; }
.np-order-form .gender-option { display:inline-flex; align-items:center; gap:8px; margin-right:18px; }
.np-order-form .gender-option input { appearance:auto; opacity:1; position:static; width:auto; height:auto; margin:0; }
.np-order-form .btn-order { background:#990100; color:#fff !important; }
.np-order-form .btn-order:hover { background:#bb1b1a; }
.np-order-form .summary p { margin:0 0 .5em; padding:0; }
.np-order-form .chckBtn { font-size:22px; }
.np-order-form .wpcf7-list-item { margin:0 0 8px; }
.np-order-form .distributor { display:grid; }
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output { display:block !important; color:#b42318; }
.np-order-form [data-form-step="details"]:not([hidden]) { display:block !important; }

/* Compact HU sidebar: neutral labels and consistent field spacing. */
.registration .np-order-form { gap:12px; font-size:15px; line-height:1.45; }
.registration .np-order-form fieldset { padding:0; margin:0; border:0; }
.registration .np-order-form .form-group { margin:0 0 14px; }
.registration .np-order-form .form-group > p { margin:0; }
.registration .np-order-form .l_left { display:block; margin:0 0 5px; font-size:14px; line-height:1.4; font-weight:400; }
.registration .np-order-form .form-control { height:54px; padding:16px 14px 8px; border-radius:7px; font-size:16px; font-style:normal; font-weight:400; }
.registration .np-order-form .form-control::placeholder { font-family:inherit; font-style:normal; font-size:14px; opacity:1; color:#737b83; }
.registration .np-order-form .np-hu-gender { display:flex; flex-wrap:wrap; align-items:center; gap:8px 20px; margin-bottom:18px; }
.registration .np-order-form .np-hu-gender > p { display:contents; }
.registration .np-order-form .np-hu-gender .l_left { flex:0 0 100%; margin:0; }
.registration .np-order-form .np-hu-gender br { display:none; }
.registration .np-order-form .gender-option { margin:0; font-size:14px; font-weight:400; }
.registration .np-order-form .btn-order { 
/* 	min-height:48px; */
	padding:12px; font-size:18px; line-height:1.25; border-radius:5px; box-shadow:none; }
.registration .np-order-form .orderform > fieldset > .form-group:last-child { margin-bottom:0; }
.registration .np-order-form .np-hu-payment { display:block; width:100%; margin:0; font-size:12px !important; line-height:1.5; font-weight:400; }
.registration .np-order-form > p:has(.np-hu-payment) { margin:0; }
.registration .np-order-form > hr { margin:0; border:0; }
.registration .np-order-form > p:empty { display:none; }

/* Floating labels use the EE states from order-form.css. */
.registration .np-order-form .wpcf7-form-control-wrap { overflow:visible; }
.registration .np-order-form .form-group { overflow:visible; padding-top:0; }
/* Legacy HU sidebar floats collapse the floating-label field containers. */
.side .registration .np-order-form .wpcf7-form-control,
.registration .np-order-form input.np-label,
.registration .np-order-form .wpcf7-list-item-label { float:none !important; }

/* Consent and delivery components from OJ DC HU. */
.wpcf7-form .form-check {
    position: relative;
    max-width: 100%;
}

.wpcf7-form .agreement-agree,
.wpcf7-form .agreement-agree label,
.wpcf7-form .agreement-agree .wpcf7-list-item-label,
.wpcf7-form .agreement-agree :is(.agree-check, input[type="checkbox"]),
.wpcf7-form .legal-more .morelink {
    cursor: pointer;
}
.wpcf7-form .form-check.agree-form-check {
    cursor: pointer;
}
.wpcf7-form .form-check .wpcf7-form-control-wrap[data-name="agree"],
.wpcf7-form .form-check .wpcf7-form-control-wrap[data-name="agree"] :is(.wpcf7-acceptance, .wpcf7-list-item) {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
}

.wpcf7-form .form-check .wpcf7-form-control-wrap[data-name="agree"] label {
    position: relative;
    display: block;
    width: 100%;
    margin: 0;
    padding-left: var(--form-control-offset);
    line-height: 1.3;
}

.wpcf7-form .form-check .wpcf7-form-control-wrap[data-name="agree"] .wpcf7-list-item-label,
.wpcf7-form .form-check .wpcf7-form-control-wrap[data-name="agree"] .wpcf7-list-item-label :is(a, a span) {
    display: inline;
    margin: 0;
    line-height: inherit;
}

.wpcf7-form .form-check .wpcf7-form-control-wrap[data-name="agree"] input[type="checkbox"] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.wpcf7-form :is(.agree-check, .agree-thp-check, .distributor .check) {
    position: absolute;
    top: var(--form-control-top);
    left: 0;
    display: block;
    width: var(--form-control-size);
    height: var(--form-control-size);
    border: 2px solid var(--form-control-color);
    border-radius: 2px;
    background: var(--form-surface);
}

.wpcf7-form :is(.agree-check, .agree-thp-check, .distributor .check)::before,
.wpcf7-form :is(.agree-check, .agree-thp-check, .distributor .check)::after {
    content: '';
    position: absolute;
    height: 4px;
    background: var(--form-choice-color);
    visibility: hidden;
}

.wpcf7-form :is(.agree-check, .agree-thp-check, .distributor .check)::before {
    top: 60%;
    left: 40%;
    width: 70%;
    transform: translate(-50%, -50%) rotate(45deg);
}

.wpcf7-form :is(.agree-check, .agree-thp-check, .distributor .check)::after {
    top: 20%;
    left: 110%;
    width: 150%;
    transform: translate(-50%, -50%) rotate(-45deg);
}

.wpcf7-form input[type="checkbox"]:checked + :is(.agree-check, .agree-thp-check, .distributor .check)::before,
.wpcf7-form input[type="checkbox"]:checked + :is(.agree-check, .agree-thp-check, .distributor .check)::after {
    visibility: visible;
}

.wpcf7-form input[type="checkbox"]:focus-visible + :is(.agree-check, .agree-thp-check, .distributor .check) {
    outline: 2px solid var(--form-control-color);
    outline-offset: 2px;
    box-shadow: 0 0 0 3px var(--form-focus-ring);
}


.wpcf7-form .form-check.agree-form-check,
.wpcf7-form .form-check:has(> .wpcf7-form-control-wrap[data-name="agree"]) {
    position: relative;
    margin-top: var(--form-row-gap);
    padding-left: var(--form-control-offset);
    line-height: 1.3;
}

.wpcf7-form .form-check.agree-form-check > .wpcf7-form-control-wrap[data-name="agree"],
.wpcf7-form .form-check:has(> .wpcf7-form-control-wrap[data-name="agree"]) > .wpcf7-form-control-wrap[data-name="agree"] {
    position: absolute;
    top: 0;
    left: 0;
    width: var(--form-control-size);
    height: var(--form-control-size);
}

.wpcf7-form .form-check.agree-form-check > .wpcf7-form-control-wrap[data-name="agree"] label,
.wpcf7-form .form-check:has(> .wpcf7-form-control-wrap[data-name="agree"]) > .wpcf7-form-control-wrap[data-name="agree"] label,
.wpcf7-form .agree-label-detached > label {
    width: var(--form-control-size);
    height: var(--form-control-size);
    padding: 0;
}

.wpcf7-form .agree-label-detached {
    position: relative;
    padding-left: 0 !important;
    line-height: 1.3;
}

.wpcf7-form .agree-label-detached > label {
    position: absolute !important;
    top: 0;
    left: 0;
    display: block !important;
    margin: 0 !important;
}

.wpcf7-form .agree-label-detached > label .agree-check {
    top: .15em;
}

/* ================================================================
   THP
================================================================ */
.wpcf7-form .form-check-one.agreement-agree {
    position: relative;
    padding-left: var(--form-control-offset);
    color: var(--form-color);
    line-height: 1.5;
}

.wpcf7-form .form-check-one.agreement-agree > .wpcf7-form-control-wrap {
    position: absolute;
    top: var(--form-control-top);
    left: 0;
    width: var(--form-control-size);
    height: var(--form-control-size);
}

.wpcf7-form .form-check-one.agreement-agree :is(
    .wpcf7-form-control,
    .wpcf7-list-item,
    .wpcf7-list-item label
) {
    display: block;
    width: var(--form-control-size);
    height: var(--form-control-size);
    margin: 0;
    padding: 0;
}

.wpcf7-form .form-check-one.agreement-agree .wpcf7-list-item label {
    position: relative;
}

.wpcf7-form .form-check-one.agreement-agree input[type="checkbox"] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.wpcf7-form .form-check-one.agreement-agree .agree-check {
    top: 0;
    left: 0;
}

.wpcf7-form .form-group > .error-agree-label {
    margin: calc(var(--form-control-gap) / 2) 0 0 var(--form-control-offset);
    width: calc(100% - var(--form-control-offset));
    text-align: left;
}

.wpcf7-form .order-legal-agreement a:not(.morelink) {
    color: var(--form-accent-color) !important;
    font-weight: 600;
}

.wpcf7-form .order-legal-agreement a:not(.morelink):is(:hover, :focus-visible) {
    color: var(--form-accent-hover) !important;
}

.wpcf7-form .order-legal-agreement .morelink {
    color: var(--form-accent-color) !important;
    font-weight: 400;
}

.wpcf7-form .form-check-one.agreement-agree .agree-thp-check {
    top: 0;
    left: 0;
}

.wpcf7-form .form-check-one.agreement-agree > .wpcf7-list-item-label {
    display: inline;
    margin: 0;
    color: var(--form-color);
    line-height: inherit;
}

.wpcf7-form .form-check .wpcf7-form-control-wrap[data-name="agree-thp"],
.wpcf7-form .form-check .wpcf7-form-control-wrap[data-name="agree-thp"] :is(.wpcf7-list-item, .wpcf7-list-item-label) {
    display: inline;
    margin: 0;
    padding: 0;
}

.wpcf7-form .form-check .wpcf7-form-control-wrap[data-name="agree-thp"] .wpcf7-list-item,
.wpcf7-form .form-check .wpcf7-form-control-wrap[data-name="agree-thp"] label {
    position: relative;
    display: block;
    width: 100%;
}

.wpcf7-form .form-check .wpcf7-form-control-wrap[data-name="agree-thp"] label {
    padding-left: var(--form-control-offset);
}

.wpcf7-form .form-check .wpcf7-form-control-wrap[data-name="agree-thp"] input[type="checkbox"] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.wpcf7-form .form-check .wpcf7-form-control-wrap[data-name="agree-thp"] .agree-thp-check {
    top: var(--form-control-top);
}

.wpcf7-form .form-check .wpcf7-form-control-wrap[data-name="agree-thp"] label {
    margin: 0;
    line-height: 1.5;
}

.wpcf7-form .wpcf7-form-control-wrap[data-name="agree-thp"] .wpcf7-list-item-label {
    display: inline;
    color: var(--form-color);
    line-height: 1.5;
}

.wpcf7-form .wpcf7-form-control-wrap[data-name="agree-thp"] a {
    text-decoration: underline;
}

.wpcf7-form .accept-all-label {
    position: relative;
    display: block;
    width: 100%;
    margin: 0;
    padding-left: var(--form-control-offset);
    line-height: 1.5;
    cursor: pointer;
}

.wpcf7-form input[name="acceptAll"] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.wpcf7-form .accept-all-label > .agree-check {
    top: var(--form-control-top);
    left: 0;
}

/* ================================================================
   AGREEMENT
================================================================ */
.wpcf7-form .agreements {
    display: none;
}

.wpcf7-form .agreements .btn-check {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.wpcf7-form
.agreements
.form-group.row {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    margin-bottom: var(--form-row-gap);
}

.wpcf7-form
.agreements
.form-group.row
> .col-2 {
    flex: 0 0 var(--agreement-column-width);
    width: var(--agreement-column-width);
    max-width: var(--agreement-column-width);
    margin: 0;
    padding-left: 0;
    padding-right: var(--form-control-gap);
}

.wpcf7-form
.agreements
.form-group.row
> .col {
    flex: 1 1 0;
    min-width: 0;
    margin: 0;
    padding-left: 0;
    padding-right: 0;
    text-align: left;
}

.wpcf7-form .agreements label.btn-agreement {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: var(--agreement-btn-width);
    min-width: var(--agreement-btn-width);
    height: var(--agreement-btn-height);
    margin: 0;
    padding: 0;
    border: 1px solid var(--form-muted-color);
    border-radius: var(--form-radius);
    background-color: var(--clr-gray600);
    background-image: none;
    color: var(--form-color);
    font-size: clamp(14px, 1.15vw, 15px);
    font-weight: 600;
    line-height: 1;
    text-align: center;
    cursor: pointer;
    transition:
        background-color var(--form-transition),
        border-color var(--form-transition),
        color var(--form-transition),
        box-shadow var(--form-transition);
}

.wpcf7-form .agreements label.btn-agreement.active {
    border-color: var(--form-interaction-color);
    background-color: var(--form-interaction-color);
    color: var(--form-surface);
}

.wpcf7-form .agreements label.btn-agreement:not(.active):hover {
    border-color: var(--form-interaction-color);
}

.wpcf7-form .agreements .btn-check:focus-visible + label.btn-agreement,
.wpcf7-form .agreements .btn-check:focus + label.btn-agreement {
    outline: 2px solid var(--form-control-color);
    outline-offset: 2px;
    box-shadow: 0 0 0 3px var(--form-focus-ring);
}

.wpcf7-form .summary .shipping-options {
    margin: 10px 0;
}

.wpcf7-form .summary .shipping-option {
    display: flex;
    align-items: flex-start;
    gap: var(--form-control-gap);
    width: auto;
    margin: 0 0 var(--form-control-gap);
    color: var(--form-color);
    font-size: clamp(15px, 1.2vw, 16px);
    line-height: 1.5;
}

.wpcf7-form .summary .shipping-option input[type="checkbox"] {
    width: var(--form-control-size);
    height: var(--form-control-size);
    margin-top: calc(var(--form-control-gap) / 4);
}

.wpcf7-form .summary .shipping-option.active span {
    font-weight: 600;
}

.wpcf7-form .summary .distributor .wpcf7-list-item {
    display: block;
    margin: var(--form-control-gap) 0;
}

.wpcf7-form .summary .distributor label {
    position: relative;
    display: block;
    min-height: var(--form-control-size);
    margin: 0;
    padding-left: var(--form-control-offset);
    color: var(--form-color);
    line-height: 1.5;
    cursor: pointer;
}

.wpcf7-form .summary .distributor input[type="checkbox"] {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

.wpcf7-form .summary .distributor .check {
    top: var(--form-control-top);
}


.np-order-form .gender-option input { clip:auto; clip-path:none; overflow:visible; accent-color:#0066b3; }

/* Align consent controls and radio options within the HU sidebar. */
.registration .np-order-form .np-hu-legal,
.registration .np-order-form .np-hu-legal .wpcf7-list-item { margin:0; padding:0; }
.registration .np-order-form .np-hu-legal .wpcf7-form-control-wrap,
.registration .np-order-form .np-hu-legal .wpcf7-acceptance,
.registration .np-order-form .np-hu-legal .wpcf7-list-item { display:block; width:100%; }
.registration .np-order-form .np-hu-legal label { position:relative; display:block; width:100%; margin:0; padding:0 0 0 var(--form-control-offset); line-height:1.5; }
.registration .np-order-form .np-hu-legal input[type="checkbox"] { position:absolute; width:1px; height:1px; margin:0; clip:rect(0,0,0,0); clip-path:inset(50%); }
.registration .np-order-form .np-hu-legal .wpcf7-list-item-label { display:inline; margin:0; padding:0; }
.registration .np-order-form .np-hu-gender { display:grid; grid-template-columns:max-content max-content; justify-content:start; }
.registration .np-order-form .np-hu-gender .l_left { grid-column:1 / -1; }
.registration .np-order-form .np-hu-gender .gender-option { display:inline-flex; width:auto; }

/* Order confirmation: centered content and a responsive product image. */
.np-hu-confirmation { padding:clamp(24px,5vw,64px) 0; background:#f3f6f8; }
.np-hu-confirmation-card { max-width:860px; margin:0 auto; padding:clamp(20px,4vw,48px); background:#fff;  border-radius:8px; box-shadow:0 8px 30px rgba(0,0,0,.06); text-align:center; }
.np-hu-confirmation-card h2 { margin:0 0 16px; color:#0066b3; font-size:clamp(26px,3vw,36px); font-weight:600; line-height:1.2; }
.np-hu-confirmation-card p { margin:0 0 24px; font-size:clamp(16px,1.5vw,19px); line-height:1.6; }
.np-hu-confirmation-card img { display:block; width:auto; max-width:100%; height:auto; max-height:540px; object-fit:contain; margin:0 auto; }

.registration .np-order-form .np-hu-legal-toggle { display:inline; width:auto; min-height:0; margin:0; padding:0; border:0; background:none; color:#0066b3; font:inherit; text-decoration:underline; cursor:pointer; }
.registration .np-order-form .np-hu-legal-toggle:focus-visible { outline:2px solid #0066b3; outline-offset:3px; }
