/* Shared form foundation for future entity refactors. Scope everything to
   .entity-form / .entity-section so existing Club, Person and Match UI is safe. */
.entity-form {
    --entity-accent: var(--bs-primary, #0d6efd);
    --entity-card: var(--bs-body-bg, #fff);
    --entity-soft: var(--bs-tertiary-bg, #f6f8fb);
    --entity-border: var(--bs-border-color, #e4e9f0);
    --entity-text-muted: var(--bs-secondary-color, #687789);
    padding-bottom: .35rem;
}
.entity-form .entity-section {
    background: var(--entity-card);
    border: 1px solid var(--entity-border);
    border-radius: 1rem;
    padding: clamp(1rem, 2.2vw, 1.4rem);
    box-shadow: 0 .2rem .95rem rgba(24, 50, 83, .045);
    margin-bottom: 1rem !important;
}
.entity-form .entity-section--compact { padding: 1rem 1.25rem; }
.entity-form .entity-section__header {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    border-bottom: 1px solid var(--entity-border);
    margin-bottom: 1.1rem;
    padding-bottom: .85rem;
}
.entity-form .entity-section__lead {
    display: flex;
    align-items: center;
    gap: .8rem;
    min-width: 0;
}
.entity-form .entity-section__icon {
    flex: 0 0 2.45rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.45rem;
    height: 2.45rem;
    color: var(--entity-accent);
    background: var(--entity-soft);
    border-radius: .78rem;
    font-size: 1.1rem;
}
.entity-form .entity-section__title {
    margin: 0;
    font-weight: 700;
    font-size: 1.025rem;
    color: var(--bs-body-color, #243346);
}
.entity-form .entity-section__subtitle {
    margin: .16rem 0 0;
    color: var(--entity-text-muted);
    font-size: .82rem;
    line-height: 1.3;
}
.entity-form .entity-header-action,
.entity-form .entity-field-action .btn { white-space: nowrap; }
.entity-form .entity-field-action {
    display: flex;
    justify-content: flex-end;
    margin-top: .48rem;
}
.entity-form .entity-field-action--end { margin-top: .65rem; }
.entity-form .entity-media-card {
    border: 1px dashed var(--entity-border);
    background: var(--entity-soft);
    border-radius: .82rem;
    padding: 1rem;
}
.entity-form .entity-media-card img {
    background: var(--entity-card);
    width: 5rem;
    height: 5rem;
}
.entity-form .entity-preferences > [class*="col-"] { min-width: 0; }
.entity-form .entity-preferences .team-check-group,
.entity-form .entity-preferences .form-floating {
    border: 1px solid var(--entity-border) !important;
    border-radius: .8rem;
    padding: .85rem !important;
    background: var(--entity-soft);
    height: 100%;
}
.entity-form .team-check-group legend,
.entity-form .team-check-group > label { font-weight: 650; color: var(--bs-body-color); }
.entity-form .team-check-group .form-check { margin-bottom: .3rem; }
.entity-form .entity-preferences .form-floating > label { left: .85rem; top: .85rem; }
.entity-form .entity-preferences .form-floating > :is(input,select) { min-width: 0; }
.entity-form .entity-owner-controls .team-owner-add {
    min-height: 3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
}
.entity-form .entity-owner-controls .select2-container .select2-selection--single {
    min-height: 3rem !important;
    height: 3rem !important;
}
.entity-form .entity-owner-controls .select2-container .select2-selection__rendered {
    line-height: 2rem !important;
    padding-top: .47rem !important;
}
.entity-form .entity-table-wrap {
    background: var(--entity-card);
    border: 1px solid var(--entity-border);
    border-radius: .8rem;
    padding: .1rem .75rem;
}
.entity-form .entity-table-wrap table { margin-bottom: 0; }
.entity-form .entity-table-wrap th {
    padding-top: .9rem;
    padding-bottom: .75rem;
    font-size: .82rem;
    color: var(--entity-text-muted);
    font-weight: 650;
}
.entity-form .entity-table-wrap td { padding-top: .7rem; padding-bottom: .7rem; vertical-align: middle; }
.entity-form .entity-training-table td:first-child { min-width: 15rem; width: 47%; }
.entity-form .entity-training-table td:nth-child(2) { min-width: 10rem; width: 30%; }
.entity-form .entity-training-table td:nth-child(3) { min-width: 8rem; }
.entity-form .entity-training-table td:last-child { white-space: nowrap; }
.entity-form .entity-training-table .form-control,
.entity-form .entity-training-table .form-select { min-height: 2.55rem; }
.entity-form .entity-owner-table td:first-child { width: 85%; }
.entity-form .team-owner-label { font-weight: 500; }
.entity-form .team-owner-empty { text-align: center; padding: 1rem; }
.entity-form .team-history-entry > .form-floating { min-width: 0; }
/* Floating labels + Select2: Bootstrap positions a real <select>, but Select2
   renders its own box. Anchor both text and label to THAT box to avoid the
   selected value dropping below the border. Keep this scoped to entity forms;
   the AJAX owner picker and non-floating Select2 controls are unaffected. */
.entity-form .form-floating:has(> select.select2-hidden-accessible) {
    position: relative;
    min-width: 0;
}
.entity-form .form-floating > select.select2-hidden-accessible {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: -1px !important;
    border: 0 !important;
}
.entity-form .form-floating > .select2-container {
    display: block;
    position: relative;
    width: 100% !important;
    min-width: 0;
}
.entity-form .form-floating > .select2-container .select2-selection--single {
    position: relative;
    box-sizing: border-box;
    height: 3.625rem !important;
    min-height: 3.625rem !important;
    padding: 0 !important;
    border: 1px solid var(--bs-border-color, #ced4da);
    border-radius: var(--bs-border-radius, .375rem);
    background: var(--entity-card);
}
.entity-form .form-floating > .select2-container .select2-selection--single .select2-selection__rendered {
    /* Undo the theme's default vertical positioning: the value is on line 2. */
    position: absolute !important;
    inset: 0 !important;
    box-sizing: border-box;
    width: 100% !important;
    height: 100% !important;
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding: 1.45rem 2.55rem .43rem .95rem !important;
    margin: 0 !important;
    line-height: 1.4rem !important;
    color: var(--bs-body-color, #212529) !important;
}
.entity-form .form-floating > .select2-container .select2-selection--single .select2-selection__arrow {
    top: 50% !important;
    right: .75rem !important;
    height: 1.5rem !important;
    transform: translateY(-50%);
}
.entity-form .form-floating:has(> select.select2-hidden-accessible) > label {
    /* Bootstrap's floating-label transforms/padding belong to the native select.
       Select2 needs a real small label at an explicit position instead. */
    position: absolute !important;
    top: .46rem !important;
    left: 1rem !important;
    right: auto !important;
    width: auto !important;
    height: auto !important;
    max-width: calc(100% - 3rem);
    margin: 0 !important;
    padding: 0 !important;
    font-size: .79rem;
    line-height: 1.15rem;
    opacity: 1 !important;
    color: var(--entity-text-muted);
    background: transparent !important;
    transform: none !important;
    transform-origin: 0 0;
    pointer-events: none;
    z-index: 2;
}
.entity-form .form-floating:has(> select.select2-hidden-accessible) > label::after {
    display: none !important;
    content: none !important;
}
/* The preferences box has .85rem of padding, so its label starts further in. */
.entity-form .entity-preferences .form-floating:has(> select.select2-hidden-accessible) > label {
    top: 1.31rem !important;
    left: 1.85rem !important;
}
.entity-form .form-floating:has(> select.select2-hidden-accessible) > .invalid-feedback {
    position: relative;
    z-index: 0;
}
.entity-form select.is-invalid + .select2-container .select2-selection,
.entity-form .team-check-group.border-danger .select2-selection { border-color: var(--bs-danger, #dc3545) !important; }
.entity-form .select2-container { max-width: 100%; }
.entity-form .select2-container--bootstrap-5 .select2-selection--multiple {
    min-height: 3.1rem;
    padding: .25rem .35rem;
    background: var(--entity-card);
}
.entity-form .entity-training-table .select2-container--bootstrap-5 .select2-selection--single {
    min-height: 2.55rem !important;
    height: 2.55rem !important;
}
.entity-form .entity-training-table .select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered {
    line-height: 1.4rem !important;
    padding-top: .48rem !important;
}
/* Generic future entity modal footer: Close is the persistent navigation action. */
.entity-modal .modal-footer,
#team-edit-modal .modal-footer {
    gap: .55rem;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.entity-modal .modal-footer .modal-btn-close,
.entity-modal .modal-footer [data-entity-close],
#team-edit-modal .modal-footer .modal-btn-close,
#team-edit-modal .modal-footer [data-entity-close] { margin-right: auto; }
@media (max-width: 575.98px) {
    .entity-form .entity-section { padding: .95rem; border-radius: .75rem; }
    .entity-form .entity-header-action { width: 100%; }
    .entity-form .entity-section__lead { width: 100%; }
    #team-edit-modal .modal-footer button { flex: 1 1 auto; }
}
.entity-form .btn-group[aria-label="Tipo di arbitro"] { display: inline-flex; flex-wrap: wrap; }
.entity-form .btn-group[aria-label="Tipo di arbitro"] .btn {
    min-width: 8rem;
    padding: .57rem 1.1rem;
    font-weight: 600;
}