.qwpp-container{
    max-width:1200px;
    margin:auto;
    font-family:poppins !important;
}

.qwpp-container,
.qwpp-container *{
    font-family: 'Poppins', sans-serif !important;
	text-transform: none !important;
}

a.um-button.um-alt{
    border-radius:16px !important;
}

.um-right.um-half br{
    display:none !important;
}

.um-field-area input{
    border-radius:10px !important;
}

form#qwpp-form br {
    display: none;
}

.container-user-info{
    display:flex;
    flex-direction:row;
    justify-content:space-between;
    align-items:center;
}

.qwpp-form-login,
.qwpp-form-register{
    border:1px solid #eee;
    border-radius:16px;
    padding:30px;
}

.qwpp-auth-buttons{
    display:flex;
    justify-content:center;
    gap:10px;
    margin-bottom:20px;
}

.qwpp-auth-btn{
    text-transform:none;
    padding:12px 20px;
    border:none;
    border-radius:8px;
    cursor:pointer;
    background:#0654D2;
    color:#fff;
    font-weight:600;
    transition:.2s;
}

.qwpp-auth-btn.active{
    background:#03012d;
    color:#fff;
}

.qwpp-logout-btn{
    background:#111;
    color:#fff;
    padding:8px 12px;
    border-radius:8px;
    text-decoration:none;
    font-size:12px;
    transition:.2s;
}

.qwpp-logout-btn:hover{
    background:#eb003d;
    color:#fff;
}

.um-col-1{
    gap:20px;
    display:flex;
    flex-direction:column;
}

.titulo-def{
    line-height:normal;
    text-align:center;
    margin-bottom:30px;
    margin-top:30px;
}

.titulo-def h2{
    text-transform:none;
    font-family:'Poppins';
    line-height:1;
}

.msd-part h2{
    text-transform:none;
    font-weight:600;
    font-family:'Poppins';
}

.qwpp-card h4{
    font-size:16px;
    font-weight:600;
}

/* =========================
   BANNER / SLIDER
========================= */

.qwpp-banner{
    width:100%;
    height:350px;
    overflow:hidden;
    border-radius:20px;
    margin-bottom:20px;
    position:relative;
    background:#ddd;
}

.qwpp-slider{
    position:relative;
    width:100%;
    height:100%;
}

.qwpp-slide{
    position:absolute;
    inset:0;
    opacity:0;
    transition:opacity .8s ease;
}

.qwpp-slide.active{
    opacity:1;
    z-index:2;
}

.qwpp-slide img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}

/* =========================
   GRID
========================= */

.qwpp-grid{
    margin-bottom:50px;
    display:flex;
    flex-direction:row;
    gap:20px;
}

.qwpp-card{
    background:#fff;
    padding:20px;
    border-radius:12px;
    box-shadow:0 2px 10px rgba(0,0,0,0.05);
}

.qwpp-question{
    margin-bottom:20px;
    border-bottom:1px solid #eee;
    padding-bottom:15px;
}

.qwpp-title{
    margin-bottom:10px;
}

.qwpp-user br{
    display:none;
}

p.qwpp-fecha-cierre {
    border-radius: 16px;
    padding: 5px 10px;
    border: 1px solid #d6d6d6ee;
    width: max-content;
    color: #7d7d7d;
    font-weight: 400;
    font-size: 13px;
}

form#qwpp-form {
    padding-top: 27px;
    border-top: 1px solid #cfcfcfee;
    margin-top: 36px;
}

/* elimina p vacíos */
.qwpp-container p:empty{
    display:none !important;
    margin:0 !important;
    padding:0 !important;
}

.qwpp-card p,
.qwpp-card ul{
    margin:0;
}

.qwpp-subtitle{
    color:#000;
    font-weight:bold;
    font-size:22px;
    margin-top:-10px;
    margin-bottom:0px !important;
}

