@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');

.wpforms-container .wpforms-form label,
.wpforms-container .wpforms-form input,
.wpforms-container .wpforms-form textarea,
.wpforms-container .wpforms-form select {
  font-family: 'Open Sans', sans-serif !important;
}

h1, h2, h3, h4, h5, h6, div, span, p {
  font-family: 'Open Sans', sans-serif !important;
}

.http-method {
  background-color: #f0f0f0;
  color: #333;
  border-radius: 6px;
  padding: 1px 1px;
  font-family: monospace;
  font-size: 0.9em;
	border: 1px solid #ccc;
  display: inline-block;
}

.http-method-note {
  background-color: #fff;
  color: #333;
  border-radius: 8px;
  padding: 1px 1px;
  font-family: monospace;
  font-size: 0.9em;
  overflow-wrap: break-word;        /* break long URLs */
  word-break: break-word;           /* fallback */
	border: 1px solid #000;
  display: inline-block;
}

/* Color classes */
.code-green { color: #6bc46d; }
.code-blue { color: #7aa6da; }  
.code-red { color: #e06c75; } 
.code-orange { color: #e5c07b; } 
.code-gray { color: #ccc; } 

.checkmark-large {
  font-size: 2em; /* or 2em for bigger */
  line-height: 1;
}

.centered-cell {
  text-align: center;
  vertical-align: middle;
}

/* Submit button on the Contact Us form */
.custom-submit-btn {
  background-color: #ffef00 !important;  /* Opala yellow */
  color: #000000 !important;             /* Black font */
  border: none !important;
  border-radius: 9999px !important;      /* Fully rounded */
  font-size: 1.125rem !important;        /* Slightly smaller than before (18px) */
  font-weight: 500 !important;           /* Balanced weight */
  padding: 0.5rem 1.5rem !important;     /* Top/bottom padding adjusted */
  line-height: 1.5 !important;           /* Helps with vertical centering */
  text-align: center !important;
  display: inline-flex !important;       /* Needed for flex centering */
  align-items: center !important;        /* Vertically centers text */
  justify-content: center !important;    /* Horizontally centers text */
  cursor: pointer !important;
  transition: background-color 0.3s ease !important;
}

.custom-submit-btn:hover {
  background-color: #4f00ff !important;  /* Opala blue on hover */
}

/* Apply Open Sans to all WPForms field labels */
.wpforms-container .wpforms-form label {
  font-family: 'Open Sans', sans-serif !important;
}

/* Apply Open Sans to all input, textarea, and select elements */
.wpforms-container .wpforms-form input,
.wpforms-container .wpforms-form textarea,
.wpforms-container .wpforms-form select {
  font-family: 'Open Sans', sans-serif !important;
}
body .wpforms-container .wpforms-form label {
  font-family: 'Open Sans', sans-serif !important;
}

/* setting the header image to be slim on display*/
.page-header {
  max-height: 300px; /* adjust to whatever height you prefer */
  overflow: hidden;
}

.page-header img {
  object-fit: cover;
  height: 100%;
  width: 100%;
}

/*text highlighting*/
.opala-highlight {
  background-color: #FFEF00;
  padding: 0 4px;
  display: inline;
}

/*text highlight with smaller text*/
.opala-highlight-small {
  background-color: #FFEF00;
  padding: 0 4px;
  display: inline;
  font-size: 0.8rem;
}

.decorative-circle {
  display: flex;
  align-items: center;
  gap: 12px; /* space between circle and text */
}

.decorative-circle::before {
  content: "";
  width: 55px;
  height: 55px;
  background-color: #FFEF00; /* Opala Yellow */
  border-radius: 50%;
  flex-shrink: 0;
}

/* Force opala blue + underline on links inside Text Editor OR HTML widgets */
.elementor-widget-text-editor a,
.elementor-widget-html a {
  text-decoration: underline !important;
  color: #4f00ff; /* Opala blue */
}

.elementor-widget-text-editor a:hover,
.elementor-widget-text-editor a:active,
.elementor-widget-html a:hover,
.elementor-widget-html a:active {
  color: #7D7979; /* Dark gray */
  text-decoration: underline !important;
}

/* Prevent auto-link styling inside code boxes */
.code-box a {
  color: inherit !important;
  text-decoration: none !important;
  pointer-events: none; /* makes it non-clickable */
  cursor: default;
}

/* Global button styling for docs.opala.com */

/* Target Elementor buttons */
.elementor-button {
  background-color: #FFEF00;   /* Opala Yellow */
  color: #000000;              /* Black text */
  border: none;                /* No border */
  border-radius: 29px;          /* Rounded edges */
  padding: 8px 30px !important;     /* Top/bottom padding adjusted */
  font-weight: 400 !important;            /* Bold text */
  transition: all 0.3s ease;   /* Smooth hover animation */
}

/* Hover state */
.elementor-button:hover,
.elementor-button:focus {
  background-color: #4F00FF;   /* Opala Blue */
  color: #FFFFFF;              /* White text */
}

/* Menu items hover style */
.elementor-nav-menu .elementor-item:hover {
  background-color: #ffffff !important;
  color: #000000 !important;
}

/* Child menu items (submenus) */
.elementor-nav-menu .elementor-sub-item {
  color: #000 !important;                 /* default black */
  text-decoration: none !important;
  background: #fff !important;
	font-size: 0.8rem !important;
	align-content 
}

/* Child hover: text turns Opala blue */
.elementor-nav-menu .elementor-sub-item:hover {
  color: #4f00ff !important;
  text-decoration: none !important;
  background: #fff !important;
}

/* Force long inline code/URLs to wrap on small screens */
.http-method {
  display: inline-block;
  white-space: normal !important;   /* allow wrapping */
  overflow-wrap: break-word;        /* break words if needed */
  word-break: break-word;           /* fallback for older browsers */
  max-width: 100%;                  /* don’t overflow container */
}

/* Keep tables responsive inside text editor widgets */
.elementor-widget-text-editor table {
  width: 100% !important;       /* Force table to fit screen */
  max-width: 100% !important;
  table-layout: auto;           /* Let cells size dynamically */
  border-collapse: collapse;
  word-break: normal !important;       /* Break long words/URLs */
  overflow-wrap: break-word !important;
	white-space: normal;          /* Allow wrapping inside cells */
}

.elementor-widget-text-editor table td,
.elementor-widget-text-editor table th {
  white-space: normal !important;     /* allow wrapping */
  word-break: normal !important;      /* don’t split words */
  overflow-wrap: break-word !important; /* break only if needed */
}

/* Responsive tables inside HTML widgets */
.elementor-widget-html table {
  width: 100% !important;       /* Fit inside phone width */
  max-width: 100% !important;
  table-layout: auto;
  border-collapse: collapse;
  word-break: normal;
  white-space: normal;
}

.elementor-widget-html td,
.elementor-widget-html th {
  white-space: normal !important;
  word-wrap: break-word;
  overflow-wrap: anywhere;      /* Breaks even long URLs */
}