/* ================================================================
   CRT — BUSCADOR DE SESIONES DEL PLENO
   buscador-sesiones-pleno.css
   Sistema Bento · Noto Sans · px independiente del CMS
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;500;600;700;800&display=swap');

/* ── VARIABLES ── */
:root {
    --bsp-primary: #4A7D75;
    --bsp-primary-dk: #3a6560;
    --bsp-primary-lt: #e8f2f1;
    --bsp-primary-xlt: #f4f9f8;
    --bsp-accent: #017977;
    --bsp-accent-lt: #e0f0ef;
    --bsp-dark: #1a2e2c;
    --bsp-text: #2e3d3c;
    --bsp-muted: #7a9695;
    --bsp-border: #d4e5e3;
    --bsp-border-lt: #eaf2f1;
    --bsp-bg: #f2f7f6;
    --bsp-white: #ffffff;
    --bsp-doc-text: #3a4a49;
    --bsp-doc-lt: #f3f6f5;
    --bsp-doc-border: #cddedd;
    --bsp-doc-hover-bg: #3a6560;
    --bsp-doc-hover-bar: #4A7D75;
    --bsp-radius: 18px;
    --bsp-radius-sm: 11px;
    --bsp-radius-xs: 7px;
    --bsp-radius-pill: 100px;
    --bsp-shadow: 0 2px 6px rgba(74,125,117,0.06), 0 6px 24px rgba(74,125,117,0.08);
    --bsp-shadow-md: 0 6px 28px rgba(74,125,117,0.14);
    --bsp-transition: 0.18s ease;
    /* Tipografía base */
    --bsp-font: 'Noto Sans', 'Segoe UI', Arial, sans-serif;
    --bsp-size-base: 15px;
    --bsp-size-sm: 13px;
    --bsp-size-xs: 12px;
}