.qwpp-card h5{
    margin-bottom:0;
    font-size:15px;
}

.qwpp-select, input.qwpp-select{
    width:50%;
    padding:10px;
    border-radius:8px;
    border:1px solid #ddd;
    background:#f9f9f9;
    margin-bottom:10px;
    font-size:14px;
}

.qwpp-btn{
    background:#0d6efd;
    color:#fff;
    padding:10px 20px;
    border:none;
    border-radius:8px;
    cursor:pointer;
    transition:.2s;
}

.qwpp-btn:hover{
    opacity:.9;
}

.qwpp-sidebar{
    display:flex;
    flex-direction:column;
    gap:20px;
}

.qwpp-user{
    display:flex;
    align-items:center;
    gap:10px;
}

.qwpp-avatar{
    width:50px;
    height:50px;
    background:#ccc;
    border-radius:50%;
}



.qwpp-history-modal{
    display:none;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    overflow:auto;
    background:rgba(0,0,0,.7);
    z-index:999999;
    padding:40px 20px;
    box-sizing:border-box;
}

/* MODAL */

.qwpp-history-content{
    width:min(1100px,95%);
    max-height:90vh;
    overflow:auto;
    margin:40px auto;
    background:#fff !important;
    border-radius:24px;
    padding:30px;
    position:relative;
}

/* HEADER */

.qwpp-history-header {
    gap: 20px;
    display: flex;
    justify-content: flex-start;
    margin-bottom: 25px;
    align-items: center;
}

.qwpp-history-content p {
    margin: 0px;
}

button.qwpp-history-close:hover {
    background: #eeee;
}

.qwpp-history-header h3{
    margin:0;
    font-size:28px;
    font-weight:700;
}

.qwpp-answer-response {
    gap: 10px;
    display: flex;
    flex-direction: row;
}

.qwpp-history-total{
    background:#f3f4f6 !important;
    padding:8px 14px;
    border-radius:999px;
    font-size:13px;
    font-weight:600;
}

/* CLOSE */

.qwpp-history-close{
    position:absolute;
    right:20px;
    top:20px;
    border:none;
    background:none;
    font-size:22px;
    cursor:pointer;
}

button.qwpp-toggle-respuestas.active:focus {
    background-color: white !important;
}

/* LIST */

.qwpp-history-list{
    display:flex;
    flex-direction:column;
    gap:16px;
}

/* CARD */

.qwpp-history-card{
    border:1px solid #ececec;
    border-radius:18px;
    overflow:hidden;
    background:#fff !important;
}

/* HEADER CARD */

.qwpp-toggle-respuestas{
    border-radius: 16px;
    width:100%;
    border: 1px solid #eee;
    background: #ffffff !important;
    cursor:pointer;
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:20px;
    text-align:left;
}

.qwpp-toggle-respuestas:hover{
    background:#fafafa;
}

.qwpp-history-info h4{
    margin: 0 0 0px;
    font-size:18px;
    font-weight: 700;
}

.qwpp-history-info span{
    font-weight: 500;
    color:#777;
    font-size:13px;
}

.qwpp-history-score{
    text-align:center;
}

.qwpp-history-score strong{
    display:block;
    font-size:24px;
    line-height:1;
}

.qwpp-history-score small{
    color:#666;
}

/* DETAIL */

.qwpp-history-detail{
    max-height:0;
    overflow:hidden;
    transition:.35s ease;
    padding:0 20px;
    background:#fafafa;
    border-top:1px solid #ececec;
}

.qwpp-history-detail.open{
    max-height:3000px;
    padding:20px;
}

/* ANSWERS */

.qwpp-answer-card{
    background:#fff;
    border:1px solid #ececec;
    border-radius:14px;
    padding:16px;
    margin-bottom:12px;
}

.qwpp-answer-question{
    font-weight:700;
}

