/* Public front-end enhancements CSS */

/* Single-question shortcode */
.ays-quiz-enh-single-question {
    max-width: 720px;
    margin: 1.5em 0;
    padding: 1.25em 1.5em;
    background: #fff;
    border: 1px solid #e6e8eb;
    border-radius: 10px;
    box-shadow: 0 1px 2px rgba(15, 20, 30, .04);
    font-size: 15px;
    color: #1f2933;
}
.ays-quiz-enh-single-question .ays-quiz-enh-q-image img {
    max-width: 100%;
    border-radius: 8px;
    margin-bottom: .75em;
}
.ays-quiz-enh-single-question .ays-quiz-enh-q-text {
    font-weight: 600;
    font-size: 1.05em;
    margin-bottom: 1em;
}
.ays-quiz-enh-answers {
    list-style: none;
    padding: 0;
    margin: 0 0 1em 0;
}
.ays-quiz-enh-answers .ays-quiz-enh-answer {
    padding: .6em .8em;
    margin: .4em 0;
    border: 1px solid #d7dbe0;
    border-radius: 8px;
    cursor: pointer;
    transition: background-color .15s ease, border-color .15s ease;
    color: #1f2933;
    background: #fff;
}
.ays-quiz-enh-answers .ays-quiz-enh-answer:hover {
    border-color: #7b8794;
    background: #f7f9fb;
}
.ays-quiz-enh-answers .ays-quiz-enh-answer label {
    display: flex;
    align-items: center;
    gap: .55em;
    margin: 0;
    cursor: pointer;
}
.ays-quiz-enh-answers .ays-quiz-enh-a-image {
    max-width: 60px;
    max-height: 60px;
    border-radius: 6px;
}

/* Correct / incorrect states */
.ays-quiz-enh-answer.ays-quiz-enh-correct,
.ays-quiz-enh-answer.ays-quiz-enh-should-be-correct {
    background: #22c55e !important;
    border-color: #16a34a !important;
    color: #fff !important;
    font-weight: 600;
}
.ays-quiz-enh-answer.ays-quiz-enh-correct label,
.ays-quiz-enh-answer.ays-quiz-enh-should-be-correct label,
.ays-quiz-enh-answer.ays-quiz-enh-correct label * ,
.ays-quiz-enh-answer.ays-quiz-enh-should-be-correct label * {
    color: #fff !important;
}
.ays-quiz-enh-answer.ays-quiz-enh-incorrect {
    background: #ef4444 !important;
    border-color: #dc2626 !important;
    color: #fff !important;
    font-weight: 600;
}
.ays-quiz-enh-answer.ays-quiz-enh-incorrect label,
.ays-quiz-enh-answer.ays-quiz-enh-incorrect label * {
    color: #fff !important;
}

