/* 
   AWWO® Frontend UI - Styles
   Purpose: public-facing components, messages, and utilities
   @package cw-awwo-nt 
*/

/**
 * © AWWO® (Advertise What We Offer)
 * Unauthorized use, copying, modification, distribution, or reverse engineering is strictly prohibited without prior written authorization from CITIPRO WORLD™.
 * @license LicenseRef-Proprietary
 */

input.cw_hide_arrow::-webkit-outer-spin-button,
input.cw_hide_arrow::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin:0;
}

input.cw_hide_arrow {
    appearance:textfield;
    -moz-appearance:textfield;
}

.cw_nt_qr_box {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: .5em;
    border-radius: 8px;
    position: relative
}

.cw_nt_qr_box.bordered {
    border: 5px solid #000
}

.cw_nt_qr_link_embed {
    display: inline-block;
    visibility: hidden
}

.cw_nt_qr_shortcode_container {
    display: inline-block;
    text-align: center;
}

.cw_nt_qr_box.cw_nt_qr_link {
    padding: 1.7em;
    margin: 0 auto
}

#cw_nt_qr_container>.generated {
    visibility: hidden
}

#cw_user_gender[disabled] {
    pointer-events: none;
    opacity: 0.7;
}

/* Birthdate's write-once lock (see $disable_birthdate in
   cw_register_extra_profile_fields()) used to get this same graying via a
   now-removed .hasDatepicker[disabled] rule, tied to a class jQuery UI
   Datepicker added — lost when the datepicker was removed. Restoring it here
   keyed to the actual [disabled] state, matching Gender/Email's locked look. */
#cw_user_birthdate_field input[disabled] {
    color: light-dark(graytext, rgb(170, 170, 170));
    background-color: light-dark(rgba(239, 239, 239, 0.3), rgba(59, 59, 59, 0.3));
    opacity: 0.7;
    pointer-events: none;
}

.theme-betheme.woocommerce-account .select2-container--default .select2-selection--single {
    padding: 3px 8px;
    min-height: 40px;
}

.theme-betheme .select2-container .select2-selection--single .select2-selection__rendered {
    display: inline;
}

.theme-betheme.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
    padding: 0;
}

.theme-betheme.woocommerce-checkout .select2-container--default .select2-selection--single {
    padding: 9px 10px;
    margin-bottom: -1.4px;
}

/* Country Code + Phone unified into one control (checkout, My Account addresses).
   Each keeps its own label above it; the select and input sit flush together
   with no gap, sharing one border, above the 500px breakpoint. */
.cw-nt-phone-combined {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}
.cw-nt-phone-combined-col {
    display: flex;
    flex-direction: column;
}
.cw-nt-phone-combined-code,
.cw-nt-phone-combined-number {
    flex: 1 1 50%;
}
.cw-nt-phone-combined-code .woocommerce-input-wrapper select,
.cw-nt-phone-combined-number .woocommerce-input-wrapper input {
    width: 100%;
}
@media (min-width: 501px) {
    .cw-nt-phone-combined-code .woocommerce-input-wrapper select {
        border-right: none;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }
    .cw-nt-phone-combined-number .woocommerce-input-wrapper input {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }
}
@media (max-width: 500px) {
    .cw-nt-phone-combined-code {
        flex: 1 1 100%;
    }
}

/* Company Name + Company ID unified into one control (checkout, My Account
   addresses), same treatment as Country Code + Phone above. */
.cw-nt-company-combined {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}
.cw-nt-company-combined-col {
    display: flex;
    flex-direction: column;
}
.cw-nt-company-combined-name,
.cw-nt-company-combined-id {
    flex: 1 1 50%;
}
.cw-nt-company-combined-name .woocommerce-input-wrapper input,
.cw-nt-company-combined-id .woocommerce-input-wrapper input {
    width: 100%;
}
@media (min-width: 501px) {
    .cw-nt-company-combined-name .woocommerce-input-wrapper input {
        border-right: none;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }
    .cw-nt-company-combined-id .woocommerce-input-wrapper input {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }
}
@media (max-width: 500px) {
    .cw-nt-company-combined-name {
        flex: 1 1 100%;
    }
}

/* Day + Month + Year unified into one control (Edit Account Details).
   Raw <input> markup (no WC .woocommerce-input-wrapper here), same
   flush-join treatment as the pairs above but with three equal columns. */
.cw-nt-birthdate-combined {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}
.cw-nt-birthdate-combined-col {
    display: flex;
    flex-direction: column;
    flex: 1 1 33.33%;
}
.cw-nt-birthdate-combined-col input[type="text"] {
    width: 100%;
    text-align: center;
    box-sizing: border-box;
}
@media (min-width: 501px) {
    .cw-nt-birthdate-combined-col:not(:last-child) input[type="text"] {
        border-right: none;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
    }
    .cw-nt-birthdate-combined-col:not(:first-child) input[type="text"] {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
    }
}
@media (max-width: 500px) {
    .cw-nt-birthdate-combined-col {
        flex: 1 1 100%;
    }
}