.qwpp-answer-card {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.tittle-part {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.qwpp-answer-footer {
    display: flex;
    align-items: flex-end;
    flex-direction: column;
}

.qwpp-answer-response{
    color:#555;
    margin-bottom:12px;
}


.qwpp-answer-footer .ok{
    color:#16a34a;
    font-weight:600;
}

.qwpp-answer-footer .fail{
    color:#dc2626;
    font-weight:600;
}

.qwpp-answer-footer .points{
    background:#111;
    color:#fff;
    padding:5px 10px;
    border-radius:999px;
    font-size:12px;
    font-weight:600;
}

/* EMPTY */

.qwpp-empty-state{
    text-align:center;
    padding:50px 20px;
}

.qwpp-empty-state h4{
    margin-bottom:10px;
}

.qwpp-history-detail{
    max-height:0;
    overflow:hidden;
    transition:.35s ease;
    padding:0 20px;
}

.qwpp-history-detail.open{
    max-height:3000px;
    padding:20px;
}

.qwpp-toggle-respuestas::after{
    content:'⌄';
    font-size:20px;
    transition:.3s;
}

.qwpp-history-score {
    color: black;
}

.qwpp-toggle-respuestas.active::after{
    transform:rotate(180deg);
}.qwpp-history-detail{
    max-height:0;
    overflow:hidden;
    transition:.35s ease;
    padding:0 20px;
}

.qwpp-history-detail.open{
    max-height:3000px;
    padding:20px;
}

.qwpp-toggle-respuestas::after{
    content:'⌄';
    font-size:20px;
    transition:.3s;
}

.qwpp-toggle-respuestas.active::after{
    transform:rotate(180deg);
}



.qwpp-toggle-respuestas::after{
    color: black;
    content:'▼';
    margin-left:15px;
    transition:transform .3s ease;
    display:inline-block;
}

.qwpp-toggle-respuestas.active::after{
    transform:rotate(180deg);
}

button#qwpp-history-open, p.puntos-user-front {
    height: 30px;
    border-radius: 12px;
    border: 1px solid #c4c4c4;
    padding: 5px 10px;
    background: none !important;
    color: #949494;
    font-size: 12px;
    font-weight: 500;
}

button#qwpp-history-open:hover {
    color: black;
}

/* =========================
   RESPONSIVE
========================= */

@media(max-width:480px){

    .qwpp-history-header {
        gap: 10px;
        display: flex;
        justify-content: flex-start;
        margin-bottom: 25px;
        align-items: flex-start;
        flex-direction: column;
    }

    .qwpp-history-content {
        padding: 20px;
    }

    .qwpp-history-detail.open {
        padding: 6px;
    }

    .qwpp-answer-card {
        font-size: 11px !important;
    }

    .qwpp-history-header h3 {
        margin: 0;
        font-size: 21px;
        font-weight: 700;
    }

    .qwpp-grid{
        flex-direction:column;
		gap: 10px;
    }

	
	p.qwpp-subtitle {
    margin-top: 6px;
    margin-bottom: 10px !important;
    line-height: 28px;
}

    .qwpp-card,
    .qwpp-sidebar{
		gap: 10px;
        width:100% !important;
    }
	
    .qwpp-sidebar{
		gap: 10px;
    }
	
	.msd-part {
		padding: 10px !important;
		width: 100%;
	}

	.qwpp-auth-btn {
		border-radius: 12px;
		font-size: 14px;
	}

    .qwpp-select{
        width:100%;
    }

    .qwpp-banner{
        height:120px;
    }

    .titulo-def h2{
        font-size:28px;
    }

	.qwpp-banner{
		margin-bottom:10px;
	}

    .qwpp-answer-footer {
    width: 30%;
    }   

    .tittle-part {
        padding-left: 10px;
        width: 70%;
    }


    .msd-part {
    text-align: left !important;
    border-top: 1px solid #d9d9d9;
    padding-top: 20px !important;
    margin-top: 30px;
        }
    
}