/*
|--------------------------------------------------------------------------
| Tarjeta de tabla
|--------------------------------------------------------------------------
*/

.data-table-card {
    width: 100%;

    padding: 1rem;

    background-color: #ffffff;

    border:
        1px solid
        rgba(138, 21, 137, 0.10);

    border-radius: 14px;

    box-shadow:
        0 7px 24px
        rgba(0, 0, 0, 0.06);
}


/*
|--------------------------------------------------------------------------
| Tabla
|--------------------------------------------------------------------------
*/

.data-table {
    width: 100% !important;

    margin-bottom: 0 !important;

    color: #15233c;

    border-collapse: collapse;
}


/*
|--------------------------------------------------------------------------
| Encabezado de tabla
|--------------------------------------------------------------------------
*/

.data-table thead th {
    padding:
        0.9rem
        0.85rem;

    color: #ffffff;

    background-color:
        var(--primary);

    border-bottom: 0;

    font-size: 0.9rem;
    font-weight: 700;

    vertical-align: middle;
}


/*
|--------------------------------------------------------------------------
| Celdas
|--------------------------------------------------------------------------
*/

.data-table tbody td {
    padding:
        0.9rem
        0.85rem;

    color: #15233c;

    background-color: #ffffff;

    border-bottom:
        1px solid #eee8ef;

    vertical-align: middle;
}


/*
|--------------------------------------------------------------------------
| Filas
|--------------------------------------------------------------------------
*/

.data-table tbody tr,
.data-table tbody tr:nth-child(even),
.data-table tbody tr:nth-child(odd) {
    background-color: #ffffff;
}


.data-table tbody tr:hover td {
    background-color: #faf5fa;
}

/*
|--------------------------------------------------------------------------
| Contacto
|--------------------------------------------------------------------------
*/

.data-table-contact {
    display: flex;
    flex-direction: column;

    gap: 0.3rem;

    color: #15233c;

    line-height: 1.4;
}


.data-table-contact-line {
    display: block;
}


.data-table-contact-label {
    font-weight: 700;
}


.data-table-contact-value {
    font-weight: 400;
}


.data-table-contact-email {
    color: #15233c;

    font-weight: 400;

    text-decoration: none;

    overflow-wrap: anywhere;
}


.data-table-contact-email:hover {
    color: var(--primary);

    text-decoration: underline;
}

/*
|--------------------------------------------------------------------------
| Columnas
|--------------------------------------------------------------------------
*/

.data-table-number {
    width: 65px;

    font-weight: 700;

    text-align: center;
}


.data-table-name {
    min-width: 175px;

    font-weight: 600;
}


.data-table-address {
    min-width: 330px;

    color: #505050 !important;

    line-height: 1.45;
}

/*
|--------------------------------------------------------------------------
| Contenedor de ubicación
|--------------------------------------------------------------------------
*/

.data-table-map-container {
    width: 100%;

    display: flex;
    flex-direction: column;
    align-items: stretch;

    gap: 0.75rem;
}


/*
|--------------------------------------------------------------------------
| Vista previa del mapa
|--------------------------------------------------------------------------
*/

.data-table-map-preview {
    position: relative;

    width: 100%;
    height: 150px;

    overflow: hidden;

    background-color: #f5f5f5;

    border:
        1px solid
        rgba(138, 21, 137, 0.12);

    border-radius: 9px;
}


.data-table-map-preview iframe {
    width: 100%;
    height: 100%;

    display: block;

    border: 0;
}


.data-table-location {
    width: 300px;
    min-width: 300px;

    text-align: center;
}


/*
|--------------------------------------------------------------------------
| Botón Google Maps
|--------------------------------------------------------------------------
*/

.data-table-map-btn {
    min-height: 42px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    padding:
        0.55rem
        0.85rem;

    color: var(--primary);

    background-color:
        rgba(138, 21, 137, 0.08);

    border:
        1px solid
        rgba(138, 21, 137, 0.15);

    border-radius: 8px;

    font-size: 0.83rem;
    font-weight: 600;

    white-space: nowrap;

    text-decoration: none;

    transition:
        color 0.2s ease,
        background-color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease;
}


