#obgMovable_app-container {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
#obgMovable_chart-and-editor-container {
    position: relative;
    width: 100%;
    height: 600px;
    display: flex;
    justify-content: center;
    align-items: center;
}
#grafico-apex {
    width: 100%;
    height: 100%;
}


#obgMovable_chart-container {
    position: relative; /* Importante para posicionamento absoluto dos filhos */
    width: 100%;
    height: 100%;
    overflow: auto; /* Permite scroll se o conteúdo for maior que o container */
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #f5f5f5; /* Opcional - apenas para visualização */
}

#obgMovable_grafico-container {
    position: relative; /* Para os elementos moveable ficarem relativos a este container */
    margin: auto; /* Centraliza o container do gráfico */
    max-width: 100%;
    max-height: 100%;
    overflow: visible; /* Permite que os elementos moveable saiam dos limites se necessário */
}

#grafico-apex {
    width: 100%;
    height: 100%;
    display: block;
}
/* Mantenha todos os outros estilos do código original aqui */
.obgMovable_text-style-btn {
    padding: 5px 10px;
    margin-right: 5px;
    font-weight: bold;
    cursor: pointer;
    border: 1px solid #ccc;
    background: #f0f0f0;
}


.obgMovable_floating-circle {
    border-radius: 50%;
    width: 100px;
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.obgMovable_floating-line {
    position: absolute;
    height: 0;
    transform-origin: left center;
    pointer-events: auto;
    border-top: 2px solid #000;
}
.obgMovable_floating-line::after {
    content: "";
    position: absolute;
    top: -10px;
    bottom: -10px;
    left: 0;
    right: 0;
    background: transparent;
}
.obgMovable_editable-box {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    word-wrap: break-word;
    overflow: hidden;
    cursor: move;
    white-space: pre-wrap;
    padding: 5px;
}

.obgMovable_editable-box.obgMovable_editing {
    cursor: text;
    outline: none;
    user-select: text;
    background-color: rgba(255, 255, 255, 0.9) !important;
    /*box-shadow: 0 0 0 2px #4a90e2;*/
    z-index: 1000;
    display: flex;
    overflow: auto;
}
.obgMovable_text-left {
    text-align: left;
    justify-content: flex-start;
}
.obgMovable_text-center {
    text-align: center;
    justify-content: center;
}
.obgMovable_text-right {
    text-align: right;
    justify-content: flex-end;
}
.obgMovable_text-justify {
    text-align: justify;
    justify-content: center;
}
.obgMovable_moveable-control {
    pointer-events: all;
}

.obgMovable_control-group {
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid #eee;
}
.obgMovable_control-group h3 {
    margin-top: 0;
    color: #333;
}
.obgMovable_form-row {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}
.obgMovable_form-row label {
    width: 100px;
    font-size: 14px;
}
.obgMovable_form-row input, .obgMovable_form-row select {
    flex: 1;
    padding: 5px;
}
#obgMovable_text-bold, #obgMovable_text-italic, #obgMovable_text-underline {
    padding: 5px 10px;
    margin-right: 5px;
    cursor: pointer;
    border: 1px solid #ccc;
    background: #f0f0f0;
}

#obgMovable_text-bold.active {
    font-weight: bold;
    background: #ddd;
}

#obgMovable_text-italic.active {
    font-style: italic;
    background: #ddd;
}

#obgMovable_text-underline.active {
    text-decoration: underline;
    background: #ddd;
}
.obgMovable_button {
    padding: 3px 10px;
    background: #ffffff;
    color: black;
    border: 1;
    border-color: #ccc;
    border-radius: 4px;
    cursor: pointer;
    margin-right: 10px;
}
.obgMovable_button:hover {
    background: #ff9d9d;
}

.obgMovable_button2 {
    padding: 0px 5px;
    background: #ffffff;
    color: black;
    border: 1;
    border-color: #ccc;
    border-radius: 4px;
    cursor: pointer;
    margin-left: 10px;
}
.obgMovable_button2:hover {
    background: #ffe3b3;
}

.obgMovable_border-inset {
    border: var(--obgMovable_border-width) var(--obgMovable_border-style) var(--obgMovable_border-color) !important;
    box-shadow: none !important;
    box-sizing: border-box;
}


/* Estilo normal (durante edição) */
.obgMovable_floating-box {
    position: absolute;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden; /* Mantém hidden durante edição */
    cursor: move;
}

.obgMovable_floating-box .obgMovable_editing {
    user-select: text; /* Permite seleção de texto durante edição */
    cursor: text; /* Mostra cursor de texto durante edição */
}

/* Garante que as bordas sejam aplicadas corretamente */
.obgMovable_floating-box:not(.obgMovable_floating-line) {
    border: var(--obgMovable_border-width, 1px) var(--obgMovable_border-style, solid) var(--obgMovable_border-color, #000);
}

/* Garante que o texto seja visível mesmo durante edições */
.obgMovable-content-wrapper {
    width: 100%;
    height: 100%;
    padding: 5px;
    word-break: break-word;
    white-space: pre-wrap;
    overflow: hidden; /* Sempre mantém hidden */
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    transform-origin: center center;
}


/* Adicione isso para garantir que os previews de cor sejam visíveis */
#obgMovable_fill-preview, #obgMovable_border-preview {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-left: 5px;
    border: 1px solid #ccc;
    vertical-align: middle;
}


.obgMovable-textarea-edit {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    resize: none;
    border: 1px dashed #999;
    background: rgba(255,255,255,0.9);
    font: inherit;
    color: inherit;
    text-align: inherit;
    padding: 5px;
    margin: 0;
    outline: none;
    overflow: auto;
    white-space: pre-wrap;
}
.obgMovable_mix-box svg {
    width: 100%;
    height: 100%;
    display: block;
  }
  .obgMovable-mix-icon {
    width: 20px;
    height: 20px;
    pointer-events: none; /* Permite clicar no botão */
  }
  
  .obgMovable_mix-box {
    position: absolute;
    overflow: hidden;
}

.obgMovable_mix-box > div {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.obgMovable_mix-box {
    position: absolute;
    overflow: hidden;
}

.obgMovable_mix-box img {
    width: 100%;
    height: 100%;
    object-fit: contain; /* Mantém proporção dentro do container */
    pointer-events: none;
}

.floatingSVGBotao {
    display: flex;
    max-width: 35px;
    max-height: 35px;
    justify-content: center;
    align-items: center;
    color: white;
    border: none;
    cursor: pointer;
    width: 100%;
    height: 100%;
}

  
.floatingSVGBotao:hover {
background: #4096ff;
border: 1px solid #eee;
border-radius: 5px;
box-shadow: 5px 5px 5px #eee;
text-shadow: none;
}