.elementor-1683 .elementor-element.elementor-element-afc06e9{--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-1683 .elementor-element.elementor-element-9ef8bef{--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-1683 .elementor-element.elementor-element-b053e87{--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-1683 .elementor-element.elementor-element-b6e2c24{--display:flex;}.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-1683 .elementor-element.elementor-element-d2fe2e6{width:var( --container-widget-width, 60% );max-width:60%;--container-widget-width:60%;--container-widget-flex-grow:0;text-align:left;}.elementor-1683 .elementor-element.elementor-element-d2fe2e6 .elementor-heading-title{font-family:"Roboto", Sans-serif;font-size:16px;font-weight:700;color:#000000;}.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-1683 .elementor-element.elementor-element-5a9e707{width:var( --container-widget-width, 60% );max-width:60%;--container-widget-width:60%;--container-widget-flex-grow:0;}.elementor-1683 .elementor-element.elementor-element-ffebb2e{width:var( --container-widget-width, 60% );max-width:60%;--container-widget-width:60%;--container-widget-flex-grow:0;text-align:left;}.elementor-1683 .elementor-element.elementor-element-ffebb2e .elementor-heading-title{font-family:"Roboto", Sans-serif;font-size:16px;font-weight:500;color:#000000;}.elementor-1683 .elementor-element.elementor-element-39c0653{width:var( --container-widget-width, 60% );max-width:60%;--container-widget-width:60%;--container-widget-flex-grow:0;color:#5F5F5F;}.elementor-1683 .elementor-element.elementor-element-b4bf96e{width:var( --container-widget-width, 60% );max-width:60%;--container-widget-width:60%;--container-widget-flex-grow:0;text-align:left;}.elementor-1683 .elementor-element.elementor-element-b4bf96e .elementor-heading-title{font-family:"Roboto", Sans-serif;font-size:16px;font-weight:500;color:#000000;}.elementor-1683 .elementor-element.elementor-element-11f1033{width:var( --container-widget-width, 60% );max-width:60%;--container-widget-width:60%;--container-widget-flex-grow:0;color:#5F5F5F;}.elementor-1683 .elementor-element.elementor-element-e3ba2c8{width:var( --container-widget-width, 60% );max-width:60%;--container-widget-width:60%;--container-widget-flex-grow:0;text-align:left;}.elementor-1683 .elementor-element.elementor-element-e3ba2c8 .elementor-heading-title{font-family:"Roboto", Sans-serif;font-size:16px;font-weight:500;color:#000000;}.elementor-1683 .elementor-element.elementor-element-5168745{width:var( --container-widget-width, 60% );max-width:60%;--container-widget-width:60%;--container-widget-flex-grow:0;color:#5F5F5F;}.elementor-1683 .elementor-element.elementor-element-d5fc618{width:var( --container-widget-width, 60% );max-width:60%;--container-widget-width:60%;--container-widget-flex-grow:0;text-align:left;}.elementor-1683 .elementor-element.elementor-element-d5fc618 .elementor-heading-title{font-family:"Roboto", Sans-serif;font-size:16px;font-weight:500;color:#000000;}.elementor-1683 .elementor-element.elementor-element-ea5b2ed{width:var( --container-widget-width, 60% );max-width:60%;--container-widget-width:60%;--container-widget-flex-grow:0;color:#5F5F5F;}.elementor-1683 .elementor-element.elementor-element-41c772f{width:var( --container-widget-width, 60% );max-width:60%;--container-widget-width:60%;--container-widget-flex-grow:0;text-align:center;}.elementor-1683 .elementor-element.elementor-element-41c772f .elementor-heading-title{font-family:"Roboto", Sans-serif;font-size:14px;font-weight:500;color:#000000;}@media(max-width:1024px){.elementor-1683 .elementor-element.elementor-element-d2fe2e6{--container-widget-width:789px;--container-widget-flex-grow:0;width:var( --container-widget-width, 789px );max-width:789px;}.elementor-1683 .elementor-element.elementor-element-5a9e707{--container-widget-width:939px;--container-widget-flex-grow:0;width:var( --container-widget-width, 939px );max-width:939px;}.elementor-1683 .elementor-element.elementor-element-ffebb2e{--container-widget-width:939px;--container-widget-flex-grow:0;width:var( --container-widget-width, 939px );max-width:939px;}.elementor-1683 .elementor-element.elementor-element-ffebb2e .elementor-heading-title{font-size:14px;}.elementor-1683 .elementor-element.elementor-element-39c0653{--container-widget-width:939px;--container-widget-flex-grow:0;width:var( --container-widget-width, 939px );max-width:939px;}.elementor-1683 .elementor-element.elementor-element-b4bf96e{--container-widget-width:939px;--container-widget-flex-grow:0;width:var( --container-widget-width, 939px );max-width:939px;}.elementor-1683 .elementor-element.elementor-element-b4bf96e .elementor-heading-title{font-size:14px;}.elementor-1683 .elementor-element.elementor-element-11f1033{--container-widget-width:939px;--container-widget-flex-grow:0;width:var( --container-widget-width, 939px );max-width:939px;}.elementor-1683 .elementor-element.elementor-element-e3ba2c8{--container-widget-width:939px;--container-widget-flex-grow:0;width:var( --container-widget-width, 939px );max-width:939px;}.elementor-1683 .elementor-element.elementor-element-e3ba2c8 .elementor-heading-title{font-size:14px;}.elementor-1683 .elementor-element.elementor-element-5168745{--container-widget-width:939px;--container-widget-flex-grow:0;width:var( --container-widget-width, 939px );max-width:939px;}.elementor-1683 .elementor-element.elementor-element-d5fc618{--container-widget-width:939px;--container-widget-flex-grow:0;width:var( --container-widget-width, 939px );max-width:939px;}.elementor-1683 .elementor-element.elementor-element-d5fc618 .elementor-heading-title{font-size:14px;}.elementor-1683 .elementor-element.elementor-element-ea5b2ed{--container-widget-width:939px;--container-widget-flex-grow:0;width:var( --container-widget-width, 939px );max-width:939px;}.elementor-1683 .elementor-element.elementor-element-41c772f{--container-widget-width:939px;--container-widget-flex-grow:0;width:var( --container-widget-width, 939px );max-width:939px;}.elementor-1683 .elementor-element.elementor-element-41c772f .elementor-heading-title{font-size:14px;}}@media(max-width:767px){.elementor-1683 .elementor-element.elementor-element-d2fe2e6{--container-widget-width:686px;--container-widget-flex-grow:0;width:var( --container-widget-width, 686px );max-width:686px;}.elementor-1683 .elementor-element.elementor-element-d2fe2e6 .elementor-heading-title{font-size:17px;}.elementor-1683 .elementor-element.elementor-element-5a9e707{--container-widget-width:319px;--container-widget-flex-grow:0;width:var( --container-widget-width, 319px );max-width:319px;}.elementor-1683 .elementor-element.elementor-element-ffebb2e{--container-widget-width:329px;--container-widget-flex-grow:0;width:var( --container-widget-width, 329px );max-width:329px;}.elementor-1683 .elementor-element.elementor-element-ffebb2e .elementor-heading-title{font-size:14px;}.elementor-1683 .elementor-element.elementor-element-39c0653{--container-widget-width:329px;--container-widget-flex-grow:0;width:var( --container-widget-width, 329px );max-width:329px;}.elementor-1683 .elementor-element.elementor-element-b4bf96e{--container-widget-width:329px;--container-widget-flex-grow:0;width:var( --container-widget-width, 329px );max-width:329px;}.elementor-1683 .elementor-element.elementor-element-b4bf96e .elementor-heading-title{font-size:14px;}.elementor-1683 .elementor-element.elementor-element-11f1033{--container-widget-width:329px;--container-widget-flex-grow:0;width:var( --container-widget-width, 329px );max-width:329px;}.elementor-1683 .elementor-element.elementor-element-e3ba2c8{--container-widget-width:329px;--container-widget-flex-grow:0;width:var( --container-widget-width, 329px );max-width:329px;}.elementor-1683 .elementor-element.elementor-element-e3ba2c8 .elementor-heading-title{font-size:14px;}.elementor-1683 .elementor-element.elementor-element-5168745{--container-widget-width:329px;--container-widget-flex-grow:0;width:var( --container-widget-width, 329px );max-width:329px;}.elementor-1683 .elementor-element.elementor-element-d5fc618{--container-widget-width:329px;--container-widget-flex-grow:0;width:var( --container-widget-width, 329px );max-width:329px;}.elementor-1683 .elementor-element.elementor-element-d5fc618 .elementor-heading-title{font-size:14px;}.elementor-1683 .elementor-element.elementor-element-ea5b2ed{--container-widget-width:329px;--container-widget-flex-grow:0;width:var( --container-widget-width, 329px );max-width:329px;}.elementor-1683 .elementor-element.elementor-element-41c772f{--container-widget-width:329px;--container-widget-flex-grow:0;width:var( --container-widget-width, 329px );max-width:329px;}.elementor-1683 .elementor-element.elementor-element-41c772f .elementor-heading-title{font-size:14px;}}/* Start custom CSS for shortcode, class: .elementor-element-c6c9b94 *//* Shared style for Preview & Meta Tags Generator headings */
.og-preview h3 {
  font-size: 17px;
  font-weight: 600;
  color: #f1f5f9;              /* light text on dark bg */
  margin: 16px 0 10px;
  display: flex;
  align-items: center;
  gap: 8px;
  letter-spacing: 0.3px;
  border-left: 4px solid #3b82f6; /* blue accent bar */
  padding-left: 10px;
}

/* Icon before heading (optional, using Font Awesome) */
.og-preview h3::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-size: 14px;
  color: #60a5fa;
  content: "\f02e"; /* default: fa-file-lines */
}

/* Specific icon for Preview heading */
.og-preview h3:first-of-type::before {
  content: "\f06e"; /* fa-eye */
}

/* Specific icon for Generated Meta Tags heading */
.og-preview h3:last-of-type::before {
  content: "\f121"; /* fa-code */
}

/* Small screen adjustments */
@media (max-width: 600px) {
  .og-preview h3 {
    font-size: 15px;
    margin: 12px 0 8px;
  }
}
/* ==============================
   Open Graph Generator - Mobile CSS
   Target: Devices under 768px width
   ============================== */

body {
  margin: 0;
  padding: 0;
  font-family: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* Container */
.og-generator {
  background: #0b0b0b;
  color: #f1f5f9;
  width: 100%;
  margin: 0 auto;
  padding: 16px;
  border-radius: 0;
  box-sizing: border-box;
}

/* Main heading */
.og-heading {
  display: flex;
  gap: 8px;
  align-items: center;
  font-size: 18px;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 16px;
  text-align: center;
  justify-content: center;
}

/* Layout stacked */
.og-grid {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

/* Form Section */
.og-form {
  width: 100%;
}

label {
  display: block;
  font-size: 13px;
  color: #cbd5e1;
  margin-bottom: 6px;
  margin-top: 12px;
}

.og-input {
  width: 100%;
  background: #111827;
  border: 1px solid #1f2937;
  color: #f8fafc;
  padding: 10px;
  border-radius: 8px;
  font-size: 14px;
  margin-bottom: 8px;
  box-sizing: border-box;
}

.og-input:focus {
  outline: none;
  border-color: #6366f1;
  box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.3);
}

/* Buttons */
.og-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 14px;
}

.og-btn {
  width: 100%;
  background: linear-gradient(180deg, #1f2937, #111827);
  color: #ffffff;
  border: none;
  padding: 12px;
  border-radius: 10px;
  cursor: pointer;
  font-weight: 600;
  font-size: 14px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  transition: transform 0.15s ease-in-out;
}

.og-btn:hover:not(:disabled) {
  transform: translateY(-1px);
}

.og-btn-secondary {
  background: transparent;
  border: 1px solid #374151;
}

.og-btn[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
}

/* Preview Section */
.og-preview {
  width: 100%;
}

.og-preview h3 {
  font-size: 15px;
  font-weight: 600;
  color: #f1f5f9;
  margin: 12px 0 8px;
  display: flex;
  align-items: center;
  gap: 6px;
  border-left: 3px solid #3b82f6;
  padding-left: 8px;
}

/* Preview Card */
.og-card {
  background: #111827;
  border-radius: 10px;
  padding: 10px;
  display: flex;
  flex-direction: column;
  text-align: center;
  align-items: center;
  margin-bottom: 12px;
  border: 1px solid #1e293b;
}

.og-card img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  margin-bottom: 8px;
}

.og-card-body h4 {
  margin: 0;
  font-size: 15px;
  color: #ffffff;
}

.og-card-body p {
  margin: 6px 0 0;
  font-size: 13px;
  color: #cbd5e1;
}

#og-preview-url {
  margin-top: 6px;
  font-size: 12px;
  color: #60a5fa;
  text-decoration: none;
  word-break: break-word;
  display: block;
}

/* Meta Tag Result */
.og-result {
  background: #0f172a;
  padding: 12px;
  border-radius: 8px;
  color: #e2e8f0;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, monospace;
  font-size: 13px;
  border: 1px solid #1e293b;
  margin-top: 8px;
  overflow-x: auto;
}

/* Note */
.og-note {
  font-size: 12px;
  color: #94a3b8;
  margin-top: 14px;
  text-align: center;
}/* End custom CSS */