/* ADH Core 1.0.17 targeted frontend fixes.
   Important: this version never reparents CF7/ThemeREX fields. */

/* Country code + phone: compact code first (+971) and keep both controls
   together without changing their original form row. */
.adh-country-code,
select[name="country-code"],
select[name="country_code"],
select[name="dial-code"],
select[name="dial_code"] {
    min-width: 0 !important;
    padding-left: 7px !important;
    padding-right: 22px !important;
    font-size: 12px !important;
    text-overflow: ellipsis;
}

.adh-phone-row {
    display: flex !important;
    align-items: flex-end !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    box-sizing: border-box !important;
}
.adh-phone-row .adh-country-code-field,
.adh-phone-row .wpcf7-form-control-wrap:has(> select[name="country-code"]),
.adh-phone-row .wpcf7-form-control-wrap:has(> select[name="country_code"]),
.adh-phone-row .wpcf7-form-control-wrap:has(> select[name="dial-code"]),
.adh-phone-row .wpcf7-form-control-wrap:has(> select[name="dial_code"]) {
    flex: 0 0 104px !important;
    width: 104px !important;
    min-width: 96px !important;
    max-width: 104px !important;
    margin: 0 !important;
}
.adh-phone-row .adh-phone-number-field,
.adh-phone-row .wpcf7-form-control-wrap:has(> input[type="tel"]),
.adh-phone-row .wpcf7-form-control-wrap:has(> input[name="phone"]),
.adh-phone-row .wpcf7-form-control-wrap:has(> input[name="your-phone"]),
.adh-phone-row .wpcf7-form-control-wrap:has(> input[name="phone-number"]),
.adh-phone-row .wpcf7-form-control-wrap:has(> input[name="phone_number"]) {
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    margin: 0 !important;
}
.adh-phone-row :is(select, input) {
    min-width: 0 !important;
    max-width: none !important;
    box-sizing: border-box !important;
}
.adh-phone-row select {
    width: 104px !important;
}
.adh-phone-row input {
    width: 100% !important;
}

/* Some older CF7 forms already have Code and Phone as two sibling ThemeREX
   columns. Do not turn the whole personal row into a new grid; simply rebalance
   those two existing columns so Name + Email + Code + Phone still total 100%. */
.adh-personal-phone-flow > .adh-country-code-unit {
    width: 10% !important;
    max-width: 10% !important;
    min-width: 104px !important;
    float: left !important;
    clear: none !important;
    box-sizing: border-box !important;
}
.adh-personal-phone-flow > .adh-phone-number-unit {
    width: 23.333333% !important;
    max-width: 23.333333% !important;
    min-width: 0 !important;
    float: left !important;
    clear: none !important;
    box-sizing: border-box !important;
}
.adh-personal-phone-flow > .adh-country-code-unit select,
.adh-personal-phone-flow > .adh-phone-number-unit input {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
}

/* Booking information stays in the THEME'S EXISTING row. Only the widths of
   the existing field columns change. This preserves icons, borders, spacing,
   CF7 validation, and all theme wrappers. */
.adhpm-booking-layout-4 .adhpm-booking-slot,
.adhpm-booking-layout-5 .adhpm-booking-slot {
    float: left !important;
    clear: none !important;
    min-width: 0 !important;
    max-width: none !important;
    box-sizing: border-box !important;
}
.adhpm-booking-layout-4 .adhpm-booking-slot--provider { width: 30% !important; flex: 0 0 30% !important; }
.adhpm-booking-layout-4 .adhpm-booking-slot--date     { width: 24% !important; flex: 0 0 24% !important; }
.adhpm-booking-layout-4 .adhpm-booking-slot--duration { width: 18% !important; flex: 0 0 18% !important; }
.adhpm-booking-layout-4 .adhpm-booking-slot--time     { width: 28% !important; flex: 0 0 28% !important; }

