:root {
    --header-height: 8rem;
}

body.woocommerce-checkout header.wp-block-template-part  {
    background: transparent;
    z-index: 9999;
    position: relative;
} 

.woocommerce-checkout .wp-block-site-logo.is-default-size img {
    width: 320px;
}

.checkout-headergradient {
background: linear-gradient(135deg, rgba(15, 23, 42, 0.98) 0%, rgba(30, 41, 59, 0.98) 100%);
height: 8rem;
position: absolute;
width: 100%;
top: 0;
z-index: 0;
margin-top: 0rem !important;
}

.woocommerce-checkout main {
    margin-top: 8rem !important;
    z-index: 1;
}


.hnd-business-fields-container {
    margin-bottom: 2rem;
}


.wc-block-components-form .wc-block-components-text-input input[type=email], .wc-block-components-form .wc-block-components-text-input input[type=number], .wc-block-components-form .wc-block-components-text-input input[type=password], .wc-block-components-form .wc-block-components-text-input input[type=tel], .wc-block-components-form .wc-block-components-text-input input[type=text], .wc-block-components-form .wc-block-components-text-input input[type=url], .wc-block-components-text-input input[type=email], .wc-block-components-text-input input[type=number], .wc-block-components-text-input input[type=password], .wc-block-components-text-input input[type=tel], .wc-block-components-text-input input[type=text], .wc-block-components-text-input input[type=url]
 {
    
    color: var(--hnd-gray-800);
    background: var(--hnd-white);
    border: var(--hnd-border-width) solid var(--hnd-gray-200);
    border-radius: var(--hnd-radius-md);
    transition: all var(--hnd-transition-base);
    font-family: inherit;
}


.wc-block-components-form .wc-block-components-text-input input[type=email]:focus, .wc-block-components-form .wc-block-components-text-input input[type=number]:focus, .wc-block-components-form .wc-block-components-text-input input[type=password]:focus, .wc-block-components-form .wc-block-components-text-input input[type=tel]:focus, .wc-block-components-form .wc-block-components-text-input input[type=text]:focus, .wc-block-components-form .wc-block-components-text-input input[type=url]:focus, .wc-block-components-text-input input[type=email]:focus, .wc-block-components-text-input input[type=number]:focus, .wc-block-components-text-input input[type=password]:focus, .wc-block-components-text-input input[type=tel]:focus, .wc-block-components-text-input input[type=text]:focus, .wc-block-components-text-input input[type=url]:focus {
    outline: 0;
    border-color: var(--hnd-blue);
    box-shadow: 0 0 0 3px rgba(24, 165, 255, .1);
}

/* === CHECKBOX === */

.wc-block-components-checkbox {
    display: flex;
    align-items: flex-start;
    gap: var(--hnd-space-md);
}

.wc-block-components-checkbox__input {
    width: 20px;
    height: 20px;
    min-width: 20px;
    border: var(--hnd-border-width) solid var(--hnd-gray-200);
    border-radius: var(--hnd-radius-sm);
    cursor: pointer;
    transition: all var(--hnd-transition-base);
    appearance: none;
    background: var(--hnd-white);
    position: relative;
}

.wc-block-components-checkbox__input:checked {
    background: var(--hnd-blue);
    border-color: var(--hnd-blue);
}

.wc-block-components-checkbox__input:checked::after {
    content: '';
    position: absolute;
    left: 6px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.wc-block-components-checkbox__input:focus {
    outline: 0;
    border-color: var(--hnd-blue);
    box-shadow: 0 0 0 3px rgba(24, 165, 255, 0.1);
}

.wc-block-components-checkbox__label {
    color: var(--hnd-gray-700);
    line-height: var(--hnd-leading-normal);
}

.wc-block-components-checkbox__label a {
    color: var(--hnd-blue);
    text-decoration: none;
    transition: color var(--hnd-transition-base);
}

.wc-block-components-checkbox__label a:hover {
    color: var(--hnd-purple);
}

/* === DROPDOWN/SELECT === */

.wc-blocks-components-select__container {
    position: relative;
}

.wc-blocks-components-select__select {
    color: var(--hnd-gray-800);
    background: var(--hnd-white);
    border: var(--hnd-border-width) solid var(--hnd-gray-200);
    border-radius: var(--hnd-radius-md);
    transition: all var(--hnd-transition-base);
    font-family: inherit;
    appearance: none;
    cursor: pointer;
}

.wc-blocks-components-select__select:focus {
    outline: 0;
    border-color: var(--hnd-blue);
    box-shadow: 0 0 0 3px rgba(24, 165, 255, 0.1);
}

.wc-blocks-components-select__expand {
    pointer-events: none;
    fill: var(--hnd-gray-500);
    transition: fill var(--hnd-transition-base);
}

.wc-blocks-components-select__select:focus ~ .wc-blocks-components-select__expand {
    fill: var(--hnd-blue);
}

.wc-blocks-components-select__label {
    color: var(--hnd-gray-700);
}

.wc-blocks-components-select__container:focus, .wc-blocks-components-select__container:hover, .wc-blocks-components-select__container:active {
    outline: 1px solid transparent !important;
}
.wc-blocks-components-select__container:outline .wc-blocks-components-select__select {
    border-color: var(--hnd-blue);
    box-shadow: 0 0 0 3px rgba(24, 165, 255, 0.1);
}

.wc-block-components-textarea:focus {
    background-color: #fff;
    border: 1px solid var(--hnd-blue);
    box-shadow: 0 0 0 3px rgba(24, 165, 255, 0.1);
    color: #2b2d2f;
}

.wp-block-woocommerce-checkout-order-summary-block {
    box-shadow: var(--hnd-shadow-md);
    border-radius: var(--hnd-radius-lg);
    overflow: hidden;
    border: var(--hnd-border-width) solid var(--hnd-gray-200);
    background: var(--hnd-gradient-light) !important;
}

.wc-block-components-totals-coupon__button {
    background-color: var(--hnd-blue);
    color: var(--hnd-white);
    border-radius: var(--hnd-radius-md);
    padding: var(--hnd-space-sm) var(--hnd-space-md);
    font-weight: 600;
    transition: background-color var(--hnd-transition-base), color var(--hnd-transition-base);
}