/* ============================================================
   DAMIAN PHILPOTT — BOOKNETIC PACKAGE FLOW
   Isolated styling for Packages add-on only.
   Targets the real package step IDs used by Booknetic Packages:
   - packages_information
   - packages_confirm_details
   Does NOT depend on a Booknetic theme ID.
   ============================================================ */

/* ---------- PACKAGE INFORMATION STEP ---------- */
.booknetic_appointment_container_body [data-step-id="packages_information"] {
    background: #000 !important;
    color: #fff !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] > [id^="booknetic_theme_"] {
    width: 100% !important;
    max-width: 100% !important;
    background: #000 !important;
    color: #fff !important;
    box-sizing: border-box !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] .form-row {
    display: flex !important;
    flex-wrap: wrap !important;
    margin-left: -8px !important;
    margin-right: -8px !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] .form-group {
    position: relative !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    margin-bottom: 18px !important;
    box-sizing: border-box !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] .form-group.col-md-6 {
    width: 50% !important;
    max-width: 50% !important;
    flex: 0 0 50% !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] .form-group.col-md-12 {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] .form-group label {
    display: block !important;
    margin: 0 0 7px !important;
    color: #FFD700 !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 18px !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] .form-group label[data-required="true"]::after {
    color: #FFD700 !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] input.form-control,
.booknetic_appointment_container_body [data-step-id="packages_information"] input[type="text"],
.booknetic_appointment_container_body [data-step-id="packages_information"] input[type="tel"],
.booknetic_appointment_container_body [data-step-id="packages_information"] input[type="email"] {
    width: 100% !important;
    max-width: 100% !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 14px !important;
    background-color: #080808 !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    border: 1px solid #333 !important;
    border-radius: 2px !important;
    box-shadow: none !important;
    outline: none !important;
    caret-color: #FFD700 !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 44px !important;
    box-sizing: border-box !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] input.form-control:focus,
.booknetic_appointment_container_body [data-step-id="packages_information"] input[type="text"]:focus,
.booknetic_appointment_container_body [data-step-id="packages_information"] input[type="tel"]:focus,
.booknetic_appointment_container_body [data-step-id="packages_information"] input[type="email"]:focus {
    background-color: #050505 !important;
    border-color: #FFD700 !important;
    box-shadow: 0 0 0 1px rgba(255,215,0,.08) !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] input[disabled] {
    background-color: #0A0A0A !important;
    color: #aaa !important;
    -webkit-text-fill-color: #aaa !important;
    border-color: #2a2a2a !important;
    opacity: 1 !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] input::placeholder {
    color: #777 !important;
    -webkit-text-fill-color: #777 !important;
    opacity: 1 !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] input.booknetic_input_error {
    border-color: #A84A4A !important;
}

/* Autofill */
.booknetic_appointment_container_body [data-step-id="packages_information"] input:-webkit-autofill,
.booknetic_appointment_container_body [data-step-id="packages_information"] input:-webkit-autofill:hover,
.booknetic_appointment_container_body [data-step-id="packages_information"] input:-webkit-autofill:focus {
    -webkit-text-fill-color: #fff !important;
    -webkit-box-shadow: 0 0 0 1000px #080808 inset !important;
    box-shadow: 0 0 0 1000px #080808 inset !important;
    caret-color: #FFD700 !important;
    border-color: #333 !important;
}

/* Email lookup clear/loading icons */
.booknetic_appointment_container_body [data-step-id="packages_information"] .form-group[data-bkntc-customer-info="true"] {
    position: relative !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] .bkntc_input_identifier_clear {
    position: absolute !important;
    top: 31px !important;
    right: 18px !important;
    width: 20px !important;
    height: 20px !important;
    z-index: 20 !important;
    padding: 0 !important;
    margin: 0 !important;
    background: #111 !important;
    border: 1px solid #444 !important;
    border-radius: 2px !important;
    box-shadow: none !important;
    object-fit: contain !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] .bkntc_input_identifier_loading {
    position: absolute !important;
    top: 32px !important;
    right: 19px !important;
    width: 18px !important;
    height: 18px !important;
    z-index: 19 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* Phone / intl-tel-input */
.booknetic_appointment_container_body [data-step-id="packages_information"] .bkntc_input_phone-container,
.booknetic_appointment_container_body [data-step-id="packages_information"] .iti {
    width: 100% !important;
    max-width: 100% !important;
    background: #080808 !important;
    color: #fff !important;
    box-sizing: border-box !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] .iti__selected-country,
.booknetic_appointment_container_body [data-step-id="packages_information"] .iti__selected-flag {
    background: #080808 !important;
    color: #fff !important;
    border: 0 !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] .iti__selected-country:hover,
.booknetic_appointment_container_body [data-step-id="packages_information"] .iti__selected-flag:hover {
    background: #111 !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] .iti__country-list,
.booknetic_appointment_container_body [data-step-id="packages_information"] .iti__dropdown-content {
    background: #080808 !important;
    color: #fff !important;
    border: 1px solid #333 !important;
    box-shadow: 0 10px 30px rgba(0,0,0,.35) !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] .iti__country:hover,
.booknetic_appointment_container_body [data-step-id="packages_information"] .iti__country.iti__highlight {
    background: #151515 !important;
}

/* Existing-customer information message */
.booknetic_appointment_container_body [data-step-id="packages_information"] .bkntc-information-step-info-container {
    width: 100% !important;
    margin: 2px 0 0 !important;
    padding: 16px 18px !important;
    background: #050505 !important;
    color: #d0d0d0 !important;
    border: 1px solid #303030 !important;
    border-left: 2px solid #FFD700 !important;
    border-radius: 2px !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] .bkntc-information-step-info-container .form-group {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] .bkntc-information-step-info-container label {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 0 8px !important;
    color: #FFD700 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] .bkntc-information-step-info-container label span {
    color: #FFD700 !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] .bkntc-information-step-info-container .form-group > div {
    color: #d0d0d0 !important;
    font-size: 12px !important;
    line-height: 19px !important;
}

/* Social login buttons, if enabled */
.booknetic_appointment_container_body [data-step-id="packages_information"] .booknetic-login-buttons-container {
    margin-bottom: 16px !important;
}

.booknetic_appointment_container_body [data-step-id="packages_information"] .gsi-material-button {
    background: #080808 !important;
    color: #fff !important;
    border: 1px solid #333 !important;
    border-radius: 2px !important;
    box-shadow: none !important;
}

/* ---------- PACKAGE CONFIRMATION STEP ---------- */
/*
   This section is intentionally more forceful than the Information step.
   Booknetic Packages reuses the normal confirmation markup, but the normal
   confirmation layout rules in the master stylesheet are tied to the
   standard confirm_details step.  The package step therefore needs its own
   complete layout reset.
*/

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    background: #000 !important;
    color: #fff !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] > [id^="booknetic_theme_"] {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    background: #000 !important;
    color: #fff !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_container {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #000 !important;
    color: #fff !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

/* Package name strip */
.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_date_time {
    position: relative !important;
    display: block !important;
    width: calc(100% - 40px) !important;
    max-width: calc(100% - 40px) !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 46px !important;
    margin: 16px 20px 14px !important;
    padding: 13px 16px !important;
    background: #050505 !important;
    color: #fff !important;
    border: 1px solid #303030 !important;
    border-left: 2px solid #FFD700 !important;
    border-radius: 2px !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_date_time > div {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
    width: 100% !important;
    min-width: 0 !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_date_time span {
    position: static !important;
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #fff !important;
    font-size: 13px !important;
    line-height: 20px !important;
    white-space: normal !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_date_time .booknetic_text_primary {
    color: #FFD700 !important;
    font-weight: 600 !important;
}

/* Main two-column confirmation area */
.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_step_body {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 150px !important;
    align-items: start !important;
    gap: 18px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 20px 18px !important;
    background: #000 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_sum_body,
.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_deposit_body {
    position: relative !important;
    float: none !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    color: #fff !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

/* Summary card */
.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_sum_body > .booknetic_portlet,
.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_portlet_cols {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #050505 !important;
    color: #fff !important;
    border: 1px solid #303030 !important;
    border-radius: 2px !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_portlet_content {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 13px 16px 8px !important;
    background: transparent !important;
    color: #fff !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_prices_box {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_details {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 18px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: 8px 0 !important;
    border: 0 !important;
    border-bottom: 1px solid #202020 !important;
    box-sizing: border-box !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_details:last-child {
    border-bottom: 0 !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_details_title,
.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_details_price {
    position: static !important;
    float: none !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 20px !important;
    box-sizing: border-box !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_details_title {
    flex: 1 1 auto !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-align: left !important;
    overflow-wrap: anywhere !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_details_price {
    flex: 0 0 auto !important;
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-align: right !important;
    white-space: nowrap !important;
    visibility: visible !important;
    opacity: 1 !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] [data-price-id="discount"] .booknetic_confirm_details_title,
.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] [data-price-id="discount"] .booknetic_confirm_details_price {
    color: #FFD700 !important;
}

/* The package template inserts an empty footer here. Hide it completely so
   it cannot create the large blank area visible in the old layout. */
.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_sum_body .booknetic_panel_footer {
    display: none !important;
    position: static !important;
    width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
}

/* Total */
.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_sum_price {
    position: relative !important;
    float: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 50px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    background: #080808 !important;
    color: #fff !important;
    border: 0 !important;
    border-top: 1px solid #303030 !important;
    box-sizing: border-box !important;
    visibility: visible !important;
    opacity: 1 !important;
    overflow: visible !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_sum_price > div:first-child {
    color: #fff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 20px !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_sum_price .booknetic_sum_price {
    position: static !important;
    float: none !important;
    display: block !important;
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    color: #FFD700 !important;
    -webkit-text-fill-color: #FFD700 !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 20px !important;
    text-align: right !important;
    white-space: nowrap !important;
    visibility: visible !important;
    opacity: 1 !important;
    overflow: visible !important;
}

/* Payment column */
.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_deposit_body > .booknetic_payment_methods_container,
.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_payment_methods_container {
    position: relative !important;
    float: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 104px !important;
    margin: 0 !important;
    padding: 12px !important;
    background: #050505 !important;
    color: #fff !important;
    border: 1px solid #303030 !important;
    border-radius: 2px !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_payment_methods {
    position: relative !important;
    float: none !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_payment_method {
    position: relative !important;
    float: none !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 118px !important;
    width: 118px !important;
    max-width: 118px !important;
    min-width: 118px !important;
    height: 76px !important;
    min-height: 76px !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    background: #080808 !important;
    color: #FFD700 !important;
    border: 1px solid #3A3A3A !important;
    border-radius: 3px !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
    text-align: center !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_payment_method:hover,
.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_payment_method.booknetic_payment_method_selected {
    background: #0D0D0D !important;
    color: #FFD700 !important;
    border-color: #FFD700 !important;
    box-shadow: none !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_payment_method img {
    position: static !important;
    display: block !important;
    width: auto !important;
    max-width: 30px !important;
    height: auto !important;
    max-height: 24px !important;
    margin: 0 0 7px !important;
    padding: 0 !important;
    object-fit: contain !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_payment_method.booknetic_payment_method_selected img {
    filter: brightness(0) saturate(100%) invert(84%) sepia(100%) saturate(1568%) hue-rotate(359deg) brightness(104%) contrast(104%) !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_payment_method span {
    position: static !important;
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #FFD700 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 16px !important;
    text-align: center !important;
    white-space: normal !important;
}

.booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_payment_methods_footer {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
}

/* ---------- RESPONSIVE ---------- */
@media only screen and (max-width: 767px) {
    .booknetic_appointment_container_body [data-step-id="packages_information"] .form-row {
        display: block !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .booknetic_appointment_container_body [data-step-id="packages_information"] .form-group,
    .booknetic_appointment_container_body [data-step-id="packages_information"] .form-group.col-md-6,
    .booknetic_appointment_container_body [data-step-id="packages_information"] .form-group.col-md-12 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .booknetic_appointment_container_body [data-step-id="packages_information"] input.form-control,
    .booknetic_appointment_container_body [data-step-id="packages_information"] input[type="text"],
    .booknetic_appointment_container_body [data-step-id="packages_information"] input[type="tel"],
    .booknetic_appointment_container_body [data-step-id="packages_information"] input[type="email"] {
        font-size: 16px !important;
    }

    .booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_date_time {
        width: calc(100% - 28px) !important;
        max-width: calc(100% - 28px) !important;
        margin: 14px 14px 12px !important;
        padding: 12px 14px !important;
    }

    .booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_step_body {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 14px 14px !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }

    .booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_sum_body,
    .booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_deposit_body {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_details {
        gap: 10px !important;
    }

    .booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_details_title {
        font-size: 12px !important;
    }

    .booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_confirm_details_price {
        font-size: 12px !important;
    }

    .booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_payment_methods_container {
        min-height: 0 !important;
        padding: 12px !important;
    }

    .booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_payment_method {
        flex: 1 1 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: 64px !important;
        min-height: 64px !important;
        flex-direction: row !important;
        gap: 9px !important;
    }

    .booknetic_appointment_container_body [data-step-id="packages_confirm_details"] .booknetic_payment_method img {
        margin: 0 !important;
        max-width: 26px !important;
        max-height: 22px !important;
    }
}


/* ============================================================
   PACKAGE INFORMATION — GENDER FIELD
   ------------------------------------------------------------
   Safe visual treatment for the custom package gender controls.
   No booking-container height, footer or scrolling changes.
   ============================================================ */

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-bpg-package-gender {
    width: 100% !important;
    margin: 0 0 18px !important;
    box-sizing: border-box !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-bpg-package-gender > label,
.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-bpg-package-describe-wrap > label {
    display: block !important;
    margin: 0 0 7px !important;
    color: #FFD700 !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 18px !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-bpg-package-select {
    width: 100% !important;
    height: 46px !important;
    min-height: 46px !important;
    padding: 0 42px 0 14px !important;

    appearance: none !important;
    -webkit-appearance: none !important;

    background-color: #080808 !important;
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 9'%3E%3Cpath d='M2 2.2 7 7l5-4.8' fill='none' stroke='%23FFD700' stroke-width='1.35' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 15px center !important;
    background-size: 11px 7px !important;

    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;

    border: 1px solid #333333 !important;
    border-radius: 2px !important;
    box-shadow: none !important;
    outline: none !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 400 !important;

    box-sizing: border-box !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-bpg-package-select:focus {
    background-color: #050505 !important;
    border-color: #FFD700 !important;
    box-shadow: 0 0 0 1px rgba(255, 215, 0, .08) !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-bpg-package-select option {
    background: #080808 !important;
    color: #FFFFFF !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-bpg-package-describe-wrap {
    width: 100% !important;
    margin: -4px 0 18px !important;
    box-sizing: border-box !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
#dp_booknetic_package_gender_describe {
    width: 100% !important;
    max-width: 100% !important;
    height: 46px !important;
    min-height: 46px !important;

    padding: 0 14px !important;

    background: #080808 !important;
    background-color: #080808 !important;

    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;

    border: 1px solid #333333 !important;
    border-radius: 2px !important;

    box-shadow: none !important;
    outline: none !important;

    caret-color: #FFD700 !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 12px !important;

    box-sizing: border-box !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
#dp_booknetic_package_gender_describe:focus {
    background: #050505 !important;
    border-color: #FFD700 !important;
    box-shadow: 0 0 0 1px rgba(255, 215, 0, .08) !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
#dp_booknetic_package_gender_describe::placeholder {
    color: #777777 !important;
    -webkit-text-fill-color: #777777 !important;
    opacity: 1 !important;
}

@media only screen and (max-width: 767px) {

    .booknetic_appointment_container_body
    [data-step-id="packages_information"]
    .dp-bpg-package-select,

    .booknetic_appointment_container_body
    [data-step-id="packages_information"]
    #dp_booknetic_package_gender_describe {
        font-size: 16px !important;
    }
}


/* ============================================================
   v1.0.1 — PACKAGE INFORMATION FORM POLISH
   ------------------------------------------------------------
   Exact package-flow selectors/classes only.
   Does NOT target normal appointment [data-step-id="information"].
   Does NOT alter booking container heights or footer positioning.
   ============================================================ */

.booknetic_appointment_container_body
[data-step-id="packages_information"].dp-package-info-enhanced {
    color: #FFFFFF !important;
}


/* ------------------------------------------------------------
   EDITORIAL SECTION HEADINGS
   ------------------------------------------------------------ */

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-section-heading {
    display: flex !important;
    align-items: center !important;

    gap: 12px !important;

    width: 100% !important;

    margin: 2px 0 13px !important;

    color: #FFD700 !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;

    letter-spacing: .17em !important;
    text-transform: uppercase !important;

    box-sizing: border-box !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-section-heading::after {
    content: "" !important;

    flex: 1 1 auto !important;

    height: 1px !important;

    background: #222222 !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-details-heading {
    margin-top: 5px !important;
}


/* ------------------------------------------------------------
   FIELD SPACING / LABELS
   ------------------------------------------------------------ */

.booknetic_appointment_container_body
[data-step-id="packages_information"]
#booknetic_theme_8
.form-group {
    position: relative !important;

    margin-bottom: 14px !important;

    box-sizing: border-box !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
#booknetic_theme_8
.form-group
> label {
    display: block !important;

    margin: 0 0 7px !important;

    color: #FFD700 !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
}


/* ------------------------------------------------------------
   INPUTS
   ------------------------------------------------------------ */

.booknetic_appointment_container_body
[data-step-id="packages_information"]
#booknetic_theme_8
.form-control,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
#booknetic_theme_8
input[type="text"],

.booknetic_appointment_container_body
[data-step-id="packages_information"]
#booknetic_theme_8
input[type="email"],

.booknetic_appointment_container_body
[data-step-id="packages_information"]
#booknetic_theme_8
input[type="tel"] {
    width: 100% !important;

    min-height: 48px !important;
    height: 48px !important;

    padding: 0 13px !important;

    background: #090A0B !important;
    background-color: #090A0B !important;

    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;

    border: 1px solid #34393D !important;
    border-radius: 3px !important;

    box-shadow: none !important;
    outline: none !important;

    caret-color: #FFD700 !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 400 !important;

    box-sizing: border-box !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
#booknetic_theme_8
.form-control:focus,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
#booknetic_theme_8
input[type="text"]:focus,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
#booknetic_theme_8
input[type="email"]:focus,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
#booknetic_theme_8
input[type="tel"]:focus {
    background: #060708 !important;
    background-color: #060708 !important;

    border-color: #FFD700 !important;

    box-shadow:
        0 0 0 1px rgba(255, 215, 0, .07) !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
#booknetic_theme_8
input::placeholder {
    color: #73777B !important;
    -webkit-text-fill-color: #73777B !important;

    opacity: 1 !important;
}


/* ------------------------------------------------------------
   FIELD ICONS
   ------------------------------------------------------------ */

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-email
input,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-confirm-email
input,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-name
input,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-surname
input {
    padding-left: 46px !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-email
input {
    padding-right: 42px !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-email::after,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-confirm-email::after,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-name::after,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-surname::after {
    content: "" !important;

    position: absolute !important;

    top: 35px !important;
    left: 14px !important;

    width: 17px !important;
    height: 17px !important;

    transform: translateY(-50%) !important;

    opacity: .8 !important;

    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;

    pointer-events: none !important;

    z-index: 4 !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-email::after,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-confirm-email::after {
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Crect x='2.7' y='4.2' width='14.6' height='11.6' rx='1.3' fill='none' stroke='%23B9B9B9' stroke-width='1.35'/%3E%3Cpath d='m3.7 5.5 6.3 5 6.3-5' fill='none' stroke='%23B9B9B9' stroke-width='1.35' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-name::after,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-surname::after {
    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='6.3' r='3.1' fill='none' stroke='%23B9B9B9' stroke-width='1.35'/%3E%3Cpath d='M4.3 16.2c.6-3 2.6-4.7 5.7-4.7s5.1 1.7 5.7 4.7' fill='none' stroke='%23B9B9B9' stroke-width='1.35' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}


/* ------------------------------------------------------------
   CONFIRM EMAIL — DELIBERATELY FULL WIDTH
   ------------------------------------------------------------ */

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-confirm-row
.dp-package-field-confirm-email {
    flex: 0 0 100% !important;

    width: 100% !important;
    max-width: 100% !important;
}


/* ------------------------------------------------------------
   PHONE
   ------------------------------------------------------------ */

.booknetic_appointment_container_body
[data-step-id="packages_information"]
#booknetic_theme_8
.iti {
    width: 100% !important;

    background: transparent !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
#booknetic_theme_8
.iti
input {
    min-height: 48px !important;

    background: #090A0B !important;

    border: 1px solid #34393D !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
#booknetic_theme_8
.iti__selected-country,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
#booknetic_theme_8
.iti__selected-flag {
    background: transparent !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
#booknetic_theme_8
.iti__arrow {
    border-top-color: #FFD700 !important;
}


/* ------------------------------------------------------------
   PACKAGE GENDER / SELF-DESCRIBE
   ------------------------------------------------------------ */

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-bpg-package-gender {
    width: 100% !important;

    margin-top: 1px !important;
    margin-bottom: 14px !important;

    box-sizing: border-box !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-bpg-package-gender
> label,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-bpg-package-describe-wrap
> label {
    display: block !important;

    margin: 0 0 7px !important;

    color: #FFD700 !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-bpg-package-select {
    width: 100% !important;

    min-height: 48px !important;
    height: 48px !important;

    padding: 0 44px 0 13px !important;

    appearance: none !important;
    -webkit-appearance: none !important;

    background-color: #090A0B !important;

    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 9'%3E%3Cpath d='M2 2.2 7 7l5-4.8' fill='none' stroke='%23FFD700' stroke-width='1.35' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;

    background-repeat: no-repeat !important;
    background-position: right 15px center !important;
    background-size: 11px 7px !important;

    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;

    border: 1px solid #34393D !important;
    border-radius: 3px !important;

    box-shadow: none !important;
    outline: none !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 12px !important;

    box-sizing: border-box !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-bpg-package-select:focus {
    background-color: #060708 !important;

    border-color: #FFD700 !important;

    box-shadow:
        0 0 0 1px rgba(255, 215, 0, .07) !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-bpg-package-describe-wrap {
    width: 100% !important;

    margin: -1px 0 14px !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
#dp_booknetic_package_gender_describe {
    width: 100% !important;

    min-height: 48px !important;
    height: 48px !important;

    padding: 0 13px !important;

    background: #090A0B !important;

    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;

    border: 1px solid #34393D !important;
    border-radius: 3px !important;

    outline: none !important;

    caret-color: #FFD700 !important;

    box-sizing: border-box !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
#dp_booknetic_package_gender_describe:focus {
    background: #060708 !important;

    border-color: #FFD700 !important;
}


/* ------------------------------------------------------------
   HELPER / ACCOUNT INFORMATION
   ------------------------------------------------------------ */

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.bkntc_spam_notice {
    display: block !important;

    margin-top: 5px !important;

    color: #707478 !important;

    font-size: 9px !important;
    line-height: 1.45 !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
.bkntc-information-step-info-container {
    margin-top: 4px !important;
    margin-bottom: 2px !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
.bkntc-information-step-info-container
.form-group {
    margin: 0 !important;

    padding: 13px 14px !important;

    background: #090909 !important;

    border: 1px solid #2A2A2A !important;
    border-left: 2px solid #FFD700 !important;
    border-radius: 2px !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
.bkntc-information-step-info-container
label {
    display: flex !important;
    align-items: center !important;

    gap: 8px !important;

    margin: 0 0 5px !important;

    color: #FFD700 !important;

    font-size: 10px !important;
    font-weight: 700 !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
.bkntc-information-step-info-container
.form-group
> div {
    color: #B7B7B7 !important;

    font-size: 10px !important;
    line-height: 1.45 !important;
}


/* ------------------------------------------------------------
   PRIVACY NOTE
   ------------------------------------------------------------ */

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-privacy {
    display: flex !important;
    align-items: center !important;

    gap: 8px !important;

    margin: 5px 0 4px !important;
    padding: 10px 0 2px !important;

    color: #777B7E !important;

    border-top: 1px solid #1F1F1F !important;

    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 9px !important;
    line-height: 1.35 !important;
}


/* ------------------------------------------------------------
   MOBILE
   ------------------------------------------------------------ */

@media only screen and (max-width: 767px) {

    .booknetic_appointment_container_body
    [data-step-id="packages_information"]
    #booknetic_theme_8
    .form-control,

    .booknetic_appointment_container_body
    [data-step-id="packages_information"]
    .dp-bpg-package-select,

    .booknetic_appointment_container_body
    [data-step-id="packages_information"]
    #dp_booknetic_package_gender_describe {
        font-size: 16px !important;
    }

}



/* ============================================================
   v1.0.2 — MICRO ALIGNMENT POLISH
   ============================================================ */

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-email::after,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-confirm-email::after,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-name::after,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-surname::after {
    top: 37px !important;
    left: 13px !important;
    width: 16px !important;
    height: 16px !important;
    opacity: .76 !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-email input,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-confirm-email input,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-name input,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-surname input {
    padding-left: 42px !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.bkntc_input_identifier_clear {
    top: 36px !important;
    right: 13px !important;
    width: 18px !important;
    height: 18px !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.bkntc_input_identifier_loading {
    top: 36px !important;
    right: 14px !important;
    width: 18px !important;
    height: 18px !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-email input {
    padding-right: 40px !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-section-heading {
    margin-bottom: 12px !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-details-heading {
    margin-top: 7px !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-privacy {
    display: flex !important;
    align-items: center !important;
    gap: 7px !important;
    margin: 8px 0 3px !important;
    padding: 9px 0 0 !important;
    border-top: 1px solid #1F1F1F !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-privacy::before {
    content: "" !important;
    flex: 0 0 14px !important;
    width: 14px !important;
    height: 14px !important;
    background:
        transparent
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Crect x='4.3' y='7.5' width='9.4' height='7.4' rx='1.2' fill='none' stroke='%23999999' stroke-width='1.25'/%3E%3Cpath d='M6.3 7.5V5.8A2.7 2.7 0 0 1 9 3.1a2.7 2.7 0 0 1 2.7 2.7v1.7' fill='none' stroke='%23999999' stroke-width='1.25' stroke-linecap='round'/%3E%3C/svg%3E")
        center / contain no-repeat !important;
    opacity: .85 !important;
}


/* ============================================================
   v1.0.3 — PACKAGE INFORMATION ALIGNMENT + ACCOUNT NOTICE
   ------------------------------------------------------------
   - Corrects left icon vertical alignment.
   - Removes the double-border look from the Information notice.
   - Explicitly honours Booknetic's booknetic_hidden state.
   - Normal appointment flow is untouched.
   ============================================================ */


/* ------------------------------------------------------------
   FIELD ICONS — centre within the 48px input itself
   ------------------------------------------------------------ */

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-email::after,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-confirm-email::after,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-name::after,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-surname::after {
    top: 48px !important;
    left: 13px !important;

    width: 15px !important;
    height: 15px !important;

    transform: translateY(-50%) !important;
}


/* Keep text consistently clear of the icons */
.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-email input,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-confirm-email input,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-name input,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-surname input {
    padding-left: 40px !important;
}


/* ------------------------------------------------------------
   EXISTING ACCOUNT INFORMATION
   Booknetic renders this with booknetic_hidden until lookup
   succeeds. Never allow styling to override that state.
   ------------------------------------------------------------ */

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.bkntc-information-step-info-container.booknetic_hidden {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}


/* Visible state — one clean card, not a card inside a card */
.booknetic_appointment_container_body
[data-step-id="packages_information"]
.bkntc-information-step-info-container:not(.booknetic_hidden) {
    display: flex !important;

    width: 100% !important;

    margin: 12px 0 2px !important;
    padding: 14px 16px !important;

    background: #080808 !important;

    border: 1px solid #2A2A2A !important;
    border-left: 2px solid #FFD700 !important;
    border-radius: 2px !important;

    box-shadow: none !important;

    box-sizing: border-box !important;
}


/* Remove the second nested card created by older package CSS */
.booknetic_appointment_container_body
[data-step-id="packages_information"]
.bkntc-information-step-info-container:not(.booknetic_hidden)
.form-group {
    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;

    border: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;
}


/* Align icon, heading and copy */
.booknetic_appointment_container_body
[data-step-id="packages_information"]
.bkntc-information-step-info-container
label {
    display: flex !important;
    align-items: center !important;

    gap: 7px !important;

    margin: 0 0 6px !important;
    padding: 0 !important;

    min-height: 15px !important;

    color: #FFD700 !important;

    font-size: 10px !important;
    font-weight: 700 !important;
    line-height: 15px !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
.bkntc-information-step-info-container
label img {
    position: static !important;

    display: block !important;

    width: 14px !important;
    height: 14px !important;
    min-width: 14px !important;
    min-height: 14px !important;
    flex: 0 0 14px !important;

    margin: 0 !important;
    padding: 0 !important;

    transform: none !important;

    object-fit: contain !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
.bkntc-information-step-info-container
label span {
    display: block !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #FFD700 !important;

    line-height: 15px !important;
}


.booknetic_appointment_container_body
[data-step-id="packages_information"]
.bkntc-information-step-info-container
.form-group > div {
    margin: 0 !important;
    padding: 0 !important;

    color: #B7B7B7 !important;

    font-size: 10px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
}


/* ------------------------------------------------------------
   MOBILE
   ------------------------------------------------------------ */

@media only screen and (max-width: 767px) {

    .booknetic_appointment_container_body
    [data-step-id="packages_information"]
    .dp-package-field-email::after,

    .booknetic_appointment_container_body
    [data-step-id="packages_information"]
    .dp-package-field-confirm-email::after,

    .booknetic_appointment_container_body
    [data-step-id="packages_information"]
    .dp-package-field-name::after,

    .booknetic_appointment_container_body
    [data-step-id="packages_information"]
    .dp-package-field-surname::after {
        top: 48px !important;
    }

}


/* ============================================================
   v1.0.4 — PACKAGE FIELD TEXT ALIGNMENT
   ------------------------------------------------------------
   Moves field text/placeholder slightly right so it clears
   the left-side envelope/person icons cleanly.
   ============================================================ */

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-email input,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-confirm-email input,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-name input,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-surname input {
    padding-left: 47px !important;
}


/* ============================================================
   v1.0.5 — FINAL FIELD ICON / TEXT SPACING POLISH
   ------------------------------------------------------------
   - Nudges field icons slightly upwards.
   - Uses the tighter 30px left text spacing preferred in testing.
   ============================================================ */

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-email::after,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-confirm-email::after,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-name::after,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-surname::after {
    top: 46px !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-email input,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-confirm-email input,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-name input,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-field-surname input {
    padding-left: 30px !important;
}



/* ============================================================
   v1.1.1
   Field text left spacing is now applied directly to the actual
   package inputs by package-flow.js as inline !important CSS.
   This makes the admin setting immune to older stylesheet rules.
   ============================================================ */


/* ============================================================
   v1.1.2 — PACKAGE GENDER STATE + CUSTOM DROPDOWN
   ------------------------------------------------------------
   Safari/macOS renders an opened native <select> using the OS
   menu, which cannot be reliably branded with CSS. The plugin
   therefore keeps the real select for data/state, but presents
   a custom black/gold control to the customer.
   ============================================================ */

/* Existing Booknetic customer: the account already owns profile
   data, so do not keep asking for package-flow gender details. */
.booknetic_appointment_container_body
[data-step-id="packages_information"].dp-package-existing-customer
.dp-bpg-package-gender,

.booknetic_appointment_container_body
[data-step-id="packages_information"].dp-package-existing-customer
.dp-package-details-heading,

.booknetic_appointment_container_body
[data-step-id="packages_information"].dp-package-existing-customer
.dp-package-privacy {
    display: none !important;
}

/* Keep the real select in the DOM so the Profile Gender plugin
   and Booknetic can continue reading its value. */
.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-native-gender-select {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    min-width: 1px !important;
    min-height: 1px !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 0 !important;
    pointer-events: none !important;
    overflow: hidden !important;
    clip-path: inset(50%) !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-gender-custom {
    position: relative !important;
    width: 100% !important;
    z-index: 30 !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-gender-trigger {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    width: 100% !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 15px !important;
    margin: 0 !important;
    background: #090A0B !important;
    color: #FFFFFF !important;
    border: 1px solid #34393D !important;
    border-radius: 3px !important;
    box-shadow: none !important;
    outline: none !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    text-align: left !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-gender-trigger:hover,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-gender-trigger:focus,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-gender-custom.dp-package-gender-open
.dp-package-gender-trigger {
    border-color: #FFD700 !important;
    background: #070707 !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-gender-arrow {
    width: 9px !important;
    height: 9px !important;
    flex: 0 0 9px !important;
    border-right: 1.5px solid #FFD700 !important;
    border-bottom: 1.5px solid #FFD700 !important;
    transform: rotate(45deg) translateY(-2px) !important;
    transform-origin: center !important;
    transition: transform .16s ease !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-gender-custom.dp-package-gender-open
.dp-package-gender-arrow {
    transform: rotate(225deg) translate(-1px, -1px) !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-gender-menu {
    position: absolute !important;
    top: calc(100% + 4px) !important;
    left: 0 !important;
    right: 0 !important;
    display: none !important;
    padding: 5px !important;
    background: #080808 !important;
    border: 1px solid #FFD700 !important;
    border-radius: 3px !important;
    box-shadow: 0 14px 34px rgba(0, 0, 0, .48) !important;
    z-index: 9999 !important;
    box-sizing: border-box !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-gender-custom.dp-package-gender-open
.dp-package-gender-menu {
    display: block !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-gender-option {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 36px !important;
    margin: 0 !important;
    padding: 0 11px !important;
    background: transparent !important;
    color: #D3D3D3 !important;
    border: 0 !important;
    border-radius: 2px !important;
    box-shadow: none !important;
    outline: none !important;
    font-family: Helvetica, Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    text-align: left !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-gender-option:hover,

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-gender-option:focus {
    background: #151515 !important;
    color: #FFD700 !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"]
.dp-package-gender-option-selected {
    background: rgba(255, 215, 0, .08) !important;
    color: #FFD700 !important;
    font-weight: 600 !important;
}

@media only screen and (max-width: 767px) {
    .booknetic_appointment_container_body
    [data-step-id="packages_information"]
    .dp-package-gender-trigger,

    .booknetic_appointment_container_body
    [data-step-id="packages_information"]
    .dp-package-gender-option {
        font-size: 16px !important;
    }
}


/* ============================================================
   v1.1.4 — EXISTING CUSTOMER PACKAGE INFORMATION
   ------------------------------------------------------------
   1) Removes the unnecessary scroll / empty body height after
      Booknetic recognises an existing customer.
   2) Shows Booknetic's own "We've found your account..." card,
      matching the normal service booking flow.
   3) Keeps YOUR DETAILS and the privacy line visible for the
      same visual hierarchy as the normal information step.
   ============================================================ */


/* Existing customer: Gender is no longer needed, but retain the
   editorial YOUR DETAILS heading and the privacy reassurance. */
.booknetic_appointment_container_body
[data-step-id="packages_information"].dp-package-existing-customer
.dp-bpg-package-gender {
    display: none !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"].dp-package-existing-customer
.dp-package-details-heading {
    display: flex !important;
}

.booknetic_appointment_container_body
[data-step-id="packages_information"].dp-package-existing-customer
.dp-package-privacy {
    display: flex !important;
}


/* Booknetic's package lookup can leave booknetic_hidden on the
   information row even when its inline style is display:block.
   Only reveal it after our JS has positively identified the
   existing customer. */
.booknetic_appointment_container_body
[data-step-id="packages_information"].dp-package-existing-customer
.bkntc-information-step-info-container.dp-package-account-notice-active,

.booknetic_appointment_container_body
[data-step-id="packages_information"].dp-package-existing-customer
.bkntc-information-step-info-container.booknetic_hidden.dp-package-account-notice-active {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;

    width: 100% !important;
    margin: 10px 0 4px !important;
    padding: 14px 16px !important;

    background: #080808 !important;

    border: 1px solid #2A2A2A !important;
    border-left: 2px solid #FFD700 !important;
    border-radius: 2px !important;

    box-shadow: none !important;

    box-sizing: border-box !important;
}


/* Keep the account card clean rather than nested inside another card. */
.booknetic_appointment_container_body
[data-step-id="packages_information"].dp-package-existing-customer
.bkntc-information-step-info-container.dp-package-account-notice-active
.form-group {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}


/* Existing-customer package information should shrink to its real
   content instead of keeping Booknetic's scrollable empty viewport. */
#booknetic_theme_8
.booknetic_appointment_container_body.dp-package-existing-customer-body {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    overflow-y: visible !important;
    overflow-x: hidden !important;

    overscroll-behavior: auto !important;
}

#booknetic_theme_8
.booknetic_appointment_container_body.dp-package-existing-customer-body
[data-step-id="packages_information"].dp-package-existing-customer,

#booknetic_theme_8
.booknetic_appointment_container_body.dp-package-existing-customer-body
[data-step-id="packages_information"].dp-package-existing-customer
> [id^="booknetic_theme_"] {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    overflow: visible !important;
}


/* The privacy line belongs beneath the account-recognition card
   in the existing-customer state. */
.booknetic_appointment_container_body
[data-step-id="packages_information"].dp-package-existing-customer
.dp-package-privacy {
    margin-top: 8px !important;
}