@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700&display=swap');
/* Pagina Cursuri V2 - Optimized Styles */

/* ============================================================================
   LOGIN STYLES
   ============================================================================ */
.pc-login-wrap {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #19D27C 0%, #19D27C 100%);
    padding: 20px;
    margin: 0 !important;
    width: 100vw;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

/* Remove WordPress default margins/paddings */
body:has(.pc-login-wrap) {
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;
}

#page:has(.pc-login-wrap),
.site:has(.pc-login-wrap),
.site-content:has(.pc-login-wrap),
article:has(.pc-login-wrap),
.entry-content:has(.pc-login-wrap) {
    margin: 0 !important;
    padding: 0 !important;
}

.pc-login-container {
    max-width: 420px;
    width: 100%;
    background: #141821;
    border-radius: 24px;
    padding: 40px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}

.pc-login-container input {
    border-radius: 15px;
    border: 1px solid #1B2029 !important;
}

.pc-login-logo {
    text-align: center;
    margin-bottom: 24px;
}

.pc-logo-img {
    max-width: 200px;
    height: auto;
}

.pc-login-header {
    text-align: center;
    margin-bottom: 32px;
}

.pc-login-title {
    font-size: 28px;
    font-weight: 700;
    color: #EEF1F6;
    margin: 0 0 8px 0;
}

.pc-login-subtitle {
    font-size: 15px;
    color: #98A1B0;
    margin: 0;
}

.pc-login-error {
    background: #141821;
    border: 1px solid #FFB020;
    border-radius: 12px;
    padding: 14px 16px;
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    gap: 10px;
    color: #FFB020;
    font-weight: 600;
    font-size: 14px;
}

.pc-error-icon { 
    font-size: 18px; 
}

.pc-login-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.pc-form-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.pc-label {
    font-weight: 600;
    font-size: 14px;
    color: #EEF1F6;
}

.pc-input {
    width: 100%;
    padding: 14px 16px;
    border: 2px solid #141821;
    border-radius: 12px;
    font-size: 15px;
    transition: all 0.15s ease;
    box-sizing: border-box;
}

.pc-input:focus {
    outline: none;
    border-color: #19D27C;
    box-shadow: 0 0 0 4px rgba(25,210,124, 0.1);
}

.pc-login-btn {
    width: 100%;
    padding: 16px;
    background: linear-gradient(135deg, #19D27C 0%, #19D27C 100%);
    color: #EEF1F6;
    border: none;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    transition: all 0.15s ease;
    margin-top: 8px;
}

.pc-login-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 30px rgba(25,210,124, 0.4);
}

.pc-login-btn:active {
    transform: translateY(0);
}

/* ============================================================================
   MAIN APP WRAPPER
   ============================================================================ */
.pc-wrap {
    --primary: #19D27C;
    --secondary: #12B86B;
    --bg: #0C0E12;
    --text: #EEF1F6;
    --muted: #98A1B0;
    --line: #1B2029;
    --card: #141821;
    --shadow: 0 4px 12px rgba(0,0,0,0.08);
    --soft: 0 2px 8px rgba(0,0,0,0.06);
    --r: 16px;
    
    max-width: 980px;
    margin: 0 auto;
    background: var(--bg);
    color: var(--text);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

/* Global emoji styling - fix WordPress emoji replacement */
.pc-wrap img.emoji {
    display: inline-block !important;
    width: 1em !important;
    height: 1em !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    box-shadow: none !important;
    vertical-align: middle !important;
}

/* ============================================================================
   VIEW SYSTEM
   ============================================================================ */
.pc-view {
    display: none;
    min-height: 100vh;
}

.pc-view.is-active {
    display: block;
}

/* ============================================================================
   HEADER
   ============================================================================ */
.pc-header {
    padding: 24px 20px 16px;
    background: #141821;
    border-bottom: 1px solid var(--line);
}

.pc-hello {
    font-size: 28px;
    font-weight: 700;
    display: flex;
    gap: 10px;
    align-items: center;
}

.pc-name {
    color: var(--primary);
}

.pc-sub {
    margin-top: 6px;
    color: var(--muted);
    font-weight: 500;
}

.pc-mood-row {
    display: flex;
    gap: 12px;
    margin-top: 16px;
    flex-wrap: wrap;
    justify-content: center;
}

.pc-mood {
    width: 54px;
    height: 42px;
    border-radius: 12px;
    border: 2px solid var(--line);
    background: #141821;
    cursor: pointer;
    font-size: 20px !important;
    transition: all 0.15s ease;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", "Android Emoji", "EmojiSymbols", sans-serif !important;
    line-height: 1 !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #EEF1F6 !important;
    text-indent: 0 !important;
    overflow: visible !important;
    position: relative;
}

/* Fallback: Emoji prin CSS content dacă textul dispare */
.pc-mood[data-mood="🥳"]:empty::before { content: "🥳"; }
.pc-mood[data-mood="🙂"]:empty::before { content: "🙂"; }
.pc-mood[data-mood="😐"]:empty::before { content: "😐"; }
.pc-mood[data-mood="😟"]:empty::before { content: "😟"; }
.pc-mood[data-mood="😡"]:empty::before { content: "😡"; }

/* WordPress emoji image support */
.pc-mood img.emoji {
    display: inline-block !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    box-shadow: none !important;
    vertical-align: middle !important;
}

/* Force text to be visible */
.pc-mood::before {
    font-size: 20px !important;
}

.pc-mood::after {
    display: none !important;
}

.pc-mood:hover {
    border-color: var(--primary);
    transform: translateY(-2px);
}

.pc-mood.is-selected {
    border-color: var(--primary);
    background: #141821;
}

.pc-journal {
    width: 100%;
    margin-top: 16px;
    padding: 14px;
    border-radius: 14px;
    border: 2px solid var(--primary);
    background: #141821;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-weight: 700;
    cursor: pointer;
    color: var(--primary);
    transition: all 0.15s ease;
}

.pc-journal:hover {
    background: var(--primary);
    color: #EEF1F6;
}

.pc-ico {
    font-size: 18px;
}

.pc-toast {
    margin-top: 10px;
    color: var(--muted);
    font-size: 13px;
    min-height: 18px;
    text-align: center;
}

/* ============================================================================
   SECTIONS
   ============================================================================ */
.pc-section {
    padding: 16px 20px;
}

.pc-section-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 6px 0 14px;
}

.pc-title-left {
    display: flex;
    align-items: center;
    gap: 10px;
}

.pc-dot {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: var(--primary);
}

.pc-section h2 {
    margin: 0;
    font-size: 17px;
    font-weight: 700;
}

.pc-row h2 {
    font-size: 18px;
}

/* ============================================================================
   CARDS
   ============================================================================ */
.pc-card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--r);
    box-shadow: var(--soft);
    padding: 16px;
}

.pc-muted {
    color: var(--muted);
    margin: 12px 0 0;
    line-height: 1.5;
}

/* ============================================================================
   JOURNEY
   ============================================================================ */
.pc-journey-top {
    display: flex;
    gap: 14px;
    align-items: center;
}

.pc-avatar {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: var(--primary);
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
}

.pc-journey-name {
    font-weight: 700;
}

.pc-journey-small {
    color: var(--muted);
    margin-top: 4px;
    font-size: 13px;
}

.pc-progress {
    margin-top: 14px;
}

.pc-progress-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 26px;
    padding: 0 12px;
    border-radius: 999px;
    font-weight: 700;
    font-size: 12px;
    color: #EEF1F6;
    background: var(--primary);
    margin-bottom: 10px;
}

.pc-progress-bar {
    height: 10px;
    background: #141821;
    border-radius: 999px;
    overflow: hidden;
}

.pc-progress-fill {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: var(--primary);
    transition: width 0.3s ease;
}

/* ============================================================================
   CAROUSEL
   ============================================================================ */
.pc-carousel {
    display: flex;
    gap: 14px;
    overflow: auto;
    scroll-snap-type: x mandatory;
    padding-bottom: 8px;
    -webkit-overflow-scrolling: touch;
}

.pc-carousel::-webkit-scrollbar {
    height: 6px;
}

.pc-carousel::-webkit-scrollbar-thumb {
    background: #1B2029;
    border-radius: 999px;
}

.pc-carousel-controls {
    display: flex;
    gap: 8px;
}

.pc-iconbtn {

    border-radius: 10px;
    border: 1px solid var(--line);
    background: #141821;
    cursor: pointer;
    font-size: 18px;
    transition: all 0.15s ease;
}

.pc-iconbtn:hover {
    border-color: var(--primary);
    color: var(--primary);
}

/* ============================================================================
   COURSE CARDS
   ============================================================================ */
.pc-course-card {
    width: 200px;
    flex: 0 0 auto;
    scroll-snap-align: start;
    border-radius: 14px;
    border: 1px solid var(--line);
    background: #141821;
    box-shadow: var(--soft);
    overflow: hidden;
    cursor: pointer;
    transition: all 0.15s ease;
}

.pc-course-card:hover {
    transform: translateY(-3px);
    box-shadow: var(--shadow);
    border-color: var(--primary);
}

.pc-course-img {
    height: 100px;
    background: var(--secondary);
    display: flex;
    align-items: center;
    justify-content: center;
}

.pc-course-emoji {
    font-size: 40px;
}

.pc-course-body {
    padding: 14px;
}

.pc-course-name {
    font-weight: 700;
    font-size: 15px;
}

.pc-course-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 10px;
    color: var(--muted);
    font-weight: 600;
    font-size: 12px;
}

.pc-mini {
    display: inline-flex;
    gap: 4px;
    align-items: center;
    background: #141821;
    border: 1px solid var(--primary);
    padding: 5px 8px;
    border-radius: 999px;
    color: var(--primary);
    font-weight: 700;
    font-size: 11px;
}

/* ============================================================================
   LIST ITEMS
   ============================================================================ */
.pc-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.pc-list-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px;
    border-radius: 14px;
    border: 1px solid var(--line);
    background: #141821;
    box-shadow: var(--soft);
    cursor: pointer;
    transition: all 0.15s ease;
}

.pc-list-item:hover {
    border-color: var(--primary);
}

.pc-li-title {
    font-weight: 700;
}

.pc-li-sub {
    color: var(--muted);
    font-weight: 600;
    font-size: 13px;
    margin-top: 4px;
}

.pc-li-right {
    width: 34px;
    height: 34px;
    border-radius: 12px;
    background: #141821;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--primary);
    font-size: 18px;
    color: var(--primary);
    flex: 0 0 auto;
}

/* ============================================================================
   BOTTOM NAVIGATION
   ============================================================================ */
.pc-bottom {
    position: sticky;
    bottom: 0;
    display: flex;
    justify-content: space-around;
    gap: 8px;
    padding: 12px 12px calc(12px + env(safe-area-inset-bottom));
    background: rgba(20,24,33,.92);
    backdrop-filter: blur(8px);
    border-top: 1px solid var(--line);
}

.pc-tab {
    border: 0;
    background: transparent;
    padding: 10px 12px;
    border-radius: 12px;
    cursor: pointer;
    font-weight: 600;
    color: var(--muted);
    min-width: 80px;
    transition: all 0.15s ease;
}

