/* ─── Variables globales ─────────────────────────────────────────────────── */
:root {
    --navy:      #2a3259;
    --navy-lite: #eef0f8;
    --accent:    #28C3E2;
    --border:    #e8eaf0;
}

/* ─── DataTable — estándar global ────────────────────────────────────────── */
.dataTables_wrapper { padding: 0; }

/* Cabecera */
table.dataTable thead th {
    background:     var(--navy-lite);
    border-bottom:  2px solid var(--border) !important;
    font-size:      11px;
    font-weight:    700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color:          #6c757d;
    padding-top:    10px;
    padding-bottom: 10px;
}
table.dataTable thead th:first-child { padding-left: 16px; }
table.dataTable thead th.sorting,
table.dataTable thead th.sorting_asc,
table.dataTable thead th.sorting_desc { padding-right: 26px !important; }
/* Indicadores de orden en color accent */
table.dataTable thead th.sorting_asc:after  { color: var(--accent) !important; opacity: 1 !important; }
table.dataTable thead th.sorting_desc:after { color: var(--accent) !important; opacity: 1 !important; }

/* Filas */
table.dataTable tbody td {
    vertical-align: middle;
    font-size:      13px;
    border-bottom:  1px solid var(--border);
    padding-top:    10px;
    padding-bottom: 10px;
}
table.dataTable tbody td:first-child { padding-left: 16px; }
table.dataTable tbody tr:last-child td { border-bottom: none; }
table.dataTable tbody tr { transition: background .12s; }
table.dataTable tbody tr:hover td {
    background:  #f0f4ff;
    border-color: #dce3f5;
}

/* Paginación — estilo navy */
.dataTables_paginate {
    padding:    10px 16px 14px;
    text-align: right;
}
.dataTables_paginate .page-link {
    font-size:    13px;
    color:        var(--navy);
    border-color: var(--border);
    border-radius: 6px !important;
    margin:       0 2px;
    padding:      4px 10px;
    line-height:  1.5;
}
.dataTables_paginate .page-item.active .page-link {
    background:   var(--navy);
    border-color: var(--navy);
    color:        #fff;
}
.dataTables_paginate .page-item.disabled .page-link { color: #adb5bd; border-color: var(--border); }
.dataTables_paginate .page-link:hover  { background: var(--navy-lite); color: var(--navy); border-color: var(--border); }
.dataTables_paginate .page-link:focus  { box-shadow: 0 0 0 .15rem rgba(42,50,89,.2); }

/* Mensaje sin resultados */
table.dataTable tbody td.dataTables_empty {
    text-align:  center;
    color:       #adb5bd;
    font-size:   13px;
    font-style:  italic;
    padding:     32px 16px;
    border:      none;
}

/* ─── Modal estándar — añadir clase .app-modal al div.modal ─────────────── */
.app-modal .modal-content  { border-radius: 12px; overflow: hidden; border: none; }
.app-modal .modal-header   { background: var(--navy); color: #fff; border: none; }
.app-modal .modal-title    { font-size: 15px; }
.app-modal .modal-header .close { opacity: .8; }
.app-modal .modal-body label { font-size: 12px; font-weight: 600; }
.app-modal .modal-footer   { border: none; padding-top: 0; }
.app-modal .modal-footer .btn { border-radius: 20px; min-width: 80px; }
.app-modal .modal-footer .btn-primary {
    background:   var(--navy);
    border-color: var(--navy);
}
.app-modal .modal-footer .btn-primary:hover,
.app-modal .modal-footer .btn-primary:focus {
    background:   #1e2545;
    border-color: #1e2545;
}

/* ─── Logo picker — reutilizable en cualquier vista ─────────────────────── */
.logo-dropzone {
    border:          2px dashed #ced4da;
    border-radius:   6px;
    padding:         20px;
    text-align:      center;
    cursor:          pointer;
    transition:      border-color .2s, background .2s;
    background:      #fafafa;
    min-height:      100px;
    display:         flex;
    align-items:     center;
    justify-content: center;
    flex-direction:  column;
}
.logo-dropzone:hover,
.logo-dropzone.dragover { border-color: #556ee6; background: #f0f3ff; }
.logo-dropzone .dz-icon { font-size: 28px; color: #adb5bd; margin-bottom: 6px; }
.logo-dropzone .dz-text { font-size: 13px; color: #6c757d; }

.logo-preview-wrap {
    display:    none;
    margin-top: 10px;
    position:   relative;
    text-align: center;
}
.logo-preview-wrap img {
    max-height:   120px;
    max-width:    100%;
    border-radius: 4px;
    border:       1px solid #dee2e6;
    object-fit:   contain;
    background:   #fff;
    padding:      4px;
}
.logo-preview-wrap .btn-remove-img {
    position:      absolute;
    top:           -8px;
    right:         -8px;
    width:         22px;
    height:        22px;
    border-radius: 50%;
    padding:       0;
    line-height:   20px;
    font-size:     13px;
}
.logo-error { font-size: 12px; color: #f46a6a; margin-top: 4px; display: none; }