body { 
    background-color: #f4f7fc; 
    color: #495057; 
    font-family: 'Segoe UI', system-ui, -apple-system, sans-serif; 
    padding-bottom: 70px; 
}
.navbar-custom { 
    background-color: #ffffff; 
    box-shadow: 0 2px 10px rgba(0,0,0,0.05); 
    z-index: 1030; 
}
/* Style Trang Chủ index.php */
.hero-section { background: linear-gradient(135deg, #eef2f7 0%, #dfe7f2 100%); padding: 80px 0 60px 0; border-bottom: 1px solid #e2e8f0; }
.feature-card { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 16px; padding: 30px 20px; text-align: center; transition: all 0.3s ease; text-decoration: none; color: inherit; display: block; height: 100%; }
.feature-card:hover { transform: translateY(-5px); box-shadow: 0 12px 30px rgba(13, 110, 253, 0.08); border-color: #0d6efd; }
.icon-box { width: 70px; height: 70px; margin: 0 auto 20px auto; display: flex; align-items: center; justify-content: center; border-radius: 50%; font-size: 2rem; }
.bg-word { background-color: #e8f0fe; color: #0d6efd; }
.bg-edit { background-color: #fce8e6; color: #d93025; }

/* Style Trang docxtopdf.php */
.main-card { border: none; border-radius: 16px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05); background: #ffffff; }
.dropzone-box { border: 2px dashed #0d6efd; background-color: #f8faff; border-radius: 12px; padding: 40px 20px; text-align: center; cursor: pointer; transition: all 0.2s ease-in-out; }
.dropzone-box:hover { background-color: #f0f4ff; border-color: #0b5ed7; }
.dropzone-icon { font-size: 3.5rem; color: #0d6efd; margin-bottom: 15px; }
.btn-convert { padding: 12px; font-weight: 600; border-radius: 8px; font-size: 1.05rem; }
.file-preview-list { max-height: 200px; overflow-y: auto; background: #fff; border: 1px solid #dee2e6; border-radius: 8px; display: none; }

/* Style Trang edit.php */
.toolbar { background: #ffffff; border-radius: 12px; box-shadow: 0 4px 20px rgba(0,0,0,0.05); padding: 12px; position: sticky; top: 85px; z-index: 1020; }
.tool-btn { border: 1px solid #dee2e6; background: #fff; padding: 8px 16px; border-radius: 8px; font-weight: 500; transition: all 0.2s; }
.tool-btn:hover, .tool-btn.active { background: #0d6efd; color: white; border-color: #0d6efd; }
.tool-btn-erase:hover, .tool-btn-erase.active { background: #dc3545; color: white; border-color: #dc3545; }
#pdf-container { max-width: 100%; margin: 20px auto; background: #fff; padding: 15px; border-radius: 12px; box-shadow: 0 5px 25px rgba(0,0,0,0.05); min-height: 400px; overflow-x: auto; }
.pdf-page-wrapper { position: relative; margin: 0 auto 20px auto; box-shadow: 0 4px 12px rgba(0,0,0,0.1); background: #fff; }
canvas { display: block; width: 100%; height: 100%; }
.interaction-layer { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.draggable-text { position: absolute; border: 1px dashed #0d6efd; background: rgba(255,255,255,0.9); padding: 4px 8px; cursor: move; user-select: none; min-width: 60px; outline: none; font-size: 16px; font-family: Arial, sans-serif; z-index: 10; box-sizing: border-box; }
.eraser-block { position: absolute; background: #ffffff; border: 1px dashed #dc3545; cursor: move; min-width: 20px; min-height: 15px; z-index: 10; box-sizing: border-box; }
.delete-btn { position: absolute; top: -10px; right: -10px; background: #dc3545; color: white; border-radius: 50%; width: 18px; height: 18px; font-size: 11px; display: flex; align-items: center; justify-content: center; cursor: pointer; border: none; font-weight: bold; line-height: 1; z-index: 100; }
.delete-btn:hover { background: #bd2130; }
.resize-handle { position: absolute; width: 10px; height: 10px; background: #dc3545; right: -2px; bottom: -2px; cursor: se-resize; z-index: 100; border-radius: 2px; }

/* Footer Hệ thống */
.footer-fixed { position: fixed; bottom: 0; left: 0; width: 100%; height: 60px; background-color: #ffffff; border-top: 1px solid #e2e8f0; z-index: 1030; display: flex; align-items: center; }