/* MrWebFeeder-FOSSTPL - presentacion de productos (pagina de pedido) */

.esda-desc { margin: .5rem 0 1rem; }
.esda-desc p { margin: .4rem 0; }
.esda-desc table { font-size: .92rem; }

.esda-feat {
    list-style: none;
    margin: .75rem 0 1rem;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: .5rem .75rem;
}
.esda-feat li {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
    padding: .55rem .75rem;
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: .6rem;
    background: var(--bs-body-bg, #fff);
    line-height: 1.35;
}
.esda-feat li::before {
    content: "\2713";
    flex: 0 0 1.4rem;
    width: 1.4rem;
    height: 1.4rem;
    margin-top: .05rem;
    border-radius: 50%;
    background: #198754;
    color: #fff;
    font-size: .8rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.esda-feat li.no { border-style: dashed; opacity: .85; }
.esda-feat li.no::before { content: "\2715"; background: #dc3545; }

.esda-note {
    margin: .6rem 0;
    padding: .65rem .9rem;
    border-left: 4px solid #1c5faa;
    border-radius: .4rem;
    background: rgba(28, 95, 170, .08);
    font-size: .93rem;
}

/* tarjeta del producto */
.order-product .well {
    padding: 1.25rem 1.5rem;
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: .8rem;
    background: var(--bs-tertiary-bg, #f8f9fa);
}
.order-product .well > h3 {
    margin-bottom: .75rem;
    padding-bottom: .6rem;
    border-bottom: 2px solid #1c5faa;
    font-size: 1.6rem;
    font-weight: 700;
    color: #1c5faa;
}
.order-product .well h4 { font-size: 1.1rem; }
.order-product .well #period-selector { max-width: 360px; font-weight: 600; }

/* lista de productos */
#products .list-group-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .5rem;
}
#products .list-group-item:hover { background: rgba(28, 95, 170, .07); }

/* subtitulos, notas agrupadas e imagenes dentro de la descripcion */
.esda-sub {
    margin: 1.2rem 0 .4rem;
    font-size: 1.05rem;
    font-weight: 700;
    color: #1c5faa;
}
.esda-note-line + .esda-note-line { margin-top: .3rem; }
.esda-img img { max-width: 220px; height: auto; margin: .3rem 0 .6rem; }