.pc-tab.is-active {
    color: var(--primary);
    background: #141821;
    border: 1px solid var(--primary);
}

/* ============================================================================
   TOP BAR
   ============================================================================ */
.pc-topbar {
    position: sticky;
    top: 0;
    z-index: 5;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: rgba(20,24,33,.92);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--line);
}

.pc-topbar-explore {
    position: sticky;
    top: 0;
    z-index: 5;
    padding: 16px 20px;
    background: rgba(20,24,33,.92);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--line);
}

.pc-topbar-title {
    font-weight: 700;
}

.pc-topbar-btn {
    width: auto;
    /*height: 40px;*/
    border-radius: 12px;
    border: 1px solid var(--line);
    background: #141821;
    cursor: pointer;
    font-size: 18px;
    transition: all 0.15s ease;
}

.pc-topbar-btn:hover {
    border-color: var(--primary);
    color: var(--primary);
}

/* ============================================================================
   COURSE DETAIL
   ============================================================================ */
.pc-course-hero {
    padding: 20px;
    display: flex;
    gap: 16px;
    align-items: center;
    background: #141821;
}

.pc-course-thumb {
    width: 64px;
    height: 64px;
    border-radius: 16px;
    background: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.pc-thumb-emoji {
    font-size: 32px;
    filter: brightness(0) invert(1);
}

.pc-course-title {
    margin: 0;
    font-size: 20px;
    font-weight: 700;
}

.pc-course-actions {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-top: 10px;
    flex-wrap: wrap;
}

.pc-pill {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 12px;
    border-radius: 999px;
    font-weight: 700;
    font-size: 12px;
    background: #141821;
    border: 1px solid var(--primary);
    color: var(--primary);
}

.pc-primary {
    border: 0;
    cursor: pointer;
    padding: 10px 16px;
    border-radius: 12px;
    color: #EEF1F6;
    font-weight: 700;
    background: var(--primary);
    transition: all 0.15s ease;
}

.pc-primary:hover {
    opacity: 0.9;
}

.pc-about {
    margin: 0 20px 16px;
}

.pc-about-label {
    color: var(--muted);
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
}

.pc-about-text {
    margin-top: 6px;
    font-weight: 500;
    line-height: 1.5;
}

/* ============================================================================
   STEPS
   ============================================================================ */
.pc-steps {
    padding: 0 20px 24px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.pc-step {
    border-radius: 16px;
    border: 1px solid var(--line);
    background: #141821;
    box-shadow: var(--soft);
    overflow: hidden;
}

.pc-step.is-locked {
    opacity: 0.6;
}

.pc-step-header {
    padding: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    transition: background 0.15s ease;
}

.pc-step-header:hover {
    background: #141821;
}

.pc-step-left {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
}

.pc-step-top {
    display: flex;
    gap: 10px;
    align-items: center;
    color: var(--muted);
    font-weight: 600;
    font-size: 12px;
    flex-wrap: wrap;
}

.pc-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 5px 10px;
    border-radius: 999px;
    font-weight: 700;
    font-size: 11px;
    background: #141821;
    border: 1px solid var(--primary);
    color: var(--primary);
}

.pc-step-title {
    font-weight: 700;
}

.pc-step-toggle {
    width: 36px;
    height: 36px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--line);
    background: #141821;
    font-size: 16px;
    color: var(--muted);
    flex: 0 0 auto;
    transition: all 0.2s ease;
}

.pc-step.is-open .pc-step-toggle {
    transform: rotate(180deg);
    background: #141821;
    border-color: var(--primary);
    color: var(--primary);
}

.pc-step-units {
    display: none;
    border-top: 1px solid var(--line);
    background: #141821;
}

.pc-step.is-open .pc-step-units {
    display: block;
}

.pc-unit {
    display: flex;
    align-items: center;
    padding: 14px 16px;
    gap: 14px;
    border-bottom: 1px solid var(--line);
    cursor: pointer;
    transition: background 0.15s ease;
}

.pc-unit:last-child {
    border-bottom: none;
}

.pc-unit:hover {
    background: #141821;
}

.pc-unit-icon {
    width: 42px;
    height: 42px;
    border-radius: 10px;
    background: #141821;
    border: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    flex: 0 0 auto;
}

.pc-unit-info {
    flex: 1;
}

.pc-unit-title {
    font-weight: 600;
    font-size: 14px;
}

.pc-unit-meta {
    color: var(--muted);
    font-size: 12px;
    margin-top: 2px;
    display: flex;
    align-items: center;
    gap: 4px;
}

.pc-unit.is-completed .pc-unit-title::after {
    content: ' \2713'; /* Unicode pentru ✓ */
    color: #19D27C;
    margin-left: 6px;
    font-family: Arial, sans-serif; /* Asigură afișarea corectă */
}

.pc-unit-play {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #EEF1F6;
    flex: 0 0 auto;
}

.pc-bottom-spacer {
    height: 24px;
}

/* ============================================================================
   STEP CONTENT
   ============================================================================ */
.pc-step-content {
    padding: 20px;
    min-height: 60vh;
}

.pc-step-content h1,
.pc-step-content h2,
.pc-step-content h3 {
    margin-top: 0;
}

.pc-step-content img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
}

.pc-step-nav {
    display: flex;
    justify-content: space-between;
    padding: 16px 20px;
    border-top: 1px solid var(--line);
    background: #141821;
    position: sticky;
    bottom: 0;
}

.pc-nav-btn {
    padding: 12px 20px;
    border-radius: 10px;
    border: 1px solid var(--line);
    background: #141821;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s ease;
}

.pc-nav-btn:hover {
    border-color: var(--primary);
    color: var(--primary);
}

.pc-nav-btn.pc-nav-next {
    background: var(--primary);
    color: #EEF1F6;
    border-color: var(--primary);
}

.pc-nav-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

.pc-locked-msg {
    text-align: center;
    padding: 40px 20px;
    color: var(--muted);
}

.pc-lock-icon {
    font-size: 48px;
    margin-bottom: 16px;
}

/* ============================================================================
   JOURNAL
   ============================================================================ */
.pc-journal-content {
    padding: 20px;
    min-height: calc(100vh - 200px);
}

.pc-journal-entry {
    background: #141821;
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 16px;
    margin-bottom: 12px;
}

.pc-journal-date {
    color: var(--muted);
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 12px;
}

.pc-journal-mood {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 10px;
}

.pc-journal-emoji {
    font-size: 32px;
}

.pc-journal-mood-label {
    font-size: 18px;
    font-weight: 700;
}

.pc-journal-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.pc-journal-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 12px;
    background: #141821;
    border-radius: 999px;
    font-size: 13px;
    color: var(--text);
}

.pc-journal-add-wrap {
    position: sticky;
    bottom: 0;
    padding: 16px 20px;
    background: #141821;
    border-top: 1px solid var(--line);
}

.pc-journal-add-btn {
    width: 100%;
    padding: 16px;
    background: var(--primary);
    color: #EEF1F6;
    border: none;
    border-radius: 12px;
    font-weight: 700;
    font-size: 16px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: all 0.15s ease;
}

.pc-journal-add-btn:hover {
    opacity: 0.9;
}

/* ============================================================================
   ADD MOOD
   ============================================================================ */
.pc-add-mood-content {
    padding: 20px;
}

.pc-mood-selector {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    gap: 12px;
    margin-bottom: 30px;
}

.pc-mood-option {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 20px 12px;
    background: #141821;
    border: 2px solid var(--line);
    border-radius: 14px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.pc-mood-option:hover {
    border-color: var(--primary);
    transform: translateY(-2px);
}

.pc-mood-option.is-selected {
    border-color: var(--primary);
    background: #141821;
}

.pc-mood-emoji {
    font-size: 40px;
}

.pc-mood-label {
    font-weight: 600;
    font-size: 14px;
}

.pc-mood-tags {
    margin-top: 20px;
}

.pc-tags-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.pc-tag-btn {
    padding: 10px 16px;
    background: #141821;
    border: 2px solid var(--line);
    border-radius: 999px;
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.pc-tag-btn:hover {
    border-color: var(--primary);
}

.pc-tag-btn.is-selected {
    background: #141821;
    border-color: var(--primary);
    color: var(--primary);
}

.pc-mood-save-wrap {
    position: sticky;
    bottom: 0;
    padding: 16px 20px;
    background: #141821;
    border-top: 1px solid var(--line);
}

.pc-mood-save-btn {
    width: 100%;
    padding: 16px;
    background: var(--primary);
    color: #EEF1F6;
    border: none;
    border-radius: 12px;
    font-weight: 700;
    font-size: 16px;
    cursor: pointer;
    transition: all 0.15s ease;
}

.pc-mood-save-btn:hover {
    opacity: 0.9;
}

.pc-mood-save-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}

/* ============================================================================
   EXPLORE
   ============================================================================ */
.pc-explore-content {
    padding: 0 20px 80px;
}

.pc-explore-category {
    margin-bottom: 30px;
}

.pc-explore-cat-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
    padding: 12px 0;
}

.pc-explore-cat-header h2 {
    margin: 0;
    font-size: 20px;
    font-weight: 700;
}

.pc-explore-arrow {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    border: 1px solid var(--line);
    background: #141821;
    color: var(--primary);
    font-size: 24px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s ease;
}

.pc-explore-arrow:hover {
    background: #141821;
    border-color: var(--primary);
}

.pc-explore-courses {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 14px;
}

.pc-explore-course-card {
    background: #141821;
    border: 1px solid var(--line);
    border-radius: 14px;
    overflow: hidden;
    box-shadow: var(--soft);
    cursor: pointer;
    transition: all 0.15s ease;
}

.pc-explore-course-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--shadow);
    border-color: var(--primary);
}

.pc-explore-course-img {
    height: 140px;
    background: var(--secondary);
    display: flex;
    align-items: center;
    justify-content: center;
}

.pc-explore-course-info {
    padding: 14px;
}

.pc-explore-course-name {
    font-weight: 700;
    font-size: 15px;
    margin-bottom: 8px;
}

.pc-explore-course-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: var(--muted);
    font-size: 13px;
    font-weight: 600;
}

.pc-category-content {
    padding: 20px;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 14px;
    padding-bottom: 80px;
}

/* ============================================================================
   CHAT
   ============================================================================ */
