/* =========================================================
   Tutor LMS - restilizacao das telas do curso
   Sobrescreve o visual do plugin sem quebrar a estrutura.
   ========================================================= */

/* --- HERO --- */
.course-hero {
  background: linear-gradient(155deg, var(--color-ink) 0%, var(--color-deep) 100%);
  color: #fff;
  padding-block: var(--section-y);
}
.course-hero__inner {
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: var(--space-2xl);
  align-items: center;
}
.course-hero__title { color: #fff; margin-bottom: var(--space-sm); }
.course-hero__excerpt { color: rgba(255,255,255,0.82); font-size: var(--fs-lead); }

/* Prova social do hero (avaliacao + alunos + nivel) */
.course-hero__trust {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-sm) var(--space-md);
  margin-top: var(--space-md);
}
.course-hero__trust .rating__score,
.course-hero__trust .rating__count { color: rgba(255,255,255,0.9); }
.course-hero__trust-item { color: rgba(255,255,255,0.75); font-size: var(--fs-sm); }
.course-hero__trust-item strong { color: #fff; }
.course-hero__trust .badge--level { background: rgba(255,255,255,0.12); color: #fff; }

.course-hero__media img,
.course-hero__media iframe,
.course-hero__media video {
  width: 100%;
  border-radius: var(--radius);
  box-shadow: var(--shadow-md);
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

/* --- LAYOUT (conteudo + sidebar) --- */
.course-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: var(--space-xl);
  padding-block: clamp(2rem, 1.2rem + 2.5vw, 3rem);
  align-items: start;
}
/* Texto corrido da descricao limitado para nao perder legibilidade na coluna larga */
.course-main .tutor-tab-item p,
.course-main .tutor-course-content p { max-width: 72ch; }

/* --- CAIXA DE COMPRA --- */
.purchase-box {
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  padding: var(--space-md);
}
.purchase-box.tutor-is-sticky { position: sticky; top: 84px; }
@media (min-width: 1280px) { .purchase-box { padding: var(--space-lg); } }

.purchase-box__title {
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-text-muted);
  margin-bottom: var(--space-sm);
}
.purchase-box__guarantee { margin-top: var(--space-md); }
.purchase-box__includes { margin-top: var(--space-md); padding-top: var(--space-md); border-top: 1px solid var(--color-line); }
.purchase-box__extra { margin-top: var(--space-md); padding-top: var(--space-md); border-top: 1px solid var(--color-line); }
.purchase-box__extra:empty { display: none; }

/* Forca o botao de compra do Tutor/Woo a usar nosso estilo de CTA */
.purchase-box .tutor-btn-primary,
.purchase-box .tutor-enroll-course-button,
.purchase-box button[type="submit"],
.purchase-box .single_add_to_cart_button {
  display: block !important;
  width: 100% !important;
  background: var(--color-cta) !important;
  color: var(--color-ink) !important;
  font-family: var(--font-base) !important;
  font-weight: var(--fw-semibold) !important;
  font-size: var(--fs-lead) !important;
  border: 0 !important;
  border-radius: var(--radius-sm) !important;
  padding: 0.95rem 1.5rem !important;
  box-shadow: var(--shadow-xs) !important;
  transition: background var(--transition), transform var(--transition), box-shadow var(--transition) !important;
}
.purchase-box .tutor-btn-primary:hover,
.purchase-box .single_add_to_cart_button:hover {
  background: var(--color-cta-hover) !important;
  color: #fff !important;
  transform: translateY(-2px);
  box-shadow: var(--shadow-md) !important;
}

/* Preco */
.purchase-box .tutor-course-price,
.purchase-box .price {
  font-size: 1.6rem;
  font-weight: var(--fw-bold);
  color: var(--color-ink);
}
.purchase-box del, .purchase-box del .amount { color: var(--color-text-muted); font-weight: var(--fw-regular); font-size: 1.1rem; }

/* --- ABAS / NAV --- */
.course-nav { background: var(--color-bg); border-bottom: 1px solid var(--color-line); }
.tutor-tab-item { display: none; }
.tutor-tab-item.is-active { display: block; }

/* --- CURRICULO --- */
.tutor-course-topic {
  border: 1px solid var(--color-line);
  border-radius: var(--radius-sm);
  margin-bottom: var(--space-xs);
  overflow: hidden;
}

/* =========================================================
   RESPONSIVO (mobile-first)
   ========================================================= */
@media (max-width: 960px) {
  .course-hero__inner { grid-template-columns: 1fr; }
  .course-layout { grid-template-columns: 1fr; }

  /* No mobile, a caixa de compra deixa de ser sticky lateral
     e ganha destaque no topo do conteudo */
  .course-sidebar { order: -1; }
  .purchase-box.tutor-is-sticky { position: static; }
}

/* =========================================================
   PLAYER DE AULA (single lesson / spotlight mode)
   Estilizado por CSS, sem override de PHP (mais seguro).
   ========================================================= */

/* Wrapper geral: sidebar de navegacao + conteudo */
.tutor-course-single-content-wrapper {
  background: var(--color-bg);
}

/* Sidebar de aulas */
.tutor-course-single-sidebar-wrapper {
  background: var(--color-surface);
  border-right: 1px solid var(--color-line);
}

/* Player de video: responsivo 16:9, cantos arredondados */
.tutor-video-player-wrapper {
  background: #000;
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow-md);
  margin-bottom: var(--space-md);
}
.tutor-video-player-wrapper iframe,
.tutor-video-player-wrapper video,
.tutor-video-player-wrapper .plyr {
  width: 100%;
  aspect-ratio: 16 / 9;
  height: auto;
  display: block;
  border: 0;
}

