/* ===================================================================
   Plataforma TrueConnect — sin halo/ring de foco en campos de formulario.
   El campo enfocado sigue distinguible con un borde sutil (accesibilidad),
   pero sin el reborde brillante. Se carga en TODOS los paneles Filament
   (render hook en AppServiceProvider) y en el formulario publico (layout).
   =================================================================== */

/* ── Formulario publico y cualquier input "plano" (scope .tc-public) ── */
.tc-public input:focus,
.tc-public input:focus-visible,
.tc-public textarea:focus,
.tc-public textarea:focus-visible,
.tc-public select:focus,
.tc-public select:focus-visible {
    outline: none !important;
    box-shadow: inset 0 0 0 1px rgb(71 85 105 / 0.55) !important; /* slate-600/55 */
    border-color: rgb(71 85 105 / 0.55) !important;
}

/* ── <select> en forms públicos: que se vea claramente como DROPDOWN ──
   Quita la flecha nativa (que casi no se ve) y pone un chevron claro a la
   derecha, manteniendo el borde del campo. Aplica a TODOS los selects de
   formularios públicos (signup, application, agendamiento, etc.). */
.tc-public select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%236b7280' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 1.15rem;
    padding-right: 2.5rem !important;
}

/* ── Filament: el wrapper real es .fi-input-wrp (Filament 3.3) ──
   Reemplaza el ring primario (azul/ambar/verde) por un borde gris sutil. */
.fi-input-wrp:focus-within {
    --tw-ring-shadow: 0 0 #0000 !important;
    --tw-ring-offset-shadow: 0 0 #0000 !important;
    box-shadow: inset 0 0 0 1px rgb(71 85 105 / 0.5) !important;
    outline: none !important;
}

/* El input interno de Filament no muestra ring/outline (el borde lo da el wrapper) */
.fi-input:focus,
.fi-input:focus-visible,
.fi-select__input:focus {
    outline: none !important;
    box-shadow: none !important;
}

/* Checkboxes, radios y toggles: sin ring brillante, borde sutil para a11y */
.fi-checkbox-input:focus,
.fi-checkbox-input:focus-visible,
.fi-radio-input:focus,
.fi-radio-input:focus-visible {
    outline: none !important;
    box-shadow: 0 0 0 1px rgb(71 85 105 / 0.45) !important;
}

.fi-fo-toggle:focus,
.fi-fo-toggle:focus-visible {
    outline: none !important;
    --tw-ring-shadow: 0 0 #0000 !important;
    --tw-ring-offset-shadow: 0 0 #0000 !important;
    box-shadow: 0 0 0 2px rgb(71 85 105 / 0.35) !important;
}

/* Red de seguridad: cualquier control de Filament dentro de un wrapper */
.fi-input-wrp:focus-within .fi-input:focus {
    box-shadow: none !important;
}

/* ─────────────────────────────────────────────────────────────────────────
   BREADCRUMBS en UNA sola línea (no parten a dos renglones). Solo se trunca el
   TEXTO de los crumbs (con elipsis si es largo); los separadores (chevron) NO se
   tocan. Aplica a todos los paneles.
   Estructura Filament: nav.fi-breadcrumbs > ol.fi-breadcrumbs-list >
   li.fi-breadcrumbs-item > (svg.fi-breadcrumbs-item-separator + a/span.fi-breadcrumbs-item-label)
   ───────────────────────────────────────────────────────────────────────── */
.fi-breadcrumbs {
    min-width: 0;
}
.fi-breadcrumbs-list {
    flex-wrap: nowrap !important;
    min-width: 0;
}
.fi-breadcrumbs-item {
    min-width: 0;
}
/* El separador no se encoge ni se deforma */
.fi-breadcrumbs-item-separator {
    flex-shrink: 0;
}
/* Solo el LABEL se trunca; el último (página actual) es el que más cede */
.fi-breadcrumbs-item-label {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