.ays-quiz-enh-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5em;
    margin: .5em 0 .25em;
}
.ays-quiz-enh-btn {
    background: #1f2933;
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: .55em 1em;
    cursor: pointer;
    font-size: .95em;
    line-height: 1;
    transition: background .15s ease;
}
.ays-quiz-enh-btn:hover { background: #3e4c59; }
.ays-quiz-enh-hint-btn { background: #f59e0b; }
.ays-quiz-enh-hint-btn:hover { background: #d97706; }
.ays-quiz-enh-explain-btn { background: #2563eb; }
.ays-quiz-enh-explain-btn:hover { background: #1d4ed8; }
.ays-quiz-enh-reset-btn { background: #6b7280; }
.ays-quiz-enh-reset-btn:hover { background: #4b5563; }

.ays-quiz-enh-hint,
.ays-quiz-enh-explanation {
    margin-top: .85em;
    padding: .75em 1em;
    background: #f3f6fa;
    border-left: 3px solid #4b5563;
    border-radius: 4px;
    color: #1f2933;
}
.ays-quiz-enh-hint { border-left-color: #f59e0b; background: #fffaeb; }
.ays-quiz-enh-explanation { border-left-color: #2563eb; background: #eff5ff; }

.ays-quiz-enh-result {
    margin-top: .85em;
    padding: .55em .85em;
    border-radius: 6px;
    font-weight: 600;
}
.ays-quiz-enh-result.is-correct { background: #dcfce7; color: #14532d; }
.ays-quiz-enh-result.is-incorrect { background: #fee2e2; color: #7f1d1d; }
.ays-quiz-enh-result.is-warning { background: #fef3c7; color: #78350f; }

/* Question timer chip */
.ays-quiz-enh-qtimer {
    display: inline-flex;
    align-items: center;
    gap: .35em;
    font-size: 14px;
    font-weight: 600;
    background: #e0f2fe;
    color: #075985;
    padding: .35em .75em;
    border-radius: 999px;
    margin: 0 0 .8em auto;
    position: relative;
    z-index: 3;
}
.ays-quiz-enh-qtimer-warn { background: #fef3c7; color: #92400e; }
.ays-quiz-enh-qtimer-danger { background: #fee2e2; color: #991b1b; }

/* Paywall */
.ays-quiz-enh-paywall {
    max-width: 560px;
    margin: 2em auto;
    padding: 1.75em;
    text-align: center;
    background: #fff;
    border: 1px solid #e6e8eb;
    border-radius: 12px;
    box-shadow: 0 2px 6px rgba(15, 20, 30, .06);
    color: #1f2933;
}
.ays-quiz-enh-paywall-image img {
    max-width: 100%;
    max-height: 220px;
    border-radius: 8px;
    margin-bottom: 1em;
}
.ays-quiz-enh-paywall-title {
    font-size: 1.4em;
    font-weight: 800;
    margin: 0 0 .5em;
    color: #1f2933;
    line-height: 1.25;
}
.ays-quiz-enh-paywall-desc {
    text-align: left;
    color: #4b5563;
    margin: 0 0 1.1em;
    font-size: .95em;
}
.ays-quiz-enh-paywall-price {
    font-size: 1.35em;
    font-weight: 700;
    margin-bottom: 1em;
    color: #16a34a;
}
.ays-quiz-enh-paynow-btn {
    display: inline-block;
    background: #16a34a;
    color: #fff !important;
    padding: .8em 1.6em;
    border-radius: 999px;
    font-weight: 700;
    text-decoration: none;
    transition: transform .1s ease, background .15s ease;
}
.ays-quiz-enh-paynow-btn:hover { background: #15803d; transform: translateY(-1px); }

.ays-quiz-enh-auth-block { margin-top: .5em; }
.ays-quiz-enh-login-note { margin: 0 0 .75em; color: #6b7280; font-size: .95em; }
.ays-quiz-enh-auth-links {
    display: inline-flex;
    align-items: center;
    gap: .75em;
    flex-wrap: wrap;
    justify-content: center;
}
.ays-quiz-enh-login-link,
.ays-quiz-enh-register-link {
    display: inline-block;
    padding: .65em 1.3em;
    border-radius: 999px;
    text-decoration: none !important;
    font-weight: 700;
    color: #fff !important;
    background: #2563eb;
    transition: background .15s ease;
}
.ays-quiz-enh-login-link:hover { background: #1d4ed8; }
.ays-quiz-enh-register-link {
    background: #16a34a;
}
.ays-quiz-enh-register-link:hover { background: #15803d; }
.ays-quiz-enh-auth-sep { color: #6b7280; font-size: .95em; }

.ays-quiz-enh-error {
    padding: .75em 1em;
    background: #fee2e2;
    color: #7f1d1d;
    border-radius: 6px;
    margin: 1em 0;
}

/* -------- Quiz List View ([ays_quiz_list]) -------- */
.ays-quiz-enh-list {
    display: grid;
    gap: 1.25em;
    margin: 1.5em 0;
}
.ays-quiz-enh-list-cols-1 { grid-template-columns: 1fr; }
.ays-quiz-enh-list-cols-2 { grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); }
.ays-quiz-enh-list-cols-3 { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.ays-quiz-enh-list-cols-4 { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }

.ays-quiz-enh-list-card {
    display: flex;
    gap: 1.25em;
    padding: 1.1em 1.25em;
    background: #fff;
    border: 1px solid #e6e8eb;
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(15, 20, 30, .04);
    transition: transform .1s ease, box-shadow .15s ease;
    color: #1f2933;
    align-items: flex-start;
}
.ays-quiz-enh-list-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(15, 20, 30, .08);
}
.ays-quiz-enh-list-cols-2 .ays-quiz-enh-list-card,
.ays-quiz-enh-list-cols-3 .ays-quiz-enh-list-card,
.ays-quiz-enh-list-cols-4 .ays-quiz-enh-list-card {
    flex-direction: column;
}
.ays-quiz-enh-list-image {
    flex: 0 0 auto;
    width: 160px;
    max-width: 100%;
}
.ays-quiz-enh-list-image img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    display: block;
    object-fit: cover;
}
.ays-quiz-enh-list-cols-2 .ays-quiz-enh-list-image,
.ays-quiz-enh-list-cols-3 .ays-quiz-enh-list-image,
.ays-quiz-enh-list-cols-4 .ays-quiz-enh-list-image {
    width: 100%;
}
.ays-quiz-enh-list-body { flex: 1; min-width: 0; }
.ays-quiz-enh-list-title {
    margin: 0 0 .35em;
    font-size: 1.15em;
    font-weight: 700;
    color: #1f2933;
    line-height: 1.3;
}
.ays-quiz-enh-list-meta {
    color: #6b7280;
    font-size: .9em;
    margin: 0 0 .55em;
}
.ays-quiz-enh-list-meta strong { color: #1f2933; font-weight: 600; }
.ays-quiz-enh-list-meta-sep { margin: 0 .5em; color: #d1d5db; }
.ays-quiz-enh-list-desc {
    color: #4b5563;
    font-size: .95em;
    margin: 0 0 .85em;
    line-height: 1.5;
}
.ays-quiz-enh-list-desc p { margin: 0 0 .5em; }
.ays-quiz-enh-list-btn {
    display: inline-block;
    background: #1f2933;
    color: #fff !important;
    padding: .55em 1.1em;
    border-radius: 999px;
    font-weight: 700;
    font-size: .95em;
    text-decoration: none !important;
    transition: background .15s ease, transform .1s ease;
}
.ays-quiz-enh-list-btn:hover { background: #3e4c59; transform: translateY(-1px); }
.ays-quiz-enh-list-btn-disabled {
    background: #9ca3af !important;
    cursor: not-allowed;
    pointer-events: none;
}
.ays-quiz-enh-list-empty {
    padding: 1em 1.25em;
    background: #f3f4f6;
    color: #6b7280;
    border-radius: 8px;
    text-align: center;
}

@media (max-width: 640px) {
    .ays-quiz-enh-list-card { flex-direction: column; }
    .ays-quiz-enh-list-image { width: 100%; }
}
