/* ==========================================================
   RESINAPP | MOBILE UX PATCH v8
   Ajuste visual dos painéis laterais no mobile + botões estáveis.
   Não altera backend, banco, clientes, projetos, uploads ou webhooks.
========================================================== */

html.resinapp-mobile-ux-ready,
html.resinapp-mobile-ux-ready body{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

body.resinapp-mobile-ux{
  overscroll-behavior:none;
  touch-action:pan-x pan-y pinch-zoom;
}

body.resinapp-mobile-ux input,
body.resinapp-mobile-ux select,
body.resinapp-mobile-ux textarea,
body.resinapp-mobile-ux button{
  -webkit-tap-highlight-color:transparent;
}

@media (max-width: 860px){
  html.resinapp-mobile-ux-ready,
  html.resinapp-mobile-ux-ready body,
  html.resinapp-mobile-ux-ready #root{
    width:100%;
    height:100%;
    min-height:100%;
    overflow:hidden;
  }

  body.resinapp-mobile-ux #root > div[class*="h-screen"]{
    height:100dvh!important;
    max-height:100dvh!important;
    overflow:hidden!important;
  }

  /* Topo compacto e rolável no celular */
  body.resinapp-mobile-ux header.no-print{
    height:auto!important;
    min-height:54px!important;
    padding:6px 7px!important;
    gap:7px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  body.resinapp-mobile-ux header.no-print::-webkit-scrollbar{display:none}
  body.resinapp-mobile-ux header.no-print > *{flex-shrink:0}
  body.resinapp-mobile-ux header.no-print button{
    min-width:34px!important;
    min-height:32px!important;
  }
  body.resinapp-mobile-ux #proj-name-input{
    width:min(44vw,182px)!important;
    min-width:126px!important;
    font-size:15px!important;
    height:36px!important;
  }

  body.resinapp-mobile-ux #root > div > div[class*="flex-1"][class*="overflow-hidden"][class*="relative"]{
    position:relative!important;
    overflow:hidden!important;
  }

  /* Painéis laterais como gavetas por cima do canvas, sem ficarem por baixo da folha */
  body.resinapp-mobile-ux #root > div > div[class*="flex-1"][class*="overflow-hidden"][class*="relative"] > div[class*="transition-all"][class*="shrink-0"][class*="z-30"][class*="h-full"]{
    position:absolute!important;
    top:0!important;
    bottom:0!important;
    z-index:2147483000!important;
    overflow:visible!important;
    pointer-events:auto!important;
    background:#fff!important;
    box-shadow:0 16px 44px rgba(15,23,42,.16)!important;
  }

  body.resinapp-mobile-ux #root > div > div[class*="flex-1"][class*="overflow-hidden"][class*="relative"] > div[class*="transition-all"][class*="shrink-0"][class*="z-30"][class*="h-full"]:first-child{
    left:0!important;
    width:clamp(218px,64vw,246px)!important;
    max-width:clamp(218px,64vw,246px)!important;
    border-right:1px solid #e5e7eb!important;
  }

  body.resinapp-mobile-ux #root > div > div[class*="flex-1"][class*="overflow-hidden"][class*="relative"] > div[class*="transition-all"][class*="shrink-0"][class*="z-30"][class*="h-full"]:last-child{
    right:0!important;
    width:clamp(246px,72vw,294px)!important;
    max-width:clamp(246px,72vw,294px)!important;
    border-left:1px solid #e5e7eb!important;
  }

  body.resinapp-mobile-ux #root > div > div[class*="flex-1"][class*="overflow-hidden"][class*="relative"] > div[class*="transition-all"][class*="shrink-0"][class*="z-30"][class*="h-full"][class*="w-0"]{
    width:0!important;
    max-width:0!important;
    overflow:visible!important;
    pointer-events:auto!important;
    box-shadow:none!important;
    border:0!important;
  }

  body.resinapp-mobile-ux #root > div > div[class*="flex-1"][class*="overflow-hidden"][class*="relative"] > div[class*="transition-all"][class*="shrink-0"][class*="z-30"][class*="h-full"]:first-child > div[class*="w-80"]{
    width:clamp(218px,64vw,246px)!important;
    max-width:clamp(218px,64vw,246px)!important;
    height:100%!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch;
    background:#fff!important;
  }

  body.resinapp-mobile-ux #root > div > div[class*="flex-1"][class*="overflow-hidden"][class*="relative"] > div[class*="transition-all"][class*="shrink-0"][class*="z-30"][class*="h-full"]:last-child > div[class*="w-80"]{
    width:clamp(246px,72vw,294px)!important;
    max-width:clamp(246px,72vw,294px)!important;
    height:100%!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch;
    background:#fff!important;
  }

  body.resinapp-mobile-ux #root > div > div[class*="flex-1"][class*="overflow-hidden"][class*="relative"] > div[class*="transition-all"][class*="shrink-0"][class*="z-30"][class*="h-full"][class*="w-0"] > div[class*="w-80"]{
    width:0!important;
    max-width:0!important;
    overflow:hidden!important;
  }

  /* Botões laterais: menores, clicáveis e sempre acima das gavetas */
  body.resinapp-mobile-ux button[title="Ocultar Biblioteca"],
  body.resinapp-mobile-ux button[title="Mostrar Biblioteca"],
  body.resinapp-mobile-ux button[title="Ocultar Ajustes"],
  body.resinapp-mobile-ux button[title="Mostrar Ajustes"]{
    position:fixed!important;
    top:52dvh!important;
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    min-height:36px!important;
    max-width:36px!important;
    max-height:36px!important;
    padding:0!important;
    border-radius:999px!important;
    border:2px solid #e5e7eb!important;
    background:#fff!important;
    box-shadow:0 8px 20px rgba(15,23,42,.18)!important;
    z-index:2147483647!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
    -webkit-user-select:none!important;
    user-select:none!important;
    -webkit-tap-highlight-color:transparent!important;
    opacity:.98!important;
  }

  body.resinapp-mobile-ux button[title="Ocultar Biblioteca"],
  body.resinapp-mobile-ux button[title="Mostrar Biblioteca"]{
    left:6px!important;
    right:auto!important;
    transform:translateY(-50%)!important;
  }

  body.resinapp-mobile-ux button[title="Ocultar Ajustes"],
  body.resinapp-mobile-ux button[title="Mostrar Ajustes"]{
    right:6px!important;
    left:auto!important;
    transform:translateY(-50%)!important;
  }

  body.resinapp-mobile-ux button[title="Ocultar Biblioteca"] svg,
  body.resinapp-mobile-ux button[title="Mostrar Biblioteca"] svg,
  body.resinapp-mobile-ux button[title="Ocultar Ajustes"] svg,
  body.resinapp-mobile-ux button[title="Mostrar Ajustes"] svg{
    width:16px!important;
    height:16px!important;
    pointer-events:none!important;
    stroke-width:2.8!important;
  }

  /* Abas da biblioteca compactas e sem ficar escondidas atrás da folha */
  body.resinapp-mobile-ux #sidebar-tabs{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:5px!important;
    overflow:visible!important;
    padding:6px!important;
  }
  body.resinapp-mobile-ux #sidebar-tabs button{
    width:100%!important;
    min-width:0!important;
    min-height:30px!important;
    padding:6px 4px!important;
    white-space:normal!important;
    font-size:10px!important;
    line-height:1.08!important;
    justify-content:center!important;
    text-align:center!important;
    gap:4px!important;
    border-radius:10px!important;
  }
  body.resinapp-mobile-ux #sidebar-tabs button svg{
    width:14px!important;
    height:14px!important;
    flex:0 0 auto!important;
  }

  body.resinapp-mobile-ux aside,
  body.resinapp-mobile-ux [class*="w-80"]{
    font-size:12px;
  }

  /* Conteúdo interno da biblioteca mais compacto no celular */
  body.resinapp-mobile-ux #sidebar-tabs + div,
  body.resinapp-mobile-ux aside div[class*="overflow-y-auto"]{
    overflow-x:hidden!important;
  }
  body.resinapp-mobile-ux aside h2,
  body.resinapp-mobile-ux aside h3,
  body.resinapp-mobile-ux aside h4{
    font-size:13px!important;
    line-height:1.15!important;
  }
  body.resinapp-mobile-ux aside p,
  body.resinapp-mobile-ux aside span{
    line-height:1.2!important;
  }

  /* Canvas com rolagem suave e suporte a zoom com dois dedos */
  body.resinapp-mobile-ux #canvas-viewport{
    width:100%!important;
    height:100%!important;
    padding:14px!important;
    justify-content:flex-start!important;
    align-items:flex-start!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
    touch-action:pan-x pan-y pinch-zoom;
    scroll-padding:14px;
  }

  body.resinapp-mobile-ux #canvas-viewport > div{
    margin:0 auto!important;
  }

  body.resinapp-mobile-ux #a4-sheet{
    box-shadow:0 12px 34px rgba(15,23,42,.20)!important;
  }

  body.resinapp-mobile-ux .editor-item{
    touch-action:none!important;
  }

  /* Evita zoom automático do iPhone em campos pequenos */
  body.resinapp-mobile-ux input,
  body.resinapp-mobile-ux textarea,
  body.resinapp-mobile-ux select{
    font-size:15px!important;
  }
}

