/* ============================================================================
   aisearchintent_extra.css
   Extrait des blocs <style> inline de app/templates/aisearchintent.html
   pour sortir les styles du template et bénéficier du cache HTTP.
   Contenu 1:1 identique à l'ancien inline — ne PAS modifier sans tester le
   rendu (resize, plein écran, sidebars, cartes de score).
   ============================================================================ */

/* ── Bloc 1 : resize handles + #resultsContainer + save button hover ──── */
.resize-handle {
    cursor: col-resize;
    transition: background-color 0.2s;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 10;
}

.resizable {
    overflow: auto;
    height: 100%;
    position: relative;
}

.left-pane {
    position: relative;
}

.right-pane {
    position: relative;
    padding-left: 8px; /* Espace pour la poignée de redimensionnement */
}

#resultsContainer {
    display: none;
    min-height: 400px;
}
#saveAnalysisBtnMain:hover{
    background-color:#15803d !important;
    transform:translateY(-1px);
}

#resultsContainer.active {
    display: flex !important;
}

/* ============================================================================
   Bloc 2 : MODE PLEIN ÉCRAN — éditeur + wordcloud + scores
   ============================================================================ */

/* Bouton dans la toolbar Quill */
.ql-toolbar .ql-fullscreen-btn{
    width:28px;height:24px;padding:2px;margin-left:4px;
    background:transparent;border:none;cursor:pointer;
    color:#444;display:inline-flex;align-items:center;justify-content:center;
    border-radius:4px;transition:background .15s,color .15s;
}
.ql-toolbar .ql-fullscreen-btn:hover{background:#eef2ff;color:#6366f1;}
.ql-toolbar .ql-fullscreen-btn svg{width:16px;height:16px;}

/* Overlay plein écran */
#aiFullscreenOverlay{
    position:fixed;inset:0;z-index:9000;
    background:linear-gradient(135deg,#fafafa 0%,#f4f4f7 100%);
    display:none;flex-direction:column;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
    animation:aifsFade .25s ease;
}
@keyframes aifsFade{from{opacity:0;transform:scale(.99)}to{opacity:1;transform:scale(1)}}
body.ai-fullscreen-active{overflow:hidden;}
body.ai-fullscreen-active #aiFullscreenOverlay{display:flex;}

/* Barre du haut — toolbar Quill pleine largeur */
.aifs-topbar{
    display:flex;align-items:center;
    background:#fff;border-bottom:1px solid #ececf0;
    box-shadow:0 1px 3px rgba(0,0,0,.03);flex-shrink:0;
    padding:0;
}
/* Bouton Quitter — déplacé dans la sidebar droite */
.aifs-exit{
    background:#18181b;color:#fff;border:none;border-radius:8px;
    padding:9px 18px;font-size:13px;font-weight:500;cursor:pointer;
    display:inline-flex;align-items:center;gap:8px;transition:background .15s;
    white-space:nowrap;
}
.aifs-exit:hover{background:#3f3f46;}

/* Corps: trois colonnes (wordcloud | éditeur | scores) */
.aifs-body{
    flex:1;display:flex;overflow:hidden;gap:0;min-height:0;
}
.aifs-main{
    flex:1 1 auto;display:flex;flex-direction:column;
    align-items:stretch;overflow-y:auto;padding:0;
}
.aifs-editor-wrap{
    width:100%;max-width:1200px;margin:0 auto;display:flex;flex-direction:column;flex:1;
}
body.ai-fullscreen-active #editor{
    min-height:calc(100vh - 160px) !important;
    height:auto !important;
    max-height:none !important;
    width:100% !important;
    border:none !important;
    border-radius:0 !important;
    background:#fff !important;
    font-size:16px !important;
    resize:none !important;
}
body.ai-fullscreen-active #editor .ql-editor{
    padding:40px 56px !important;
    line-height:1.7 !important;
    font-size:16px !important;
    max-width:none !important;
}
/* La toolbar est placée dans la topbar, pleine largeur */
body.ai-fullscreen-active .ql-toolbar{
    border:none !important;
    border-bottom:1px solid #e4e4e7 !important;
    border-radius:0 !important;
    background:#fff !important;
    position:sticky;top:0;z-index:5;
    flex:1;
}
.aifs-calc-wrap{
    margin-top:20px;display:flex;justify-content:center;
}
body.ai-fullscreen-active #calculateSemanticBtn{
    background:#18181b;color:#fff;padding:10px 16px;border:none;
    border-radius:10px;font-size:12px;font-weight:500;cursor:pointer;
    box-shadow:0 2px 8px rgba(0,0,0,.08);transition:transform .15s,box-shadow .15s;
    width:100%;margin-top:8px;
}
body.ai-fullscreen-active #calculateSemanticBtn:hover{
    transform:translateY(-1px);box-shadow:0 4px 12px rgba(0,0,0,.12);
}
body.ai-fullscreen-active #saveAnalysisBtnMain{
    background:#16a34a !important;color:#fff;padding:10px 16px;border:none;
    border-radius:10px;font-size:12px;font-weight:500;cursor:pointer;
    box-shadow:0 2px 8px rgba(22,163,74,.15);transition:transform .15s,box-shadow .15s;
    width:100%;margin-top:8px;
}
body.ai-fullscreen-active #saveAnalysisBtnMain:hover{
    background:#15803d !important;transform:translateY(-1px);box-shadow:0 4px 12px rgba(22,163,74,.25);
}

