/* The CRM contact form (ContactForm), which has no view of its own: emails and phones as plain rows, and the phone's country part. */

/*
    CRM contact form: emails and phones look like plain fields (ContactForm::details()),
    one row under another, without the table's frame, header or padding.
*/
.fi-panel-app .ambex-contact-details table,
.fi-panel-app .ambex-contact-details table tr,
.fi-panel-app .ambex-contact-details table td {
    border: 0;
    box-shadow: none;
    background: transparent;
}

.fi-panel-app .ambex-contact-details {
    gap: 0.25rem;
}

.fi-panel-app .ambex-contact-details > table {
    border-spacing: 0;
    border-radius: 0;
}

/* One line per row (address, "Main", delete), even where Filament would stack the cells. */
.fi-panel-app .ambex-contact-details tbody tr {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0 0 0.5rem 0;
}

.fi-panel-app .ambex-contact-details tbody td {
    display: block;
    flex: none;
    width: auto;
    padding: 0;
}

.fi-panel-app .ambex-contact-details tbody td:first-child {
    flex: 1 1 auto;
    min-width: 0;
}

/* The "Main" switch keeps its label next to it (Filament hides labels inside table cells). */
.fi-panel-app .ambex-contact-details tbody td:nth-child(2) .fi-fo-field {
    display: flex;
    flex-direction: row-reverse;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
}

.fi-panel-app .ambex-contact-details tbody td:nth-child(2) .fi-fo-field-label.fi-sr-only {
    position: static;
    width: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    clip: auto;
    white-space: nowrap;
    font-size: 0.875rem;
    font-weight: 500;
}

.fi-panel-app .ambex-contact-details tbody td:nth-child(2) .fi-fo-field-label-content {
    display: inline;
}

.fi-panel-app .ambex-contact-details tbody td.fi-hidden {
    display: none;
}

.fi-panel-app .ambex-contact-details thead {
    display: none;
}

/* "Add another email": there for the few who need it, not competing with the field. */
.fi-panel-app .ambex-contact-details .fi-fo-table-repeater-add .fi-link {
    color: var(--gray-500);
    font-weight: 500;
}

.fi-panel-app .ambex-contact-details .fi-fo-table-repeater-add .fi-link:hover {
    color: var(--primary-600);
}

/* Phone: a narrow country part showing only the flag and dialling code ("🇱🇻 +371"); names show in its list (ContactForm). */
.fi-panel-app .ambex-phone-field > .fi-sc,
.fi-panel-app .ambex-phone-field .fi-fo-fused-group > .fi-grid,
.fi-panel-app .ambex-phone-field .fi-grid { display: flex !important; }
.fi-panel-app .ambex-phone-field .fi-grid > :first-child { flex: 0 0 7.5rem; min-width: 0; }
.fi-panel-app .ambex-phone-field .fi-grid > :last-child { flex: 1 1 auto; min-width: 0; }
.fi-panel-app .ambex-phone-country-select .fi-select-input-value-label .ambex-phone-country { display: none; }
.fi-panel-app .ambex-phone-country-select .fi-dropdown-panel { min-width: 16rem; }
.fi-panel-app .ambex-phone-country-select .ambex-phone-code { white-space: nowrap; }