/* ── BASE ── */
.buscador-pleno {
    font-family: var(--bsp-font);
    font-size: var(--bsp-size-base);
    line-height: 1.65;
    color: var(--bsp-text);
    padding: 16px 0 56px;
}

    .buscador-pleno *,
    .buscador-pleno *::before,
    .buscador-pleno *::after {
        box-sizing: border-box;
    }

    /* ── CARD BENTO ── */
    .buscador-pleno .card-bento {
        background: var(--bsp-white);
        border-radius: var(--bsp-radius);
        border: 1px solid var(--bsp-border);
        padding: 32px 36px;
        box-shadow: var(--bsp-shadow);
        margin-top: 20px; /* separación entre cards */
    }

    /* ── ENCABEZADO ── */
    .buscador-pleno .buscador-header {
        display: flex;
        align-items: center;
        gap: 16px;
        margin-bottom: 28px;
        padding-bottom: 22px;
        border-bottom: 2px solid var(--bsp-border-lt);
    }

    .buscador-pleno .buscador-header-icon {
        width: 52px;
        height: 52px;
        background: linear-gradient(135deg, var(--bsp-primary) 0%, var(--bsp-accent) 100%);
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        box-shadow: 0 4px 14px rgba(74,125,117,0.30);
    }

        .buscador-pleno .buscador-header-icon i {
            color: white;
            font-size: 22px;
            line-height: 1;
        }

    .buscador-pleno .buscador-titulo {
        font-size: 22px;
        font-weight: 800;
        color: var(--bsp-dark);
        margin: 0 0 3px;
        line-height: 1.2;
        letter-spacing: -0.01em;
    }

    .buscador-pleno .buscador-subtitulo {
        font-size: 13px;
        color: var(--bsp-muted);
        margin: 0;
    }

    /* ── LABELS ── */
    .buscador-pleno .form-label {
        font-family: var(--bsp-font);
        font-size: 12px; /* legible, no micro */
        font-weight: 700;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        color: var(--bsp-primary-dk);
        margin-bottom: 7px;
        display: block;
    }

    /* ── INPUTS Y SELECTS ── */
    .buscador-pleno .form-control,
    .buscador-pleno .form-select {
        border: 1.5px solid var(--bsp-border);
        border-radius: var(--bsp-radius-sm);
        padding: 10px 14px;
        font-size: 14px; /* ← era 14px, se mantiene legible */
        font-family: var(--bsp-font);
        color: var(--bsp-text);
        background: var(--bsp-white);
        transition: border-color var(--bsp-transition), box-shadow var(--bsp-transition);
        width: 100%;
        line-height: 1.5;
    }

        .buscador-pleno .form-control:focus,
        .buscador-pleno .form-select:focus {
            outline: none;
            border-color: var(--bsp-primary);
            box-shadow: 0 0 0 3px rgba(74,125,117,0.13);
        }

        .buscador-pleno .form-control::placeholder {
            color: #b0c4c2;
            font-style: italic;
            font-size: 13px;
        }

    /* ── ROW SEPARACIÓN ── */
    .buscador-pleno .row.g-3 {
        --bs-gutter-y: 1.2rem; /* más aire entre filas */
    }

    /* ── INPUT KEYWORD ── */
    .buscador-pleno .input-keyword-wrap {
        position: relative;
    }

        .buscador-pleno .input-keyword-wrap .kw-icon {
            position: absolute;
            left: 14px;
            top: 50%;
            transform: translateY(-50%);
            color: var(--bsp-primary);
            font-size: 16px;
            pointer-events: none;
            z-index: 2;
            opacity: 0.9;
        }

    .buscador-pleno input[name="Keyword"] {
        padding: 13px 18px 13px 44px;
        font-size: 15px;
        font-weight: 500;
        border-width: 2px;
        border-color: var(--bsp-border);
        border-radius: var(--bsp-radius-sm);
        background: var(--bsp-primary-xlt);
    }

        .buscador-pleno input[name="Keyword"]:focus {
            border-color: var(--bsp-primary);
            background: var(--bsp-white);
            box-shadow: 0 0 0 4px rgba(74,125,117,0.12);
        }

    /* ── CHECKBOX ── */
    .buscador-pleno .form-check {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 11px 16px;
        background: var(--bsp-white);
        border-radius: var(--bsp-radius-sm);
        border: 1.5px solid var(--bsp-border);
        cursor: pointer;
        transition: border-color var(--bsp-transition), background var(--bsp-transition);
        margin-bottom: 0;
    }

        .buscador-pleno .form-check:hover {
            border-color: var(--bsp-primary);
            background: var(--bsp-primary-xlt);
        }

    .buscador-pleno .form-check-input {
        width: 18px;
        height: 18px;
        border: 1.5px solid var(--bsp-border);
        border-radius: 5px;
        cursor: pointer;
        flex-shrink: 0;
        accent-color: var(--bsp-primary);
        margin: 0;
    }

    .buscador-pleno .form-check-label {
        font-size: 14px; /* legible */
        font-weight: 600;
        color: var(--bsp-text);
        cursor: pointer;
        text-transform: none;
        letter-spacing: 0;
    }

    /* ── BOTONES ACCIÓN ── */
    .buscador-pleno .btn-primary-crt {
        background: linear-gradient(135deg, var(--bsp-primary) 0%, var(--bsp-accent) 100%);
        color: var(--bsp-white);
        border: none;
        border-radius: var(--bsp-radius-sm);
        padding: 12px 28px;
        font-size: 14px;
        font-weight: 700;
        font-family: var(--bsp-font);
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        transition: all var(--bsp-transition);
        box-shadow: 0 3px 12px rgba(74,125,117,0.28);
        letter-spacing: 0.02em;
    }

        .buscador-pleno .btn-primary-crt:hover {
            background: linear-gradient(135deg, var(--bsp-primary-dk) 0%, var(--bsp-primary) 100%);
            box-shadow: 0 6px 20px rgba(74,125,117,0.38);
            transform: translateY(-1px);
            color: white;
        }

        .buscador-pleno .btn-primary-crt:active {
            transform: translateY(0);
        }

    .buscador-pleno .btn-outline-secondary {
        background: var(--bsp-white);
        color: var(--bsp-muted);
        border: 1.5px solid var(--bsp-border);
        border-radius: var(--bsp-radius-sm);
        padding: 12px 22px;
        font-size: 14px;
        font-weight: 600;
        font-family: var(--bsp-font);
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        text-decoration: none;
        transition: all var(--bsp-transition);
    }

        .buscador-pleno .btn-outline-secondary:hover {
            color: var(--bsp-text);
            background: var(--bsp-bg);
            border-color: #b8cecc;
        }

    /* ── CABECERA RESULTADOS ── */
    .buscador-pleno .resultados-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 18px;
        flex-wrap: wrap;
        gap: 8px;
    }

    .buscador-pleno .resultados-contador {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-size: 13px;
        color: var(--bsp-primary-dk);
        font-weight: 700;
        padding: 7px 16px;
        background: var(--bsp-primary-lt);
        border-radius: var(--bsp-radius-pill);
        border: 1px solid var(--bsp-border);
    }

    /* ── TABLA ── */
    .buscador-pleno .tabla-pleno {
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;
        font-size: 14px; /* legible */
        font-family: var(--bsp-font);
    }

        .buscador-pleno .tabla-pleno thead tr {
            background: linear-gradient(to right, var(--bsp-primary-lt), var(--bsp-accent-lt));
        }

        .buscador-pleno .tabla-pleno thead th {
            padding: 13px 16px;
            font-size: 12px; /* headers de tabla: 12px es estándar */
            font-weight: 800;
            letter-spacing: 0.07em;
            text-transform: uppercase;
            color: var(--bsp-primary-dk);
            border-bottom: 2px solid var(--bsp-border);
            white-space: nowrap;
        }

            .buscador-pleno .tabla-pleno thead th:first-child {
                border-radius: var(--bsp-radius-sm) 0 0 0;
            }

            .buscador-pleno .tabla-pleno thead th:last-child {
                border-radius: 0 var(--bsp-radius-sm) 0 0;
            }

        .buscador-pleno .tabla-pleno tbody tr {
            transition: background var(--bsp-transition);
            cursor: pointer;
        }

            .buscador-pleno .tabla-pleno tbody tr:hover,
            .buscador-pleno .tabla-pleno tbody tr.fila-expandida {
                background: var(--bsp-primary-xlt);
            }

        .buscador-pleno .tabla-pleno tbody td {
            padding: 14px 16px;
            border-bottom: 1px solid var(--bsp-border-lt);
            vertical-align: middle;
            font-size: 14px;
            line-height: 1.5;
        }

        /* ── CELDA SESIÓN ── */
        .buscador-pleno .tabla-pleno .fw-semibold {
            font-size: 14px;
            font-weight: 700;
            color: var(--bsp-dark);
        }

        .buscador-pleno .tabla-pleno small.text-muted {
            font-size: 12px;
            color: var(--bsp-muted) !important;
        }

    /* ── FECHA ── */
    .buscador-pleno .text-nowrap {
        font-size: 14px;
        color: var(--bsp-text);
    }

    /* ── BADGE TIPO ── */
    .buscador-pleno .badge-tipo {
        display: inline-block;
        background: var(--bsp-accent-lt);
        color: var(--bsp-accent);
        border-radius: var(--bsp-radius-pill);
        padding: 4px 13px;
        font-size: 12px; /* 12px es la mínima legible para badge */
        font-weight: 800;
        white-space: nowrap;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        border: 1px solid rgba(1,121,119,0.15);
    }

    /* ── NÚMERO ACUERDO ── */
    .buscador-pleno .tabla-pleno .text-nowrap {
        font-size: 14px;
        font-weight: 600;
        color: var(--bsp-primary-dk);
    }

    /* ── DESCRIPCIÓN CON EXPANSIÓN ── */
    .buscador-pleno .descripcion-acuerdo {
        font-size: 14px;
        line-height: 1.6;
        max-width: 360px;
        color: var(--bsp-text);
    }

    .buscador-pleno .descripcion-texto {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

        .buscador-pleno .descripcion-texto.expandida {
            display: block;
            -webkit-line-clamp: unset;
            overflow: visible;
        }

    .buscador-pleno .desc-toggle {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        font-size: 12px;
        font-weight: 700;
        color: var(--bsp-primary);
        cursor: pointer;
        margin-top: 6px;
        background: none;
        border: none;
        padding: 0;
        font-family: var(--bsp-font);
        transition: color var(--bsp-transition);
    }

        .buscador-pleno .desc-toggle:hover {
            color: var(--bsp-primary-dk);
        }

    /* ── BOTONES DOCUMENTOS ── */
    .buscador-pleno .btn-doc {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 5px 12px 5px 9px;
        border-radius: var(--bsp-radius-xs);
        font-size: 12.5px;
        font-weight: 600;
        font-family: var(--bsp-font);
        text-decoration: none;
        white-space: nowrap;
        transition: all var(--bsp-transition);
        border: 1px solid var(--bsp-doc-border);
        background: var(--bsp-doc-lt);
        color: var(--bsp-doc-text);
        letter-spacing: 0.01em;
    }

        .buscador-pleno .btn-doc::before {
            content: '';
            display: block;
            width: 3px;
            height: 13px;
            border-radius: 2px;
            flex-shrink: 0;
            background: var(--bsp-primary);
            opacity: 0.55;
        }

        .buscador-pleno .btn-doc i {
            font-size: 13px;
            line-height: 1;
            color: var(--bsp-primary);
            opacity: 0.8;
        }

        .buscador-pleno .btn-doc:hover {
            background: var(--bsp-doc-hover-bg);
            color: #fff;
            border-color: var(--bsp-doc-hover-bg);
            box-shadow: 0 2px 8px rgba(58,101,96,0.20);
        }

            .buscador-pleno .btn-doc:hover::before {
                background: rgba(255,255,255,0.45);
                opacity: 1;
            }

            .buscador-pleno .btn-doc:hover i {
                color: #fff;
                opacity: 0.9;
            }

    /* Variantes — solo la barra lateral cambia de color para distinguir tipo */
    .buscador-pleno .btn-doc-pdf::before {
        background: #b91c1c;
        opacity: 0.7;
    }

    .buscador-pleno .btn-doc-acta::before {
        background: #1e4d7b;
        opacity: 0.7;
    }

    .buscador-pleno .btn-doc-est::before {
        background: #0f5132;
        opacity: 0.7;
    }

    .buscador-pleno .btn-doc-audio::before {
        background: #44403c;
        opacity: 0.7;
    }

    /* ── PAGINACIÓN ── */
    .buscador-pleno .pagination {
        gap: 4px;
    }

    .buscador-pleno .page-item .page-link {
        border-radius: var(--bsp-radius-sm) !important;
        border: 1.5px solid var(--bsp-border);
        color: var(--bsp-primary);
        font-size: 14px;
        font-weight: 600;
        padding: 6px 14px;
        transition: all var(--bsp-transition);
        font-family: var(--bsp-font);
    }

        .buscador-pleno .page-item .page-link:hover {
            background: var(--bsp-primary-lt);
            border-color: var(--bsp-primary);
            color: var(--bsp-primary-dk);
        }

    .buscador-pleno .page-item.active .page-link {
        background: linear-gradient(135deg, var(--bsp-primary), var(--bsp-accent));
        border-color: var(--bsp-primary);
        color: white;
        box-shadow: 0 3px 12px rgba(74,125,117,0.32);
    }

    /* ── EMPTY STATE ── */
    .buscador-pleno .empty-state {
        padding: 60px 20px;
        text-align: center;
    }

        .buscador-pleno .empty-state i {
            font-size: 48px;
            color: #b8d4d1;
            display: block;
            margin-bottom: 16px;
        }

        .buscador-pleno .empty-state p {
            color: var(--bsp-muted);
            font-size: 15px;
            margin: 0;
        }

/* ── RESPONSIVE ── */
@media (max-width: 992px) {
    .buscador-pleno .card-bento {
        padding: 24px 20px;
    }
}

@media (max-width: 768px) {
    .buscador-pleno .card-bento {
        padding: 18px 14px;
        border-radius: 14px;
        margin-top: 14px;
    }

    .buscador-pleno .buscador-titulo {
        font-size: 18px;
    }

    .buscador-pleno .buscador-subtitulo {
        font-size: 12px;
    }

    .buscador-pleno .form-label {
        font-size: 11px;
    }

    .buscador-pleno .form-control,
    .buscador-pleno .form-select {
        font-size: 14px; /* nunca bajar de 14px en móvil */
        padding: 10px 12px;
    }

    /* Tabla scrollable en móvil */
    .buscador-pleno .table-responsive {
        font-size: 13px;
    }

    .buscador-pleno .tabla-pleno thead th {
        font-size: 11px;
        padding: 10px 10px;
    }

    .buscador-pleno .tabla-pleno tbody td {
        padding: 10px 10px;
        font-size: 13px;
    }

    .buscador-pleno .descripcion-acuerdo {
        max-width: 200px;
        font-size: 13px;
    }

    .buscador-pleno .btn-doc {
        font-size: 12px;
        padding: 5px 10px;
    }

    .buscador-pleno .btn-primary-crt,
    .buscador-pleno .btn-outline-secondary {
        font-size: 14px;
        padding: 11px 18px;
    }

    .buscador-pleno .badge-tipo {
        font-size: 11px;
        padding: 3px 10px;
    }
}

@media (max-width: 480px) {
    .buscador-pleno .buscador-header {
        gap: 12px;
    }

    .buscador-pleno .buscador-header-icon {
        width: 42px;
        height: 42px;
    }

        .buscador-pleno .buscador-header-icon i {
            font-size: 18px;
        }

    .buscador-pleno .buscador-titulo {
        font-size: 16px;
    }

    .buscador-pleno .tabla-pleno tbody td {
        font-size: 12px;
    }
}