/* Sidebars */
.aifs-sidebar{
    flex:0 0 380px;background:#fff;
    display:flex;flex-direction:column;overflow:hidden;
}
.aifs-sidebar-left{border-right:1px solid #ececf0;}
.aifs-sidebar-right{flex:0 0 240px;border-left:1px solid #ececf0;}
.aifs-sidebar-header{
    padding:16px 20px;border-bottom:1px solid #f0f0f3;
    font-size:12px;font-weight:600;letter-spacing:.05em;
    text-transform:uppercase;color:#71717a;flex-shrink:0;
}
.aifs-sidebar-body{flex:1;overflow-y:auto;padding:16px 20px;}
body.ai-fullscreen-active #tabContentWordcloud{display:block !important;}
body.ai-fullscreen-active #tabContentWordcloud #wordCloud{max-height:none !important;}

/* En-tête sidebar droite avec bouton Quitter */
.aifs-sidebar-right .aifs-sidebar-header{
    display:flex;align-items:center;justify-content:space-between;
}

/* Sidebar des scores — design avec jauges */
.aifs-sidebar-right .aifs-sidebar-body{padding:20px 18px;display:flex;flex-direction:column;gap:16px;}
body.ai-fullscreen-active .aifs-sidebar-right #articleQualityScore,
body.ai-fullscreen-active .aifs-sidebar-right #semanticScore,
body.ai-fullscreen-active .aifs-sidebar-right #overoptimizationScore{
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    flex:0 0 auto !important;
}
body.ai-fullscreen-active .aifs-sidebar-right #articleQualityScore{
    display:block;
}
body.ai-fullscreen-active .aifs-sidebar-right .article-quality-box{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:10px !important;
    min-height:0 !important;
    border-radius:14px !important;
    padding:14px 14px 12px !important;
    box-shadow:0 4px 14px rgba(17,17,26,.05),0 1px 2px rgba(17,17,26,.04) !important;
    border:1px solid #b7dfc8 !important;
    text-align:center !important;
    position:relative;
    overflow:hidden;
    background:#f6fbf8 !important;
}
body.ai-fullscreen-active .aifs-sidebar-right .article-quality-box.is-medium{
    background:#fffbf0 !important;
    border-color:#f5d794 !important;
}
body.ai-fullscreen-active .aifs-sidebar-right .article-quality-box.is-warning{
    background:#fff7ed !important;
    border-color:#fdba74 !important;
}
body.ai-fullscreen-active .aifs-sidebar-right .article-quality-box.is-danger{
    background:#fff5f5 !important;
    border-color:#fca5a5 !important;
}
body.ai-fullscreen-active .aifs-sidebar-right .article-quality-heading{
    justify-content:center !important;
    padding:0 20px !important;
}
body.ai-fullscreen-active .aifs-sidebar-right .article-quality-box h3{
    font-size:11px !important;
    font-weight:600 !important;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:#334155 !important;
    margin:0 !important;
}
body.ai-fullscreen-active .aifs-sidebar-right .article-quality-badge{
    min-height:20px !important;
    padding:0 7px !important;
    font-size:10px !important;
}
body.ai-fullscreen-active .aifs-sidebar-right .article-quality-box .scorePercentage{
    font-size:40px !important;
    font-weight:700 !important;
    line-height:1 !important;
    margin:2px 0 2px !important;
    font-variant-numeric:tabular-nums;
}
body.ai-fullscreen-active .aifs-sidebar-right .article-quality-box .score-gauge{
    max-width:100% !important;
    margin:8px 0 2px !important;
}
body.ai-fullscreen-active .aifs-sidebar-right .article-quality-details{
    gap:8px !important;
}
body.ai-fullscreen-active .aifs-sidebar-right .article-quality-box .comparison-message{
    font-size:13px !important;
    font-weight:600 !important;
    line-height:1.2 !important;
    margin:0 !important;
    text-align:center !important;
    color:#27272a !important;
}
body.ai-fullscreen-active .aifs-sidebar-right .article-quality-breakdown{
    justify-content:center !important;
    gap:5px !important;
    padding:0 !important;
    margin:0 !important;
}
body.ai-fullscreen-active .aifs-sidebar-right .article-quality-pill{
    min-height:20px !important;
    padding:0 6px !important;
    font-size:10px !important;
    background:rgba(255,255,255,.72) !important;
}
body.ai-fullscreen-active .aifs-sidebar-right .article-quality-advice{
    display:block !important;
    border-left:0 !important;
    border-top:1px solid rgba(44,62,80,.14) !important;
    padding:10px 0 0 !important;
    font-size:11px !important;
    line-height:1.35 !important;
    text-align:left !important;
    color:#475569 !important;
}
body.ai-fullscreen-active .aifs-sidebar-right .semantic-score-box,
body.ai-fullscreen-active .aifs-sidebar-right .overoptimization-score-box{
    border-radius:14px !important;
    padding:18px 16px !important;
    box-shadow:0 4px 14px rgba(17,17,26,.05),0 1px 2px rgba(17,17,26,.04) !important;
    border:1px solid rgba(0,0,0,.04) !important;
    text-align:center !important;
    position:relative;
    overflow:hidden;
    transition:transform .15s,box-shadow .15s;
    background:#fff !important;
}
body.ai-fullscreen-active .aifs-sidebar-right .semantic-score-box:hover,
body.ai-fullscreen-active .aifs-sidebar-right .overoptimization-score-box:hover{
    transform:translateY(-2px);
    box-shadow:0 8px 22px rgba(17,17,26,.08),0 2px 4px rgba(17,17,26,.05) !important;
}
body.ai-fullscreen-active .aifs-sidebar-right .semantic-score-box h3,
body.ai-fullscreen-active .aifs-sidebar-right .overoptimization-score-box h3{
    font-size:11px !important;
    font-weight:600 !important;
    text-transform:uppercase;
    letter-spacing:.08em;
    color:#52525b !important;
    margin:0 0 10px !important;
}
body.ai-fullscreen-active .aifs-sidebar-right .semantic-score-box .scorePercentage,
body.ai-fullscreen-active .aifs-sidebar-right .overoptimization-score-box .scorePercentage{
    font-size:42px !important;
    font-weight:700 !important;
    line-height:1 !important;
    margin:4px 0 6px !important;
    font-variant-numeric:tabular-nums;
}
body.ai-fullscreen-active .aifs-sidebar-right .semantic-score-box .comparison-message,
body.ai-fullscreen-active .aifs-sidebar-right .overoptimization-score-box .comparison-message{
    font-size:13px !important;
    font-weight:600 !important;
    margin:0 0 8px !important;
    color:#27272a !important;
}
body.ai-fullscreen-active .aifs-sidebar-right .ranking-info{
    margin-top:8px !important;
    font-size:11px !important;
    color:#6366f1 !important;
    font-weight:500;
    cursor:pointer;
}
body.ai-fullscreen-active .aifs-sidebar-right .ranking-info:hover{text-decoration:underline;}
body.ai-fullscreen-active .aifs-sidebar-right .info-icon{top:10px !important;right:10px !important;}
/* Réduire l'espace sous les classements dans les score cards */
body.ai-fullscreen-active .aifs-sidebar-right .semantic-score-box p:last-child,
body.ai-fullscreen-active .aifs-sidebar-right .overoptimization-score-box p:last-child{
    margin-top:4px !important;padding-bottom:4px !important;
}
body.ai-fullscreen-active .aifs-sidebar-right .semantic-score-box,
body.ai-fullscreen-active .aifs-sidebar-right .overoptimization-score-box{
    padding:14px 14px 8px !important;
}