@media (hover: hover) {

    .data-table-map-btn:hover {
        color: #ffffff;

        background-color:
            var(--primary);

        border-color:
            var(--primary);

        transform:
            translateY(-1px);
    }

}


.data-table-map-btn:focus-visible {
    outline:
        3px solid
        rgba(138, 21, 137, 0.25);

    outline-offset: 2px;
}


/*
|--------------------------------------------------------------------------
| Sin ubicación
|--------------------------------------------------------------------------
*/

.data-table-no-map {
    min-height: 120px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: 0.55rem;

    padding: 1rem;

    color: #817782;

    background-color: #faf8fa;

    border:
        1px dashed
        rgba(138, 21, 137, 0.22);

    border-radius: 9px;

    font-size: 0.85rem;

    text-align: center;
}


.data-table-no-map i {
    color:
        rgba(138, 21, 137, 0.45);

    font-size: 1.35rem;
}



/*
|--------------------------------------------------------------------------
| Acciones de archivos
|--------------------------------------------------------------------------
*/

.data-table-file-actions {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.45rem;
}

.data-table-file-btn {
    min-height: 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    padding: 0.45rem 0.7rem;
    color: var(--primary);
    background-color: rgba(138, 21, 137, 0.07);
    border: 1px solid rgba(138, 21, 137, 0.18);
    border-radius: 8px;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1.1;
    text-decoration: none;
    white-space: nowrap;
    transition:
        color 0.2s ease,
        background-color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease;
}

@media (hover: hover) {
    .data-table-file-btn:hover {
        color: #ffffff;
        background-color: var(--primary);
        border-color: var(--primary);
        transform: translateY(-1px);
    }
}

.data-table-file-btn:focus-visible {
    outline: 3px solid rgba(138, 21, 137, 0.22);
    outline-offset: 2px;
}

.data-table-empty {
    color: #817782;
    font-size: 0.82rem;
    font-style: italic;
}

/*
|--------------------------------------------------------------------------
| DataTables
|--------------------------------------------------------------------------
*/

.data-table-card .dt-container,
.data-table-card
.dataTables_wrapper {
    width: 100%;

    color: #595959;

    font-size: 0.9rem;
}


.data-table-card
.dataTables_wrapper::after {
    content: "";

    display: block;

    clear: both;
}


/*
|--------------------------------------------------------------------------
| Selector de registros
|--------------------------------------------------------------------------
*/

.data-table-card .dt-length,
.data-table-card
.dataTables_wrapper
.dataTables_length {
    float: left;

    margin-bottom: 1rem;
}


.data-table-card .dt-length label,
.data-table-card
.dataTables_wrapper
.dataTables_length label {
    display: flex;
    align-items: center;

    gap: 0.4rem;

    margin: 0;

    color: #595959;

    font-weight: 400;
}


.data-table-card .dt-length select,
.data-table-card
.dataTables_wrapper
.dataTables_length select {
    min-width: 65px;
    min-height: 38px;

    padding:
        0.3rem
        1.8rem
        0.3rem
        0.55rem;

    color: #15233c;

    background-color: #ffffff;

    border:
        1px solid #ded5df;

    border-radius: 7px;

    outline: none;
}


/*
|--------------------------------------------------------------------------
| Buscador
|--------------------------------------------------------------------------
*/

.data-table-card .dt-search,
.data-table-card
.dataTables_wrapper
.dataTables_filter {
    float: right;

    margin-bottom: 1rem;

    text-align: right;
}


.data-table-card .dt-search label,
.data-table-card
.dataTables_wrapper
.dataTables_filter label {
    display: flex;
    align-items: center;

    gap: 0.5rem;

    margin: 0;

    color: #595959;

    font-weight: 400;
}


.data-table-card .dt-search input,
.data-table-card
.dataTables_wrapper
.dataTables_filter input {
    width: 220px;
    min-height: 38px;

    margin-left: 0 !important;

    padding:
        0.45rem
        0.75rem;

    color: #15233c;

    background-color: #ffffff;

    border:
        1px solid #ded5df;

    border-radius: 7px;

    outline: none;

    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}


