#action-container{display:flex;flex-direction:column;align-items:center}#action-container .action-content{display:flex;flex-direction:row;gap:1rem;padding:.5rem;width:1080px;height:500px;background-color:#fff;border:1px solid #e5e5e5;border-radius:.5rem;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -2px rgba(0,0,0,.1)}#action-container .action-content .btn{background-color:#0d66ff;color:#fff;border:none;border-radius:.5rem;cursor:pointer;transition:all .2s ease}#action-container .action-content .btn:hover{background-color:rgba(13,102,255,.9)}#action-container .action-content .btn[s-disabled]{opacity:.7;pointer-events:none}#action-container .action-content .box{padding:.5rem;border:1px solid #e5e5e5;border-radius:.5rem}#action-container .action-content .preview{position:relative;width:calc(100% - 25rem - 1rem);background-image:url(/static/icons/icon-image-placeholder.svg);background-size:100%;background-repeat:no-repeat;background-position:center}#action-container .action-content .preview .scroll-btn{position:absolute;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;color:#fff;background-color:rgba(80,80,80,.3);backdrop-filter:blur(1rem);border-radius:100%;cursor:pointer;transition:all .2s ease;z-index:1}#action-container .action-content .preview .scroll-btn:active{scale:.95}#action-container .action-content .preview .left-scroll{left:1rem}#action-container .action-content .preview .right-scroll{right:1rem}#action-container .action-content .preview .scroll-container{display:flex;flex-direction:row;width:100%;height:100%;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;scrollbar-width:none;pointer-events:none;user-select:none}#action-container .action-content .preview .preview-container{position:relative;width:100%;height:100%;flex-shrink:0;background-color:#eaeaea}#action-container .action-content .preview .preview-container img{width:100%;height:100%;object-fit:contain}#action-container .action-content .preview .preview-container .buttons{position:absolute;right:.25rem;bottom:.25rem;display:flex;flex-direction:row;gap:.5rem;pointer-events:all;z-index:1}#action-container .action-content .preview .preview-container .buttons .button{display:block;width:2rem;height:2rem;border-radius:100%;background-color:rgba(80,80,80,.3);backdrop-filter:blur(1rem);cursor:pointer;background-repeat:no-repeat;background-position:center;background-size:1.2rem;transition:all .2s ease}#action-container .action-content .preview .preview-container .buttons .button:active{transform:scale(0.95)}#action-container .action-content .preview .preview-container .buttons .button.download-btn{background-image:url(/static/icons/icon-download.svg)}#action-container .action-content .preview .preview-container .buttons .button.enhance-btn{background-image:url(/static/icons/icon-hd.svg)}#action-container .action-content .config{display:flex;flex-direction:column;justify-content:space-between;width:25rem;height:100%}#action-container .action-content .config[s-disabled] .textarea-box .textarea textarea{pointer-events:none}#action-container .action-content .config[s-disabled] .textarea-box .textarea .count .clear-btn{pointer-events:none}#action-container .action-content .config[s-disabled] .textarea-box .generate-btn{pointer-events:none}#action-container .action-content .config[s-disabled] .try-this-box,#action-container .action-content .config[s-disabled] .styles-box,#action-container .action-content .config[s-disabled] .shape-box,#action-container .action-content .config[s-disabled] .quantity-box{pointer-events:none;opacity:.7}#action-container .action-content .config .textarea-box{display:flex;flex-direction:row;gap:.5rem}#action-container .action-content .config .textarea-box .textarea{position:relative;flex:1}#action-container .action-content .config .textarea-box .textarea textarea{padding:.5rem 5rem .5rem .5rem;width:100%;height:100%;min-height:4.5rem;resize:none;border:none;outline:2px solid rgba(0,0,0,0);transition:all .1s ease;color:#4a4a4a;background-color:#f3f4f6;border-radius:.5rem;font-size:.7rem}#action-container .action-content .config .textarea-box .textarea textarea:focus-visible{outline-color:#a1a1aa}#action-container .action-content .config .textarea-box .textarea .count{position:absolute;right:.5rem;bottom:.5rem;display:flex;flex-direction:row;align-items:center;gap:.5rem;color:#9ca3af}#action-container .action-content .config .textarea-box .textarea .count .clear-btn{display:flex;align-items:center;justify-content:center;border-radius:100%;transition:all .2s ease;cursor:pointer}#action-container .action-content .config .textarea-box .textarea .count .clear-btn:hover{background-color:#e5e7eb}#action-container .action-content .config .textarea-box .generate-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;padding:0 1rem;height:inherit}#action-container .action-content .config .textarea-box .generate-btn svg{width:.8rem;height:.8rem}#action-container .action-content .config .try-this-box{display:flex;flex-direction:row;align-items:center;gap:.5rem;min-height:1.5rem}#action-container .action-content .config .try-this-box .try-this-item{padding:.2rem 1rem;color:#4a4a4a;background-color:#f3f4f6;font-size:.7rem;border-radius:5rem;cursor:pointer;transition:all .2s ease}#action-container .action-content .config .try-this-box .try-this-item:hover{background-color:#e5e7eb}#action-container .action-content .config .options{display:flex;flex-direction:column;gap:.5rem}#action-container .action-content .config .options .title{font-weight:bold;color:#000}#action-container .action-content .config .options .options-item-box{display:flex;flex-direction:row;gap:.5rem}#action-container .action-content .config .options .options-item{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:.5rem;flex:1 1 0%;padding:.4rem .8rem;border:1px solid #e5e7eb;background-color:#f3f4f6;border-radius:.5rem;cursor:pointer;font-size:.7rem;transition:all .2s ease}#action-container .action-content .config .options .options-item svg{width:.8rem;height:.8rem}#action-container .action-content .config .options .options-item[data-active]:hover,#action-container .action-content .config .options .options-item[data-active]{color:#fff;background-color:#005eff}#action-container .action-content .config .options .options-item:hover{background-color:#e5e7eb}#action-container .action-content .config .styles-box .styles{display:flex;flex-direction:row;gap:.5rem}#action-container .action-content .config .styles-box .styles .styles-item{position:relative;width:3.7rem;height:3.7rem;border-radius:.5rem;overflow:hidden;border:2px solid rgba(0,0,0,0);background:linear-gradient(135deg, rgb(118, 196, 226) 15%, rgb(253, 157, 92) 80%);transition:all .2s ease;cursor:pointer}#action-container .action-content .config .styles-box .styles .styles-item:hover,#action-container .action-content .config .styles-box .styles .styles-item[data-active]{border-color:#0d66ff}#action-container .action-content .config .styles-box .styles .styles-item img{width:100%;height:100%;object-fit:cover}#action-container .action-content .config .styles-box .styles .styles-item span{position:absolute;left:0;bottom:0;width:100%;color:#fff;background-color:rgba(0,0,0,.3);backdrop-filter:blur(1rem);font-size:.6rem;text-align:center}#action-container .action-content .config .quantity-box{visibility:hidden}@media screen and (max-width: 600px){#action-container .action-content{flex-direction:column;gap:.5rem;width:100%;height:auto}#action-container .action-content .preview{width:100%;height:10rem;padding:0}#action-container .action-content .preview .left-scroll{left:.5rem}#action-container .action-content .preview .right-scroll{right:.5rem}#action-container .action-content .config{width:100%;gap:.5rem}#action-container .action-content .config .textarea-box{flex-direction:column}#action-container .action-content .config .textarea-box .generate-btn{padding:.4rem 0}#action-container .action-content .config .try-this-box{overflow-x:auto;scrollbar-width:none}#action-container .action-content .config .try-this-box span,#action-container .action-content .config .try-this-box .try-this-item{flex-shrink:0}#action-container .action-content .config .options .options-item-box{overflow-x:auto;scrollbar-width:none}#action-container .action-content .config .options .options-item-box .options-item span{white-space:nowrap}#action-container .action-content .config .quantity-box{display:none}}