/**
 * Néla Personal Shopper IA — Charte MySongOriginal 3.0
 * Forest #3d5a3d | Sage #7d9a78 | Terracotta #c67b5c | Cream #faf8f5 | Sand #e8e2d9
 * Typo : Cormorant Garamond (titres) + Outfit (corps)
 */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,600;0,700;1,400&family=Outfit:wght@300;400;500;600;700&display=swap');

:root {
    --myso-forest: #3d5a3d;
    --myso-forest-dark: #2e4630;
    --myso-forest-light: #4a6e4a;
    --myso-sage: #7d9a78;
    --myso-sage-light: #9ab496;
    --myso-sage-pale: rgba(125,154,120,.12);
    --myso-terracotta: #c67b5c;
    --myso-terracotta-light: #d4956e;
    --myso-terracotta-dark: #a8644a;
    --myso-cream: #faf8f5;
    --myso-sand: #e8e2d9;
    --myso-sand-dark: #d4ccc0;
    --myso-text: #3a3a3a;
    --myso-text-light: #6b6b6b;
    --myso-gradient-hero: linear-gradient(135deg,#3d5a3d 0%,#7d9a78 60%,#c67b5c 100%);
    --myso-gradient-card: linear-gradient(135deg,#3d5a3d 0%,#4a6e4a 100%);
    --myso-shadow-sm: 0 1px 3px rgba(61,90,61,.08);
    --myso-shadow-md: 0 4px 12px rgba(61,90,61,.10);
    --myso-shadow-lg: 0 10px 30px rgba(61,90,61,.12);
    --myso-shadow-xl: 0 20px 40px rgba(61,90,61,.15);
    --myso-radius-sm: .5rem;
    --myso-radius-md: 1rem;
    --myso-radius-lg: 1.5rem;
    --myso-radius-xl: 2rem;
    --myso-radius-full: 9999px;
    --myso-transition: 300ms cubic-bezier(.4,0,.2,1);
}

/* === BASE === */
.nela-dashboard-modern,.nela-quiz-page,.nela-chatbot-page,.nela-morphology-page,.nela-landing-page {
    font-family:'Outfit',sans-serif;color:var(--myso-text);padding:2rem 0;max-width:1200px;margin:0 auto;
}
h1,h2,h3,h4,.nela-title,.nela-section-title,.nela-hero-title {
    font-family:'Cormorant Garamond',serif;
}

/* === HERO === */
.nela-hero {
    background:var(--myso-gradient-hero);border-radius:var(--myso-radius-xl);
    padding:3rem;margin-bottom:2rem;position:relative;overflow:hidden;box-shadow:var(--myso-shadow-xl);
}
.nela-hero::before {
    content:'';position:absolute;inset:0;
    background:radial-gradient(ellipse at 30% 50%,rgba(255,255,255,.08) 0%,transparent 70%);pointer-events:none;
}
.nela-hero-title {font-family:'Cormorant Garamond',serif;font-size:2.2rem;font-weight:700;color:#fff;margin-bottom:.5rem}
.nela-hero-subtitle {font-family:'Outfit',sans-serif;font-size:1.05rem;font-weight:300;color:rgba(255,255,255,.85)}
.nela-hero .nela-avatar {border:3px solid rgba(255,255,255,.4);box-shadow:0 4px 20px rgba(0,0,0,.15)}

/* === CARDS === */
.nela-card {
    background:#fff;border:1px solid var(--myso-sand);border-radius:var(--myso-radius-md);
    box-shadow:var(--myso-shadow-sm);transition:var(--myso-transition);
}
.nela-card:hover {box-shadow:var(--myso-shadow-md)}
.nela-card-header {
    background:var(--myso-gradient-card);color:#fff;padding:1rem 1.5rem;
    border-bottom:2px solid var(--myso-forest-dark);
    border-radius:var(--myso-radius-md) var(--myso-radius-md) 0 0;
    font-family:'Cormorant Garamond',serif;font-weight:600;font-size:1.15rem;
}
.nela-card-header h4,.nela-card-header h5 {color:#fff;margin:0;font-family:'Cormorant Garamond',serif}

/* === ACTION CARDS === */
.nela-action-card {
    background:#fff;border:2px solid var(--myso-sand);border-radius:var(--myso-radius-md);
    padding:1.5rem;text-align:center;transition:var(--myso-transition);cursor:pointer;
}
.nela-action-card:hover {border-color:var(--myso-sage);box-shadow:var(--myso-shadow-md);transform:translateY(-3px)}
.nela-action-icon {color:var(--myso-terracotta);font-size:2.5rem;margin-bottom:.75rem}
.nela-action-icon i {color:var(--myso-terracotta)}
.nela-action-card h5 {font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--myso-forest);margin-bottom:.5rem}
.nela-action-card p {color:var(--myso-text-light);font-size:.9rem}

/* === AVATAR === */
.nela-avatar {
    width:120px;height:120px;border-radius:var(--myso-radius-full);object-fit:cover;
    border:3px solid var(--myso-sage);box-shadow:var(--myso-shadow-md);
}
.nela-avatar-sm {width:40px;height:40px;border-radius:var(--myso-radius-full);object-fit:cover;border:2px solid var(--myso-sage-light)}

/* === BUTTONS === */
.nela-btn-primary,
.nela-dashboard-modern .btn-primary,.nela-quiz-page .btn-primary,
.nela-chatbot-page .btn-primary,.nela-morphology-page .btn-primary {
    background:var(--myso-forest)!important;border-color:var(--myso-forest)!important;color:#fff!important;
    font-family:'Outfit',sans-serif;font-weight:500;border-radius:var(--myso-radius-sm);
    padding:.6rem 1.5rem;transition:var(--myso-transition);
}
.nela-btn-primary:hover,
.nela-dashboard-modern .btn-primary:hover,.nela-quiz-page .btn-primary:hover,
.nela-chatbot-page .btn-primary:hover,.nela-morphology-page .btn-primary:hover {
    background:var(--myso-forest-light)!important;border-color:var(--myso-forest-light)!important;
    box-shadow:var(--myso-shadow-md);transform:translateY(-1px);
}
.nela-btn-secondary {
    background:var(--myso-terracotta)!important;border-color:var(--myso-terracotta)!important;color:#fff!important;
    font-family:'Outfit',sans-serif;font-weight:500;border-radius:var(--myso-radius-sm);
    padding:.6rem 1.5rem;transition:var(--myso-transition);
}
.nela-btn-secondary:hover {background:var(--myso-terracotta-dark)!important;border-color:var(--myso-terracotta-dark)!important}
.nela-btn-outline {
    background:var(--myso-terracotta,#c67b5c)!important;border:2px solid var(--myso-terracotta,#c67b5c)!important;color:#fff!important;
    font-family:'Outfit',sans-serif;font-weight:600;border-radius:var(--myso-radius-sm);transition:var(--myso-transition);
    padding:.6rem 1.5rem;text-decoration:none!important;
}
.nela-btn-outline:hover {background:var(--myso-terracotta-dark,#b06a4d)!important;border-color:var(--myso-terracotta-dark,#b06a4d)!important;color:#fff!important}
.nela-dashboard-modern .nela-btn-outline,
.nela-dashboard-modern .nela-action-card .btn,
.nela-dashboard-modern a.btn {
    background:var(--myso-terracotta,#c67b5c)!important;border:2px solid var(--myso-terracotta,#c67b5c)!important;
    color:#fff!important;padding:.6rem 1.5rem;font-weight:600;text-decoration:none!important;
}
.nela-dashboard-modern .nela-btn-outline:hover,
.nela-dashboard-modern .nela-action-card .btn:hover,
.nela-dashboard-modern a.btn:hover {
    background:var(--myso-terracotta-dark,#b06a4d)!important;color:#fff!important;
}

/* === PROGRESS === */
.progress-bar.bg-myso-forest,.nela-progress-bar {
    background:linear-gradient(90deg,var(--myso-forest) 0%,var(--myso-sage) 100%)!important;
    border-radius:var(--myso-radius-full);
}
.progress {background-color:var(--myso-sand);border-radius:var(--myso-radius-full);height:.6rem}

/* === ALERTS === */
.nela-alert-info,.nela-morphology-page .alert-info,.nela-quiz-page .alert-info,.nela-chatbot-page .alert-info {
    background:var(--myso-sage-pale)!important;border:none!important;border-left:4px solid var(--myso-sage)!important;
    color:var(--myso-forest)!important;padding:1rem 1.25rem;border-radius:0 var(--myso-radius-sm) var(--myso-radius-sm) 0;
}
.nela-alert-warning,.nela-chatbot-page .alert-warning,.nela-morphology-page .alert-warning {
    background:rgba(198,123,92,.08)!important;border:none!important;border-left:4px solid var(--myso-terracotta)!important;
    color:var(--myso-terracotta-dark)!important;padding:1rem 1.25rem;border-radius:0 var(--myso-radius-sm) var(--myso-radius-sm) 0;
}
.nela-alert-success {
    background:rgba(61,90,61,.08);border-left:4px solid var(--myso-forest);color:var(--myso-forest);
    padding:1rem 1.25rem;border-radius:0 var(--myso-radius-sm) var(--myso-radius-sm) 0;
}
.nela-alert-danger {
    background:rgba(180,60,60,.06);border-left:4px solid #b43c3c;color:#8b2e2e;
    padding:1rem 1.25rem;border-radius:0 var(--myso-radius-sm) var(--myso-radius-sm) 0;
}

/* === CHAT === */
.nela-chat-container {display:flex;flex-direction:column;height:500px;background:var(--myso-cream);border-radius:var(--myso-radius-md)}
.nela-chat-messages {flex:1;overflow-y:auto;padding:1.5rem}
.nela-chat-message {display:flex;gap:.75rem;margin-bottom:1rem;max-width:80%}
.nela-chat-message-bot {align-self:flex-start}
.nela-chat-message-user {align-self:flex-end;flex-direction:row-reverse}
.nela-chat-bubble {
    background:#fff;border:1px solid var(--myso-sand);border-radius:var(--myso-radius-md);
    padding:.75rem 1rem;box-shadow:var(--myso-shadow-sm);font-size:.95rem;line-height:1.5;
}
.nela-chat-message-user .nela-chat-bubble {background:var(--myso-forest);color:#fff;border-color:var(--myso-forest)}
.nela-chat-input-container {
    padding:1rem;border-top:1px solid var(--myso-sand);background:#fff;
    border-radius:0 0 var(--myso-radius-md) var(--myso-radius-md);
}
.nela-chat-input-container .form-control {border:1px solid var(--myso-sand);border-radius:var(--myso-radius-sm);font-family:'Outfit',sans-serif}
.nela-chat-input-container .form-control:focus {border-color:var(--myso-sage);box-shadow:0 0 0 3px var(--myso-sage-pale)}

/* === QUIZ === */
.nela-quiz-question {
    background:#fff;border:1px solid var(--myso-sand);border-radius:var(--myso-radius-md);padding:2rem;margin-bottom:1.5rem;
}
.nela-quiz-question h5 {font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--myso-forest);font-size:1.2rem;margin-bottom:1rem}
.nela-quiz-option {
    display:block;padding:.8rem 1.2rem;margin-bottom:.5rem;background:var(--myso-cream);
    border:2px solid var(--myso-sand);border-radius:var(--myso-radius-sm);cursor:pointer;transition:var(--myso-transition);
}
.nela-quiz-option:hover {border-color:var(--myso-sage);background:var(--myso-sage-pale)}
.nela-quiz-option.selected,.nela-quiz-option input:checked+.nela-quiz-option-label {border-color:var(--myso-forest);background:rgba(61,90,61,.06)}

/* === MORPHOLOGY === */
.nela-morpho-upload {
    border:2px dashed var(--myso-sage);border-radius:var(--myso-radius-md);padding:3rem;
    text-align:center;background:var(--myso-cream);transition:var(--myso-transition);cursor:pointer;
}
.nela-morpho-upload:hover {border-color:var(--myso-forest);background:var(--myso-sage-pale)}
.nela-morpho-result {background:var(--myso-cream);border:1px solid var(--myso-sand);border-radius:var(--myso-radius-md);padding:1.5rem}
.nela-morpho-silhouette {text-align:center;padding:1.5rem}
.nela-morpho-silhouette svg {max-height:250px;fill:var(--myso-sage)}

/* === LANDING === */
.nela-landing-page {padding:0}
.nela-landing-wrapper {background:linear-gradient(135deg,var(--myso-cream) 0%,#f0ebe3 100%);padding:3rem 1rem}
.nela-landing-card {
    background:#fff;box-shadow:var(--myso-shadow-xl);border-radius:var(--myso-radius-xl);
    overflow:hidden;display:flex;flex-direction:row;max-width:900px;margin:0 auto;
}
.nela-landing-left {
    flex:1;background:var(--myso-cream);padding:3rem;display:flex;align-items:center;justify-content:center;text-align:center;
}
.nela-landing-left h3 {font-family:'Cormorant Garamond',serif;font-weight:700;color:var(--myso-forest);font-size:1.25rem;margin-top:1rem}
.nela-landing-right {flex:1;padding:3rem}
.nela-prelaunch-badge {
    background:rgba(198,123,92,.1);border-left:4px solid var(--myso-terracotta);padding:.75rem 1rem;margin-bottom:1.5rem;
    border-radius:0 var(--myso-radius-sm) var(--myso-radius-sm) 0;font-weight:600;color:var(--myso-terracotta-dark);font-size:.95rem;
}
.nela-landing-right h1 {font-family:'Cormorant Garamond',serif;font-weight:700;color:var(--myso-forest);font-size:2rem;margin-bottom:1rem}
.nela-landing-right p {color:var(--myso-text-light);font-size:1rem;line-height:1.6;margin-bottom:1.5rem}
.nela-feature-item {display:flex;align-items:center;gap:.75rem;margin-bottom:.75rem;color:var(--myso-text)}
.nela-feature-icon {flex-shrink:0;width:24px;height:24px;color:var(--myso-sage)}
.nela-prelaunch-form {display:flex;gap:0;margin-top:1.5rem}
.nela-prelaunch-form input[type="email"] {
    flex:1;padding:.7rem 1rem;border:1px solid var(--myso-sand);
    border-radius:var(--myso-radius-sm) 0 0 var(--myso-radius-sm);font-family:'Outfit',sans-serif;font-size:.95rem;
    outline:none;transition:var(--myso-transition);
}
.nela-prelaunch-form input[type="email"]:focus {border-color:var(--myso-sage);box-shadow:0 0 0 3px var(--myso-sage-pale)}
.nela-prelaunch-form button[type="submit"] {
    background:var(--myso-forest);color:#fff;border:none;padding:.7rem 1.5rem;
    border-radius:0 var(--myso-radius-sm) var(--myso-radius-sm) 0;font-family:'Outfit',sans-serif;
    font-weight:500;cursor:pointer;transition:var(--myso-transition);white-space:nowrap;
}
.nela-prelaunch-form button[type="submit"]:hover {background:var(--myso-forest-light)}
.nela-landing-footer {text-align:center;margin-top:2rem;color:var(--myso-text-light);font-size:.85rem}

/* === SECTION TITLES === */
.nela-title {font-family:'Cormorant Garamond',serif;font-weight:700;color:var(--myso-forest)}
.nela-section-title {font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--myso-forest);font-size:1.4rem;margin-bottom:.75rem}
.nela-description {color:var(--myso-text-light);font-family:'Outfit',sans-serif;line-height:1.6}
.nela-result-title {font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--myso-forest)}
.nela-recommendations-title {font-family:'Cormorant Garamond',serif;color:var(--myso-terracotta);font-weight:600}

/* === STAT CARDS === */
.nela-stat-card {
    background:#fff;border:1px solid var(--myso-sand);border-radius:var(--myso-radius-md);
    padding:1.25rem;text-align:center;transition:var(--myso-transition);
}
.nela-stat-card:hover {box-shadow:var(--myso-shadow-md)}
.nela-stat-value {font-family:'Cormorant Garamond',serif;font-size:2rem;font-weight:700;color:var(--myso-forest)}
.nela-stat-label {font-size:.85rem;color:var(--myso-text-light);margin-top:.25rem}
.nela-stat-icon {color:var(--myso-terracotta);font-size:1.5rem;margin-bottom:.5rem}

/* === BADGES === */
.nela-badge {display:inline-block;padding:.25rem .75rem;border-radius:var(--myso-radius-full);font-size:.8rem;font-weight:500}
.nela-badge-forest {background:rgba(61,90,61,.1);color:var(--myso-forest)}
.nela-badge-sage {background:var(--myso-sage-pale);color:var(--myso-forest)}
.nela-badge-terracotta {background:rgba(198,123,92,.1);color:var(--myso-terracotta-dark)}

/* === FORMS === */
.nela-form-control {border:1px solid var(--myso-sand);border-radius:var(--myso-radius-sm);padding:.6rem 1rem;font-family:'Outfit',sans-serif;transition:var(--myso-transition)}
.nela-form-control:focus {border-color:var(--myso-sage);box-shadow:0 0 0 3px var(--myso-sage-pale);outline:none}

/* === SCROLLBAR === */
.nela-chat-messages::-webkit-scrollbar {width:6px}
.nela-chat-messages::-webkit-scrollbar-track {background:var(--myso-cream)}
.nela-chat-messages::-webkit-scrollbar-thumb {background:var(--myso-sand-dark);border-radius:var(--myso-radius-full)}
.nela-chat-messages::-webkit-scrollbar-thumb:hover {background:var(--myso-sage)}

/* === RESPONSIVE === */
@media(max-width:768px) {
    .nela-landing-card {flex-direction:column}
    .nela-landing-left,.nela-landing-right {padding:2rem}
    .nela-hero {padding:2rem 1.5rem}
    .nela-hero-title {font-size:1.6rem}
    .nela-avatar {width:90px;height:90px}
    .nela-prelaunch-form {flex-direction:column;gap:.5rem}
    .nela-prelaunch-form input[type="email"],.nela-prelaunch-form button[type="submit"] {border-radius:var(--myso-radius-sm)}
}

/* === MySo Utility Classes (JS/template compat) === */
.bg-myso-forest{background-color:var(--myso-forest)!important;color:#fff}
.bg-myso-sage{background-color:var(--myso-sage)!important;color:#fff}
.bg-myso-terracotta{background-color:var(--myso-terracotta)!important;color:#fff}
.bg-myso-cream{background-color:var(--myso-cream)!important}
.bg-myso-sand{background-color:var(--myso-sand)!important}
.text-myso-forest{color:var(--myso-forest)!important}
.text-myso-terracotta{color:var(--myso-terracotta)!important}
.focus\:ring-myso-sage:focus{box-shadow:0 0 0 3px rgba(125,154,120,.4)!important}
.focus\:border-myso-sage:focus{border-color:var(--myso-sage)!important}
.hover\:bg-myso-sand:hover{background-color:var(--myso-sand)!important}
.progress-bar.bg-myso-forest{background-color:var(--myso-forest)!important}