.data-table-card .dt-search input:focus,
.data-table-card
.dataTables_wrapper
.dataTables_filter input:focus {
    border-color:
        rgba(138, 21, 137, 0.45);

    box-shadow:
        0 0 0 3px
        rgba(138, 21, 137, 0.08);
}


/*
|--------------------------------------------------------------------------
| Información inferior - DataTables 1 y 2
|--------------------------------------------------------------------------
*/

.data-table-card .dt-info,
.data-table-card
.dataTables_wrapper
.dataTables_info {
    padding-top: 1rem;

    color: #6c6570;

    font-size: 0.84rem;
}


/*
|--------------------------------------------------------------------------
| Contenedor de paginación
|--------------------------------------------------------------------------
*/

.data-table-card .dt-paging,
.data-table-card
.dataTables_wrapper
.dataTables_paginate {
    display: flex;
    align-items: center;

    gap: 0.4rem;

    padding-top: 0.75rem;
}



/*
|--------------------------------------------------------------------------
| Botones de paginación
|--------------------------------------------------------------------------
*/

.data-table-card
.dt-paging
button.dt-paging-button,

.data-table-card
.dataTables_wrapper
.dataTables_paginate
.paginate_button {

    min-width: 36px;
    min-height: 36px;

    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    margin: 0 !important;

    padding:
        0.45rem
        0.75rem !important;

    color: var(--primary) !important;

    background:
        #ffffff !important;

    border:
        1px solid
        rgba(138, 21, 137, 0.20) !important;

    border-radius:
        8px !important;

    font-family: inherit;

    font-size: 0.82rem;
    font-weight: 600;

    line-height: 1;

    text-decoration: none !important;

    cursor: pointer;

    box-shadow: none !important;

    transition:
        color 0.2s ease,
        background-color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease;
}

/*
|--------------------------------------------------------------------------
| Anterior / Siguiente
|--------------------------------------------------------------------------
*/

.data-table-card
.dt-paging
button.dt-paging-button.first,

.data-table-card
.dt-paging
button.dt-paging-button.previous,

.data-table-card
.dt-paging
button.dt-paging-button.next,

.data-table-card
.dt-paging
button.dt-paging-button.last,

.data-table-card
.dataTables_wrapper
.dataTables_paginate
.paginate_button.previous,

.data-table-card
.dataTables_wrapper
.dataTables_paginate
.paginate_button.next {

    min-width: auto;

    padding:
        0.45rem
        0.9rem !important;

    background:
        rgba(
            138,
            21,
            137,
            0.06
        ) !important;
}


/*
|--------------------------------------------------------------------------
| Hover
|--------------------------------------------------------------------------
*/

@media (hover: hover) {

    .data-table-card
    .dt-paging
    button.dt-paging-button:hover,

    .data-table-card
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button:hover {

        color: #ffffff !important;

        background:
            var(--primary) !important;

        border-color:
            var(--primary) !important;

        transform:
            translateY(-1px);
    }

}


/*
|--------------------------------------------------------------------------
| Página actual
|--------------------------------------------------------------------------
*/

.data-table-card
.dt-paging
button.dt-paging-button.current,

.data-table-card
.dt-paging
button.dt-paging-button.current:hover,

.data-table-card
.dataTables_wrapper
.dataTables_paginate
.paginate_button.current,

.data-table-card
.dataTables_wrapper
.dataTables_paginate
.paginate_button.current:hover {

    color: #ffffff !important;

    background:
        var(--primary) !important;

    border-color:
        var(--primary) !important;

    box-shadow:
        0 3px 8px
        rgba(
            138,
            21,
            137,
            0.20
        ) !important;

    cursor: default;
}

/*
|--------------------------------------------------------------------------
| Deshabilitado
|--------------------------------------------------------------------------
*/

.data-table-card
.dt-paging
button.dt-paging-button.disabled,

.data-table-card
.dt-paging
button.dt-paging-button.disabled:hover,

.data-table-card
.dataTables_wrapper
.dataTables_paginate
.paginate_button.disabled,

.data-table-card
.dataTables_wrapper
.dataTables_paginate
.paginate_button.disabled:hover {

    color: #b7adb8 !important;

    background:
        #f8f6f8 !important;

    border-color:
        #eee8ef !important;

    box-shadow: none !important;

    transform: none;

    cursor: default !important;

    opacity: 0.6;
}

