/* AvaClik Create: shared desktop and mobile presentation. */
.text-image-page{--ti-accent:#eb80bb!important;--ti-border:rgba(232,131,185,.25)!important;display:flex!important;flex-direction:column!important;gap:14px!important;color:#fff!important}
.text-image-page .ti-mode-note,.text-image-page .ti-help,.text-image-page .ti-actions-row{display:none!important}
.text-image-page .ti-head{order:0!important;background:transparent!important;border:0!important;padding:0 0 12px!important;margin:0!important;border-bottom:1px solid rgba(238,141,191,.16)!important}
.text-image-page .ti-head h3{color:#f593c6!important;visibility:visible!important;display:block!important;font-size:21px!important}
.text-image-page .ti-head p{color:#b69aad!important;font-size:12px!important;line-height:1.5!important}
.text-image-page .ti-field--prompt{order:1!important;display:flex!important;flex-direction:column!important;gap:8px!important}
.text-image-page .ti-field>span{color:#e4bbd4!important;font-weight:700!important;font-size:12px!important}
.text-image-page textarea{width:100%!important;min-height:150px!important;padding:15px!important;color:#fff!important;background:linear-gradient(145deg,#1a121f,#0f0c14)!important;border:1px solid #633650!important;border-radius:14px!important;box-shadow:inset 0 0 22px rgba(205,80,143,.04)!important;line-height:1.5!important}
.text-image-page textarea:focus,.text-image-page select:focus{outline:2px solid #ed85bb!important;outline-offset:2px}
.text-image-page textarea::placeholder{color:#99899d!important}
.text-image-page .ti-grid{order:2!important;margin:0!important;padding:0!important;border:0!important}
.text-image-page select{width:100%!important;min-height:46px!important;background:#1b111f!important;color:#f9eaf4!important;border:1px solid #633650!important;border-radius:12px!important;padding:10px 12px!important}
.text-image-page .ti-generate{order:3!important;min-height:52px!important;width:100%!important;margin:2px 0 0!important;color:white!important;border:1px solid #e779b1!important;border-radius:13px!important;background:linear-gradient(110deg,#933578,#d44c95)!important;box-shadow:0 8px 24px rgba(208,57,139,.20)!important;font-weight:800!important}
.text-image-page .ti-generate:disabled{opacity:.48!important;box-shadow:none!important}
.text-image-page .ti-notice{order:4!important}
.text-image-popup{border-color:#65374e!important;background:linear-gradient(155deg,#21101c,#0f0b13 70%)!important;box-shadow:0 20px 70px rgba(0,0,0,.55),0 0 40px rgba(219,62,142,.1)!important}
@media(max-width:768px){.text-image-popup .text-image-page{gap:14px!important}.text-image-popup .ti-generate--popup-top{order:3!important}.ti-mobile-generator-panel .ti-mobile-generator-actions{justify-content:space-between!important}.text-image-popup .ti-head h3{display:block!important}}
#fotor-root .text-image-page.text-image-page textarea{background:linear-gradient(145deg,#1a121f,#0f0c14)!important;border:1px solid #633650!important;border-radius:14px!important;color:#fff!important;min-height:150px!important;font-weight:400!important;line-height:1.5!important}
#fotor-root .text-image-page.text-image-page textarea:focus{outline:2px solid #e784b8!important;box-shadow:none!important}
#fotor-root .text-image-page.text-image-page select{background-color:#1b111f!important;border:1px solid #633650!important;color:#fff!important;border-radius:12px!important}
#fotor-root .text-image-page.text-image-page .ti-generate.ti-generate{background:linear-gradient(110deg,#933578,#d44c95)!important;border:1px solid #e779b1!important;color:#fff!important;min-height:52px!important;border-radius:13px!important}
#fotor-root .text-image-page.text-image-page .ti-generate:disabled{opacity:.45!important}
#fotor-root .agent-popup.text-image-popup{background:linear-gradient(150deg,#21101c,#0f0b13 75%)!important;border:1px solid #663650!important;box-shadow:0 20px 70px rgba(0,0,0,.5),0 0 35px rgba(218,63,139,.15)!important}

#fotor-root .text-image-page .ti-quality{order:2!important;display:flex!important;flex-direction:column!important;gap:8px!important}
#fotor-root .text-image-page .ti-grid{order:3!important}
#fotor-root .text-image-page .ti-generate{order:4!important}
#fotor-root .text-image-page .ti-notice{order:5!important}

#fotor-root .text-image-page .ava-create-presets{order:2!important;min-width:0;width:100%;padding:0;margin:0}
#fotor-root .ava-create-presets-head{display:flex;align-items:center;justify-content:space-between;color:#e4bbd4;font-size:12px;margin-bottom:8px}
#fotor-root .ava-create-presets-controls{display:flex;gap:5px}
#fotor-root .ava-create-presets-controls button{width:28px;height:28px;border:1px solid #633650;border-radius:8px;background:#211522;color:#f19ac7;font-size:19px;line-height:1;cursor:pointer}
#fotor-root .ava-create-presets-list{display:flex;gap:8px;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;padding:2px 2px 8px;scrollbar-width:thin;scrollbar-color:#9d4879 transparent}
#fotor-root .ava-create-preset{position:relative;flex:0 0 104px;width:104px;height:116px;padding:0;border:1px solid #633650;border-radius:12px;overflow:hidden;background:#211522;scroll-snap-align:start;cursor:pointer}
#fotor-root .ava-create-preset.is-selected{border:2px solid #f48bc2;box-shadow:0 0 0 1px #f48bc2}
#fotor-root .ava-create-preset img{display:block;width:100%;height:100%;object-fit:cover}
#fotor-root .ava-create-preset span{position:absolute;inset:auto 0 0;padding:16px 5px 5px;background:linear-gradient(transparent,rgba(0,0,0,.86));color:#fff;font-size:10px;line-height:1.2;text-align:left}
#fotor-root .ava-create-preset:focus-visible,#fotor-root .ava-create-presets-controls button:focus-visible{outline:2px solid #f5a4d0;outline-offset:2px}
#fotor-root .text-image-page .ti-quality{order:3!important}
#fotor-root .text-image-page .ti-grid{order:4!important}
#fotor-root .text-image-page .ti-generate.ti-generate{order:5!important}
#fotor-root .text-image-page .ti-notice{order:6!important}

/* Desktop uses a separate panel shell; match the mobile Create surface. */
@media (min-width:769px){
  #fotor-root .editor-shell:not(.is-mobile) .left-panel.left-panel--tool-ai-text-image{
    border:1px solid #65374e!important;
    background:linear-gradient(155deg,#21101c,#0f0b13 75%)!important;
    box-shadow:0 20px 60px rgba(0,0,0,.45),0 0 32px rgba(219,62,142,.1)!important;
  }
  #fotor-root .editor-shell:not(.is-mobile) .left-panel--tool-ai-text-image .left-panel-header{
    background:linear-gradient(110deg,#24121f,#1a111b)!important;
    border-bottom:1px solid rgba(238,141,191,.2)!important;
  }
  #fotor-root .editor-shell:not(.is-mobile) .left-panel--tool-ai-text-image .lp-title{color:#f593c6!important}
  #fotor-root .editor-shell:not(.is-mobile) .left-panel--tool-ai-text-image .lp-subtitle{color:#b69aad!important}
  #fotor-root .editor-shell:not(.is-mobile) .left-panel--tool-ai-text-image .left-panel-body{
    background:transparent!important;
    scrollbar-color:#9d4879 transparent!important;
  }
  #fotor-root .editor-shell:not(.is-mobile) .left-panel--tool-ai-text-image .left-panel-body::-webkit-scrollbar-thumb{background:#9d4879!important}
  #fotor-root .editor-shell:not(.is-mobile) .left-panel--tool-ai-text-image button:focus-visible,
  #fotor-root .editor-shell:not(.is-mobile) .left-panel--tool-ai-text-image select:focus-visible,
  #fotor-root .editor-shell:not(.is-mobile) .left-panel--tool-ai-text-image textarea:focus-visible{outline:2px solid #f5a4d0!important;outline-offset:2px!important}
}

/* Override legacy desktop field and header styles specifically for Create. */
#fotor-root .editor-shell:not(.is-mobile) .left-panel.left-panel--tool-ai-text-image .text-image-page textarea,
#fotor-root .editor-shell:not(.is-mobile) .left-panel.left-panel--tool-ai-text-image .text-image-page select{
  background:#211321!important;
  color:#fff1f8!important;
  border:1px solid #78415f!important;
  border-radius:12px!important;
}
#fotor-root .editor-shell:not(.is-mobile) .left-panel.left-panel--tool-ai-text-image .text-image-page textarea::placeholder{color:#bda2b4!important}
#fotor-root .text-image-page select option{background:#241421!important;color:#fff1f8!important}
#fotor-root .editor-shell:not(.is-mobile) .left-panel.left-panel--tool-ai-text-image .left-panel-header .lp-back,
#fotor-root .editor-shell:not(.is-mobile) .left-panel.left-panel--tool-ai-text-image .left-panel-header .lp-close{
  background:#2a1827!important;
  border:1px solid #71405c!important;
  color:#f2a4cf!important;
}
#fotor-root .editor-shell:not(.is-mobile) .left-panel.left-panel--tool-ai-text-image .left-panel-header .lp-back:hover,
#fotor-root .editor-shell:not(.is-mobile) .left-panel.left-panel--tool-ai-text-image .left-panel-header .lp-close:hover{background:#48223b!important}
#fotor-root .editor-shell:not(.is-mobile) .rail-btn[data-section="ai-text-image"].active{background:#3b1c33!important;border-color:#db70ac!important;box-shadow:inset 0 0 0 1px rgba(239,130,188,.35)!important;color:#f9c1e0!important}
#fotor-root .editor-shell:not(.is-mobile) .rail-btn[data-section="ai-text-image"].active .rail-label,
#fotor-root .editor-shell:not(.is-mobile) .rail-btn[data-section="ai-text-image"].active .rail-ico{color:#f9c1e0!important}