/*
 * ePrilux · Opiniones de producto en la ficha (bloque [epx_opiniones], módulo opiniones; 28/10/2026).
 * Es la plantilla de opiniones de WooCommerce: aquí solo su aspecto, con los tokens de la web. Los selectores llevan
 * #opiniones #reviews porque los de WooCommerce («.woocommerce #reviews #comments …») pesan más que una clase.
 */

.epx-opiniones{font-family:Montserrat,sans-serif;font-size:14px;line-height:1.6;color:#06163d}
#opiniones #reviews{margin:0}
#opiniones #reviews .woocommerce-Reviews-title{display:none} /* ya lo dice el título de la sección */
#opiniones #reviews .woocommerce-noreviews{margin:0 0 20px;color:#5b6270}

/* Lista */
#opiniones #reviews #comments ol.commentlist{list-style:none;margin:0 0 28px;padding:0;display:grid;gap:12px}
#opiniones #reviews #comments ol.commentlist li{margin:0;padding:18px 20px;background:#fff;border:1px solid #e4e6e9;border-radius:2px}
#opiniones #reviews #comments ol.commentlist li .avatar{display:none}
#opiniones #reviews #comments ol.commentlist li .comment-text{margin:0!important;padding:0!important;border:0!important}
#opiniones #reviews .meta{margin:6px 0 8px!important;font-size:12px;color:#8a909e}
#opiniones #reviews .meta strong{font-weight:600;color:#06163d}
#opiniones #reviews .meta .woocommerce-review__verified{font-style:normal;color:#1e7a4c;font-weight:500}
#opiniones #reviews .description p{margin:0}

/* Estrellas */
#opiniones #reviews .star-rating{float:none;margin:0;color:#E8A920}
#opiniones #reviews p.stars a{color:#E8A920}
#opiniones #reviews p.stars{margin:6px 0 0}

/* Formulario */
#opiniones #reviews #review_form_wrapper{padding:24px;background:#f7f7f5;border:1px solid #e4e6e9;border-radius:2px}
#opiniones #reviews #reply-title{display:block;margin:0 0 6px;font-size:17px;font-weight:600;color:#06163d}
#opiniones #reviews .comment-notes{margin:0 0 14px;font-size:12px;color:#8a909e}
#opiniones #reviews .comment-form p{margin:0 0 14px}
#opiniones #reviews .comment-form label{display:block;margin-bottom:6px;font-size:12px;font-weight:600;color:#06163d}
#opiniones #reviews .comment-form textarea,#opiniones #reviews .comment-form input[type=text],#opiniones #reviews .comment-form input[type=email]{box-sizing:border-box;width:100%;max-width:560px;padding:11px 14px;border:1px solid #c9ccd2;border-radius:2px;background:#fff;font:inherit;color:#06163d}
#opiniones #reviews .comment-form textarea{max-width:none;min-height:120px}
#opiniones #reviews .comment-form input[readonly]{background:#eef0f2;color:#5b6270}
#opiniones #reviews .comment-form .form-submit{margin:0}
#opiniones #reviews .comment-form .submit{padding:13px 26px;border:1px solid #06163d!important;border-radius:2px;background:#FDCF63!important;color:#06163d!important;font:600 12px/1 Montserrat,sans-serif;letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
#opiniones #reviews .comment-form .submit:hover{background:#06163d!important;color:#fff!important}
#opiniones #reviews .woocommerce-verification-required{margin:0;padding:16px 20px;background:#f7f7f5;border:1px solid #e4e6e9;border-radius:2px;color:#5b6270}

/* Sin opiniones el atajo sale vacío: fuera la sección entera (título incluido) de la plantilla de ficha 295 */
[data-elementor-id="295"] > :has(.epx-opiniones-bloque .elementor-shortcode:empty){display:none!important}

.epx-opiniones-nota{margin:14px 0 0;font-size:12px;color:#8a909e}

/* /tu-caja/: opinar con el número de pedido y el correo ([epx_opinar_pedido]) */
.epx-opinar{font-family:Montserrat,sans-serif;font-size:14px;line-height:1.6;color:#06163d;text-align:left}
.epx-opinar-form{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
.epx-opinar-form p{margin:0!important;flex:1 1 200px}
.epx-opinar-form p.epx-opinar-enviar{flex:0 0 auto}
.epx-opinar-form label{display:block;margin-bottom:6px;font-size:12px;font-weight:600;color:#06163d}
.epx-opinar-form input{box-sizing:border-box;width:100%;padding:11px 14px;border:1px solid #c9ccd2;border-radius:2px;background:#fff;font:inherit;color:#06163d}
.epx-opinar-form button,.epx-opinar-valorar button,.epx-opinar-btn{display:inline-block;padding:12px 22px;border:1px solid #06163d;border-radius:2px;background:#FDCF63;color:#06163d!important;font:600 12px/1.2 Montserrat,sans-serif;letter-spacing:.08em;text-transform:uppercase;text-decoration:none!important;cursor:pointer;white-space:nowrap}
.epx-opinar-form button:hover,.epx-opinar-valorar button:hover,.epx-opinar-btn:hover{background:#06163d;color:#fff!important}
.epx-opinar-form input::placeholder{color:#8a909e;opacity:1}
/* Globito de ayuda junto a «N.º de pedido» (<details>: se abre y se cierra al pulsar el «?») */
.epx-opinar-pedido{position:relative;flex:1 1 200px}
.epx-opinar-pedido>label{display:inline-block}
.epx-ayuda{display:inline-block;margin:0 0 0 6px;vertical-align:top}
.epx-ayuda summary{display:flex;align-items:center;justify-content:center;width:18px;height:18px;border:1px solid #23a7d6;border-radius:2px;background:#fff;color:#23a7d6;font:700 11px/1 Montserrat,sans-serif;list-style:none;cursor:pointer;user-select:none}
.epx-ayuda summary::-webkit-details-marker{display:none}
.epx-ayuda summary:hover,.epx-ayuda[open] summary{background:#23a7d6;color:#fff}
.epx-ayuda-globo{position:absolute;z-index:20;left:0;bottom:calc(100% + 8px);width:280px;max-width:calc(100vw - 44px);box-sizing:border-box;padding:12px 14px;border-radius:2px;background:#06163d;color:#fff;font-size:12px;font-weight:400;line-height:1.5;text-align:left;box-shadow:0 6px 18px rgba(6,22,61,.18)}
.epx-ayuda-globo::after{content:"";position:absolute;top:100%;left:103px;border:6px solid transparent;border-top-color:#06163d}
.epx-opinar-aviso{margin:12px 0 0!important;padding:12px 16px;border:1px solid #e4e6e9;border-left:3px solid #E8A920;border-radius:2px;background:#fff;font-size:13px;color:#3a4257}
.epx-opinar-hola{margin:0 0 12px!important}
.epx-opinar-lista{list-style:none;margin:0!important;padding:0!important}
.epx-opinar-lista li{display:grid;grid-template-columns:56px 1fr;gap:14px;align-items:start;margin:0!important;padding:14px 0;border-top:1px solid #e4e6e9}
.epx-opinar-lista img{display:block;width:56px;height:56px;object-fit:cover;border:1px solid #e4e6e9;border-radius:2px}
.epx-opinar-nombre{font-size:13px}
.epx-opinar-hecho{display:block;margin-top:4px;font-size:12px;color:#1e7a4c;font-weight:500}
/* Valorar ahí mismo: estrellas (radios del 5 al 1 en fila invertida) y comentario */
.epx-opinar-prod{min-width:0}
.epx-opinar-nombre{display:block;font-weight:600}
.epx-estrellas{display:inline-flex;flex-direction:row-reverse;justify-content:flex-end;gap:2px;margin:4px 0 6px!important;padding:0!important;border:0!important}
.epx-estrellas legend{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.epx-estrellas input{position:absolute;opacity:0;width:1px;height:1px}
.epx-estrellas label{padding:0 2px;font-size:30px;line-height:1;color:#d5d8de;cursor:pointer;transition:color .1s}
.epx-estrellas input:checked~label,.epx-estrellas label:hover,.epx-estrellas label:hover~label{color:#E8A920}
.epx-estrellas input:focus-visible+label{outline:1px solid #23a7d6;outline-offset:2px}
.epx-opinar-texto{display:block;margin:0}
.epx-opinar-texto span{display:block;margin-bottom:4px;font-size:12px;color:#8a909e}
.epx-opinar-texto textarea{box-sizing:border-box;width:100%;min-height:64px;padding:10px 12px;border:1px solid #c9ccd2;border-radius:2px;background:#fff;font:inherit;font-size:13px;color:#06163d;text-align:left;resize:vertical}
.epx-opinar-texto textarea::placeholder{color:#8a909e;opacity:1}
.epx-opinar-valorar .epx-opinar-enviar{margin:16px 0 0!important;text-align:center}
.epx-opinar-gracias{margin:0 0 14px!important;padding:14px 16px;border:1px solid #e4e6e9;border-left:3px solid #1e7a4c;border-radius:2px;background:#fff;font-size:14px}

@media (max-width:767px){.epx-opinar-lista li{grid-template-columns:48px 1fr}.epx-opinar-lista img{width:48px;height:48px}.epx-opinar-valorar button{width:100%}.epx-opinar-form p.epx-opinar-enviar{flex:1 1 100%}.epx-opinar-form button{width:100%}}
@media (max-width:767px){#opiniones #reviews #review_form_wrapper{padding:18px}#opiniones #reviews #comments ol.commentlist li{padding:14px 16px}}