/* constructor_normas_only.css
 * Ajustes para constructor con un único catálogo de normas.
 * Se carga DESPUÉS de css_constructor.css para evitar modificar el CSS base.
 */

.constructor-page .cp-normas-only-panel {
    padding: 1.2rem;
    overflow: visible;
}

.constructor-page .cp-normas-only-panel .cp-custom-builder {
    padding: 0;
}

.constructor-page .cp-normas-only-panel .cp-custom-head {
    padding-bottom: 1rem;
}

.constructor-page .cp-normas-only-panel .cp-normas-filters {
    padding: 0 0 .65rem;
}

.constructor-page .cp-normas-only-panel .cp-result-line {
    padding: .35rem 0 1rem;
}

.constructor-page .cp-normas-only-panel .cp-custom-levels {
    display: flex;
    gap: .65rem;
    flex-wrap: wrap;
}

.constructor-page .cp-normas-only-panel .cp-custom-levels .cp-level-btn {
    min-width: 135px;
    min-height: 46px;
}

.constructor-page .cp-normas-only-panel .cp-norma-row > div:first-child,
.constructor-page .cp-normas-only-panel .cp-selected-norma > div:first-child {
    min-width: 0;
}

.constructor-page .cp-normas-only-panel .cp-norma-row strong,
.constructor-page .cp-normas-only-panel .cp-selected-norma strong {
    white-space: normal;
}

