.elementor-widget-container .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-container .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-180 .elementor-element.elementor-element-409d4d9{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-180 .elementor-element.elementor-element-618c5bf{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--align-items:center;}.elementor-widget-theme-site-logo .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-theme-site-logo .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-theme-site-logo .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-180 .elementor-element.elementor-element-68afb91{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;}.elementor-widget-nav-menu .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-nav-menu .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-nav-menu .elementor-nav-menu .elementor-item{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-text );fill:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:hover,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.elementor-item-active,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item.highlighted,
					.elementor-widget-nav-menu .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-accent );fill:var( --e-global-color-accent );}.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:before,
					.elementor-widget-nav-menu .elementor-nav-menu--main:not(.e--pointer-framed) .elementor-item:after{background-color:var( --e-global-color-accent );}.elementor-widget-nav-menu .e--pointer-framed .elementor-item:before,
					.elementor-widget-nav-menu .e--pointer-framed .elementor-item:after{border-color:var( --e-global-color-accent );}.elementor-widget-nav-menu{--e-nav-menu-divider-color:var( --e-global-color-text );}.elementor-widget-nav-menu .elementor-nav-menu--dropdown .elementor-item, .elementor-widget-nav-menu .elementor-nav-menu--dropdown  .elementor-sub-item{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-180 .elementor-element.elementor-element-be7eb87 .elementor-menu-toggle{margin:0 auto;}.elementor-180 .elementor-element.elementor-element-bf973e6{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-widget-heading .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-heading .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-180 .elementor-element.elementor-element-d0866d1{text-align:center;}.elementor-180 .elementor-element.elementor-element-d0866d1 .elementor-heading-title{font-family:"Roboto", Sans-serif;font-weight:600;color:var( --e-global-color-accent );}.elementor-widget-text-editor .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-text-editor .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-180 .elementor-element.elementor-element-ad9d3f6{text-align:center;}.elementor-180 .elementor-element.elementor-element-82248f2{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-widget-html .eael-protected-content-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-html .protected-content-error-msg{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-180 .elementor-element.elementor-element-22641df:hover{background-color:#E4E4E4;}.elementor-180 .elementor-element.elementor-element-22641df{box-shadow:0px 0px 10px 0px rgba(0,0,0,0.5);}.elementor-180 .elementor-element.elementor-element-209a0ba.elementor-element{--align-self:flex-end;}:root{--page-title-display:none;}@media(max-width:767px){.elementor-180 .elementor-element.elementor-element-409d4d9{--width:100%;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:space-between;}.elementor-180 .elementor-element.elementor-element-618c5bf{--width:150px;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;}.elementor-180 .elementor-element.elementor-element-68afb91{--width:50%;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}}@media(min-width:768px){.elementor-180 .elementor-element.elementor-element-409d4d9{--width:90%;}.elementor-180 .elementor-element.elementor-element-618c5bf{--width:20%;}.elementor-180 .elementor-element.elementor-element-68afb91{--width:100%;}.elementor-180 .elementor-element.elementor-element-bf973e6{--width:80%;}.elementor-180 .elementor-element.elementor-element-82248f2{--width:80%;}}/* Start custom CSS for html, class: .elementor-element-22641df *//* Common styling for HTML Formatter textareas */
#html-input,
#html-output {
  width: 100%;
  min-height: 225px; /* 15 rows × 15px */
  height: 225px;
  padding: 12px 14px;
  font-family: Consolas, Monaco, "Courier New", monospace;
  font-size: 14px;
  line-height: 15px; /* Each row height = 15px */
  background-color: #f9fafb;
  color: #1f2937;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  resize: vertical;
  outline: none;
  box-sizing: border-box;
  white-space: pre;
  overflow: auto;
}

/* Focus effect */
#html-input:focus,
#html-output:focus {
  border-color: #ec4899;
  box-shadow: 0 0 0 2px rgba(236, 72, 153, 0.2);
}

/* Readonly output styling */
#html-output {
  background-color: #f3f4f6;
  cursor: text;
}

/* Placeholder styling */
#html-input::placeholder {
  color: #9ca3af;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-209a0ba *//* ===========================
   Tool Container
=========================== */
.tool-wrapper {
  max-width: 1100px;
  margin: 0 auto;
}

/* ===========================
   Textareas (Input & Output)
=========================== */
#js-input,
#js-output {
  width: 100%;
  min-height: 240px;
  height: 240px;
  padding: 14px 16px;
  font-family: Consolas, Monaco, "Courier New", monospace;
  font-size: 14px;
  line-height: 15px; /* row height = 15px */
  background-color: #f9fafb;
  color: #111827;
  border: 1px solid #d1d5db;
  border-radius: 8px;
  resize: vertical;
  box-sizing: border-box;
  white-space: pre;
  overflow: auto;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

/* Focus state */
#js-input:focus,
#js-output:focus {
  border-color: #2563eb;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.2);
  outline: none;
}

/* Output box subtle difference */
#js-output {
  background-color: #f3f4f6;
}

/* ===========================
   Buttons Wrapper
=========================== */
.tool-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 14px 0;
}

/* ===========================
   Buttons (Common)
=========================== */
.tool-actions button {
  padding: 10px 18px;
  font-size: 14px;
  font-weight: 600;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.2s ease;
}

/* Beautify Button */
#beautify-js {
  background-color: #2563eb;
  color: #ffffff;
}
#beautify-js:hover {
  background-color: #1d4ed8;
}

/* Minify Button */
#minify-js {
  background-color: #0f766e;
  color: #ffffff;
}
#minify-js:hover {
  background-color: #115e59;
}

/* Copy Button */
#copy-js {
  background-color: #6b7280;
  color: #ffffff;
}
#copy-js:hover {
  background-color: #4b5563;
}

/* Clear Button */
#clear-js {
  background-color: #ef4444;
  color: #ffffff;
}
#clear-js:hover {
  background-color: #dc2626;
}

/* ===========================
   Labels
=========================== */
.tool-label {
  font-size: 13px;
  font-weight: 600;
  color: #374151;
  margin-bottom: 6px;
  display: block;
}

/* ===========================
   Responsive Adjustments
=========================== */
@media (max-width: 768px) {
  #js-input,
  #js-output {
    min-height: 200px;
    height: 200px;
  }

  .tool-actions {
    flex-direction: column;
  }

  .tool-actions button {
    width: 100%;
  }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-4c0a95e *//* Common styling for HTML Formatter textareas */
#html-input,
#html-output {
  width: 100%;
  min-height: 225px; /* 15 rows × 15px */
  height: 225px;
  padding: 12px 14px;
  font-family: Consolas, Monaco, "Courier New", monospace;
  font-size: 14px;
  line-height: 15px; /* Each row height = 15px */
  background-color: #f9fafb;
  color: #1f2937;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  resize: vertical;
  outline: none;
  box-sizing: border-box;
  white-space: pre;
  overflow: auto;
}

/* Focus effect */
#html-input:focus,
#html-output:focus {
  border-color: #ec4899;
  box-shadow: 0 0 0 2px rgba(236, 72, 153, 0.2);
}

/* Readonly output styling */
#html-output {
  background-color: #f3f4f6;
  cursor: text;
}

/* Placeholder styling */
#html-input::placeholder {
  color: #9ca3af;
}/* End custom CSS */