.tutor-course-topic-single-body {
  max-width: 920px;
  margin-inline: auto;
  padding: var(--space-lg) var(--space-md);
}

/* Abas dentro da aula (visao geral, anexos, comentarios) */
.tutor-course-spotlight-nav .tutor-nav-link.is-active {
  color: var(--color-primary);
  border-bottom: 2px solid var(--color-gold);
}

/* Botao "marcar como concluida" herda o CTA da marca */
.tutor-course-topic-single-body .tutor-btn-primary {
  background: var(--color-success) !important;
  border: 0 !important;
  border-radius: var(--radius-sm) !important;
  font-family: var(--font-base) !important;
  font-weight: var(--fw-semibold) !important;
}

/* Barra de progresso do curso */
.tutor-progress-bar { background: var(--color-line); border-radius: 999px; }
.tutor-progress-bar .tutor-progress-value { background: var(--color-gold); }

@media (max-width: 768px) {
  .tutor-course-topic-single-body { padding: var(--space-md) var(--space-sm); }
}

/* =========================================================
   ARQUIVO DE CURSOS (listagem /courses)
   ========================================================= */

/* Cabecalho branded */
.course-archive-hero {
  background: linear-gradient(155deg, var(--color-ink) 0%, var(--color-deep) 100%);
  color: #fff;
  padding-block: var(--section-y);
}
.course-archive-hero .eyebrow { color: var(--color-gold-soft); }
.course-archive-hero h1 { color: #fff; margin-bottom: var(--space-2xs); }
.course-archive-hero .lead { color: rgba(255,255,255,0.82); max-width: 60ch; margin: 0; }

.course-archive-body { padding-block: clamp(2rem, 1.2rem + 2.5vw, 3rem); }
.course-archive-body .tutor-container { max-width: var(--container); }

/* Grade responsiva: auto-fit + card com largura maxima resolve o caso de
   poucos cursos (1-2 cards ficam centralizados em tamanho normal, nunca esticados) */
.course-archive-body .tutor-course-list {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(300px, 360px)) !important;
  justify-content: center;
  gap: var(--space-lg) !important;
}

/* Card */
.course-archive-body .tutor-card {
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
  transition: transform var(--transition-slow), box-shadow var(--transition-slow);
  height: 100%;
  width: 100%;
  max-width: 420px;
  display: flex;
  flex-direction: column;
}
.course-archive-body .tutor-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }

.course-archive-body .tutor-course-thumbnail img,
.course-archive-body .tutor-card-image-top { width: 100%; height: 100%; object-fit: cover; transition: transform var(--transition-slow); }
.course-archive-body .tutor-card:hover .tutor-card-image-top { transform: scale(1.04); }

.course-archive-body .tutor-card-body { padding: var(--space-md); }
.course-archive-body .tutor-course-name { font-size: 1.1rem; font-weight: var(--fw-semibold); }
.course-archive-body .tutor-course-name a { color: var(--color-ink); }
.course-archive-body .tutor-course-name a:hover { color: var(--color-primary); }

.course-archive-body .tutor-meta,
.course-archive-body .tutor-meta-value,
.course-archive-body .tutor-meta-icon { color: var(--color-text-muted); font-size: var(--fs-sm); }

.course-archive-body .tutor-card-footer { padding: 0 var(--space-md) var(--space-md); margin-top: auto; }

/* Empilha preco e botao no rodape (cabe em qualquer largura de card) */
.course-archive-body .tutor-card-footer > .tutor-d-flex {
  flex-direction: column !important;
  align-items: stretch !important;
  gap: var(--space-sm) !important;
}
.course-archive-body .tutor-course-price,
.course-archive-body .tutor-course-price .price,
.course-archive-body .list-item-price .price,
.course-archive-body .price { color: var(--color-ink); font-weight: var(--fw-bold); font-size: 1.2rem; }

/* Qualquer botao/link de acao no rodape vira CTA dourado, largura total */
.course-archive-body .tutor-card-footer a,
.course-archive-body .tutor-card-footer button,
.course-archive-body .tutor-course-list-btn,
.course-archive-body .list-item-button {
  display: block !important;
  width: 100% !important;
}
.course-archive-body .tutor-card-footer .tutor-btn,
.course-archive-body .tutor-card-footer a.tutor-btn,
.course-archive-body .tutor-card-footer button {
  background: var(--color-cta) !important;
  color: var(--color-ink) !important;
  border: 0 !important;
  border-radius: var(--radius-sm) !important;
  font-family: var(--font-base) !important;
  font-weight: var(--fw-semibold) !important;
  padding: 0.7rem 1rem !important;
  white-space: normal !important;
  text-align: center;
  transition: background var(--transition), transform var(--transition) !important;
}
.course-archive-body .tutor-card-footer .tutor-btn:hover,
.course-archive-body .tutor-card-footer button:hover {
  background: var(--color-cta-hover) !important;
  color: #fff !important;
  transform: translateY(-1px);
}

/* Barra de filtros / ordenacao */
.course-archive-body .tutor-course-filter,
.course-archive-body .tutor-course-filter-bar {
  background: var(--color-surface);
  border: 1px solid var(--color-line);
  border-radius: var(--radius);
  padding: var(--space-sm) var(--space-md);
}