/*
|--------------------------------------------------------------------------
| Quitar Primero y Último
|--------------------------------------------------------------------------
*/

.data-table-card
.dt-paging
button.first,

.data-table-card
.dt-paging
button.last,

.data-table-card
.dataTables_wrapper
.dataTables_paginate
.paginate_button.first,

.data-table-card
.dataTables_wrapper
.dataTables_paginate
.paginate_button.last {
    display: none !important;
}




/*
|--------------------------------------------------------------------------
| Ordenamiento DataTables
|--------------------------------------------------------------------------
*/

.data-table
thead
.sorting,

.data-table
thead
.sorting_asc,

.data-table
thead
.sorting_desc {
    cursor: pointer;
}


/*
|--------------------------------------------------------------------------
| Tablet
|--------------------------------------------------------------------------
*/

@media (max-width: 991.98px) {

    .data-table {
        font-size: 0.9rem;
    }


    .data-table-card .dt-search input,
    .data-table-card
    .dataTables_wrapper
    .dataTables_filter
    input {
        width: 180px;
    }

}


/*
|--------------------------------------------------------------------------
| Móvil
|--------------------------------------------------------------------------
*/

@media (max-width: 767.98px) {

    /*
    |--------------------------------------------------------------------------
    | Pestañas
    |--------------------------------------------------------------------------
    */

    .unused-data-table-tabs {
        flex-direction: column;

        gap: 0.4rem;

        border-bottom: none;
    }


    .unused-data-table-tabs .nav-link {
        width: 100%;

        border-radius: 8px;
    }


    /*
    |--------------------------------------------------------------------------
    | Tabla
    |--------------------------------------------------------------------------
    */

    .data-table-card {
        padding: 0.75rem;
    }


    .data-table {
        min-width: 850px;
    }


    /*
    |--------------------------------------------------------------------------
    | Selector y buscador
    |--------------------------------------------------------------------------
    */

    .data-table-card .dt-length,
    .data-table-card .dt-search,
    .data-table-card
    .dataTables_wrapper
    .dataTables_length,

    .data-table-card
    .dataTables_wrapper
    .dataTables_filter {
        float: none;

        width: 100%;

        margin-bottom: 0.75rem;

        text-align: left;
    }


    .data-table-card .dt-search label,
    .data-table-card
    .dataTables_wrapper
    .dataTables_filter
    label {
        width: 100%;
    }


    .data-table-card .dt-search input,
    .data-table-card
    .dataTables_wrapper
    .dataTables_filter
    input {
        flex: 1;

        width: auto;
        max-width: 100%;
    }


    /*
    |--------------------------------------------------------------------------
    | Información
    |--------------------------------------------------------------------------
    */

    .data-table-card
    .dataTables_wrapper
    .dataTables_info {
        float: none;

        width: 100%;

        padding-top: 1rem;

        text-align: center;
    }


    /*
    |--------------------------------------------------------------------------
    | Paginación
    |--------------------------------------------------------------------------
    */

    .data-table-card .dt-info,
    .data-table-card
    .dataTables_wrapper
    .dataTables_info {

        width: 100%;

        text-align: center;
    }


    .data-table-card .dt-paging,
    .data-table-card
    .dataTables_wrapper
    .dataTables_paginate {

        width: 100%;

        justify-content: center;

        flex-wrap: wrap;
    }


    .data-table-card
    .dt-paging
    button.dt-paging-button {

        min-width: 34px;
        min-height: 34px;
    }

}


/*
|--------------------------------------------------------------------------
| Móviles pequeños
|--------------------------------------------------------------------------
*/

@media (max-width: 575.98px) {

    
.data-table-card
    .dataTables_wrapper
    .dataTables_length
    label {
        flex-wrap: wrap;
    }

}


/*
|--------------------------------------------------------------------------
| Accesibilidad - movimiento reducido
|--------------------------------------------------------------------------
*/

@media (
    prefers-reduced-motion:
    reduce
) {

    .unused-data-table-tabs .nav-link,
    .data-table-map-btn,

    .data-table-card
    .dataTables_wrapper
    .dataTables_paginate
    .paginate_button {

        transition: none;
    }

}