/* ==========================================================
   RESINAPP | MOBILE UX PATCH v8
   Correção dos painéis laterais: menu da esquerda em coluna,
   utilitários empilhados e gavetas sem conteúdo escondido.
========================================================== */

@media (max-width: 860px){
  /* Gavetas com largura mais equilibrada no celular */
  body.resinapp-mobile-ux .ra-mobile-left-panel{
    width:min(82vw, 330px)!important;
    max-width:min(82vw, 330px)!important;
    min-width:250px!important;
    left:0!important;
    overflow:visible!important;
    z-index:2147483200!important;
  }

  body.resinapp-mobile-ux .ra-mobile-right-panel{
    width:min(82vw, 330px)!important;
    max-width:min(82vw, 330px)!important;
    min-width:250px!important;
    right:0!important;
    overflow:visible!important;
    z-index:2147483200!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel[class*="w-0"],
  body.resinapp-mobile-ux .ra-mobile-right-panel[class*="w-0"]{
    width:0!important;
    min-width:0!important;
    max-width:0!important;
    overflow:visible!important;
    box-shadow:none!important;
    border:0!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel > div[class*="w-80"],
  body.resinapp-mobile-ux .ra-mobile-right-panel > div[class*="w-80"]{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:100%!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    background:#fff!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel[class*="w-0"] > div[class*="w-80"],
  body.resinapp-mobile-ux .ra-mobile-right-panel[class*="w-0"] > div[class*="w-80"]{
    width:0!important;
    max-width:0!important;
    overflow:hidden!important;
  }

  /* A aba de categorias da esquerda agora fica uma embaixo da outra */
  body.resinapp-mobile-ux .ra-mobile-left-panel #sidebar-tabs,
  body.resinapp-mobile-ux #sidebar-tabs.ra-mobile-sidebar-tabs{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:7px!important;
    padding:8px 10px!important;
    overflow:visible!important;
    width:100%!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel #sidebar-tabs button,
  body.resinapp-mobile-ux #sidebar-tabs.ra-mobile-sidebar-tabs button{
    width:100%!important;
    min-width:0!important;
    min-height:38px!important;
    height:auto!important;
    padding:8px 10px!important;
    justify-content:flex-start!important;
    text-align:left!important;
    white-space:normal!important;
    line-height:1.15!important;
    font-size:12px!important;
    border-radius:12px!important;
    gap:8px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel #sidebar-tabs button svg,
  body.resinapp-mobile-ux #sidebar-tabs.ra-mobile-sidebar-tabs button svg{
    width:17px!important;
    height:17px!important;
    flex:0 0 17px!important;
  }

  /* Utilitários em coluna para não ficarem escondidos */
  body.resinapp-mobile-ux .ra-mobile-utilities,
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-utilities{
    display:flex!important;
    flex-direction:column!important;
    gap:8px!important;
    width:100%!important;
    padding:8px 10px!important;
    overflow:visible!important;
  }

  body.resinapp-mobile-ux .ra-mobile-utilities > *,
  body.resinapp-mobile-ux .ra-mobile-utilities button,
  body.resinapp-mobile-ux .ra-mobile-utilities a{
    width:100%!important;
    max-width:100%!important;
    min-height:42px!important;
    justify-content:flex-start!important;
    text-align:left!important;
  }

  /* Conteúdo interno da biblioteca com mais respiro e sem corte horizontal */
  body.resinapp-mobile-ux .ra-mobile-left-panel *{
    max-width:100%;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"]{
    overflow:visible!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid-cols-2"]{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid-cols-3"],
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid-cols-4"]{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel input,
  body.resinapp-mobile-ux .ra-mobile-left-panel select,
  body.resinapp-mobile-ux .ra-mobile-left-panel textarea{
    font-size:15px!important;
  }

  /* Ajusta a área central para não herdar largura quebrada quando uma gaveta abre */
  body.resinapp-mobile-ux #canvas-viewport{
    min-width:0!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-x pan-y pinch-zoom!important;
  }

  /* Botões laterais mantidos funcionais, mas com tamanho menos exagerado */
  body.resinapp-mobile-ux button[title="Ocultar Biblioteca"],
  body.resinapp-mobile-ux button[title="Mostrar Biblioteca"],
  body.resinapp-mobile-ux button[title="Ocultar Ajustes"],
  body.resinapp-mobile-ux button[title="Mostrar Ajustes"]{
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    min-height:34px!important;
    max-width:34px!important;
    max-height:34px!important;
    z-index:2147483647!important;
  }

  body.resinapp-mobile-ux button[title="Ocultar Biblioteca"] svg,
  body.resinapp-mobile-ux button[title="Mostrar Biblioteca"] svg,
  body.resinapp-mobile-ux button[title="Ocultar Ajustes"] svg,
  body.resinapp-mobile-ux button[title="Mostrar Ajustes"] svg{
    width:15px!important;
    height:15px!important;
  }
}

/* ==========================================================
   RESINAPP | MOBILE UX PATCH v9
   Correção pontual: biblioteca esquerda rolável e conteúdo da
   aba ativo visível no mobile, sem tocar no login.
========================================================== */

@media (max-width: 860px){
  /* Garante que a gaveta esquerda inteira possa rolar com o dedo */
  body.resinapp-mobile-ux .ra-mobile-left-panel{
    top:0!important;
    bottom:0!important;
    height:100%!important;
    max-height:100%!important;
    overflow:visible!important;
    touch-action:pan-y!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel > div,
  body.resinapp-mobile-ux .ra-mobile-left-panel > div[class*="w-80"]{
    height:100%!important;
    max-height:100%!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    touch-action:pan-y!important;
    padding-bottom:96px!important;
  }

  /* Reduz o topo da biblioteca para sobrar espaço para letras/moldes */
  body.resinapp-mobile-ux .ra-mobile-left-panel #sidebar-tabs,
  body.resinapp-mobile-ux #sidebar-tabs.ra-mobile-sidebar-tabs{
    gap:5px!important;
    padding:6px 9px!important;
    margin:0!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel #sidebar-tabs button,
  body.resinapp-mobile-ux #sidebar-tabs.ra-mobile-sidebar-tabs button{
    min-height:32px!important;
    padding:6px 9px!important;
    font-size:11.5px!important;
    line-height:1.05!important;
    border-radius:11px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel #sidebar-tabs button svg,
  body.resinapp-mobile-ux #sidebar-tabs.ra-mobile-sidebar-tabs button svg{
    width:15px!important;
    height:15px!important;
    flex-basis:15px!important;
  }

  /* Upload selecionado fica menor, sem empurrar o conteúdo para baixo */
  body.resinapp-mobile-ux .ra-mobile-left-panel #sidebar-tabs button[class*="bg-emerald"],
  body.resinapp-mobile-ux .ra-mobile-left-panel #sidebar-tabs button[class*="text-emerald"],
  body.resinapp-mobile-ux #sidebar-tabs.ra-mobile-sidebar-tabs button[class*="bg-emerald"],
  body.resinapp-mobile-ux #sidebar-tabs.ra-mobile-sidebar-tabs button[class*="text-emerald"]{
    min-height:34px!important;
  }

  /* Utilitários empilhados, mas mais compactos */
  body.resinapp-mobile-ux .ra-mobile-utilities,
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-utilities{
    gap:6px!important;
    padding:6px 10px 8px!important;
    margin:0!important;
  }

  body.resinapp-mobile-ux .ra-mobile-utilities > *,
  body.resinapp-mobile-ux .ra-mobile-utilities button,
  body.resinapp-mobile-ux .ra-mobile-utilities a{
    min-height:34px!important;
    padding-top:6px!important;
    padding-bottom:6px!important;
    font-size:11.5px!important;
    border-radius:12px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="APOIO"],
  body.resinapp-mobile-ux .ra-mobile-left-panel h3,
  body.resinapp-mobile-ux .ra-mobile-left-panel h4{
    margin-top:8px!important;
    margin-bottom:6px!important;
  }

  /* Área da aba ativa: rolagem independente quando o React usa div interna */
  body.resinapp-mobile-ux .ra-mobile-left-panel aside,
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="overflow-y-auto"],
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="overflow-auto"]{
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    touch-action:pan-y!important;
  }

  /* Cartões das letras/moldes mais compactos para aparecerem mais cedo */
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"]{
    gap:7px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > button,
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > div{
    min-width:0!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] button{
    min-height:64px!important;
  }

  /* Mantém os botões de recolher funcionando e sem exagero */
  body.resinapp-mobile-ux button[title="Ocultar Biblioteca"],
  body.resinapp-mobile-ux button[title="Mostrar Biblioteca"],
  body.resinapp-mobile-ux button[title="Ocultar Ajustes"],
  body.resinapp-mobile-ux button[title="Mostrar Ajustes"]{
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    min-height:34px!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
  }
}

