.banner-wrap{margin-top:120px;margin-bottom:160px;display:flex;flex-direction:column;align-items:center;justify-content:center}.banner-wrap__container{display:flex;flex-direction:column;align-items:center;justify-content:center}.banner-wrap__card{position:relative;min-height:560px;background-color:#f5f5f5;padding:20px;border-radius:10px;width:calc(1240px - 4rem);margin:80px auto 0;box-shadow:0 0 10px 0 rgba(0, 0, 0, 0.1);border-radius:20px;background-color:#fff;padding:40px;display:flex;justify-content:center;gap:40px}.ai-promote{height:100%;width:100%}.banner-wrap__card-left h2{font-weight:500}.banner-wrap__card-left .chatbot-description{color:#999;margin-top:30px}.banner-wrap__card-left,.banner-wrap__card-right{flex:1}.banner-wrap__card-left{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.banner-wrap__card-left.align-center .banner-wrap__card-left{text-align:center}.banner-wrap__card-left .training-wrapper__title{width:100%;margin-bottom:20px}.banner-wrap__card-left .training-wrapper__title h3{margin:0}.banner-wrap__card-left .training-wrapper__title strong,.training-step3__title strong{display:block;font-size:20px}.banner-wrap__card-left .training-wrapper__title p,.training-step3__title p{margin-top:0;color:#999;font-size:14px}.mt-120{margin-top:120px}.training-wrapper{display:flex;flex-direction:column;align-items:center;justify-content:space-between;height:100%;width:100%}.training-wrapper#aiTrainingStep1,.training-wrapper#aiTrainingStep3{height:560px}.button-wrapper{position:absolute;bottom:0;left:0;width:100%;display:flex;align-items:center;justify-content:space-between}.button-primary{width:fit-content;background-color:#42b55b;color:#fff;padding:8px 20px;border-radius:5px;font-size:16px;font-weight:600;cursor:pointer;transition:all 0.3s ease;display:flex;align-items:center;justify-content:center;gap:10px}.button-primary:hover{background-color:#3aa350}.button-default{display:flex;align-items:center;justify-content:center;gap:10px;cursor:pointer}.button-animPulse{background-color:#42b55b;animation:animPulse 2s infinite}@keyframes animPulse{0%{box-shadow:0 0 0 0 rgba(66, 181, 91, 0.7)}70%{box-shadow:0 0 0 15px rgba(66, 181, 91, 0)}100%{box-shadow:0 0 0 0 rgba(66, 181, 91, 0)}}.banner-wrap__card-left .banner-wrap__card-button:hover{animation-play-state:paused}.banner-wrap__card-left .banner-wrap__card-button:after{content:'';position:absolute;top:50%;left:50%;width:0;height:0;background:rgba(255, 255, 255, 0.2);border-radius:50%;transform:translate(-50%, -50%);transition:width 0.6s ease-out, height 0.6s ease-out}.banner-wrap__card-left .banner-wrap__card-button:hover:after{width:300px;height:300px}.banner-wrap__card-left .banner-wrap__card-button:hover{background-color:#3aa350}.training-wrapper__content{width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}.training-wrapper__content-item{cursor:pointer;width:100%;display:flex;gap:10px;align-items:center;border:1px solid rgba(62, 98, 200, 0.1);border-radius:6px;border-left-width:4px;padding:14px 20px}.training-wrapper__content-item:hover,input:focus,textarea:focus{box-shadow:0 0 10px 0 rgba(0, 0, 0, 0.1)}.training-wrapper__content-item-title{flex:1;font-size:14px}.training-wrapper__content-item p,.training-step2__title p{font-size:12px;margin:0;color:#999}.button-wrapper .button-primary{padding:6px 16px;font-size:14px}.border-left-color-yellow{border-left-color:#f59e0b}.border-left-color-blue{border-left-color:#007bff}.border-left-color-green{border-left-color:#42b55b}.bg-yellow-400{background-color:#f59e0b}.bg-green-400{background-color:#42b55b}.bg-blue-400{background-color:#007bff}.shrink-0{flex-shrink:0}.radius{border-radius:5px}.fill-white{color:#fff}.p-1{padding:0.25rem}.fill-navy-100{fill:rgba(200, 206, 237, 1)}.f-14{font-size:14px}.training-step2__title{display:flex;align-items:center;width:100%}.training-step2__title .back-hover{cursor:pointer;border-radius:6px}.training-step2__title .back-hover:hover{background-color:rgba(243, 243, 254, 0.1)}.training-step2__title .training-wrapper__content-item-title{margin-left:10px}.training-step2__content{display:flex;flex-direction:column;gap:14px;margin-top:20px;border:1px solid rgba(200, 206, 237, 0.4);padding:20px;width:100%;height:fit-content;border-radius:10px}.training-step2__content-wrap{position:relative;width:100%;min-height:200px;border:1px dashed #c8ceed;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;cursor:pointer;transition:all 0.3s ease}.training-step2__content-wrap.drag-over{border-color:#42b55b;background-color:rgba(66, 181, 91, 0.1)}.upload-input{position:absolute;width:100%;height:100%;top:0;left:0;opacity:0;cursor:pointer}.upload-title{margin-top:6px;font-weight:600}.upload-description{color:#999;font-size:14px}.w-full{width:100%}.h-full{height:100%}.button-save{float:right;margin-top:20px;background-color:#42b55b}.button-primary.button-save:hover,.button-primary.button-animPulse:hover{background-color:#3aa350}.training-step2__content-top-title{font-size:16px;font-weight:600}.training-step2__content-top-description{color:#999;font-size:14px}.training-step2__file-wrap{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px;border:1px dashed #c8ceed;border-radius:6px}.training-step2__file-wrap-name{display:flex;align-items:center;gap:10px}.training-step2__file-wrap-name .file-name{font-size:14px}.pointer{cursor:pointer}.training-step2__content-input-wrap{border-radius:6px}.training-step2__content-input-wrap .training-step2__content-input,.custom-role-input{border:1px solid rgba(200, 206, 237, 0.4);height:40px;padding:0 20px;width:100%;box-sizing:border-box;border-radius:10px}.training-step2__content-textarea{width:100%;border:1px solid rgba(200, 206, 237, 0.4);border-radius:6px;height:200px;line-height:1.5;padding:20px;resize:vertical;font-size:14px}.training-step2__content-input::placeholder,.training-step2__content-textarea::placeholder,.training-textarea::placeholder,#aiPromoteChat::placeholder,.custom-role-input::placeholder{color:#ccc}.mb-40{margin-bottom:40px}#aiPromote{position:relative;min-height:560px}.ai-promote__container{display:flex;gap:10px;flex-wrap:wrap}.ai-promote__container .ai-promote__item{padding:6px 20px;border:1px solid #42b55b;border-radius:6px;cursor:pointer;font-size:14px}.ai-promote__container .ai-promote__item:first-child{margin-top:20px}.ai-promote__container .ai-promote__item:hover{background-color:#42b55b;color:#fff}.ai-promote__chat{height:560px;background:#efeae2;border-radius:10px;border:1px solid #ccc;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 2px 10px rgba(0, 0, 0, 0.1)}.ai-promote__chat-history{flex:1;padding:20px;overflow-y:auto;display:flex;flex-direction:column;gap:10px}.ai-promote__chat-history .chat-history-item{background:#fff;padding:10px;border-radius:6px;width:fit-content;max-width:80%}.ai-promote__chat-history .chat-history-item.from-ai{align-self:flex-start}.ai-promote__chat-history .chat-history-item.from-me{align-self:flex-end;background-color:#d9fdd3}.ai-promote__chat-input{width:100%;height:60px;background:#f0f2f5;display:flex;align-items:center;gap:10px;padding:10px;box-sizing:border-box}.ai-promote__chat-input #aiPromoteChat{flex:1;height:100%;border-radius:6px;padding:0 16px}.ai-promote__chat-input .ai-promote__chat-input-send{height:24px;cursor:pointer}.training-step3-add-button{display:flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;height:40px;width:100%;color:#fff;background-color:#42b55b;border-radius:6px;margin:10px auto;font-size:14px}.training-step3-add-button:hover{background-color:#3aa350}.align-center{align-items:center}.bg-yellow-400.bg-opacity-20{background-color:rgba(245, 158, 11, 0.2)}.bg-blue-400.bg-opacity-20{background-color:rgba(0, 123, 255, 0.2)}.bg-green-400.bg-opacity-20{background-color:rgba(66, 181, 91, 0.2)}.fill-blue-400{fill:rgba(62, 98, 200, 1)}.fill-yellow-400{fill:rgba(245, 158, 11, 1)}.fill-green-400{fill:rgba(66, 181, 91, 1)}.training-step3__content{flex:1;width:100%;margin-top:20px}.training-step3__icon{height:40px;width:40px;display:flex;align-items:center;justify-content:center}.flex{display:flex}.justify-center{justify-content:center}.flex-1{flex:1}.gap-10{gap:10px}.step3-item-card{padding:20px;box-shadow:0 0 10px 0 rgba(0, 0, 0, 0.1);border-radius:10px;margin-bottom:20px}.step3-item-card .delete-source-icon{cursor:pointer}.step3-item-card .delete-source-icon:hover{color:#f87171}.step3-link-title,.step3-pdf-title{font-size:16px;font-weight:600}.step3-link-href,.step3-pdf-href{font-size:12px;color:#007bff;text-decoration:underline;cursor:pointer}.step3-link-href:hover,.step3-pdf-href:hover{color:#0056b3}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.w-400{width:400px}.training-select{width:100%;border:1px solid rgba(200, 206, 237, 0.4);border-radius:10px;height:40px;padding:0 10px}.training-select:focus{box-shadow:0 0 10px 0 rgba(0, 0, 0, 0.1)}.training-textarea{height:200px;resize:vertical;padding:12px;border:1px solid rgba(200, 206, 237, 0.4);border-radius:10px;margin-bottom:20px;line-height:1.5}.training-textarea:focus{box-shadow:0 0 10px 0 rgba(0, 0, 0, 0.1)}.promote-loading-container{width:100%;flex-direction:column;gap:20px;position:relative;padding-bottom:48px}.promote-loading-container .steps-wrap{display:flex;flex-direction:column;justify-content:center;gap:10px}@keyframes rotate{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.promote-loading-container .promote-loading-icon{animation:rotate 1s linear infinite}.text-center{text-align:center}.training-select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background:url('/static/images/whatsapp-ai/select-arrow.svg') no-repeat right 10px center;background-size:24px 24px;padding-right:30px}.training-select:focus{background-image:url('/static/images/whatsapp-ai/select-arrow.svg');background-repeat:no-repeat;background-position:right 10px center;background-size:24px 24px;padding-right:30px}.training-select{position:relative}.training-select::after{content:'';position:absolute;right:10px;top:50%;width:24px;height:24px;background:url('/static/images/whatsapp-ai/select-arrow.svg') no-repeat center;background-size:contain;transform:translateY(-50%);transition:transform 0.3s ease;pointer-events:none}.training-select:focus::after{transform:translateY(-50%) rotate(180deg)}.training-select option{padding:12px;font-size:14px;background-color:#fff;color:#333}.training-select option:hover,.training-select option:focus{background-color:rgba(0, 117, 227, 0.1);color:rgba(0, 117, 227, 1)}.training-select option:checked{background-color:rgba(0, 117, 227, 0.1);color:rgba(0, 117, 227, 1);font-weight:600}.modal-wrap{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000;display:flex;align-items:center;justify-content:center}.modal-mask{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0, 0, 0, 0.5)}.modal-container{background:#0b5737;position:relative;border-radius:12px;width:800px;box-shadow:0 4px 12px rgba(0, 0, 0, 0.15)}.modal-content{padding:24px}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.modal-header h3{margin:0;font-size:18px;font-weight:600}.modal-close{position:absolute;top:10px;right:10px;cursor:pointer;color:#fff;width:24px;height:24px;z-index:1000}.modal-close:hover{color:#333}.modal-body{width:100%;position:relative;margin-bottom:24px;display:flex;align-items:center;gap:10px;color:#000;justify-content:space-between}.modal-footer{display:flex;justify-content:center}.install-logo{width:430px;margin-top:-120px}@keyframes bounce{0%,  100%{transform:translateY(0)}50%{transform:translateY(-6px)}}.hide{display:none !important}.error{border-color:#ff4d4f !important}.error-message{color:#ff4d4f;font-size:12px;text-indent:4px}.mb-20{margin-bottom:20px}#beforeTraining,#aiTraining{position:relative}#cf-turnstile,#cf-turnstile-refresh{position:absolute;top:0;left:0;height:100%;width:100%;background:#cccccc80;display:flex;align-items:center;justify-content:center;border-radius:20px}.loading-status{display:flex;align-items:center;justify-content:center}.modal-body-title{font-size:36px;font-weight:bold;margin-bottom:30px;color:#fff}.modal-body-description{font-size:16px;color:#fff;text-decoration:underline}.button-modal{background-color:#fcca00;color:#000;border-radius:10px;padding:10px 20px;font-size:16px;cursor:pointer;width:100%;backface-visibility:hidden;-webkit-backface-visibility:hidden;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;will-change:transform, box-shadow;animation:strong-breathe 2.5s cubic-bezier(0.4, 0, 0.6, 1) infinite}@keyframes strong-breathe{0%{box-shadow:0 0 5px rgba(74, 144, 226, 0.3);transform:translateZ(0) scale(1)}50%{box-shadow:0 0 20px rgba(74, 144, 226, 0.7);transform:translateZ(0) scale(1.03)}100%{box-shadow:0 0 5px rgba(74, 144, 226, 0.3);transform:translateZ(0) scale(1)}}.button-modal:hover{animation-play-state:paused}#uploadBox.loading,#trainingStep2FileWrap.loading{position:relative;pointer-events:none}#uploadBox.loading::after,#trainingStep2FileWrap.loading::after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(255, 255, 255, 0.7);display:flex;justify-content:center;align-items:center}#uploadBox.loading::before,#trainingStep2FileWrap.loading::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);width:30px;height:30px;border:3px solid #f3f3f3;border-top:3px solid #42b55b;border-radius:50%;z-index:1;animation:spin 1s linear infinite}@keyframes spin{0%{transform:translate(-50%, -50%) rotate(0deg)}100%{transform:translate(-50%, -50%) rotate(360deg)}}#deletePdfBtn:disabled{opacity:0.6;cursor:not-allowed}.font-bold{font-weight:600}.ai-promote__title{margin-bottom:1rem}.ai-promote__title-h3{font-size:20px;font-weight:bolder;line-height:1.5}.ai-promote__title-desc{color:#999;font-size:14px}#toChromeStoreBtn.button-primary{padding:16px;margin-top:20px;position:relative;overflow:hidden}#toChromeStoreBtn.button-primary::before{content:'';position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(    120deg,    transparent 0%,    transparent 20%,    rgba(255, 255, 255, 0.4) 45%,    rgba(255, 255, 255, 0.6) 50%,    rgba(255, 255, 255, 0.4) 55%,    transparent 80%,    transparent 100%  );transform:skewX(-25deg);animation:shimmerEffect 8s cubic-bezier(0.4, 0, 0.2, 1) infinite}@keyframes shimmerEffect{0%{left:-100%}40%{left:100%}100%{left:100%}}#toChromeStoreBtn.button-primary:hover::before{animation-play-state:paused}