/**
 * Vime LMS — Elementor widgets base styles.
 * Light, easily overridable defaults. Brand violet: #5C13E6.
 */

/* Editor placeholder */
.vime-elementor-placeholder {
    padding: 16px 20px;
    border: 1px dashed #c9b8ef;
    border-radius: 8px;
    background: #f5f2fb;
    color: #5C13E6;
    font-size: 13px;
    text-align: center;
}

/* Course Title */
.vime-course-title { margin: 0; }
.vime-course-title a { color: inherit; text-decoration: none; }
.vime-course-title a:hover { text-decoration: underline; }

/* Course Cover */
.vime-course-cover-wrap { display: flex; }
.vime-course-cover {
    position: relative;
    width: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.vime-course-cover.has-ratio { height: 0; }
.vime-course-cover-img { display: block; width: 100%; height: auto; }

/* Course Price & Buy (stateful) */
.vime-course-price { display: flex; flex-direction: column; gap: 12px; align-items: flex-start; }
.vime-course-cta { width: 100%; }
.vime-course-price-amount { font-size: 1.5em; font-weight: 700; color: #5C13E6; }
/* Box de níveis: largura própria; o alinhamento (content_align) controla a posição. */
.vime-course-price .vime-tiers-widget { width: 100%; max-width: 420px; }

/* Shared button used by every state + the two new widgets.
   .vime-tiers-buy-btn herda o MESMO visual base — estilizar "o botão" afeta os dois. */
.vime-price-btn,
.vime-course-buy-btn,
.vime-tiers-buy-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 28px;
    background-color: #5C13E6;
    color: #fff;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 600;
    line-height: 1.2;
    transition: background-color .15s ease, color .15s ease;
}
.vime-price-btn:hover,
.vime-course-buy-btn:hover,
.vime-tiers-buy-btn:hover { background-color: #4a0fc0; color: #fff; }
.vime-price-btn-icon { display: inline-flex; align-items: center; }
.vime-price-btn-icon svg { width: 1em; height: 1em; fill: currentColor; }

/* Group CTA: sem cor própria → herda o botão principal (.vime-price-btn).
   Defina cor/hover do grupo no widget para sobrescrever. */
.vime-price-btn--secondary { font-weight: 500; }

/* Completed badge */
.vime-cta-badge-done {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border-radius: 999px;
    background: #e9f7ef;
    color: #2d8a4e;
    font-weight: 700;
}
.vime-cta-badge-check {
    display: inline-flex;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #2d8a4e;
    color: #fff;
    align-items: center;
    justify-content: center;
    font-size: 12px;
}

/* Progress bar */
.vime-cta-progress { width: 100%; display: flex; flex-direction: column; gap: 6px; }
.vime-cta-progress-label { font-size: 13px; font-weight: 600; color: #5C13E6; }
.vime-cta-progress-track {
    width: 100%;
    height: 10px;
    background-color: #e7e0f6;
    border-radius: 6px;
    overflow: hidden;
}
.vime-cta-progress-fill {
    height: 100%;
    background-color: #5C13E6;
    border-radius: 6px;
    transition: width .3s ease;
}

/* Price-only widget */
.vime-price-only { color: #5C13E6; font-weight: 700; }
.vime-price-only-prefix,
.vime-price-only-suffix { font-weight: 400; opacity: .8; }

/* Group buy widget */
.vime-group-buy-wrap { display: flex; }

/* Course Curriculum */
.vime-course-curriculum { display: flex; flex-direction: column; gap: 8px; }
.vime-curriculum-module {
    border: 1px solid #e7e0f6;
    border-radius: 8px;
    overflow: hidden;
}
.vime-curriculum-module > summary {
    position: relative;
    cursor: pointer;
    list-style: none;
    padding: 14px 42px 14px 18px;
    background-color: #f5f2fb;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}
.vime-curriculum-module > summary::-webkit-details-marker { display: none; }
.vime-curriculum-module > summary::after {
    content: "+";
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 1.1em;
    color: #5C13E6;
    transition: transform .15s ease;
}
.vime-curriculum-module[open] > summary::after { content: "\2013"; }
/* Indicador customizado (ícones escolhidos no widget) substitui o ::after */
.vime-course-curriculum.has-custom-toggle .vime-curriculum-module > summary::after { content: none; }
.vime-curriculum-toggle {
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    color: #5C13E6;
    line-height: 0;
}
.vime-curriculum-toggle-closed,
.vime-curriculum-toggle-open { display: inline-flex; align-items: center; }
.vime-curriculum-module[open] .vime-curriculum-toggle-closed { display: none; }
.vime-curriculum-module:not([open]) .vime-curriculum-toggle-open { display: none; }
.vime-curriculum-module-title { min-width: 0; }
.vime-curriculum-module-count { font-weight: 400; font-size: .85em; opacity: .7; white-space: nowrap; flex: 0 0 auto; }
.vime-curriculum-lessons { list-style: none; margin: 0; padding: 0; }
.vime-curriculum-lesson {
    padding: 10px 18px;
    border-top: 1px solid #f0ecf9;
    display: flex;
    align-items: center;
    gap: 10px;
}
.vime-curriculum-lesson-icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    color: #5C13E6;
    font-size: 1.05em;
}
.vime-curriculum-lesson-thumb {
    flex: 0 0 auto;
    width: 48px;
    height: 48px;
    object-fit: cover;
    border-radius: 6px;
    background: #f0ecf9;
}
.vime-curriculum-lesson-thumb--empty {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #9b8fc4;
    font-size: 1.1em;
}
.vime-curriculum-lesson-title { flex: 1 1 auto; min-width: 0; }
.vime-curriculum-lesson-duration { margin-left: auto; flex: 0 0 auto; font-size: .85em; opacity: .65; white-space: nowrap; }

/* Course Instructor */
.vime-course-instructor { display: flex; gap: 16px; align-items: flex-start; }
.vime-instructor-avatar img { display: block; }
.vime-instructor-name { font-weight: 700; font-size: 1.1em; }
.vime-instructor-bio { margin-top: 6px; opacity: .85; }
.vime-instructor-bio p:last-child { margin-bottom: 0; }

/* Course Description */
.vime-course-description p:last-child { margin-bottom: 0; }

/* Course Meta (Informações do Curso) */
.vime-course-meta {
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 12px;
}
.vime-meta-item {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}
.vime-meta-icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #5C13E6;
    font-size: 18px;
    line-height: 0;
}
.vime-meta-icon svg { width: 1em; height: 1em; display: block; }
.vime-meta-text {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    min-width: 0;
}
.vime-meta-label { font-weight: 600; opacity: .85; }
.vime-meta-label::after { content: ":"; }
.vime-meta-value { min-width: 0; word-break: break-word; }

/* Course FAQ (mirrors render_curso_detalhes markup) */
.vime-curso-faq { margin: 0; }
.vime-curso-faq h2 { margin: 0 0 16px; }
.vime-faq-accordion { display: flex; flex-direction: column; gap: 10px; }
.vime-faq-item { border: 1px solid #E5E7EB; border-radius: 10px; background: #fff; overflow: hidden; }
.vime-faq-question { display: flex; align-items: center; justify-content: space-between; gap: 12px; cursor: pointer; padding: 16px 18px; font-weight: 600; list-style: none; user-select: none; }
.vime-faq-question::-webkit-details-marker { display: none; }
.vime-faq-question-text { flex: 1 1 auto; }
.vime-faq-chevron { flex: 0 0 auto; width: 10px; height: 10px; border-right: 2px solid #6B7280; border-bottom: 2px solid #6B7280; transform: rotate(45deg); transition: transform .18s ease; margin-right: 4px; }
.vime-faq-item[open] .vime-faq-chevron { transform: rotate(-135deg); }
/* Indicador customizado (ícones escolhidos no widget) */
.vime-faq-toggle { flex: 0 0 auto; display: inline-flex; align-items: center; color: #6B7280; line-height: 0; }
.vime-faq-toggle-closed,
.vime-faq-toggle-open { display: inline-flex; align-items: center; }
.vime-faq-item[open] .vime-faq-toggle-closed { display: none; }
.vime-faq-item:not([open]) .vime-faq-toggle-open { display: none; }
.vime-faq-answer { padding: 0 18px 16px; color: #374151; line-height: 1.6; }
.vime-faq-answer p:last-child { margin-bottom: 0; }