.pc-chat-categories {
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.pc-chat-cat {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px;
    border-radius: 14px;
    border: 1px solid var(--line);
    background: #141821;
    box-shadow: var(--soft);
    cursor: pointer;
    transition: all 0.15s ease;
}

.pc-chat-cat:hover {
    border-color: var(--primary);
    transform: translateY(-2px);
    box-shadow: var(--shadow);
}

.pc-chat-icon {
    width: 54px;
    height: 54px;
    border-radius: 14px;
    background: #141821;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    flex: 0 0 auto;
}

.pc-chat-info {
    flex: 1;
}

.pc-chat-name {
    font-weight: 700;
    font-size: 15px;
    margin-bottom: 4px;
}

.pc-chat-desc {
    color: var(--muted);
    font-size: 13px;
    line-height: 1.4;
}

.pc-chat-rating {
    color: var(--primary);
    font-weight: 700;
    font-size: 13px;
    flex: 0 0 auto;
}

.pc-chat-messages {
    padding: 20px;
    min-height: calc(100vh - 200px);
    overflow-y: auto;
}

.pc-chat-welcome {
    text-align: center;
    padding: 40px 20px;
}

.pc-welcome-icon {
    font-size: 64px;
    margin-bottom: 16px;
}

.pc-chat-welcome h3 {
    margin: 0 0 8px;
    font-size: 22px;
}

.pc-chat-welcome p {
    color: var(--muted);
    margin: 0;
}

.pc-chat-message {
    margin-bottom: 16px;
    display: flex;
    gap: 12px;
}

.pc-chat-message.is-user {
    justify-content: flex-end;
}

.pc-chat-bubble {
    max-width: 75%;
    padding: 12px 16px;
    border-radius: 16px;
    line-height: 1.5;
}

.pc-chat-message:not(.is-user) .pc-chat-bubble {
    background: #141821;
    color: var(--text);
}

.pc-chat-message.is-user .pc-chat-bubble {
    background: var(--primary);
    color: #EEF1F6;
}

.pc-chat-input-wrap {
    display: flex;
    gap: 10px;
    padding: 16px 20px;
    border-top: 1px solid var(--line);
    background: #141821;
}

.pc-chat-input {
    flex: 1;
    padding: 12px 16px;
    border: 1px solid var(--line);
    border-radius: 24px;
    font-size: 15px;
}

.pc-chat-input:focus {
    outline: none;
    border-color: var(--primary);
}

.pc-chat-send {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: var(--primary);
    color: #EEF1F6;
    border: none;
    cursor: pointer;
    font-size: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s ease;
}

.pc-chat-send:hover {
    opacity: 0.9;
    transform: scale(1.05);
}

/* ============================================================================
   PROFILE
   ============================================================================ */
.pc-profile-content {
    padding: 20px;
    padding-bottom: 80px;
}

.pc-profile-header {
    display: flex;
    gap: 16px;
    align-items: center;
    padding: 20px;
    background: #141821;
    border-radius: 16px;
    margin-bottom: 20px;
}

.pc-profile-avatar {
    width: 64px;
    height: 64px;
    border-radius: 16px;
    background: var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    font-weight: 700;
    color: #EEF1F6;
    flex: 0 0 auto;
}

.pc-profile-info {
    flex: 1;
}

.pc-profile-name {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 6px;
}

.pc-profile-email {
    color: var(--muted);
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.pc-email-icon {
    font-size: 16px;
}

.pc-profile-section {
    background: #141821;
    border: 1px solid var(--line);
    border-radius: 16px;
    margin-bottom: 16px;
    overflow: hidden;
}

.pc-profile-section-title {
    padding: 12px 16px;
    font-weight: 700;
    font-size: 14px;
    color: var(--muted);
    border-bottom: 1px solid var(--line);
}

.pc-profile-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px;
    border-bottom: 1px solid var(--line);
    cursor: pointer;
    transition: background 0.15s ease;
}

.pc-profile-item:last-child {
    border-bottom: none;
}

.pc-profile-item:hover {
    background: #141821;
}

.pc-profile-item-content {
    flex: 1;
}

.pc-profile-item-label {
    font-size: 14px;
    color: var(--text);
    margin-bottom: 4px;
}

.pc-profile-item-value {
    font-weight: 700;
    font-size: 15px;
}

.pc-profile-item-arrow {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--muted);
    font-size: 20px;
    flex: 0 0 auto;
}

.pc-profile-item-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: #141821;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    flex: 0 0 auto;
}

.pc-profile-count {
    font-size: 24px;
    font-weight: 700;
    color: var(--primary);
    margin-bottom: 4px;
}

.pc-logout-btn {
    width: 100%;
    padding: 14px;
    border-radius: 12px;
    border: none;
    background: #141821;
    color: #FFB020;
    font-weight: 700;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: all 0.15s ease;
}

.pc-logout-btn:hover {
    background: #141821;
}

.pc-logout-icon {
    font-size: 18px;
}

.pc-profile-version {
    text-align: center;
    color: var(--muted);
    font-size: 12px;
    margin-top: 20px;
}

/* ============================================================================
   RESPONSIVE
   ============================================================================ */
@media (min-width: 860px) {
    .pc-header {
        border-radius: 20px;
        margin: 20px 20px 0;
    }
    
    .pc-bottom {
        border-radius: 16px;
        margin: 0 20px 20px;
    }
    
    .pc-view-home {
        padding-bottom: 20px;
    }
}

@media (max-width: 600px) {
    .pc-explore-courses {
        grid-template-columns: 1fr;
    }
    
    .pc-category-content {
        grid-template-columns: 1fr;
    }
}

























.pc-workout-complete {
    text-align: center;
    margin-top: 20px;
}


/* ===== LISTA DE EXERCIȚII ===== */
.pc-kegel-workout {
    padding: 20px;
}

.pc-kegel-header {
    text-align: center;
    margin-bottom: 30px;
}

.pc-kegel-emoji {
    font-size: 64px;
    margin-bottom: 12px;
}

.pc-kegel-meta {
    display: flex;
    gap: 8px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 12px;
}

.pc-kegel-badge {
    background: #141821;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 13px;
    color: #EEF1F6;
}

.pc-kegel-about {
    background: #141821;
    border-left: 4px solid #19D27C;
    padding: 16px;
    border-radius: 6px;
    margin-bottom: 24px;
    color: #98A1B0;
}

.pc-exercises-title {
    font-size: 18px;
    font-weight: 600;
    margin: 24px 0 12px;
    color: #EEF1F6;
}

.pc-exercise-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    background: #141821;
    border: 1px solid #141821;
    border-radius: 8px;
    margin-bottom: 8px;
    cursor: pointer;
    transition: all 0.2s;
}

.pc-exercise-item:hover {
    background: #141821;
    border-color: #1B2029;
    transform: translateX(4px);
}

.pc-exercise-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    flex-shrink: 0;
}

.pc-exercise-info {
    flex: 1;
}

.pc-exercise-name {
    font-weight: 600;
    color: #EEF1F6;
    margin-bottom: 4px;
}

.pc-exercise-duration {
    font-size: 13px;
    color: #98A1B0;
}

.pc-exercise-arrow {
    font-size: 18px;
    color: #98A1B0;
}

.pc-start-training-btn {
    width: 100%;
    padding: 18px;
    background: linear-gradient(135deg, #19D27C 0%, #19D27C 100%);
    color: white;
    border: none;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    margin-top: 24px;
    transition: transform 0.2s;
}

.pc-start-training-btn:hover {
    transform: scale(1.02);
}

/* ===== DETALII EXERCIȚIU ===== */
.pc-exercise-detail {
    padding: 20px;
}

.pc-back-to-list {
    background: #141821;
    border: none;
    padding: 10px 16px;
    border-radius: 8px;
    margin-bottom: 20px;
    cursor: pointer;
}

.pc-exercise-detail-header {
    text-align: center;
    margin-bottom: 32px;
}

.pc-exercise-icon-large {
    width: 80px;
    height: 80px;
    border-radius: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 40px;
    margin-bottom: 16px;
}

.pc-exercise-duration-large {
    font-size: 18px;
    color: #98A1B0;
    margin-top: 8px;
}

.pc-exercise-description {
    background: #141821;
    padding: 20px;
    border-radius: 12px;
    margin-bottom: 20px;
}

.pc-exercise-description h3 {
    margin: 0 0 12px;
    font-size: 16px;
}

.pc-exercise-content {
    margin-top: 20px;
}











/* ===== PLAYER KEGEL NOU ===== */
.pc-kegel-player-fullscreen {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: white;
    z-index: 9999;
    display: flex;
    flex-direction: column;
    padding: 20px;
    overflow: hidden;
}

.pc-player-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    flex-shrink: 0;
}
#pcFavBtn {
    color: transparent !important;
    border-color: transparent !important;
}
.pc-player-sound-btn,
.pc-player-close-btn {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: none;
    background-color: transparent !important;
    font-size: 20px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s;
}

.pc-player-sound-btn:hover,
.pc-player-close-btn:hover {

}

/* CERCUL MARE */
.pc-player-circle-container {
    position: relative;
    width: 90vw;
    max-width: 500px;
    aspect-ratio: 1;
    margin: 0 auto 30px;
    flex-shrink: 0;
}

/* Background portocaliu palid */
.pc-player-circle-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 50%;
    background: #141821;
}

/* Cercul portocaliu închis (pulsează) */
.pc-player-circle-fill {
    position: absolute;
    top: 50%;
    left: 50%;

    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: #19D27C;
    transform-origin: center;
    transition: none;
    will-change: transform;
    transform: translate3d(-50%, -50%, 0) scale(0);
    backface-visibility: hidden;
}

/* CERC ALB pentru timer */
.pc-player-timer-circle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 140px;
    height: 140px;
    border-radius: 50%;
    background: #141821;
    border: 3px solid #19D27C;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10;
    box-shadow: 0 4px 20px rgba(25,210,124, 0.15);
}

/* Timer */
.pc-player-timer {
    font-size: 56px;
    font-weight: 700;
    color: #19D27C;
}

/* TEXT STATUS */
.pc-player-status {
    text-align: center;
    margin-bottom: 20px;
    flex-shrink: 0;
}

.pc-player-status h3 {
    font-size: 24px;
    font-weight: 600;
    color: #EEF1F6;
    margin-bottom: 8px;
}

.pc-player-status p {
    color: #98A1B0;
        max-width: 600px;
    margin: 0 auto;
}

/* TABS */
.pc-player-tabs {
    padding: 0 20px;
    margin-bottom: 20px;
    flex-shrink: 0;
    max-height: none;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
@media only screen and (min-width: 760px) {
    .pc-player-tabs {
        justify-content: center;
    }
}

.pc-player-tab {
    padding: 10px 20px;
    border: 2px solid transparent;
    background: white;
    border-radius: 20px;
    font-size: 14px;
    color: #98A1B0 !important;
    white-space: nowrap;
    cursor: pointer;
    transition: all 0.2s;
    flex-shrink: 0;
}


.pc-player-tab.completed {

}

/* CONTROLS */
.pc-player-controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 20px;
    margin-top: auto;
    padding-bottom: 20px;
    flex-shrink: 0;
}

.pc-player-nav-btn {
    width: 50px;
    height: 50px;
    border-radius: 16px;
    border: 2px solid #141821;
    background: white;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s;
    color: #EEF1F6;
    font-size: 24px;
    font-weight: 300;
}

.pc-player-nav-btn:hover:not(:disabled) {
    border-color: #19D27C;
    color: #19D27C;
    background: #141821;
}

.pc-player-nav-btn:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

.pc-player-continue-btn {
    flex: 1;
    max-width: 400px;
    padding: 10px 32px;
    background: #19D27C;
    color: white;
    border: none;
    border-radius: 12px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    transition: all 0.2s;
}

.pc-player-continue-btn:hover {
    background: #FFB020;
}


@media (max-width: 640px) {
    .pc-player-circle-container {
        width: 85vw;
        margin-bottom: 20px;
    }
    
    .pc-player-timer-circle {
        width: 120px;
        height: 120px;
    }
    
    .pc-player-timer {
        font-size: 48px;
    }
    
    .pc-player-tab {
        font-size: 13px;
        padding: 8px 16px;
    }
}