@media (max-width: 767.98px) {
    .constructor-page .cp-normas-only-panel {
        padding: 1rem;
    }

    .constructor-page .cp-normas-only-panel .cp-custom-levels {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .constructor-page .cp-normas-only-panel .cp-custom-levels .cp-level-btn {
        min-width: 0;
        width: 100%;
    }
}

/* Paso 5.2 — Información clara del medio de pago en el resumen. */
.constructor-page .cp-payment-methods {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .4rem;
    margin-top: .3rem;
    color: var(--cp-muted);
    font-size: .79rem;
    line-height: 1.45;
    text-align: center;
}
.constructor-page .cp-payment-methods i {
    font-size: .96rem;
    color: var(--cp-primary);
}

/* En el detalle comercial cada fila contiene solo título y preguntas. */
.constructor-page .cp-law-row {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .75rem;
}
@media (max-width: 575.98px) {
    .constructor-page .cp-law-row {
        grid-template-columns: minmax(0, 1fr);
    }
    .constructor-page .cp-law-questions {
        grid-column: 1;
    }
}

/* Paso 5.3: una única barra de búsqueda; sin selectores de categoría ni nivel. */
.constructor-page .cp-normas-only-panel .cp-normas-filters {
    display: block;
}
.constructor-page .cp-normas-only-panel .cp-normas-filters .cp-search {
    width: 100%;
    max-width: none;
}
/* El periodo de 3 meses está recomendado visualmente, aunque el seleccionado sea 1 mes. */
.constructor-page .cp-duration-card.cp-duration-popular {
    border: 2px solid #3579e4;
    background: #f5f9ff;
    box-shadow: 0 3px 14px rgba(13, 110, 253, .10);
    min-height: 88px;
    padding-top: 12px;
}
.constructor-page .cp-duration-card.cp-duration-popular .cp-popular-badge {
    top: -13px;
    left: 50%;
    right: auto;
    transform: translateX(-50%);
    white-space: nowrap;
    background: #174ea6;
    color: #fff;
    padding: .18rem .46rem;
    font-size: .68rem;
    font-weight: 800;
    line-height: 1.35;
    letter-spacing: 0;
    z-index: 1;
}
.constructor-page .cp-duration-grid .btn-check:focus-visible + .cp-duration-card {
    outline: 3px solid #7bb4ff;
    outline-offset: 3px;
}
/* Iconos de tarjetas: pequeños, autoalojados y adaptables. */
.constructor-page .cp-payment-methods {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .45rem;
    margin-top: .5rem;
    color: var(--cp-muted);
    font-size: .8rem;
}
.constructor-page .cp-payment-heading {
    font-weight: 700;
    font-size: .77rem;
    color: #556579;
}
.constructor-page .cp-payment-logos {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: .46rem;
}
.constructor-page .cp-payment-brand {
    width: 74px;
    height: 43px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: .2rem;
    border: 1px solid #e1e7f0;
    border-radius: 9px;
    background: #fff;
    box-shadow: 0 2px 6px rgba(22, 42, 71, .035);
}
.constructor-page .cp-payment-brand img {
    width: 62px;
    height: 34px;
    max-width: 100%;
    object-fit: contain;
    display: block;
}
.constructor-page .cp-payment-note {
    font-size: .71rem;
    color: var(--cp-muted);
    text-align: center;
}


/* Paso 5.4 — Solo el periodo realmente elegido lleva el tratamiento de selección. */
.constructor-page .cp-duration-grid .cp-duration-card.cp-duration-popular {
    border: 1.5px solid var(--cp-border, #dae2ef);
    background: #fff;
    box-shadow: none;
    transform: none;
}
.constructor-page .cp-duration-grid .btn-check:checked + .cp-duration-card,
.constructor-page .cp-duration-grid .btn-check:checked + .cp-duration-card.cp-duration-popular {
    border: 2px solid var(--cp-primary, #0d6efd);
    background: linear-gradient(135deg, var(--cp-primary, #0d6efd), #075fe8);
    box-shadow: 0 8px 19px rgba(13,110,253,.19);
    color: #fff;
}
.constructor-page .cp-duration-grid .btn-check:checked + .cp-duration-card::after {
    content: '✓ Elegido';
    font-size: .66rem;
    font-weight: 800;
    letter-spacing: .01em;
    line-height: 1.2;
    margin-top: .15rem;
    color: #fff;
}
/* La insignia de popularidad NO es un indicador de selección. */
.constructor-page .cp-duration-card.cp-duration-popular .cp-popular-badge {
    background: #174ea6;
}

/* Normas disponibles y elegidas: nombre | cantidad | acción. */
.constructor-page .cp-normas-only-panel .cp-norma-row,
.constructor-page .cp-normas-only-panel .cp-selected-norma {
    display: grid;
    grid-template-columns: minmax(0, 1fr) max-content auto;
    align-items: center;
    gap: .65rem;
    padding: .58rem .75rem;
}
.constructor-page .cp-normas-only-panel .cp-norma-name {
    min-width: 0;
}
.constructor-page .cp-normas-only-panel .cp-norma-name strong {
    font-size: .83rem;
    line-height: 1.3;
}
.constructor-page .cp-normas-only-panel .cp-norma-questions {
    white-space: nowrap;
    text-align: right;
    color: #364a65;
    font-size: .82rem;
    font-weight: 750;
    font-variant-numeric: tabular-nums;
}
.constructor-page .cp-normas-only-panel .cp-norma-questions span {
    font-size: .73rem;
    font-weight: 400;
    color: #697991;
}
.constructor-page .cp-normas-only-panel .cp-selected-norma button {
    justify-self: end;
}

/* Tarjetas de pago discretas y sin el aviso azul. */
.constructor-page .cp-payment-methods {
    margin-top: .22rem;
    gap: .22rem;
}
.constructor-page .cp-payment-logos {
    gap: .28rem;
    flex-wrap: wrap;
}
.constructor-page .cp-payment-brand {
    width: 46px;
    height: 29px;
    padding: .15rem .2rem;
    border-radius: 5px;
    box-shadow: none;
    border-color: #e8ecf2;
}
.constructor-page .cp-payment-brand img {
    width: 38px;
    height: 23px;
}
.constructor-page .cp-payment-brand.cp-payment-klarna {
    width: 59px;
    height: 31px;
    padding: .1rem .18rem .2rem;
    position: relative;
    border-style: dashed;
    opacity: .76;
}
.constructor-page .cp-payment-brand.cp-payment-klarna img {
    width: 48px;
    height: 21px;
}
.constructor-page .cp-klarna-pending {
    position: absolute;
    bottom: -8px;
    left: 50%;
    transform: translateX(-50%);
    padding: 0 .14rem;
    background: #fff;
    color: #5c6677;
    font-size: .48rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -.02em;
    white-space: nowrap;
}
/* Even if an older stylesheet still defines this element, hide it. */
.constructor-page .cp-payment-note { display: none !important; }

@media (max-width: 640px) {
    .constructor-page .cp-normas-only-panel .cp-norma-row,
    .constructor-page .cp-normas-only-panel .cp-selected-norma {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: .22rem .5rem;
    }
    .constructor-page .cp-normas-only-panel .cp-norma-name {
        grid-column: 1;
        grid-row: 1 / span 2;
    }
    .constructor-page .cp-normas-only-panel .cp-norma-questions {
        grid-column: 2;
        grid-row: 1;
        font-size: .73rem;
    }
    .constructor-page .cp-normas-only-panel .cp-norma-questions span {
        font-size: .68rem;
    }
    .constructor-page .cp-normas-only-panel .cp-norma-row > button,
    .constructor-page .cp-normas-only-panel .cp-selected-norma > button,
    .constructor-page .cp-normas-only-panel .cp-selected-norma > span:last-child {
        grid-column: 2;
        grid-row: 2;
        justify-self: end;
    }
}


/* Paso 5.5 — Catálogo a todo el ancho: el carrito ya muestra las normas elegidas. */
.constructor-page .cp-normas-only-panel .cp-custom-grid.cp-custom-grid-single {
    grid-template-columns: minmax(0, 1fr);
}
.constructor-page .cp-normas-only-panel .cp-custom-grid-single .cp-custom-results { min-width: 0; }
.constructor-page .cp-normas-only-panel .cp-custom-grid-single .cp-normas-list { max-height: 430px; }
.constructor-page .cp-duration-panel .cp-discount-icon { color: var(--cp-primary, #2563eb); font-size: .95em; margin-right: .3rem; }
.constructor-page .cp-benefits .cp-ai-benefit span { font-size: .71rem; line-height: 1.35; }
.constructor-page .cp-benefits .cp-ai-benefit span a {
    color: #2a5689;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}
.constructor-page .cp-benefits .cp-ai-benefit span a:hover,
.constructor-page .cp-benefits .cp-ai-benefit span a:focus-visible { color: var(--cp-primary, #0d6efd); }
.constructor-page .cp-benefits .cp-ai-benefit span a i { display:inline; background:transparent; width:auto; height:auto; font-size: .7rem; border-radius:0; }
/* Klarna como proveedor (solo si está confirmado), nunca como cuarta tarjeta. */
.constructor-page .cp-secure.cp-secure-compact { display:flex; align-items:center; justify-content:center; gap:.55rem; flex-wrap:wrap; }
.constructor-page .cp-secure.cp-secure-compact > span { display:inline-flex; align-items:center; gap:.3rem; }
.constructor-page .cp-secure-provider { padding:.06rem .28rem; border-radius:5px; background:#ffb3c7; }
.constructor-page .cp-secure-provider img { display:block; width:44px; height:22px; object-fit:contain; }

/* Paso 5.6: tabla densa, cabecera de preguntas y botones icono. */
.constructor-page .cp-normas-only-panel .cp-normas-table-head,
.constructor-page .cp-normas-only-panel .cp-norma-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(105px, 145px) 37px;
    gap: .65rem;
    align-items: center;
    padding: .37rem .8rem;
}
.constructor-page .cp-normas-only-panel .cp-normas-table-head {
    color: #596b82; font-size: .7rem; font-weight: 800;
    letter-spacing: .015em; background: #f4f7fc;
    border-bottom: 1px solid #dfe6f1;
}
.constructor-page .cp-normas-only-panel .cp-normas-table-head span:nth-child(2) { text-align:right; }
.constructor-page .cp-normas-only-panel .cp-norma-row { min-height: 40px; }
.constructor-page .cp-normas-only-panel .cp-norma-row strong { font-size: .81rem; line-height: 1.3; }
.constructor-page .cp-normas-only-panel .cp-norma-row .cp-norma-questions { font-size: .8rem; }
.constructor-page .cp-normas-only-panel .cp-norma-row button.cp-norma-add {
    display:inline-flex; align-items:center; justify-content:center;
    justify-self:end; width:31px; height:31px; min-width:31px;
    padding:0; border-radius:8px; font-size:.88rem;
}
.constructor-page .cp-normas-only-panel .cp-norma-row button.cp-norma-add i { margin: 0; }
/* Precio visible del pack elegido, calculado a partir de la configuración vigente. */
.constructor-page .cp-cycle-prices {display:flex;flex-direction:column;gap:.12rem;margin-top:.3rem;font-size:.73rem;line-height:1.28;}
.constructor-page .cp-cycle-prices .cp-cycle-context {opacity:.75;font-size:.65rem;}
.constructor-page .cp-cycle-prices .cp-cycle-level {display:block;white-space:normal;}
.constructor-page .cp-cycle-prices strong {font-weight:800;}
.constructor-page .cp-cycle-prices del {font-size:.64rem;opacity:.72;margin-left:.2rem;}
.constructor-page .cp-duration-card { /*min-height:122px;*/ }
@media (max-width: 575.98px) {
    .constructor-page .cp-normas-only-panel .cp-normas-table-head,
    .constructor-page .cp-normas-only-panel .cp-norma-row {
        grid-template-columns: minmax(0, 1fr) 76px 31px;
        gap:.35rem; padding:.42rem .5rem;
    }
    .constructor-page .cp-normas-only-panel .cp-normas-table-head {font-size:.59rem;}
    .constructor-page .cp-normas-only-panel .cp-norma-row .cp-norma-name,
    .constructor-page .cp-normas-only-panel .cp-norma-row .cp-norma-questions,
    .constructor-page .cp-normas-only-panel .cp-norma-row button.cp-norma-add {grid-row:auto;grid-column:auto;}
    .constructor-page .cp-duration-card {min-height:145px;}
    .constructor-page .cp-cycle-prices {font-size:.67rem;}
}

/* Paso 5.7 — Departamento discreto bajo la denominación, sin ampliar columnas. */
.constructor-page .cp-normas-only-panel .cp-norma-name .cp-norma-department,
.constructor-page .cp-normas-only-panel .cp-selected-norma .cp-norma-department {
    display: block; margin-top: .11rem; color: #64748b; font-size: .68rem;
    line-height: 1.2; font-weight: 400; overflow-wrap: anywhere;
}
.constructor-page .cp-cart-department { display: block; color: #64748b; font-size: .74rem; line-height: 1.2; }
.constructor-page .cp-normas-only-panel .cp-norma-row { min-height: 43px; }


/* FIX 2026-10-11: filtros de materias y departamentos y títulos íntegros. */
.constructor-page .cp-normas-only-panel .cp-normas-filters {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .8rem;
    padding: 0 0 .85rem;
}
.constructor-page .cp-normas-only-panel .cp-normas-filters .cp-search {
    grid-column: 1 / -1;
    width: 100%;
    min-width: 0;
}
.constructor-page .cp-normas-only-panel .cp-filter-field {
    display: flex;
    flex-direction: column;
    gap: .35rem;
    min-width: 0;
}
.constructor-page .cp-normas-only-panel .cp-filter-field label {
    font-size: .83rem;
    font-weight: 700;
    color: var(--cp-text, #24334a);
}
.constructor-page .cp-normas-only-panel .cp-filter-field .form-select {
    width: 100%;
    min-width: 0;
    min-height: 46px;
    border-color: var(--cp-border, #dce3ee);
    border-radius: 12px;
}
.constructor-page .cp-normas-only-panel .cp-norma-name { min-width: 0; }
.constructor-page .cp-normas-only-panel .cp-norma-name strong {
    white-space: normal;
    overflow-wrap: anywhere;
    line-height: 1.42;
}
.constructor-page .cp-normas-only-panel .cp-norma-boe-id {
    display: inline-block;
    margin-right: .6rem;
    font-size: .75rem;
    color: var(--cp-muted, #64748b);
}
.constructor-page .cp-normas-only-panel .cp-load-more {
    display: block;
    width: 100%;
    padding: .7rem;
    border: 0;
    border-top: 1px solid var(--cp-border, #dce3ee);
    color: var(--cp-primary, #0d6efd);
    background: #f8fbff;
    font-weight: 750;
    cursor: pointer;
}
.constructor-page .cp-normas-only-panel .cp-load-more:hover { background: #edf5ff; }
.constructor-page .cp-normas-only-panel .cp-load-more:disabled { opacity: .6; cursor: wait; }
.constructor-page .cp-normas-only-panel .cp-load-more.d-none { display: none; }
@media (max-width: 575.98px) {
    .constructor-page .cp-normas-only-panel .cp-normas-filters {
        grid-template-columns: minmax(0, 1fr);
    }
}