/**
 * CSS Fix for AI Modal and Project Detail h3 Font Size Issue
 * Giải quyết vấn đề h3 quá lớn trong modal AI và trang chi tiết project
 */


/* Giảm font-size của các heading trong modal AI để phù hợp với nội dung khác */
.modal .wr-user-reply h1,
.modal .ai-paragraph h1,
.modal .modal-body h1,
.workreap-aicontent-modal h1,
.wr-aichat-modal h1 {
    font-size: 20px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    margin-bottom: 16px !important;
    margin-top: 20px !important;
}

.modal .wr-user-reply h2,
.modal .ai-paragraph h2,
.modal .modal-body h2,
.workreap-aicontent-modal h2,
.wr-aichat-modal h2 {
    font-size: 17px !important;
    font-weight: 650 !important;
    line-height: 1.35 !important;
    margin-bottom: 14px !important;
    margin-top: 18px !important;
}

.modal .wr-user-reply h3,
.modal .ai-paragraph h3,
.modal .modal-body h3,
.workreap-aicontent-modal h3,
.wr-aichat-modal h3 {
    font-size: 15px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 12px !important;
    margin-top: 16px !important;
}

.modal .wr-user-reply h4,
.modal .ai-paragraph h4,
.modal .modal-body h4,
.workreap-aicontent-modal h4,
.wr-aichat-modal h4 {
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.45 !important;
    margin-bottom: 10px !important;
    margin-top: 14px !important;
}

.modal .wr-user-reply h5,
.modal .ai-paragraph h5,
.modal .modal-body h5,
.workreap-aicontent-modal h5,
.wr-aichat-modal h5 {
    font-size: 11px !important;
    font-weight: 600 !important;
    line-height: 1.5 !important;
    margin-bottom: 8px !important;
    margin-top: 12px !important;
}

/* Đảm bảo heading đầu tiên không có margin-top */
.modal .wr-user-reply h1:first-child,
.modal .ai-paragraph h1:first-child,
.modal .modal-body h1:first-child,
.workreap-aicontent-modal h1:first-child,
.wr-aichat-modal h1:first-child,
.modal .wr-user-reply h2:first-child,
.modal .ai-paragraph h2:first-child,
.modal .modal-body h2:first-child,
.workreap-aicontent-modal h2:first-child,
.wr-aichat-modal h2:first-child,
.modal .wr-user-reply h3:first-child,
.modal .ai-paragraph h3:first-child,
.modal .modal-body h3:first-child,
.workreap-aicontent-modal h3:first-child,
.wr-aichat-modal h3:first-child,
.modal .wr-user-reply h4:first-child,
.modal .ai-paragraph h4:first-child,
.modal .modal-body h4:first-child,
.workreap-aicontent-modal h4:first-child,
.wr-aichat-modal h4:first-child,
.modal .wr-user-reply h5:first-child,
.modal .ai-paragraph h5:first-child,
.modal .modal-body h5:first-child,
.workreap-aicontent-modal h5:first-child,
.wr-aichat-modal h5:first-child {
    margin-top: 0 !important;
}

/* Đảm bảo các thẻ khác trong modal AI có kích thước phù hợp */
.modal .wr-user-reply p,
.modal .ai-paragraph p,
.modal .modal-body p,
.workreap-aicontent-modal p,
.wr-aichat-modal p {
    font-size: 14px !important;
    line-height: 1.6 !important;
    margin-bottom: 12px !important;
}

/* Styling cho lists trong modal AI */
.modal .wr-user-reply ul,
.modal .wr-user-reply ol,
.modal .ai-paragraph ul,
.modal .ai-paragraph ol,
.modal .modal-body ul,
.modal .modal-body ol,
.workreap-aicontent-modal ul,
.workreap-aicontent-modal ol,
.wr-aichat-modal ul,
.wr-aichat-modal ol {
    font-size: 14px !important;
    line-height: 1.6 !important;
    margin-bottom: 12px !important;
    padding-left: 20px !important;
}

/* Styling cho code trong modal AI */
.modal .wr-user-reply code,
.modal .ai-paragraph code,
.modal .modal-body code,
.workreap-aicontent-modal code,
.wr-aichat-modal code {
    font-size: 13px !important;
    background-color: #f5f5f5 !important;
    padding: 2px 4px !important;
    border-radius: 3px !important;
    font-family: 'Courier New', monospace !important;
}

/* Styling cho strong/bold trong modal AI */
.modal .wr-user-reply strong,
.modal .ai-paragraph strong,
.modal .modal-body strong,
.workreap-aicontent-modal strong,
.wr-aichat-modal strong {
    font-weight: 600 !important;
}

/* Styling cho em/italic trong modal AI */
.modal .wr-user-reply em,
.modal .ai-paragraph em,
.modal .modal-body em,
.workreap-aicontent-modal em,
.wr-aichat-modal em {
    font-style: italic !important;
}

/* CSS fixes for Project Detail page */
.wr-servicedetailtitle h3 {
    font-size: 20px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 10px !important;
}

.wr-project-title h4 {
    font-size: 17px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 8px !important;
}

.wr-sidebar-title h5 {
    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 8px !important;
}

/* Additional project detail heading fixes */
.wr-projectbox h1 {
    font-size: 26px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    margin-bottom: 12px !important;
}

.wr-projectbox h2 {
    font-size: 24px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 10px !important;
}

.wr-projectbox h3 {
    font-size: 20px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    margin-bottom: 8px !important;
}

.wr-project-holder h1,
.wr-project-holder h2,
.wr-project-holder h3,
.wr-project-holder h4,
.wr-project-holder h5 {
    margin-top: 0 !important;
}