.adhpm-booking-layout-5 .adhpm-booking-slot--provider { width: 23% !important; flex: 0 0 23% !important; }
.adhpm-booking-layout-5 .adhpm-booking-slot--date     { width: 17% !important; flex: 0 0 17% !important; }
.adhpm-booking-layout-5 .adhpm-booking-slot--duration { width: 14% !important; flex: 0 0 14% !important; }
.adhpm-booking-layout-5 .adhpm-booking-slot--time     { width: 20% !important; flex: 0 0 20% !important; }
.adhpm-booking-layout-5 .adhpm-booking-slot--purpose  { width: 26% !important; flex: 0 0 26% !important; }

/* Studio detail booking: the five booking fields share one ThemeREX row.
   Make that row a real five-column grid on laptop/desktop and release the
   legacy percentage/flex widths on its direct children. The explicit
   compact-studio-booking/pdf-row-4 selector also protects the site's saved
   CF7 wrapper even before/without relying on selector order in Custom CSS. */
.adhpm-booking-layout-5 .adhpm-booking-flow--5,
.compact-studio-booking .pdf-row-4 {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    align-items: end !important;
}
.adhpm-booking-layout-5 .adhpm-booking-flow--5 > .adhpm-booking-slot,
.compact-studio-booking .pdf-row-4 > .adhpm-booking-slot {
    float: none !important;
    clear: none !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    flex: none !important;
}

.adhpm-booking-slot--provider { clear: left !important; }
.adhpm-booking-slot :is(input, select, .wpcf7-form-control-wrap),
.adhpm-booking-slot > :is(input, select, .wpcf7-form-control-wrap) {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    box-sizing: border-box !important;
}
.adhpm-booking-slot--duration select,
.adhpm-booking-slot--time select,
.adhpm-booking-slot--purpose select {
    padding-left: 9px !important;
    padding-right: 24px !important;
}

/* Keep select hover/focus readable without changing the normal appearance.
   JS records the normal computed colors as custom properties only; these rules
   apply solely while the select is hovered/focused. */
select[data-adh-select-guard="1"]:is(:hover, :focus, :focus-visible) {
    background-color: var(--adh-select-normal-bg, transparent) !important;
    color: var(--adh-select-normal-color, inherit) !important;
    -webkit-text-fill-color: var(--adh-select-normal-color, currentColor) !important;
    opacity: 1 !important;
}