/* Jauge de score — remplace les fonds colorés */
.score-gauge{
    width:100%;height:5px;background:#f0f0f3;border-radius:3px;
    margin:10px 0 6px;overflow:hidden;
}
.score-gauge-fill{
    height:100%;border-radius:4px;transition:width .6s ease,background-color .4s ease;
}

/* Fix z-index des popups au-dessus de l'overlay fullscreen */
body.ai-fullscreen-active .score-info-popup,
body.ai-fullscreen-active .popup,
body.ai-fullscreen-active .questions-popup,
body.ai-fullscreen-active .synonyms-popup,
body.ai-fullscreen-active #rankingPopup,
body.ai-fullscreen-active #urlPopup,
body.ai-fullscreen-active #questionsPopup{
    z-index:100000 !important;
}
body.ai-fullscreen-active .score-info-content,
body.ai-fullscreen-active .popup-content,
body.ai-fullscreen-active .questions-popup-content,
body.ai-fullscreen-active .ranking-popup-content{
    z-index:100001 !important;
}

/* Scrollbars douces */
.aifs-main::-webkit-scrollbar,
.aifs-sidebar-body::-webkit-scrollbar{width:10px;}
.aifs-main::-webkit-scrollbar-thumb,
.aifs-sidebar-body::-webkit-scrollbar-thumb{
    background:#d4d4d8;border-radius:10px;border:2px solid transparent;
    background-clip:padding-box;
}
.aifs-main::-webkit-scrollbar-thumb:hover,
.aifs-sidebar-body::-webkit-scrollbar-thumb:hover{background:#a1a1aa;background-clip:padding-box;border:2px solid transparent;}

@media (max-width:1100px){
    .aifs-sidebar-right{flex:0 0 220px;}
}
@media (max-width:900px){
    .aifs-body{flex-direction:column;}
    .aifs-sidebar{flex:0 0 35vh;border-left:none;border-right:none;border-top:1px solid #ececf0;}
    .aifs-main{padding:20px;}
}