/* ==========================================================
   RESINAPP | MOBILE UX PATCH v10
   Ajuste pontual: abas menores + cards/moldes/uploads maiores.
   Não atua no login. Não altera dados, backend, projetos ou webhooks.
========================================================== */

@media (max-width: 860px){
  /* Gaveta esquerda um pouco mais larga para mostrar melhor os moldes/uploads */
  body.resinapp-mobile-ux .ra-mobile-left-panel{
    width:min(88vw, 356px)!important;
    max-width:min(88vw, 356px)!important;
    min-width:286px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel > div,
  body.resinapp-mobile-ux .ra-mobile-left-panel > div[class*="w-80"]{
    width:100%!important;
    max-width:100%!important;
    padding-bottom:120px!important;
  }

  /* Abinhas mais compactas para sobrar espaço útil */
  body.resinapp-mobile-ux .ra-mobile-left-panel #sidebar-tabs,
  body.resinapp-mobile-ux #sidebar-tabs.ra-mobile-sidebar-tabs{
    gap:3px!important;
    padding:4px 7px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel #sidebar-tabs button,
  body.resinapp-mobile-ux #sidebar-tabs.ra-mobile-sidebar-tabs button{
    min-height:26px!important;
    padding:4px 7px!important;
    font-size:10px!important;
    line-height:1.02!important;
    border-radius:9px!important;
    gap:5px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel #sidebar-tabs button svg,
  body.resinapp-mobile-ux #sidebar-tabs.ra-mobile-sidebar-tabs button svg{
    width:13px!important;
    height:13px!important;
    flex:0 0 13px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel #sidebar-tabs button[class*="bg-emerald"],
  body.resinapp-mobile-ux .ra-mobile-left-panel #sidebar-tabs button[class*="text-emerald"],
  body.resinapp-mobile-ux #sidebar-tabs.ra-mobile-sidebar-tabs button[class*="bg-emerald"],
  body.resinapp-mobile-ux #sidebar-tabs.ra-mobile-sidebar-tabs button[class*="text-emerald"]{
    min-height:28px!important;
  }

  /* Utilitários compactos e em coluna */
  body.resinapp-mobile-ux .ra-mobile-utilities,
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-utilities{
    gap:4px!important;
    padding:4px 8px 6px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-utilities > *,
  body.resinapp-mobile-ux .ra-mobile-utilities button,
  body.resinapp-mobile-ux .ra-mobile-utilities a{
    min-height:30px!important;
    padding:5px 7px!important;
    font-size:10px!important;
    line-height:1.05!important;
    border-radius:10px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-utilities svg,
  body.resinapp-mobile-ux .ra-mobile-utilities img{
    width:16px!important;
    height:16px!important;
  }

  /* Títulos e textos menores para não empurrar os moldes para baixo */
  body.resinapp-mobile-ux .ra-mobile-left-panel h2,
  body.resinapp-mobile-ux .ra-mobile-left-panel h3,
  body.resinapp-mobile-ux .ra-mobile-left-panel h4{
    font-size:11px!important;
    line-height:1.08!important;
    margin-top:6px!important;
    margin-bottom:5px!important;
    letter-spacing:.04em!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel p,
  body.resinapp-mobile-ux .ra-mobile-left-panel small,
  body.resinapp-mobile-ux .ra-mobile-left-panel span{
    font-size:10.5px!important;
  }

  /* Grids da biblioteca: cards maiores, melhor visualização dos moldes e uploads */
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid-cols-2"],
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid-cols-3"],
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid-cols-4"]{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }

  /* Cards clicáveis de moldes/uploads */
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > button,
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > div,
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > article{
    min-height:112px!important;
    padding:8px!important;
    border-radius:14px!important;
  }

  /* Área visual interna dos cards */
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > button > div,
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > div > div,
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > article > div{
    min-height:62px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] img,
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] svg{
    max-width:72px!important;
    max-height:72px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] img{
    object-fit:contain!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > button span,
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > div span,
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > article span,
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > button p,
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > div p,
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > article p{
    font-size:10.5px!important;
    line-height:1.08!important;
  }

  /* Quando for letra simples, deixa ela maior e mais legível */
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > button,
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > div{
    font-size:20px!important;
  }

  /* Evita que a folha/canvas cubra a lista quando a gaveta está aberta */
  body.resinapp-mobile-ux .ra-mobile-left-panel{
    box-shadow:12px 0 30px rgba(15,23,42,.12)!important;
  }
}

/* ==========================================================
   RESINAPP | MOBILE UX PATCH v11
   Ajuste pontual: melhor visualização dos uploads/moldes na
   gaveta esquerda e bloqueio do botão de excluir no mobile.
   Não atua no login. Não altera dados, backend, projetos ou webhooks.
========================================================== */

@media (max-width: 860px){
  /* Abas e utilitários ainda mais compactos para sobrar espaço visual */
  body.resinapp-mobile-ux .ra-mobile-left-panel #sidebar-tabs,
  body.resinapp-mobile-ux #sidebar-tabs.ra-mobile-sidebar-tabs{
    gap:2px!important;
    padding:3px 6px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel #sidebar-tabs button,
  body.resinapp-mobile-ux #sidebar-tabs.ra-mobile-sidebar-tabs button{
    min-height:24px!important;
    padding:3px 6px!important;
    font-size:9.5px!important;
    line-height:1!important;
    border-radius:8px!important;
    gap:4px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel #sidebar-tabs button svg,
  body.resinapp-mobile-ux #sidebar-tabs.ra-mobile-sidebar-tabs button svg{
    width:12px!important;
    height:12px!important;
    flex:0 0 12px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-utilities,
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-utilities{
    gap:3px!important;
    padding:3px 8px 5px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-utilities > *,
  body.resinapp-mobile-ux .ra-mobile-utilities button,
  body.resinapp-mobile-ux .ra-mobile-utilities a{
    min-height:28px!important;
    padding:4px 7px!important;
    font-size:9.8px!important;
    line-height:1!important;
    border-radius:9px!important;
  }

  /* Uploads: thumbnails maiores, sem botão de excluir aparecendo por toque acidental */
  body.resinapp-mobile-ux .ra-mobile-left-panel #uploads-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    padding:2px 2px 18px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel #uploads-grid > div,
  body.resinapp-mobile-ux .ra-mobile-left-panel #uploads-grid > button,
  body.resinapp-mobile-ux .ra-mobile-left-panel #uploads-grid > article{
    aspect-ratio:1/1!important;
    min-height:128px!important;
    height:auto!important;
    padding:0!important;
    border-radius:16px!important;
    overflow:hidden!important;
    background:#fff!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel #uploads-grid button[title="Inserir ou aplicar imagem"]{
    padding:0!important;
    width:100%!important;
    height:100%!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:hidden!important;
    background:#fff!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel #uploads-grid img{
    width:100%!important;
    height:100%!important;
    min-width:100%!important;
    min-height:100%!important;
    max-width:none!important;
    max-height:none!important;
    object-fit:cover!important;
    object-position:center!important;
    border-radius:14px!important;
    transform:none!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel #uploads-grid button[title="Remover"],
  body.resinapp-mobile-ux .ra-mobile-left-panel #uploads-grid button[aria-label*="Remover"],
  body.resinapp-mobile-ux .ra-mobile-left-panel #uploads-grid button[aria-label*="Excluir"]{
    display:none!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }

  /* Moldes personalizados: imagem maior e texto menor */
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list > div,
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list > button,
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list > article{
    min-height:126px!important;
    padding:7px!important;
    border-radius:16px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list img,
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list svg{
    max-width:94px!important;
    max-height:94px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list p,
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list span{
    font-size:9.8px!important;
    line-height:1.05!important;
  }

  /* Letras e moldes gerais: melhora visual sem mexer na lógica */
  body.resinapp-mobile-ux .ra-mobile-left-panel [id*="letters"],
  body.resinapp-mobile-ux .ra-mobile-left-panel [id*="molds"]{
    overflow:visible!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > button,
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > div,
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > article{
    border-radius:15px!important;
  }
}

/* ==========================================================
   RESINAPP | MOBILE UX PATCH v12
   Ajuste pontual da aba lateral direita no mobile.
   Diminui fonte/espaçamentos e evita elementos vazarem para fora.
   Não atua no login. Não altera dados, backend, projetos ou webhooks.
========================================================== */

@media (max-width: 860px){
  /* Painel direito mais legível e sem vazamento horizontal */
  body.resinapp-mobile-ux .ra-mobile-right-panel,
  body.resinapp-mobile-ux .ra-mobile-right-panel *{
    box-sizing:border-box!important;
  }

  body.resinapp-mobile-ux .ra-mobile-right-panel{
    width:min(78vw, 300px)!important;
    max-width:min(78vw, 300px)!important;
    min-width:236px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-right-panel > div,
  body.resinapp-mobile-ux .ra-mobile-right-panel > div[class*="w-80"]{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    padding-left:10px!important;
    padding-right:10px!important;
    padding-bottom:92px!important;
  }

  /* Fontes menores na aba direita */
  body.resinapp-mobile-ux .ra-mobile-right-panel{
    font-size:11px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-right-panel h1,
  body.resinapp-mobile-ux .ra-mobile-right-panel h2,
  body.resinapp-mobile-ux .ra-mobile-right-panel h3,
  body.resinapp-mobile-ux .ra-mobile-right-panel h4,
  body.resinapp-mobile-ux .ra-mobile-right-panel [class*="text-xl"],
  body.resinapp-mobile-ux .ra-mobile-right-panel [class*="text-lg"]{
    font-size:13px!important;
    line-height:1.12!important;
    letter-spacing:.02em!important;
    margin-top:6px!important;
    margin-bottom:6px!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  body.resinapp-mobile-ux .ra-mobile-right-panel p,
  body.resinapp-mobile-ux .ra-mobile-right-panel span,
  body.resinapp-mobile-ux .ra-mobile-right-panel label,
  body.resinapp-mobile-ux .ra-mobile-right-panel small,
  body.resinapp-mobile-ux .ra-mobile-right-panel div{
    font-size:11px!important;
    line-height:1.18!important;
  }

  body.resinapp-mobile-ux .ra-mobile-right-panel [class*="text-xs"]{
    font-size:9.5px!important;
    line-height:1.12!important;
  }

  body.resinapp-mobile-ux .ra-mobile-right-panel [class*="text-sm"]{
    font-size:10.5px!important;
    line-height:1.15!important;
  }

  body.resinapp-mobile-ux .ra-mobile-right-panel [class*="font-bold"],
  body.resinapp-mobile-ux .ra-mobile-right-panel [class*="font-semibold"]{
    line-height:1.12!important;
  }

  /* Inputs e botões cabendo dentro da tela */
  body.resinapp-mobile-ux .ra-mobile-right-panel input,
  body.resinapp-mobile-ux .ra-mobile-right-panel select,
  body.resinapp-mobile-ux .ra-mobile-right-panel textarea,
  body.resinapp-mobile-ux .ra-mobile-right-panel button{
    max-width:100%!important;
    min-width:0!important;
    font-size:15px!important; /* mantém 16px para evitar zoom automático do iPhone */
  }

  body.resinapp-mobile-ux .ra-mobile-right-panel button{
    font-size:10.5px!important;
    line-height:1.1!important;
    padding:6px 7px!important;
    min-height:32px!important;
    border-radius:9px!important;
    white-space:normal!important;
  }

  body.resinapp-mobile-ux .ra-mobile-right-panel input[type="color"]{
    min-width:36px!important;
    width:36px!important;
    height:34px!important;
    padding:2px!important;
    flex:0 0 36px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-right-panel input[type="range"]{
    width:100%!important;
    max-width:100%!important;
  }

  /* Grades e linhas de botões não vazam para fora */
  body.resinapp-mobile-ux .ra-mobile-right-panel [class*="grid-cols-2"],
  body.resinapp-mobile-ux .ra-mobile-right-panel [class*="grid-cols-3"],
  body.resinapp-mobile-ux .ra-mobile-right-panel [class*="grid-cols-4"]{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:6px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-right-panel [class*="gap-4"],
  body.resinapp-mobile-ux .ra-mobile-right-panel [class*="gap-3"]{
    gap:6px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-right-panel [class*="p-4"]{
    padding:10px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-right-panel [class*="p-3"]{
    padding:8px!important;
  }

  body.resinapp-mobile-ux .ra-mobile-right-panel [class*="space-y-4"] > :not([hidden]) ~ :not([hidden]),
  body.resinapp-mobile-ux .ra-mobile-right-panel [class*="space-y-3"] > :not([hidden]) ~ :not([hidden]){
    margin-top:8px!important;
  }

  /* Seções/cards da direita mais compactos */
  body.resinapp-mobile-ux .ra-mobile-right-panel [class*="rounded"],
  body.resinapp-mobile-ux .ra-mobile-right-panel [class*="border"]{
    max-width:100%!important;
  }

  body.resinapp-mobile-ux .ra-mobile-right-panel .flex{
    min-width:0!important;
    max-width:100%!important;
  }

  body.resinapp-mobile-ux .ra-mobile-right-panel .flex > *{
    min-width:0!important;
  }

  /* Evita textos grandes como nome do item saírem para fora */
  body.resinapp-mobile-ux .ra-mobile-right-panel [class*="uppercase"],
  body.resinapp-mobile-ux .ra-mobile-right-panel [class*="tracking"]{
    letter-spacing:.04em!important;
  }
}

/* ==========================================================
   RESINAPP | MOBILE UX PATCH v16
   X menor e colado dentro do item selecionado no mobile.
   Não atua no login e não altera dados salvos.
========================================================== */

@media (max-width: 860px){
  body.resinapp-mobile-ux #canvas-viewport{
    padding:18px 18px 90px 18px!important;
    scroll-padding:18px!important;
  }

  body.resinapp-mobile-ux .editor-item{
    overflow:visible!important;
  }

  body.resinapp-mobile-ux .editor-item > .ra-mobile-delete-selected-item{
    position:absolute!important;
    top:-9px!important;
    right:-9px!important;
    width:20px!important;
    height:20px!important;
    min-width:20px!important;
    min-height:20px!important;
    max-width:20px!important;
    max-height:20px!important;
    border-radius:999px!important;
    border:2px solid #ffffff!important;
    background:#ef4444!important;
    color:#ffffff!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    font-size:13px!important;
    line-height:1!important;
    font-weight:900!important;
    z-index:999999!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
    box-shadow:0 5px 12px rgba(239,68,68,.32)!important;
    cursor:pointer!important;
    -webkit-tap-highlight-color:transparent!important;
    user-select:none!important;
    transform:none!important;
    padding:0!important;
  }

  body.resinapp-mobile-ux .editor-item > .ra-mobile-delete-selected-item:active{
    transform:scale(.92)!important;
  }
}

/* ==========================================================
   RESINAPP | MOBILE UX PATCH v17
   Ajuste fino: X colado aos handles, moldes salvos visíveis
   e categorias de Formatos/Moldes com fonte correta.
========================================================== */
@media (max-width: 860px){
  /* X agora é flutuante calculado pelos handles reais, menor e sem ficar longe */
  body.resinapp-mobile-ux .editor-item > .ra-mobile-delete-selected-item{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }
  body.resinapp-mobile-ux body > .ra-mobile-delete-selected-item,
  body.resinapp-mobile-ux .ra-mobile-delete-selected-item.ra-mobile-delete-floating{
    position:fixed!important;
    width:18px!important;
    height:18px!important;
    min-width:18px!important;
    min-height:18px!important;
    max-width:18px!important;
    max-height:18px!important;
    border-radius:999px!important;
    border:2px solid #fff!important;
    background:#ef4444!important;
    color:#fff!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    font-size:12px!important;
    line-height:1!important;
    font-weight:900!important;
    z-index:2147483647!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
    box-shadow:0 5px 12px rgba(239,68,68,.30)!important;
    cursor:pointer!important;
    padding:0!important;
    margin:0!important;
    transform:none!important;
    -webkit-tap-highlight-color:transparent!important;
    user-select:none!important;
  }

  /* Regra geral: textos de cards não ficam gigantes */
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > button,
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > div,
  body.resinapp-mobile-ux .ra-mobile-left-panel [class*="grid"] > article{
    font-size:11.5px!important;
  }
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-letter-grid > button,
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-letter-grid > div,
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-letter-grid > article{
    font-size:20px!important;
    font-weight:800!important;
  }
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-format-grid > button,
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-format-grid > div,
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-format-grid > article{
    font-size:11px!important;
    line-height:1.08!important;
    min-height:86px!important;
    padding:7px!important;
    text-align:center!important;
    overflow:hidden!important;
  }
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-format-grid > button span,
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-format-grid > div span,
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-format-grid > article span,
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-format-grid > button p,
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-format-grid > div p,
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-format-grid > article p{
    font-size:10px!important;
    line-height:1.06!important;
    max-width:100%!important;
  }

  /* Meus moldes salvos: lixeira pequena no canto e molde aparecendo */
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    padding:4px 4px 22px!important;
    overflow:visible!important;
  }
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list > div,
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list > button,
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list > article{
    position:relative!important;
    min-height:126px!important;
    height:auto!important;
    padding:8px 6px 9px!important;
    border-radius:16px!important;
    overflow:hidden!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    background:#fff!important;
  }
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list button[title*="Remover"],
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list button[aria-label*="Remover"],
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list button[aria-label*="Excluir"]{
    position:absolute!important;
    top:5px!important;
    right:5px!important;
    left:auto!important;
    bottom:auto!important;
    width:22px!important;
    height:22px!important;
    min-width:22px!important;
    min-height:22px!important;
    max-width:22px!important;
    max-height:22px!important;
    padding:0!important;
    border-radius:8px!important;
    background:rgba(255,255,255,.94)!important;
    color:#6b7280!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    z-index:5!important;
    box-shadow:0 2px 8px rgba(15,23,42,.12)!important;
  }
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list button[title*="Remover"] svg,
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list button[aria-label*="Remover"] svg,
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list button[aria-label*="Excluir"] svg{
    width:13px!important;
    height:13px!important;
    max-width:13px!important;
    max-height:13px!important;
  }
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list img,
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list svg{
    max-width:82px!important;
    max-height:82px!important;
    width:auto!important;
    height:auto!important;
    object-fit:contain!important;
    opacity:1!important;
    visibility:visible!important;
  }
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list p,
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list span{
    font-size:9.5px!important;
    line-height:1.05!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
}

/* ==========================================================
   RESINAPP | MOBILE UX PATCH v18
   Correção final: X nunca fica por cima das abas/painéis e
   lixeira de Meus Moldes Salvos não cobre a miniatura no mobile.
========================================================== */
@media (max-width: 860px){
  /* O X fica abaixo das gavetas laterais; se a gaveta abrir, ela passa por cima dele. */
  body.resinapp-mobile-ux .ra-mobile-delete-selected-item.ra-mobile-delete-floating{
    z-index:2147482500!important;
    width:17px!important;
    height:17px!important;
    min-width:17px!important;
    min-height:17px!important;
    max-width:17px!important;
    max-height:17px!important;
    font-size:11px!important;
    box-shadow:0 4px 10px rgba(239,68,68,.26)!important;
  }

  /* Em Meus Moldes Salvos, remove a lixeira da frente da miniatura no mobile. */
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list button[title*="Remover"],
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list button[aria-label*="Remover"],
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list button[aria-label*="Excluir"]{
    display:none!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }

  /* Miniatura dos moldes salvos mais visível e sem corte agressivo. */
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list > div,
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list > button,
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list > article{
    padding:7px 5px 8px!important;
    justify-content:space-between!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list img,
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list svg{
    max-width:96px!important;
    max-height:92px!important;
    object-fit:contain!important;
  }
}


/* ==========================================================
   RESINAPP | MOBILE UX PATCH v19
   Correção definitiva: apenas 1 X, sem piscar, sem passar por
   cima das abas, moldes salvos sem lixeira na frente.
========================================================== */
@media (max-width: 860px){
  /* Remove visualmente qualquer X antigo preso dentro do item */
  body.resinapp-mobile-ux .editor-item > .ra-mobile-delete-selected-item,
  body.resinapp-mobile-ux .editor-item > .ra-mobile-delete-floating{
    display:none!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }

  /* X único do patch v19 */
  body.resinapp-mobile-ux #ra-mobile-delete-x-v19{
    position:fixed!important;
    width:17px!important;
    height:17px!important;
    min-width:17px!important;
    min-height:17px!important;
    max-width:17px!important;
    max-height:17px!important;
    border-radius:999px!important;
    border:2px solid #fff!important;
    background:#ef4444!important;
    color:#fff!important;
    display:none;
    align-items:center!important;
    justify-content:center!important;
    font-size:11px!important;
    line-height:1!important;
    font-weight:900!important;
    z-index:2147482400!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
    box-shadow:0 4px 10px rgba(239,68,68,.26)!important;
    cursor:pointer!important;
    padding:0!important;
    margin:0!important;
    transform:none!important;
    -webkit-tap-highlight-color:transparent!important;
    user-select:none!important;
  }

  /* Painéis ficam acima do X; quando abrirem, o JS também esconde o X */
  body.resinapp-mobile-ux .ra-mobile-left-panel,
  body.resinapp-mobile-ux .ra-mobile-right-panel{
    z-index:2147483200!important;
  }

  /* Meus moldes salvos: qualquer botão pequeno de lixeira fica escondido no mobile */
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list .ra-mobile-custom-trash-hidden,
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list button[title*="Remover"],
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list button[title*="Excluir"],
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list button[aria-label*="Remover"],
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list button[aria-label*="Excluir"],
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list button[aria-label*="remover"],
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list button[aria-label*="excluir"]{
    display:none!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list > div,
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list > button,
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list > article{
    overflow:hidden!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list img,
  body.resinapp-mobile-ux .ra-mobile-left-panel #custom-molds-list svg:not(button svg){
    max-width:100px!important;
    max-height:92px!important;
    object-fit:contain!important;
  }

  /* Formatos e Moldes: categorias legíveis, não gigantes */
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-format-grid > *,
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-format-grid button,
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-format-grid div{
    font-size:11px!important;
    line-height:1.08!important;
  }

  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-format-grid h3,
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-format-grid p,
  body.resinapp-mobile-ux .ra-mobile-left-panel .ra-mobile-format-grid span{
    font-size:10.5px!important;
    line-height:1.06!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
}