/* Câmpuri pentru exercițiu în 2 pași */
.pc-kegel-doua-pasi-fields {
    transition: all 0.3s ease;
}
.pc-kegel-doua-pasi-fields.hidden {
    display: none !important;
}















/* Exercițiu activ în listă */
.pc-exercise-item.is-active {
    background: #141821 !important;
    border-color: #19D27C !important;
}

/* Icon de INFO pentru exercițiul activ */
.pc-exercise-info-icon {
    display: inline-block;
    margin-left: 8px;
    font-size: 16px;
    cursor: pointer;
    opacity: 0.7;
    transition: opacity 0.2s;
}

.pc-exercise-info-icon:hover {
    opacity: 1;
}

/* Butonul de pauză/continuă - îmbunătățit */
.pc-player-continue-btn {
    position: relative;
    overflow: hidden;
}

.pc-player-continue-btn::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(255,255,255,.07);
    opacity: 0;
    transition: opacity 0.2s;
}

.pc-player-continue-btn:active::after {
    opacity: 1;
}

/* Săgețile inactive când rulează */
.pc-player-nav-btn:disabled {
    opacity: 0.3;
    cursor: not-allowed;
    background: #141821;
    color: #98A1B0;
}

/* Tabs - doar exercițiul activ are background */


.pc-player-tab.active {
    background: transparent !important;
    border-color: transparent !important;
    color: #EEF1F6 !important;
    font-weight: 600;
}


/* Buton pauzat */
.pc-player-continue-btn.paused {
    background: white !important;
    color: #19D27C !important;
    border: 2px solid #19D27C !important;
}












/* Tabs orizontale cu scroll pe mobil */
.pc-player-tabs {
    display: flex !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none;  /* IE 10+ */
    padding: 0 8px;
    margin: 0 !important;
}
.pc-player-tabs::-webkit-scrollbar { 
    display: none; /* Chrome/Safari */
}
.pc-player-tab {
    flex-shrink: 0 !important; /* Previne împachetarea pe mobil */
    white-space: nowrap !important;
    margin: 0 4px !important;
}


















/* Tabs cu scroll automat */
.pc-player-tabs {
    display: flex !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none;  /* IE 10+ */
    padding: 0 8px;
    margin: 0 !important;
    gap: 8px;
    justify-content: center;
}

.pc-player-tabs::-webkit-scrollbar { 
    display: none; /* Chrome/Safari */
}