/* Studio registration visual repairs retained from the previous working build. */
.adhpm-provider-form[data-provider-form="studio"] label {
    color: var(--adhpm-ink, #192b48) !important;
}
.adhpm-provider-form[data-provider-form="studio"] :is(input, textarea)::placeholder {
    color: #7a8797 !important;
    opacity: 1 !important;
}
.adhpm-provider-form[data-provider-form="studio"] :is(.adhpm-field-icon, .style-line[class*="icon-"]::before, .pdf-field::before) {
    color: var(--adhpm-primary, #660033) !important;
    opacity: 1 !important;
}
.adhpm-provider-form[data-provider-form="studio"] input[type="checkbox"] {
    -webkit-appearance: checkbox !important;
    appearance: checkbox !important;
    width: 16px !important;
    min-width: 16px !important;
    height: 16px !important;
    opacity: 1 !important;
    visibility: visible !important;
    accent-color: var(--adhpm-primary, #660033) !important;
}
body.page-id-17947 .form-style-3 label {
    color: var(--adh-brand-sand, #ede9df) !important;
}
body.page-id-17947 .form-style-3 :is(input, textarea)::placeholder {
    color: rgba(237, 233, 223, .92) !important;
    opacity: 1 !important;
}
body.page-id-17947 .form-style-3 :is(.style-line[class*="icon-"]::before, .pdf-field::before) {
    color: var(--adh-brand-sand, #ede9df) !important;
    opacity: 1 !important;
}
body.page-id-17947 .form-style-3 input[type="checkbox"] {
    -webkit-appearance: checkbox !important;
    appearance: checkbox !important;
    width: 16px !important;
    min-width: 16px !important;
    height: 16px !important;
    opacity: 1 !important;
    visibility: visible !important;
    accent-color: var(--adh-brand-lime, #d7ef64) !important;
}

/* ADH Core 1.0.24: Provider registration cards use a light surface.
   Keep both first-time and additional Dancer/Studio form copy readable,
   regardless of page-level legacy form color schemes. */
.adhpm-provider-register .adhpm-provider-form :is(.form-style-3, .form-style-5) label {
    color: var(--adhpm-ink, #192b48) !important;
}
.adhpm-provider-register .adhpm-provider-form :is(.form-style-3, .form-style-5) :is(input, textarea)::placeholder {
    color: #526174 !important;
    opacity: 1 !important;
}
.adhpm-provider-register .adhpm-provider-form :is(.form-style-3, .form-style-5) .wpcf7-list-item-label,
.adhpm-provider-register .adhpm-provider-form :is(.form-style-3, .form-style-5) .wpcf7-list-item-label a {
    color: var(--adhpm-ink, #192b48) !important;
}

/* Public social links remain hidden; owner/admin profile UIs are unaffected. */
.adhpm-dancer-archive-page :is(.sc_team_item_socials, .team_member_socials, .socials_wrap, .adhpm-dancer-archive-socials-fallback),
.adhpm-studio-archive-page :is(.sc_portfolio_item_socials, .socials_wrap),
body.single-cpt_portfolio :is(.sc_socials, .socials_wrap) {
    display: none !important;
}

@media (max-width: 900px) {
    .adhpm-booking-layout-5 .adhpm-booking-flow--5,
    .compact-studio-booking .pdf-row-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
    .adhpm-booking-layout-4 .adhpm-booking-slot,
    .adhpm-booking-layout-5 .adhpm-booking-slot {
        width: 50% !important;
        max-width: 50% !important;
        flex: 0 0 50% !important;
    }
    .adhpm-booking-layout-4 .adhpm-booking-slot:nth-of-type(odd),
    .adhpm-booking-layout-5 .adhpm-booking-slot:nth-of-type(odd) {
        clear: left !important;
    }
    .adh-personal-phone-flow > .adh-country-code-unit,
    .adh-personal-phone-flow > .adh-phone-number-unit {
        width: 50% !important;
        max-width: 50% !important;
    }
}

@media (max-width: 600px) {
    .adhpm-booking-layout-5 .adhpm-booking-flow--5,
    .compact-studio-booking .pdf-row-4 {
        grid-template-columns: 1fr !important;
    }
    .adhpm-booking-layout-4 .adhpm-booking-slot,
    .adhpm-booking-layout-5 .adhpm-booking-slot {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        clear: both !important;
    }
    .adh-personal-phone-flow > .adh-country-code-unit,
    .adh-personal-phone-flow > .adh-phone-number-unit {
        width: 100% !important;
        max-width: 100% !important;
        clear: both !important;
    }
    .adh-phone-row .adh-country-code-field,
    .adh-phone-row .wpcf7-form-control-wrap:has(> select[name="country-code"]),
    .adh-phone-row .wpcf7-form-control-wrap:has(> select[name="country_code"]) {
        flex-basis: 96px !important;
        width: 96px !important;
        max-width: 96px !important;
    }
    .adh-phone-row select { width: 96px !important; }
}

/* Code and Phone stacked inside one existing ThemeREX column (notably the
   /find-a-studio/ registration form): make only that column a two-track row. */
.adh-phone-column {
    display: grid !important;
    grid-template-columns: 104px minmax(0, 1fr) !important;
    align-items: end !important;
    column-gap: 8px !important;
}
.adh-phone-column > .adh-phone-column__code,
.adh-phone-column > .adh-phone-column__number,
.adh-phone-column .adh-phone-column__code,
.adh-phone-column .adh-phone-column__number {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}
.adh-phone-column .adh-phone-column__code select,
.adh-phone-column .adh-phone-column__number input {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
}

@media (max-width: 600px) {
    .adh-phone-column {
        grid-template-columns: 96px minmax(0, 1fr) !important;
    }
}