/* ====================================================================
   NYC Shipping — Checkout field styles
   ==================================================================== */

/* Field spacing inside the checkout column */
#nyc-delivery-date,
#nyc-delivery-time,
#nyc-delivery-comment,
.checkout-shipping-address #nyc-delivery-date,
.checkout-shipping-address #nyc-delivery-time,
.checkout-shipping-address #nyc-delivery-comment {
    margin-top: 10px;
}

/* Label weight */
.field[name$=".nyc_delivery_date"] label,
.field[name$=".nyc_delivery_time"] label,
.field[name$=".nyc_delivery_comment"] label,
.checkout-shipping-address .field[name$=".nyc_delivery_date"] label,
.checkout-shipping-address .field[name$=".nyc_delivery_time"] label,
.checkout-shipping-address .field[name$=".nyc_delivery_comment"] label {
    font-weight: 600;
}

/* ====================================================================
   FORCE the required-field asterisk to render.

   Magento's default theme only shows the asterisk if the field is
   inside a form that registers as required. In shippingAdditional (and
   in some custom themes), the asterisk is not rendered automatically.
   These rules add it directly to the label of any NYC field whose input
   is marked required="required" (set by our JS validator's
   markInputsRequired() helper) or whose field wrapper has the standard
   Magento _required class.
   ==================================================================== */

/* Apply to any NYC field whose <input>/<select>/<textarea> has the
   native required attribute. ":has" lets us style the wrapper based on
   the input's required state. */
.field:has(#nyc-delivery-date[required]) > .label::after,
.field:has(#nyc-delivery-time[required]) > .label::after,
.field:has(#nyc-delivery-comment[required]) > .label::after,
.field:has(#nyc-delivery-date[aria-required="true"]) > .label::after,
.field:has(#nyc-delivery-time[aria-required="true"]) > .label::after,
.field:has(#nyc-delivery-comment[aria-required="true"]) > .label::after {
    content: " *";
    color: #e02b27;
    font-weight: 700;
    margin-left: 2px;
}

/* Fallback for browsers without :has() support — uses the Magento
   standard ._required modifier on the wrapper. */
.field._required > label::after,
.field._required > .label::after {
    content: " *";
    color: #e02b27;
    font-weight: 700;
    margin-left: 2px;
}

/* Force-add asterisk via a NYC-specific class our JS will toggle on
   the field wrapper. This is the truly universal fallback for browsers
   without :has() AND for themes that omit ._required. */
.nyc-field-required > label::after,
.nyc-field-required > .label::after,
.nyc-field-required label::after {
    content: " *";
    color: #e02b27;
    font-weight: 700;
    margin-left: 2px;
}

/* ====================================================================
   Error state — make it very visible so the customer can see what's
   missing. Applied by nyc-validator.js when validation fails.
   ==================================================================== */
.field._error #nyc-delivery-date,
.field._error #nyc-delivery-time,
.field._error #nyc-delivery-comment,
.nyc-field-error #nyc-delivery-date,
.nyc-field-error #nyc-delivery-time,
.nyc-field-error #nyc-delivery-comment {
    border: 1px solid #e02b27 !important;
    background-color: #fff4f4;
    box-shadow: 0 0 0 1px rgba(224, 43, 39, 0.15);
}

.nyc-shipping-error,
.field-error.nyc-shipping-error {
    display: block;
    color: #e02b27;
    font-size: 0.9em;
    margin-top: 4px;
    font-weight: 500;
}

/* ====================================================================
   Datepicker disabled-day styles
   ==================================================================== */
.ui-datepicker .nyc-disabled a,
.ui-datepicker .nyc-disabled-day a,
.ui-datepicker .nyc-disabled-date a {
    background: #f4f4f4 !important;
    color: #c0c0c0 !important;
    text-decoration: line-through;
    cursor: not-allowed !important;
}

.ui-datepicker .nyc-disabled-date a {
    background: #ffe5e5 !important;
}

/* ====================================================================
   Order email / customer view delivery info table
   ==================================================================== */
.nyc-delivery-info {
    margin: 15px 0;
    border: 1px solid #e6e6e6;
    border-radius: 4px;
    width: 100%;
    border-collapse: collapse;
}

.nyc-delivery-info td {
    padding: 6px 10px;
    vertical-align: top;
}

.nyc-delivery-info .nyc-header {
    font-weight: bold;
    background: #f5f5f5;
    border-bottom: 1px solid #e6e6e6;
}