/* Presentation only. Keep DOM order, control identities and visibility owned by
   the existing calculators. Extra specificity overrides their inline <style>s. */
form.cart.kap-calc-ui { --calc-border:#d5dfed; --calc-blue:#2563eb; font-size:13px; line-height:1.45; }
form.cart.kap-calc-ui, form.cart.kap-calc-ui * { box-sizing:border-box; }
form.cart.kap-calc-ui :is(.step,.kapv2-step,.calc-field-group) { min-width:0; margin-bottom:10px; }
form.cart.kap-calc-ui :is(label,.kapv2-step-title) { font-size:12px; font-weight:650; line-height:1.4; color:#334155; margin-bottom:5px; }
form.cart.kap-calc-ui :is(select,input[type=number],input[type=text],.ro,.readonly,.calc-btn-option,.yn button,.subyn button,.kapv2-yn button,.kapv2-mcard,.matpick button) {
    min-width:0; max-width:100%; min-height:40px; border:1px solid var(--calc-border); border-radius:8px;
    padding:8px 10px; background:#fff; color:#172033; font-family:inherit; font-size:13px; line-height:1.4; box-shadow:none;
}
form.cart.kap-calc-ui :is(select,input[type=number],input[type=text]) { width:100%; }
form.cart.kap-calc-ui select { padding-right:28px; text-overflow:ellipsis; }
form.cart.kap-calc-ui :is(.ro,.readonly) { background:#f8fafc; font-weight:600; }
form.cart.kap-calc-ui :is(.calc-btn-option,.yn button,.subyn button,.kapv2-yn button,.kapv2-mcard,.matpick button) { font-weight:650; cursor:pointer; white-space:normal; overflow-wrap:anywhere; }
form.cart.kap-calc-ui :is(.calc-btn-option,.yn button,.subyn button,.kapv2-yn button,.kapv2-mcard,.matpick button).active {
    background:#eff6ff; border-color:var(--calc-blue); color:#1d4ed8; box-shadow:none;
}
form.cart.kap-calc-ui :is(select,input,button,.calc-btn-option):focus-visible { outline:2px solid var(--calc-blue); outline-offset:2px; }
form.cart.kap-calc-ui :is(.grid2,.g2,.kapv2-grid2,.calc-grid-2) { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
form.cart.kap-calc-ui :is(.grid2,.g2,.kapv2-grid2,.calc-grid-2)>* { min-width:0; }
form.cart.kap-calc-ui :is(.yn,.subyn,.kapv2-yn,.calc-horizontal-select,.kapv2-material-cards,.matpick) { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
form.cart.kap-calc-ui :is(.note,.kapv2-note,.calc-upload-help,.kapv2-upload-support) { font-size:11px; line-height:1.5; overflow-wrap:anywhere; }
form.cart.kap-calc-ui .calc-upload-help { margin-top:8px; }
form.cart.kap-calc-ui :is(.tot,.total,.kapv2-total,.calc-total-final) { font-size:16px; gap:8px; flex-wrap:wrap; }
form.cart.kap-calc-ui :is(.btn,.kapv2-btn,.wc-calc-submit-btn) { font-size:14px!important; border-radius:8px!important; min-height:44px; }
form.cart.kap-calc-ui .kapv2-qty-wrap input { border-radius:0; border-left:0; border-right:0; }
/* Wrapping rows preserve DOM/tab order. Short fields share a row; an unpaired
   field grows to fill its row instead of leaving an empty grid cell. */
form.cart.kap-calc-ui:not(.wc-frontend-calc-form) { display:flex; flex-wrap:wrap; column-gap:12px; align-items:flex-start; padding:14px; }
form.cart.kap-calc-ui:not(.wc-frontend-calc-form)>* { flex:1 1 100%; min-width:0; }
/* WooCommerce clearfix pseudo-elements are layout items in flex/grid. */
form.cart.kap-calc-ui::before, form.cart.kap-calc-ui::after { content:none!important; display:none!important; }
form.cart.kap-calc-ui>:is(.step,.kapv2-step):has(>select,>input[type=number],>.ro,>.readonly,>.kapv2-qty-wrap,>.yn,>.kapv2-yn) { flex-basis:calc((100% - 12px) / 2); }
/* Namecard's technique branches must still obey jQuery show/hide. */
form.cart.kap-calc-ui :is(#kapv2_nc_offset,#kapv2_nc_kts):not([style*="display:none"]):not([style*="display: none"]) { display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:12px; }
form.cart.kap-calc-ui :is(#kapv2_nc_offset,#kapv2_nc_kts)>.step { min-width:0; }
form.cart.kap-calc-ui #kapv2_nc_kts>.step:first-child { grid-column:1 / -1; }
form.cart.kap-calc-ui.kapv2-nc>.step:has(#kapv2_nc_corner_btn) { flex-basis:calc((100% - 12px) / 2); }
/* A delivery field has a read-only value but needs room for the rush option. */
form.cart.kap-calc-ui>.step:has([name=kapv2_rush],#kapv2_nc_delivery_text,#kapv2_cat_delivery_text) { flex-basis:100%; }
form.cart.kap-calc-ui.kapv2-s14>.step { padding:0; border-bottom:0; }
/* On narrow phones retain useful numeric pairs; readable text controls remain 16px
   to avoid browser focus zoom. Do not shrink checkbox/radio or hidden upload inputs. */
@media (max-width:600px) {
    form.cart.kap-calc-ui:not(.wc-frontend-calc-form), form.cart.kap-calc-ui .wc-frontend-calc { padding:12px; }
    form.cart.kap-calc-ui :is(select,input[type=number],input[type=text]) { font-size:16px; min-height:44px; }
    form.cart.kap-calc-ui :is(.calc-btn-option,.yn button,.subyn button,.kapv2-yn button,.kapv2-mcard,.matpick button) { min-height:44px; padding:8px; font-size:12px; }
    form.cart.kap-calc-ui :is(.grid2,.g2,.kapv2-grid2,.calc-grid-2) { gap:8px; }
    /* Long material descriptions need a full row on a phone. */
    form.cart.kap-calc-ui :is(#kapv2-fine-wrap>.kapv2-grid2,.grid2:has(>#kapv2_cat_cover_box)) { grid-template-columns:1fr; }
}
@media (max-width:359px) {
    form.cart.kap-calc-ui:not(.wc-frontend-calc-form) { column-gap:8px; }
    form.cart.kap-calc-ui>:is(.step,.kapv2-step):has(>select) { flex-basis:100%; }
    form.cart.kap-calc-ui #kapv2_nc_kts>.step { grid-column:1 / -1; }
}
/* V1: pair the standalone controls in the longer Standee / KTS forms. */
form.cart.kap-calc-ui .wc-frontend-calc:has(#calc_st_frame,#calc_bh_material,#group_kts_side) { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:10px; }
form.cart.kap-calc-ui .wc-frontend-calc:has(#calc_st_frame,#calc_bh_material,#group_kts_side)>* { grid-column:1 / -1; min-width:0; }
form.cart.kap-calc-ui .wc-frontend-calc>.calc-field-group:has(#calc_st_frame,#calc_st_frame_qty,#calc_bh_material,#calc_bh_gia_cong,#group_kts_side,#calc_kts_can_mang) { grid-column:span 1; }
@media (max-width:359px) {
    form.cart.kap-calc-ui .wc-frontend-calc>.calc-field-group:has(#calc_bh_material,#calc_bh_gia_cong,#group_kts_side,#calc_kts_can_mang) { grid-column:1 / -1; }
}
@media (max-width:600px) {
    /* Reserve two label lines in numeric pairs so their input baselines align. */
    form.cart.kap-calc-ui :is(.g2,.grid2,.kapv2-grid2):has([name=kapv2_qty])>div>label { min-height:34px; }
}
/* Namecard has three short KTS fields: use three columns only when the form
   itself is wide enough (including desktop sidebars), not just the viewport. */
form.cart.kap-calc-ui.kapv2-nc { container-type:inline-size; }
form.cart.kap-calc-ui #kapv2_nc_kts>.step:last-child { grid-column:1 / -1; }
@container (min-width:480px) {
    form.cart.kap-calc-ui #kapv2_nc_kts:not([style*="display:none"]):not([style*="display: none"]) { grid-template-columns:repeat(3,minmax(0,1fr)); }
    form.cart.kap-calc-ui #kapv2_nc_kts>.step:last-child { grid-column:span 1; }
}