.pc-player-tab {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    padding: 10px 16px !important;


    border-radius: 20px !important;
    font-size: 14px !important;

    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

.pc-player-tab.active {

    font-weight: 600 !important;
    transform: scale(1.05);
}


























.pc-pas-row {
    margin-bottom: 15px;
    clear: both;
}

.pc-pas-content {
    padding: 15px;
    background: #141821;
    border: 1px solid #141821;
    border-radius: 4px;
    margin-top: 8px;
}

.pc-unitate-row {
    margin-bottom: 10px;
    background: #141821;
    padding: 12px;
    border-radius: 4px;
    border: 1px solid #141821;
}



























.pc-pas-drag,
.pc-unitate-drag {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 28px !important;
    height: 28px !important;
    cursor: move !important;
    user-select: none !important;
    border-radius: 6px !important;
    background: #141821 !important;
    margin-right: 10px !important;
}
.pc-pas-drag:hover,
.pc-unitate-drag:hover {
    background: #1B2029 !important;
}














.pc-sort-placeholder {
  background: #141821;
  border: 2px dashed #19D27C;
  border-radius: 6px;
  height: 50px;
  margin: 10px 0;
}









.pc-pas-drag,
.pc-unitate-drag{
  display:inline-flex;
  width:28px;
  height:28px;
  align-items:center;
  justify-content:center;
  cursor:move;
  user-select:none;
  -webkit-user-select:none;
  background:#1B2029;
  border-radius:6px;
}

.pc-pas-header,
.pc-unitate-header{
  cursor:default !important;
}

















.pc-workout-complete-v2 {
    min-height: 100vh;
    background: #141821;
    display: flex;
    flex-direction: column;
}

.pc-complete-header-gradient {
    position: relative;
    background: linear-gradient(135deg, #19D27C 0%, #19D27C 40%, #19D27C 70%, #19D27C 100%);
    padding: 40px 20px 60px;
    text-align: center;
    overflow: hidden;
}

.pc-complete-skip {
    position: absolute;
    top: 16px;
    right: 20px;
    background: none;
    border: none;
    color: rgba(255,255,255,0.85);
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    padding: 6px 12px;
    border-radius: 6px;
    transition: background 0.2s;
}

.pc-complete-skip:hover {
    background: rgba(255,255,255,.07);
    color: #EEF1F6;
}

.pc-complete-thumbs {
    margin: 0 auto 10px;
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: thumbsBounce 0.6s ease-out;
}

@keyframes thumbsBounce {
    0% { transform: scale(0.3) rotate(-10deg); opacity: 0; }
    60% { transform: scale(1.15) rotate(5deg); }
    100% { transform: scale(1) rotate(0deg); opacity: 1; }
}

.pc-complete-wave {
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    line-height: 0;
}

.pc-complete-wave svg {
    width: 100%;
    height: 40px;
}

.pc-complete-body {
    padding: 10px 20px 30px;
    text-align: center;
    flex: 1;
}

.pc-complete-title {
    font-size: 28px;
    font-weight: 800;
    color: #EEF1F6;
    margin: 0 0 6px;
}

.pc-complete-subtitle {
    font-size: 15px;
    color: #98A1B0;
    margin: 0 0 20px;
}

.pc-complete-stats-row {
    display: flex;
    justify-content: center;
    gap: 20px;
    margin-bottom: 24px;
}

.pc-complete-stat-item {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.pc-complete-stat-num {
    font-size: 32px;
    font-weight: 800;
    color: #19D27C;
}

.pc-complete-stat-lbl {
    font-size: 13px;
    color: #98A1B0;
    margin-top: 2px;
}

.pc-complete-question {
    font-size: 16px;
    font-weight: 600;
    color: #EEF1F6;
    margin: 0 0 16px;
}

.pc-feedback-options {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: 400px;
    margin: 0 auto;
}

.pc-feedback-option {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 18px;
    border: 2px solid #141821;
    border-radius: 14px;
    cursor: pointer;
    transition: all 0.2s ease;
    background: #141821;
}

.pc-feedback-option:hover {
    border-color: #1B2029;
    background: #1B2029;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(25,210,124,0.08);
}

.pc-feedback-option.selected {
    border-color: #19D27C;
    background: #1B2029;
    box-shadow: 0 0 0 3px rgba(25,210,124,0.15);
    transform: scale(0.98);
}

.pc-feedback-option.selected .pc-feedback-emoji {
    animation: emojiPop 0.3s ease-out;
}

@keyframes emojiPop {
    0% { transform: scale(1); }
    50% { transform: scale(1.3); }
    100% { transform: scale(1); }
}

.pc-feedback-emoji {
    font-size: 32px;
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.pc-feedback-info {
    text-align: left;
}

.pc-feedback-label {
    font-size: 15px;
    font-weight: 700;
    color: #EEF1F6;
}

.pc-feedback-desc {
    font-size: 13px;
    color: #98A1B0;
    margin-top: 2px;
}

/* =====================================================================
   KEGEL-UP · STRAT DE DESIGN CURSURI (v2)
   Aceeași direcție ca la quiz: grafit, verde de performanță, colțuri ferme.
   Ultimul în fișier, deci suprascrie regulile vechi.
   ===================================================================== */


.pc-wrap,
.pc-login-wrap {
    --pc-ink:       #0C0E12;
    --pc-surface:   #141821;
    --pc-surface-2: #1B2029;
    --pc-line:      rgba(255,255,255,.09);
    --pc-line-2:    rgba(255,255,255,.16);
    --pc-text:      #EEF1F6;
    --pc-muted:     #98A1B0;
    --pc-accent:    #19D27C;
    --pc-accent-2:  #12B86B;
    --pc-signal:    #FFB020;

    --pc-r-sm: 8px;
    --pc-r-md: 12px;
    --pc-r-lg: 16px;

    --pc-head: 'Space Grotesk', system-ui, sans-serif;
    --pc-body: 'Inter', system-ui, sans-serif;
}

/* ---------------------------------------------------------------- login */
.pc-login-wrap {
    background: radial-gradient(120% 90% at 50% 0%, #141821 0%, var(--pc-ink) 60%);
    font-family: var(--pc-body);
}

.pc-login-container,
.pc-login-form {
    background: var(--pc-surface);
    border: 1px solid var(--pc-line);
    border-radius: var(--pc-r-lg);
    box-shadow: 0 24px 60px rgba(0,0,0,.45);
}

.pc-login-title { font-family: var(--pc-head); color: var(--pc-text); letter-spacing: -.02em; }
.pc-login-subtitle { color: var(--pc-muted); }

.pc-login-form input,
.pc-input {
    background: var(--pc-surface-2);
    border: 1px solid var(--pc-line);
    border-radius: var(--pc-r-sm);
    color: var(--pc-text);
    font-family: var(--pc-body);
}

.pc-login-form input::placeholder,
.pc-input::placeholder { color: var(--pc-muted); }

.pc-login-btn,
.pc-start-training-btn,
.pc-mood-save-btn,
.pc-journal-add-btn,
.pc-player-continue-btn,
.pc-chat-send {
    background: var(--pc-accent);
    color: #06210F;
    border: none;
    border-radius: var(--pc-r-sm);
    font-family: var(--pc-head);
    font-weight: 700;
    letter-spacing: .01em;
    box-shadow: 0 6px 20px rgba(25,210,124,.25);
}

.pc-login-btn:hover,
.pc-start-training-btn:hover { background: var(--pc-accent-2); }

.pc-login-error { color: #FFB020; }

/* ---------------------------------------------------------------- shell */
.pc-wrap {
    background: var(--pc-ink);
    color: var(--pc-text);
    font-family: var(--pc-body);
    -webkit-font-smoothing: antialiased;
}

.pc-header {
    background: rgba(12,14,18,.92);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--pc-line);
}

.pc-hello, .pc-name { font-family: var(--pc-head); color: var(--pc-text); letter-spacing: -.01em; }
.pc-sub, .pc-muted, .pc-mini { color: var(--pc-muted); }

.pc-section-title,
.pc-course-title,
.pc-step-title,
.pc-exercises-title,
.pc-profile-section-title,
.pc-complete-title { font-family: var(--pc-head); color: var(--pc-text); letter-spacing: -.01em; }

/* ---------------------------------------------------------------- carduri */
.pc-card,
.pc-course-card,
.pc-explore-course-card,
.pc-section,
.pc-list-item,
.pc-journal-entry,
.pc-profile-item,
.pc-exercise-item,
.pc-step,
.pc-chat-cat,
.pc-feedback-option {
    background: var(--pc-surface);
    border: 1px solid var(--pc-line);
    border-radius: var(--pc-r-md);
    color: var(--pc-text);
}

.pc-card:hover,
.pc-course-card:hover,
.pc-explore-course-card:hover,
.pc-exercise-item:hover {
    border-color: var(--pc-line-2);
    transform: translateY(-1px);
    transition: border-color .15s ease, transform .12s ease;
}

.pc-course-thumb,
.pc-course-img,
.pc-explore-course-img {
    border-radius: var(--pc-r-sm);
    overflow: hidden;
}

.pc-course-hero {
    border-radius: var(--pc-r-lg);
    border: 1px solid var(--pc-line);
    overflow: hidden;
}

.pc-badge,
.pc-pill,
.pc-journal-tag,
.pc-progress-badge,
.pc-kegel-badge {
    background: rgba(25,210,124,.14);
    color: var(--pc-accent);
    border: 1px solid rgba(25,210,124,.28);
    border-radius: 6px;
    font-family: var(--pc-head);
    font-weight: 600;
    font-size: 11px;
    letter-spacing: .03em;
    text-transform: uppercase;
}

.pc-locked-msg,
.pc-lock-icon { color: var(--pc-muted); }

/* ---------------------------------------------------------------- progres */
.pc-progress,
.pc-progress-bar {
    background: rgba(255,255,255,.07);
    border-radius: 4px;
    overflow: hidden;
}

.pc-progress-fill {
    background: linear-gradient(90deg, var(--pc-accent), #19D27C);
    border-radius: 4px;
    box-shadow: 0 0 12px rgba(25,210,124,.35);
}

.pc-journey-name { font-family: var(--pc-head); color: var(--pc-text); }
.pc-journey-small { color: var(--pc-muted); }

/* ---------------------------------------------------------------- player */
.pc-kegel-player-fullscreen {
    background: radial-gradient(120% 90% at 50% 0%, #141821 0%, var(--pc-ink) 65%);
}

.pc-player-tabs {
    background: var(--pc-surface);
    border: 1px solid var(--pc-line);
    border-radius: var(--pc-r-sm);
    padding: 4px;
}

.pc-player-tab {
    border-radius: 6px;
    color: var(--pc-muted);
    font-family: var(--pc-head);
    font-weight: 600;
}

.pc-player-tab.active,
.pc-player-tab[aria-selected="true"] {
    background: var(--pc-accent);
    color: #06210F;
}

.pc-player-circle-bg { stroke: rgba(255,255,255,.08); }
.pc-player-circle-fill { stroke: var(--pc-accent); }

.pc-player-timer,
.pc-player-status {
    font-family: var(--pc-head);
    color: var(--pc-text);
    letter-spacing: -.02em;
}

.pc-player-nav-btn,
.pc-nav-btn,
.pc-iconbtn,
.pc-player-sound-btn,
.pc-player-close-btn {
    background: var(--pc-surface-2);
    border: 1px solid var(--pc-line);
    border-radius: var(--pc-r-sm);
    color: var(--pc-text);
}

/* ---------------------------------------------------------------- jurnal + mood */
.pc-mood-option,
.pc-feedback-option {
    background: var(--pc-surface);
    border: 1px solid var(--pc-line);
    border-radius: var(--pc-r-sm);
}

.pc-mood-option.selected,
.pc-feedback-option.selected,
.pc-mood-option[data-selected="1"] {
    border-color: var(--pc-accent);
    background: linear-gradient(0deg, rgba(25,210,124,.10), rgba(25,210,124,.10)), var(--pc-surface);
}

.pc-mood-label,
.pc-feedback-label,
.pc-journal-mood-label { color: var(--pc-muted); }

/* ---------------------------------------------------------------- profil */
.pc-profile-avatar,
.pc-avatar {
    border: 1px solid var(--pc-line);
    border-radius: 50%;
}

.pc-profile-item-label { color: var(--pc-text); }
.pc-profile-item-value { color: var(--pc-muted); }

.pc-logout-btn {
    background: transparent;
    border: 1px solid var(--pc-line-2);
    color: var(--pc-text);
    border-radius: var(--pc-r-sm);
}

/* ---------------------------------------------------------------- final de lecție */
.pc-complete-header-gradient {
    background: linear-gradient(135deg, #19D27C 0%, #19D27C 100%);
}

.pc-complete-stat-num { font-family: var(--pc-head); color: var(--pc-text); }
.pc-complete-stat-lbl { color: var(--pc-muted); }
.pc-complete-skip { color: var(--pc-muted); }

/* =====================================================================
   BLOCAREA PALETEI
   Pluginul injectează inline pe .pc-wrap variabilele --primary / --secondary
   din setări (unde pot fi încă salvate culorile vechi). Un inline fără
   !important pierde în fața regulii de aici, deci paleta e fixată.
   ===================================================================== */

.pc-wrap,
.pc-login-wrap {
    --primary:   #19D27C !important;
    --secondary: #12B86B !important;
    --bg:        #0C0E12 !important;
    --card:      #141821 !important;
    --text:      #EEF1F6 !important;
    --muted:     #98A1B0 !important;
    --line:      #1B2029 !important;
}

/* bara de sus a cursului: era translucid alb */
.pc-wrap .pc-topbar,
.pc-wrap .pc-topbar-explore {
    background-color: rgba(12,14,18,.92) !important;
    border-bottom: 1px solid var(--pc-line, #1B2029) !important;
}

.pc-wrap .pc-topbar-title { color: #EEF1F6 !important; }

.pc-wrap .pc-topbar-btn,
.pc-wrap .pc-back-to-list,
.pc-wrap .pc-step-toggle,
.pc-wrap .pc-iconbtn {
    background-color: #1B2029 !important;
    border: 1px solid #1B2029 !important;
    color: #EEF1F6 !important;
    box-shadow: none !important;
}

/* hero-ul cursului: era card deschis cu titlu alb pe fundal deschis */
.pc-wrap .pc-course-hero {
    background-color: #141821 !important;
    border: 1px solid #1B2029 !important;
}

.pc-wrap .pc-course-title,
.pc-wrap .pc-course-name,
.pc-wrap .pc-li-title,
.pc-wrap .pc-step-title { color: #EEF1F6 !important; }

.pc-wrap .pc-course-thumb {
    background-color: #1B2029 !important;
    border: 1px solid #1B2029 !important;
}

/* butonul Începe */
.pc-wrap .pc-primary,
.pc-wrap .pc-start-training-btn,
.pc-wrap .pc-login-btn {
    background-color: #19D27C !important;
    color: #06210F !important;
    border: none !important;
}

/* pastile și badge-uri */
.pc-wrap .pc-pill,
.pc-wrap .pc-badge {
    background-color: rgba(25,210,124,.14) !important;
    color: #19D27C !important;
    border: 1px solid rgba(25,210,124,.28) !important;
}

/* navigația de jos */
.pc-wrap .pc-bottom {
    background-color: rgba(12,14,18,.94) !important;
    border-top: 1px solid #1B2029 !important;
}

.pc-wrap .pc-tab { color: #98A1B0 !important; background: transparent !important; }
.pc-wrap .pc-tab.is-active { color: #19D27C !important; }

/* carduri de conținut */
.pc-wrap .pc-card,
.pc-wrap .pc-about,
.pc-wrap .pc-step,
.pc-wrap .pc-list-item {
    background-color: #141821 !important;
    border: 1px solid #1B2029 !important;
    color: #EEF1F6 !important;
}

.pc-wrap .pc-about-label,
.pc-wrap .pc-about-text,
.pc-wrap .pc-sub,
.pc-wrap .pc-muted,
.pc-wrap .pc-mini { color: #98A1B0 !important; }

/* elementele care pot avea imagine pe fundal: nu le atingem fundalul */
.pc-wrap .pc-course-thumb,
.pc-wrap .pc-course-img,
.pc-wrap .pc-explore-course-img {
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

.pc-wrap .pc-course-thumb[style*="url("],
.pc-wrap .pc-explore-course-img[style*="url("] {
    background-color: transparent !important;
    border: none !important;
}

/* =====================================================================
   CONSISTENȚĂ VIZUALĂ
   Toate razele, înălțimile și spațierile trec prin aceleași valori.
   Înainte erau amestecate: 6, 8, 12, 16, 18, 24px, în funcție de ecran.
   ===================================================================== */

.pc-wrap, .pc-login-wrap {
    --r-xs: 8px;    /* pastile, badge-uri */
    --r-sm: 10px;   /* butoane, câmpuri */
    --r-md: 14px;   /* carduri */
    --r-lg: 18px;   /* panouri mari, hero */
    --nav-h: 68px;  /* înălțimea barei de jos */
}

/* ---- carduri: o singură rază peste tot */
.pc-wrap .pc-card,
.pc-wrap .pc-section,
.pc-wrap .pc-course-card,
.pc-wrap .pc-explore-course-card,
.pc-wrap .pc-list-item,
.pc-wrap .pc-step,
.pc-wrap .pc-profile-section,
.pc-wrap .pc-journal-entry,
.pc-wrap .pc-chat-cat,
.pc-wrap .pc-feedback-option,
.pc-wrap .pc-mood-option,
.pc-wrap .pc-stat-box,
.pc-wrap .pc-fb-stat,
.pc-wrap .pc-about {
    border-radius: var(--r-md) !important;
}

.pc-wrap .pc-course-hero,
.pc-wrap .pc-kegel-player-fullscreen > .pc-card {
    border-radius: var(--r-lg) !important;
}

/* ---- butoane: aceeași rază și aceeași înălțime */
.pc-wrap .pc-primary,
.pc-wrap .pc-login-btn,
.pc-wrap .pc-start-training-btn,
.pc-wrap .pc-journal-add-btn,
.pc-wrap .pc-mood-save-btn,
.pc-wrap .pc-player-continue-btn,
.pc-wrap .pc-logout-btn,
.pc-wrap .pc-chat-send {
    border-radius: var(--r-sm) !important;
    min-height: 48px;
    padding: 0 22px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.pc-wrap .pc-topbar-btn,
.pc-wrap .pc-iconbtn,
.pc-wrap .pc-player-nav-btn,
.pc-wrap .pc-step-toggle {
    border-radius: var(--r-sm) !important;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* ---- pastile și badge-uri */
.pc-wrap .pc-badge,
.pc-wrap .pc-pill,
.pc-wrap .pc-journal-tag,
.pc-wrap .pc-kegel-badge,
.pc-wrap .pc-tag-btn,
.pc-wrap .pc-unitate-tip {
    border-radius: var(--r-xs) !important;
    padding: 4px 10px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    line-height: 1.6;
}

/* ---- imagini de curs: același format, aceeași rază */
.pc-wrap .pc-course-img,
.pc-wrap .pc-explore-course-img {
    border-radius: var(--r-md) var(--r-md) 0 0 !important;
    aspect-ratio: 16 / 10;
    width: 100%;
    object-fit: cover;
}

.pc-wrap .pc-course-card,
.pc-wrap .pc-explore-course-card { overflow: hidden; }

/* ---- bara de jos: fixată mereu, cu spațiu pentru safe area */
.pc-wrap .pc-bottom {
    position: fixed !important;
    left: 0; right: 0; bottom: 0;
    z-index: 60;
    height: calc(var(--nav-h) + env(safe-area-inset-bottom, 0px));
    padding-bottom: env(safe-area-inset-bottom, 0px);
    display: flex;
    align-items: center;
    justify-content: space-around;
    background: rgba(12,14,18,.94) !important;
    backdrop-filter: blur(14px);
    border-top: 1px solid #1B2029 !important;
}

/* conținutul nu mai intră sub bară */
.pc-wrap .pc-view { padding-bottom: calc(var(--nav-h) + 24px + env(safe-area-inset-bottom, 0px)); }

.pc-wrap .pc-tab {
    border-radius: var(--r-xs) !important;
    padding: 8px 14px;
    font-size: 13px;
    font-weight: 600;
    border: none !important;
}

.pc-wrap .pc-tab.is-active,
.pc-wrap .pc-tab.active {
    background: rgba(25,210,124,.14) !important;
    color: #19D27C !important;
}

/* ---- bara de sus: aceeași înălțime pe toate ecranele */
.pc-wrap .pc-topbar,
.pc-wrap .pc-topbar-explore {
    position: sticky;
    top: 0;
    z-index: 50;
    min-height: 64px;
    padding: 12px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.pc-wrap .pc-topbar-title {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: -.01em;
}

/* ---- titluri de secțiune: o singură scară tipografică */
.pc-wrap .pc-section-title,
.pc-wrap .pc-exercises-title,
.pc-wrap .pc-profile-section-title {
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -.01em;
    margin: 0 0 14px;
}

.pc-wrap .pc-course-title { font-size: 19px; font-weight: 700; letter-spacing: -.01em; }
.pc-wrap .pc-li-title     { font-size: 15px; font-weight: 600; }
.pc-wrap .pc-mini,
.pc-wrap .pc-li-sub       { font-size: 12px; color: #98A1B0; }

/* ---- spațiere constantă între secțiuni */
.pc-wrap .pc-section + .pc-section,
.pc-wrap .pc-card + .pc-card { margin-top: 16px; }

.pc-wrap .pc-view > * + * { margin-top: 16px; }

/* =====================================================================
   PREMIUM PASS
   Rescrie aspectul: bara de jos plutitoare, carduri cu adâncime,
   o singură scară de spațiere, stări de hover și blocat coerente.
   ===================================================================== */

.pc-wrap {
    --surface-1: #12161F;
    --surface-2: #171C27;
    --line-1: rgba(255,255,255,.07);
    --line-2: rgba(255,255,255,.12);
    --glow: 0 1px 0 rgba(255,255,255,.04) inset;
    --shadow-card: 0 2px 10px rgba(0,0,0,.35);
    --shadow-float: 0 12px 40px rgba(0,0,0,.55);
    --gutter: 20px;
}

/* ---------------------------------------------------------------- layout */
.pc-wrap .pc-view {
    max-width: 1120px;
    margin: 0 auto;
    padding-left: var(--gutter);
    padding-right: var(--gutter);
    padding-bottom: 130px;
}

.pc-wrap .pc-topbar,
.pc-wrap .pc-topbar-explore {
    background: rgba(12,14,18,.82) !important;
    backdrop-filter: blur(16px) saturate(140%);
    border-bottom: 1px solid var(--line-1) !important;
    margin-left: calc(var(--gutter) * -1);
    margin-right: calc(var(--gutter) * -1);
    padding-left: var(--gutter);
    padding-right: var(--gutter);
}

/* ---------------------------------------------------------------- bara de jos, plutitoare */
.pc-wrap .pc-bottom {
    position: fixed !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%);
    bottom: calc(18px + env(safe-area-inset-bottom, 0px));
    width: min(460px, calc(100% - 32px));
    height: 62px;
    padding: 6px;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 4px;
    background: rgba(18,22,31,.86) !important;
    backdrop-filter: blur(20px) saturate(160%);
    border: 1px solid var(--line-2) !important;
    border-radius: 18px !important;
    box-shadow: var(--shadow-float);
}

.pc-wrap .pc-tab {
    flex: 1;
    height: 100%;
    display: flex !important;
    align-items: center;
    justify-content: center;
    border-radius: 13px !important;
    font-size: 13px;
    font-weight: 600;
    color: #98A1B0 !important;
    background: transparent !important;
    transition: background .18s ease, color .18s ease;
}

.pc-wrap .pc-tab:hover { color: #EEF1F6 !important; }

.pc-wrap .pc-tab.is-active,
.pc-wrap .pc-tab.active {
    background: linear-gradient(180deg, rgba(25,210,124,.2), rgba(25,210,124,.1)) !important;
    color: #19D27C !important;
    box-shadow: var(--glow);
}

/* ---------------------------------------------------------------- antete de secțiune */
.pc-wrap .pc-section-title,
.pc-wrap .pc-explore-cat-title {
    font-family: 'Space Grotesk', Inter, sans-serif;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -.02em;
    margin: 32px 0 16px;
}

.pc-wrap .pc-section-arrow,
.pc-wrap .pc-explore-cat-arrow,
.pc-wrap .pc-step-nav ~ * .pc-nav-btn {
    width: 34px; height: 34px;
    border-radius: 11px !important;
    background: var(--surface-2) !important;
    border: 1px solid var(--line-1) !important;
    color: #19D27C !important;
    display: inline-flex; align-items: center; justify-content: center;
    transition: border-color .18s ease, transform .18s ease;
}
.pc-wrap .pc-section-arrow:hover,
.pc-wrap .pc-nav-btn:hover { border-color: var(--line-2) !important; transform: translateY(-1px); }

/* ---------------------------------------------------------------- carduri de curs */
.pc-wrap .pc-course-card,
.pc-wrap .pc-explore-course-card {
    background: var(--surface-1) !important;
    border: 1px solid var(--line-1) !important;
    border-radius: 16px !important;
    overflow: hidden;
    box-shadow: var(--shadow-card);
    transition: transform .2s cubic-bezier(.2,.7,.3,1), border-color .2s ease, box-shadow .2s ease;
}

.pc-wrap .pc-course-card:hover,
.pc-wrap .pc-explore-course-card:hover {
    transform: translateY(-3px);
    border-color: rgba(25,210,124,.4) !important;
    box-shadow: 0 10px 30px rgba(0,0,0,.5);
}

/* zona de imagine: nu mai e bloc verde plat */
.pc-wrap .pc-course-img,
.pc-wrap .pc-explore-course-img {
    position: relative;
    aspect-ratio: 16 / 10;
    border-radius: 0 !important;
    background-color: var(--surface-2) !important;
    background-image:
        radial-gradient(120% 90% at 50% 0%, rgba(25,210,124,.22) 0%, rgba(25,210,124,0) 60%),
        linear-gradient(180deg, #19202C 0%, #131821 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    border-bottom: 1px solid var(--line-1);
}

/* cand exista poza reala, ea acopera fundalul decorativ */
.pc-wrap .pc-course-img[style*="url("],
.pc-wrap .pc-explore-course-img[style*="url("] {
    background-image: none !important;
    background-size: cover !important;
    background-position: center !important;
}

.pc-wrap .pc-course-emoji,
.pc-wrap .pc-thumb-emoji {
    font-size: 34px;
    line-height: 1;
    filter: drop-shadow(0 6px 14px rgba(0,0,0,.5));
    opacity: .95;
}

.pc-wrap .pc-course-body,
.pc-wrap .pc-explore-course-info { padding: 14px 16px 16px; }

.pc-wrap .pc-course-name,
.pc-wrap .pc-explore-course-name {
    font-size: 15px;
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: -.01em;
    color: #EEF1F6;
    margin-bottom: 10px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.pc-wrap .pc-course-meta,
.pc-wrap .pc-explore-course-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 12px;
    color: #98A1B0;
}

/* starea blocat: discretă, nu două lacăte */
.pc-wrap .pc-course-card.is-locked,
.pc-wrap .pc-explore-course-card.is-locked { opacity: .72; }

.pc-wrap .pc-course-card.is-locked:hover,
.pc-wrap .pc-explore-course-card.is-locked:hover { transform: none; }

.pc-wrap .pc-lock-badge,
.pc-wrap .pc-course-lock {
    position: absolute; top: 10px; right: 10px;
    width: 26px; height: 26px;
    border-radius: 9px;
    background: rgba(12,14,18,.7);
    backdrop-filter: blur(6px);
    border: 1px solid var(--line-1);
    display: flex; align-items: center; justify-content: center;
    font-size: 12px;
}

/* ---------------------------------------------------------------- liste și panouri */
.pc-wrap .pc-section,
.pc-wrap .pc-card,
.pc-wrap .pc-profile-section,
.pc-wrap .pc-about {
    background: var(--surface-1) !important;
    border: 1px solid var(--line-1) !important;
    border-radius: 16px !important;
    box-shadow: var(--shadow-card);
}

.pc-wrap .pc-list-item,
.pc-wrap .pc-profile-item,
.pc-wrap .pc-step {
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid var(--line-1) !important;
    border-radius: 0 !important;
    padding: 16px 18px;
    transition: background .15s ease;
}
.pc-wrap .pc-list-item:last-child,
.pc-wrap .pc-profile-item:last-child,
.pc-wrap .pc-step:last-child { border-bottom: none !important; }
.pc-wrap .pc-list-item:hover,
.pc-wrap .pc-profile-item:hover { background: rgba(255,255,255,.03) !important; }

/* ---------------------------------------------------------------- progres */
.pc-wrap .pc-progress,
.pc-wrap .pc-progress-bar {
    height: 6px;
    background: rgba(255,255,255,.06) !important;
    border-radius: 99px;
    overflow: hidden;
}
.pc-wrap .pc-progress-fill {
    background: linear-gradient(90deg, #19D27C, #5BF0AE) !important;
    border-radius: 99px;
    box-shadow: 0 0 16px rgba(25,210,124,.35);
}

/* ---------------------------------------------------------------- butoane */
.pc-wrap .pc-primary,
.pc-wrap .pc-start-training-btn,
.pc-wrap .pc-journal-add-btn {
    background: linear-gradient(180deg, #1FE089, #15BE6F) !important;
    color: #06210F !important;
    border-radius: 12px !important;
    box-shadow: 0 6px 20px rgba(25,210,124,.28), var(--glow);
    transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.pc-wrap .pc-primary:hover,
.pc-wrap .pc-start-training-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 26px rgba(25,210,124,.34);
    filter: brightness(1.03);
}

.pc-wrap .pc-topbar-btn,
.pc-wrap .pc-iconbtn,
.pc-wrap .pc-step-toggle {
    background: var(--surface-2) !important;
    border: 1px solid var(--line-1) !important;
    border-radius: 12px !important;
    color: #EEF1F6 !important;
}

/* ---------------------------------------------------------------- jurnal / stare */
.pc-wrap .pc-mood-option {
    width: 52px; height: 52px;
    border-radius: 15px !important;
    background: var(--surface-2) !important;
    border: 1px solid var(--line-1) !important;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 22px;
    transition: transform .15s ease, border-color .15s ease;
}
.pc-wrap .pc-mood-option:hover { transform: translateY(-2px); border-color: var(--line-2) !important; }
.pc-wrap .pc-mood-option.selected { border-color: #19D27C !important; background: rgba(25,210,124,.12) !important; }

/* ---------------------------------------------------------------- grile */
.pc-wrap .pc-courses-grid,
.pc-wrap .pc-explore-grid,
.pc-wrap .pc-category-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 16px;
}

@media (max-width: 600px) {
    .pc-wrap { --gutter: 16px; }
    .pc-wrap .pc-section-title { font-size: 18px; margin: 26px 0 14px; }
    .pc-wrap .pc-courses-grid,
    .pc-wrap .pc-explore-grid,
    .pc-wrap .pc-category-grid { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
    .pc-wrap .pc-course-name { font-size: 14px; }
}


/* =====================================================================
   HERO-UL CURSULUI
   `.pc-course-thumb` e iconita mica de langa titlu, nu o imagine de card.
   Regula generica de mai sus o intindea pe toata latimea si impingea
   titlul in afara ecranului.
   ===================================================================== */

.pc-wrap .pc-course-hero {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px;
    background: var(--surface-1) !important;
    border: 1px solid var(--line-1) !important;
    border-radius: 16px !important;
    box-shadow: var(--shadow-card);
}

.pc-wrap .pc-course-thumb {
    flex: 0 0 auto;
    width: 64px;
    height: 64px;
    aspect-ratio: auto !important;
    border-radius: 14px !important;
    background-color: var(--surface-2) !important;
    background-image: radial-gradient(120% 120% at 50% 0%, rgba(25,210,124,.22), rgba(25,210,124,0) 65%);
    background-size: cover;
    background-position: center;
    border: 1px solid var(--line-1) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.pc-wrap .pc-course-thumb .pc-thumb-emoji { font-size: 28px; }

.pc-wrap .pc-course-hero-info {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.pc-wrap .pc-course-hero .pc-course-title {
    margin: 0;
    font-size: 18px;
    line-height: 1.3;
    overflow-wrap: anywhere;
}

.pc-wrap .pc-course-hero-actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

@media (max-width: 520px) {
    .pc-wrap .pc-course-hero { align-items: flex-start; }
    .pc-wrap .pc-course-thumb { width: 52px; height: 52px; border-radius: 12px !important; }
    .pc-wrap .pc-course-hero .pc-course-title { font-size: 16px; }
}




/* =====================================================================
   PASII CURSULUI
   Structura reala: .pc-step > .pc-step-header (stanga + buton) + .pc-step-units.
   Regula generica de flex le punea pe acelasi rand, de unde lista de unitati
   aparea lipita in dreapta titlului.
   ===================================================================== */

.pc-wrap .pc-steps {
    background: var(--surface-1);
    border: 1px solid var(--line-1);
    border-radius: 16px;
    overflow: hidden;
    box-shadow: var(--shadow-card);
}

.pc-wrap .pc-step {
    display: block !important;
    padding: 0 !important;
    border-bottom: 1px solid var(--line-1) !important;
}
.pc-wrap .pc-step:last-child { border-bottom: none !important; }

.pc-wrap .pc-step-header {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px 20px;
    cursor: pointer;
    transition: background .15s ease;
}
.pc-wrap .pc-step-header:hover { background: rgba(255,255,255,.03); }

.pc-wrap .pc-step-left { flex: 1 1 auto; min-width: 0; }

.pc-wrap .pc-step-top {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 8px;
    font-size: 12px;
    color: #98A1B0;
}

.pc-wrap .pc-step-title {
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
    color: #EEF1F6;
    overflow-wrap: anywhere;
}

/* sageata, fixata in dreapta */
.pc-wrap .pc-step-toggle {
    flex: 0 0 auto;
    margin-left: auto;
    width: 34px; height: 34px;
    border-radius: 11px !important;
    background: var(--surface-2) !important;
    border: 1px solid var(--line-1) !important;
    color: #98A1B0 !important;
    display: flex; align-items: center; justify-content: center;
    font-size: 11px;
    transition: transform .2s ease, color .2s ease, border-color .2s ease;
}
.pc-wrap .pc-step.is-open .pc-step-toggle,
.pc-wrap .pc-step.open .pc-step-toggle,
.pc-wrap .pc-step.active .pc-step-toggle {
    transform: rotate(180deg);
    color: #19D27C !important;
    border-color: rgba(25,210,124,.4) !important;
}

/* lista de unitati: ascunsa pana la deschiderea pasului.
   Regula mea anterioara o facea `display:block` neconditionat si suprascria
   starea implicita, deci pasul nu se mai putea inchide. */
.pc-wrap .pc-step-units {
    display: none;
    width: 100%;
    padding: 0 20px 18px;
    background: rgba(0,0,0,.18);
}

.pc-wrap .pc-step.is-open > .pc-step-units {
    display: block;
    animation: pcStepOpen .22s cubic-bezier(.2,.7,.3,1);
}

@keyframes pcStepOpen {
    from { opacity: 0; transform: translateY(-6px); }
    to   { opacity: 1; transform: none; }
}

.pc-wrap .pc-unit {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    margin-top: 10px;
    background: var(--surface-2);
    border: 1px solid var(--line-1);
    border-radius: 12px;
    transition: border-color .15s ease, transform .15s ease;
}
.pc-wrap .pc-unit:hover { border-color: var(--line-2); transform: translateX(2px); }

.pc-wrap .pc-unit-icon {
    flex: 0 0 auto;
    width: 38px; height: 38px;
    border-radius: 11px;
    background: rgba(255,255,255,.05);
    display: flex; align-items: center; justify-content: center;
    font-size: 16px;
}

.pc-wrap .pc-unit-info { flex: 1 1 auto; min-width: 0; }
.pc-wrap .pc-unit-title { font-size: 14px; font-weight: 600; color: #EEF1F6; line-height: 1.35; }
.pc-wrap .pc-unit-meta { font-size: 12px; color: #98A1B0; margin-top: 3px; }

.pc-wrap .pc-unit-play {
    flex: 0 0 auto;
    width: 36px; height: 36px;
    border-radius: 50%;
    background: linear-gradient(180deg, #1FE089, #15BE6F);
    color: #06210F;
    display: flex; align-items: center; justify-content: center;
    font-size: 12px;
    box-shadow: 0 4px 14px rgba(25,210,124,.3);
}

.pc-wrap .pc-unit.is-completed .pc-unit-play {
    background: rgba(255,255,255,.07);
    color: #98A1B0;
    box-shadow: none;
}

.pc-wrap .pc-locked-msg {
    padding: 22px;
    text-align: center;
    color: #98A1B0;
    font-size: 13px;
}
.pc-wrap .pc-locked-msg .pc-lock-icon { font-size: 22px; margin-bottom: 8px; opacity: .8; }

@media (max-width: 520px) {
    .pc-wrap .pc-step-header { padding: 16px; gap: 12px; }
    .pc-wrap .pc-step-units { padding: 0 16px 16px; }
}


/* lacatul din randurile de lista nu mai cade peste sageata */
.pc-wrap .pc-list-item { position: relative; }

.pc-wrap .pc-list-item .pc-lock-badge,
.pc-wrap .pc-list-item .pc-course-lock {
    position: static;
    width: 22px; height: 22px;
    margin-left: 10px;
    border-radius: 7px;
    flex: 0 0 auto;
}

.pc-wrap .pc-li-right {
    flex: 0 0 auto;
    margin-left: 12px;
    width: 30px; height: 30px;
    border-radius: 10px;
    border: 1px solid var(--line-1);
    background: var(--surface-2);
    color: #19D27C;
    display: flex; align-items: center; justify-content: center;
    font-size: 14px;
}

.pc-wrap .pc-list-item { display: flex; align-items: center; gap: 4px; }
.pc-wrap .pc-li-main { flex: 1 1 auto; min-width: 0; }

/* =====================================================================
   MODALE: contact și întrebări frecvente
   ===================================================================== */

.pc-modal {
    position: fixed;
    inset: 0;
    z-index: 200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    font-family: 'Inter', system-ui, sans-serif;
}

.pc-modal[hidden] { display: none; }

.pc-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(6, 8, 12, .72);
    backdrop-filter: blur(6px);
    opacity: 0;
    transition: opacity .18s ease;
}
.pc-modal.is-open .pc-modal-backdrop { opacity: 1; }

.pc-modal-box {
    position: relative;
    width: 100%;
    max-width: 460px;
    max-height: calc(100vh - 40px);
    display: flex;
    flex-direction: column;
    background: #12161F;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 20px;
    box-shadow: 0 24px 70px rgba(0,0,0,.6);
    transform: translateY(14px) scale(.98);
    opacity: 0;
    transition: transform .22s cubic-bezier(.2,.7,.3,1), opacity .18s ease;
}
.pc-modal.is-open .pc-modal-box { transform: none; opacity: 1; }

.pc-modal-box-lg { max-width: 620px; }

.pc-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 20px 22px 16px;
    border-bottom: 1px solid rgba(255,255,255,.07);
}

.pc-modal-title {
    margin: 0;
    font-family: 'Space Grotesk', Inter, sans-serif;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -.02em;
    color: #EEF1F6;
}

.pc-modal-close {
    flex: 0 0 auto;
    width: 34px; height: 34px;
    padding: 0;
    border-radius: 11px;
    background: #171C27;
    border: 1px solid rgba(255,255,255,.07);
    color: #98A1B0;
    cursor: pointer;
    /* glifa × are metrici proprii si nu se centreaza din line-height;
       o centram cu flex si o desenam la dimensiune fixa */
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: system-ui, -apple-system, 'Segoe UI', sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 0;
    transition: color .15s ease, border-color .15s ease, background .15s ease;
}
.pc-modal-close:hover { background: #1C2230; }
.pc-modal-close:hover { color: #EEF1F6; border-color: rgba(255,255,255,.18); }

.pc-modal-body {
    padding: 20px 22px;
    overflow-y: auto;
}

.pc-modal-lead {
    margin: 0 0 18px;
    font-size: 14px;
    line-height: 1.6;
    color: #98A1B0;
}

.pc-field-label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #98A1B0;
    margin-bottom: 8px;
}

.pc-textarea {
    width: 100%;
    background: #171C27;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 12px;
    padding: 14px 16px;
    color: #EEF1F6;
    font-family: inherit;
    font-size: 15px;
    line-height: 1.55;
    resize: vertical;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.pc-textarea::placeholder { color: #6B7489; }
.pc-textarea:focus {
    outline: none;
    border-color: rgba(25,210,124,.55);
    box-shadow: 0 0 0 3px rgba(25,210,124,.12);
}

.pc-modal-error {
    margin-top: 10px;
    min-height: 18px;
    font-size: 13px;
    color: #FFB020;
}

.pc-modal-foot {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    padding: 16px 22px 20px;
    border-top: 1px solid rgba(255,255,255,.07);
}

.pc-btn-ghost {
    min-height: 44px;
    padding: 0 18px;
    border-radius: 12px;
    background: transparent;
    border: 1px solid rgba(255,255,255,.12);
    color: #98A1B0;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: color .15s ease, border-color .15s ease;
}
.pc-btn-ghost:hover { color: #EEF1F6; border-color: rgba(255,255,255,.2); }

.pc-modal-foot .pc-primary {
    min-height: 44px;
    padding: 0 22px;
    border-radius: 12px;
    border: none;
    background: linear-gradient(180deg, #1FE089, #15BE6F);
    color: #06210F;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    box-shadow: 0 6px 20px rgba(25,210,124,.26);
}
.pc-modal-foot .pc-primary:disabled { opacity: .6; cursor: default; box-shadow: none; }

/* ---- întrebări frecvente */
.pc-faq-list { display: flex; flex-direction: column; gap: 10px; }

.pc-faq-item {
    background: #171C27;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: 14px;
    overflow: hidden;
    transition: border-color .15s ease;
}
.pc-faq-item.is-open { border-color: rgba(25,210,124,.35); }

.pc-faq-q {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 16px 18px;
    background: transparent;
    border: none;
    color: #EEF1F6;
    font-family: inherit;
    font-size: 14.5px;
    font-weight: 600;
    line-height: 1.4;
    text-align: left;
    cursor: pointer;
}

.pc-faq-chevron {
    flex: 0 0 auto;
    color: #98A1B0;
    font-size: 12px;
    transition: transform .2s ease, color .2s ease;
}
.pc-faq-item.is-open .pc-faq-chevron { transform: rotate(180deg); color: #19D27C; }

.pc-faq-a {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows .22s ease;
}
.pc-faq-item.is-open .pc-faq-a { grid-template-rows: 1fr; }

.pc-faq-a > p {
    overflow: hidden;
    margin: 0;
    padding: 0 18px;
    font-size: 14px;
    line-height: 1.65;
    color: #98A1B0;
}
.pc-faq-item.is-open .pc-faq-a > p { padding-bottom: 16px; }

/* elementele din profil sunt acum butoane: le readucem la aspectul de rând */
.pc-wrap button.pc-profile-item {
    width: 100%;
    background: transparent;
    border: none;
    border-bottom: 1px solid rgba(255,255,255,.07);
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

@media (max-width: 520px) {
    .pc-modal { padding: 0; align-items: flex-end; }
    .pc-modal-box {
        max-width: none;
        max-height: 88vh;
        border-radius: 22px 22px 0 0;
        transform: translateY(100%);
    }
    .pc-modal.is-open .pc-modal-box { transform: none; }
    .pc-modal-foot { padding-bottom: calc(20px + env(safe-area-inset-bottom, 0px)); }
}

/* ---- conținut de termeni în modal */
.pc-terms-body { font-size: 14px; line-height: 1.7; color: #98A1B0; }
.pc-terms-body h4 {
    margin: 22px 0 8px;
    font-family: 'Space Grotesk', Inter, sans-serif;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .01em;
    color: #EEF1F6;
}
.pc-terms-body h4:first-of-type { margin-top: 14px; }
.pc-terms-body p { margin: 0 0 12px; }
.pc-terms-body .pc-terms-updated {
    display: inline-block;
    margin-bottom: 16px;
    padding: 4px 10px;
    border-radius: 8px;
    background: rgba(255,255,255,.05);
    font-size: 12px;
    color: #98A1B0;
}

/* =====================================================================
   STREAK, CONSISTENȚĂ, RECORDURI
   ===================================================================== */

.pc-wrap .pc-stats {
    background: linear-gradient(180deg, #151B26 0%, #12161F 100%);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 18px;
    padding: 22px;
    box-shadow: 0 2px 10px rgba(0,0,0,.35);
    margin-bottom: 16px;
}

.pc-wrap .pc-stats-main {
    display: flex;
    align-items: center;
    gap: 22px;
    padding-bottom: 20px;
    border-bottom: 1px solid rgba(255,255,255,.07);
}

.pc-wrap .pc-streak { flex: 0 0 auto; text-align: center; min-width: 96px; }
.pc-wrap .pc-streak-flame { font-size: 22px; line-height: 1; filter: drop-shadow(0 0 14px rgba(255,176,32,.45)); }
.pc-wrap .pc-streak-num {
    font-family: 'Space Grotesk', Inter, sans-serif;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.05;
    letter-spacing: -.03em;
    color: #EEF1F6;
    margin-top: 4px;
}
.pc-wrap .pc-streak-lbl {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #98A1B0;
    margin-top: 2px;
}

.pc-wrap .pc-week {
    flex: 1 1 auto;
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 8px;
}

.pc-wrap .pc-week-day { display: flex; flex-direction: column; align-items: center; gap: 7px; }

.pc-wrap .pc-week-dot {
    width: 100%;
    max-width: 34px;
    aspect-ratio: 1;
    border-radius: 11px;
    background: rgba(255,255,255,.05);
    border: 1px solid rgba(255,255,255,.07);
    transition: background .2s ease, border-color .2s ease, box-shadow .2s ease;
}

.pc-wrap .pc-week-day.is-active .pc-week-dot {
    background: linear-gradient(180deg, #1FE089, #15BE6F);
    border-color: transparent;
    box-shadow: 0 4px 14px rgba(25,210,124,.3);
}

.pc-wrap .pc-week-lbl { font-size: 10px; color: #6B7489; text-transform: uppercase; }
.pc-wrap .pc-week-day.is-active .pc-week-lbl { color: #98A1B0; }

.pc-wrap .pc-stats-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    padding-top: 18px;
}

.pc-wrap .pc-stat-mini { text-align: center; }
.pc-wrap .pc-stat-mini-num {
    display: block;
    font-family: 'Space Grotesk', Inter, sans-serif;
    font-size: 20px;
    font-weight: 700;
    color: #EEF1F6;
    letter-spacing: -.02em;
}
.pc-wrap .pc-stat-mini-lbl { display: block; font-size: 11px; color: #98A1B0; margin-top: 3px; }

.pc-wrap .pc-social {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid rgba(255,255,255,.07);
}

.pc-wrap .pc-social-line {
    font-size: 12px;
    color: #19D27C;
    background: rgba(25,210,124,.1);
    border: 1px solid rgba(25,210,124,.22);
    border-radius: 99px;
    padding: 5px 12px;
}

.pc-wrap .pc-badges { margin-top: 18px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.07); }

.pc-wrap .pc-badges-title {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #98A1B0;
    margin-bottom: 12px;
}

.pc-wrap .pc-badges-list { display: flex; flex-wrap: wrap; gap: 8px; }

.pc-wrap .pc-badge-item {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 7px 12px 7px 9px;
    border-radius: 12px;
    background: #171C27;
    border: 1px solid rgba(255,255,255,.08);
    font-size: 12px;
    color: #EEF1F6;
}
.pc-wrap .pc-badge-icon { font-size: 15px; line-height: 1; }
.pc-wrap .pc-badge-name { font-weight: 600; }

@media (max-width: 520px) {
    .pc-wrap .pc-stats { padding: 18px; }
    .pc-wrap .pc-stats-main { flex-direction: column; align-items: stretch; gap: 18px; }
    .pc-wrap .pc-streak { display: flex; align-items: baseline; justify-content: center; gap: 10px; }
    .pc-wrap .pc-streak-num { font-size: 32px; margin: 0; }
    .pc-wrap .pc-streak-lbl { margin: 0; }
}

/* =====================================================================
   NAVIGAREA ÎNTRE PAȘI (pasul anterior / următor)
   ===================================================================== */

.pc-wrap .pc-step-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 20px;
    padding: 0;
    background: transparent !important;
    border: none !important;
}

.pc-wrap .pc-step-nav button,
.pc-wrap .pc-step-nav a {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 46px;
    padding: 0 20px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    text-decoration: none;
    transition: transform .15s ease, border-color .15s ease, background .15s ease, box-shadow .15s ease;
}

/* înapoi: discret */
.pc-wrap .pc-step-nav button:first-child,
.pc-wrap .pc-step-nav .pc-step-prev {
    background: #171C27;
    border: 1px solid rgba(255,255,255,.08);
    color: #98A1B0;
}
.pc-wrap .pc-step-nav button:first-child:hover,
.pc-wrap .pc-step-nav .pc-step-prev:hover {
    color: #EEF1F6;
    border-color: rgba(255,255,255,.18);
}

/* înainte: acțiunea principală */
.pc-wrap .pc-step-nav button:last-child,
.pc-wrap .pc-step-nav .pc-step-next {
    background: linear-gradient(180deg, #1FE089, #15BE6F);
    border: none;
    color: #06210F;
    box-shadow: 0 6px 20px rgba(25,210,124,.26);
}
.pc-wrap .pc-step-nav button:last-child:hover,
.pc-wrap .pc-step-nav .pc-step-next:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 26px rgba(25,210,124,.32);
}

.pc-wrap .pc-step-nav button:disabled,
.pc-wrap .pc-step-nav button[disabled] {
    opacity: .4;
    cursor: default;
    transform: none;
    box-shadow: none;
}

@media (max-width: 520px) {
    .pc-wrap .pc-step-nav { gap: 10px; }
    .pc-wrap .pc-step-nav button,
    .pc-wrap .pc-step-nav a { flex: 1 1 0; justify-content: center; padding: 0 14px; }
}

/* butoanele de navigare între pași: text, nu pătrate de iconiță */
.pc-wrap .pc-step-nav .pc-nav-btn {
    width: auto !important;
    height: auto !important;
    min-height: 46px;
    padding: 0 20px !important;
    border-radius: 12px !important;
    font-size: 14px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: #171C27 !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    color: #98A1B0 !important;
    cursor: pointer;
    transition: color .15s ease, border-color .15s ease, background .15s ease,
                transform .15s ease, box-shadow .15s ease;
}

.pc-wrap .pc-step-nav .pc-nav-btn:hover {
    color: #EEF1F6 !important;
    border-color: rgba(255,255,255,.18) !important;
    background: #1C2230 !important;
}

.pc-wrap .pc-step-nav .pc-nav-next,
.pc-wrap .pc-step-nav .pc-nav-btn:last-child {
    background: linear-gradient(180deg, #1FE089, #15BE6F) !important;
    border: none !important;
    color: #06210F !important;
    box-shadow: 0 6px 20px rgba(25,210,124,.26);
}

.pc-wrap .pc-step-nav .pc-nav-next:hover,
.pc-wrap .pc-step-nav .pc-nav-btn:last-child:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 26px rgba(25,210,124,.32);
    color: #06210F !important;
}

.pc-wrap .pc-step-nav .pc-nav-btn:disabled {
    opacity: .4;
    cursor: default;
    transform: none;
    box-shadow: none;
}

/* ---- card de progres: etichete și context */
.pc-wrap .pc-stats-head {
    font-family: 'Space Grotesk', Inter, sans-serif;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #98A1B0;
    margin-bottom: 18px;
}

.pc-wrap .pc-week-wrap { flex: 1 1 auto; min-width: 0; }

.pc-wrap .pc-week-cap {
    font-size: 11px;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: #6B7489;
    margin-bottom: 10px;
}

.pc-wrap .pc-week-day.is-today .pc-week-dot {
    border-color: rgba(25,210,124,.5);
}
.pc-wrap .pc-week-day.is-today .pc-week-lbl { color: #19D27C; font-weight: 600; }

.pc-wrap .pc-streak {
    border-right: 1px solid rgba(255,255,255,.07);
    padding-right: 22px;
}

@media (max-width: 520px) {
    .pc-wrap .pc-streak { border-right: none; padding-right: 0; }
}