/* Mesbah companion styles. Page layouts, colors, typography and gallery
 * columns are managed in Elementor. This file handles plugin form controls,
 * navigation touch targets, focus states and reduced motion. */
@font-face {
  font-family: "Mesbah Vazir";
  src: url("/wp-content/uploads/2025/10/Vazir.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Mesbah Vazir";
  src: url("/wp-content/uploads/2025/10/Vazir-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
body.mesbah-visual {
  --mesbah-teal: #176b76;
  --mesbah-teal-hover: #10545e;
  --mesbah-ink: #233c40;
  --mesbah-muted: #536568;
  --mesbah-paper: #f5f3ee;
  --mesbah-surface: #fffefa;
  --mesbah-line: #d4dedb;
  --mesbah-font: "Mesbah Vazir", "Vazir", Tahoma, sans-serif;
  --mesbah-gutter: clamp(18px, 4vw, 56px);
  --mesbah-header-height: 76px;
  margin: 0;
  padding-block-start: var(--mesbah-header-height);
  -webkit-font-smoothing: antialiased;
}
.mesbah-visual ::selection { background: #c6e4e3; color: #123f46; }
.mesbah-visual :where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid #2898a5;
  outline-offset: 4px;
}
.mesbah-visual :where(h1, h2, h3, h4) { line-height: 1.6; }
.mesbah-visual :where(a, button, input, select, textarea) {
  transition: color 180ms ease, background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}
.mesbah-visual :where(input, select, textarea, button) { font-family: var(--mesbah-font); }
.mesbah-visual :where([id]) { scroll-margin-top: calc(var(--mesbah-header-height) + 24px); }

body.mesbah-visual.admin-bar .elementor-location-header > .e-con {
  /* Existing Elementor mobile CSS pins this header with !important. */
  top: var(--wp-admin--admin-bar--height, 32px) !important;
}
.mesbah-visual .elementor-location-header .e-n-menu-title {
  min-height: 44px;
  border-radius: 6px;
}
.mesbah-visual .elementor-location-header .e-n-menu-title:hover,
.mesbah-visual .elementor-location-header .e-n-menu-title:focus-within {
  background-color: #ffffff12;
}
.mesbah-visual .elementor-location-header :where(.e-n-menu-title-text, .elementor-icon-list-text) {
  font-family: var(--mesbah-font);
  line-height: 1.8;
}
.mesbah-visual .elementor-location-header .elementor-icon a,
.mesbah-visual .elementor-location-header a.elementor-icon {
  min-width: 44px;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.mesbah-visual .elementor-location-header a.elementor-icon svg { width: 26px; height: 26px; }
/* Keep the two existing contact/ticket actions in one row at every breakpoint. */
body.mesbah-visual .elementor-location-header .e-con:has(> .elementor-widget-icon a[href^="tel:"]) {
  --width: auto;
  --flex-wrap: nowrap;
  width: auto;
  min-width: 96px;
  flex: 0 0 auto;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 8px;
  align-items: center;
}
body.mesbah-visual .elementor-location-header .elementor-widget-icon:has(a:is([href^="tel:"], [href*="ticket.mesbah.art"])) {
  width: 44px;
  min-width: 44px;
  flex: 0 0 44px;
}
body.mesbah-visual .elementor-location-header .elementor-widget-icon a:is([href^="tel:"], [href*="ticket.mesbah.art"]) {
  box-sizing: border-box;
  width: 44px;
  height: 44px;
  padding: 10px;
  border-width: 1px;
}
.mesbah-visual .elementor-location-header .elementor-icon-list-item a {
  min-height: 44px;
  padding-inline: 12px;
  border-radius: 5px;
}
.mesbah-visual .elementor-location-header .elementor-icon-list-item a:hover { background-color: #ffffff12; }
.mesbah-visual .e-off-canvas .e-n-menu-title { min-height: 48px; }

.mesbah-visual .elementor-gallery-item {
  border-radius: 4px;
  box-shadow: 0 1px 4px #102f3515;
}
.mesbah-visual .elementor-gallery-item .e-gallery-image {
  border-radius: 4px;
  transition: filter 200ms ease;
}
@media (hover: hover) {
  .mesbah-visual .elementor-gallery-item:hover .e-gallery-image { filter: brightness(1.07); }
}
.mesbah-visual .elementor-gallery-item:focus-visible { outline-offset: 2px; }
.mesbah-visual .elementor-slideshow__title,
.mesbah-visual .elementor-slideshow__description { font-family: var(--mesbah-font); line-height: 1.8; }
.mesbah-visual .elementor-lightbox .dialog-lightbox-close-button { padding: 12px; }

/* Form presentation only: retain fields, hidden inputs, validation and submission. */
.mesbah-visual .gform_wrapper {
  max-width: 1040px;
  margin: 32px auto;
  padding: clamp(22px, 4vw, 44px);
  background-color: var(--mesbah-surface);
  color: var(--mesbah-ink);
  border: 1px solid var(--mesbah-line);
  border-radius: 14px;
  box-shadow: 0 6px 24px #203a4008;
  font-family: var(--mesbah-font);
}
.mesbah-visual .gform_wrapper :where(label, legend, .gfield_description) { color: var(--mesbah-ink); }
.mesbah-visual .gform_wrapper .gform_fields { row-gap: 28px; }
.mesbah-visual .gform_wrapper :where(.gfield_label) { line-height: 1.9; margin-bottom: 10px; }
.mesbah-visual .gform_wrapper :where(.gchoice) { padding-block: 6px; }
.mesbah-visual .gform_wrapper :where(input[type="radio"], input[type="checkbox"]) {
  accent-color: var(--mesbah-teal);
  width: 20px;
  height: 20px;
  vertical-align: middle;
}
.mesbah-visual .gform_wrapper :where(input[type="text"], input[type="tel"], input[type="email"], input[type="number"], select, textarea),
.mesbah-visual #cupri_form :where(input:not([type="hidden"]), textarea) {
  min-height: 48px;
  max-width: 100%;
  padding: 11px 14px;
  border: 1px solid #a7b9b6;
  border-radius: 7px;
  background-color: #fff;
  color: var(--mesbah-ink);
  font-family: var(--mesbah-font);
  font-size: 16px;
  line-height: 1.7;
}
.mesbah-visual .gform_wrapper :where(input, select, textarea):focus,
.mesbah-visual #cupri_form :where(input, textarea):focus {
  border-color: var(--mesbah-teal);
  box-shadow: 0 0 0 3px #176b761a;
}
.mesbah-visual .gform_wrapper :where(input[type="submit"], button[type="submit"], .gform_button),
.mesbah-visual #cupri_submit {
  min-height: 48px;
  padding: 12px 28px;
  border: 1px solid var(--mesbah-teal);
  border-radius: 7px;
  background-color: var(--mesbah-teal);
  color: #fff;
  font-family: var(--mesbah-font);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.6;
}
.mesbah-visual .gform_wrapper :where(input[type="submit"], button[type="submit"], .gform_button):hover,
.mesbah-visual #cupri_submit:hover { background-color: var(--mesbah-teal-hover); }
.mesbah-visual .gform_wrapper :where(.gfield_error) { border-inline-start: 3px solid #ad3434; padding-inline-start: 12px; }
.mesbah-visual .gform_wrapper :where(.gfield_validation_message, .gform_validation_errors) { color: #922727; }
.mesbah-donate #content { margin-inline: auto; }
.mesbah-visual #cupri_form {
  width: 100%;
  max-width: 560px;
  margin-inline: auto;
  padding: 28px;
  border: 1px solid var(--mesbah-line);
  border-radius: 14px;
  background-color: var(--mesbah-surface);
  color: var(--mesbah-ink);
  font-family: var(--mesbah-font);
}
.mesbah-visual #cupri_form :where(.cupri_row, .cupri_submit_form_wrapper, form, .cupri_tbl) { width: 100%; max-width: 100%; }
.mesbah-visual #cupri_form .cupri_input_title { color: var(--mesbah-ink); text-align: start; }
.mesbah-visual #cupri_form .cupri_predefined_prices {
  display: inline-flex;
  gap: 4px;
  align-items: center;
  min-height: 44px;
  margin: 3px 1px;
  padding: 7px 10px;
  border: 1px solid #b7cfcc;
  background-color: #eaf3f0;
  color: #205860;
}
.mesbah-visual #cupri_form .cupri_predefined_prices:hover { background-color: #d7eae6; }
.mesbah-visual #cupri_form textarea[readonly] {
  color: var(--mesbah-muted);
  background: transparent;
  border: 0;
  padding: 0;
  font-size: 14px;
  line-height: 1.9;
  min-height: 110px;
}

/* Native text-editor content keeps its original markup. */
.mesbah-document .elementor-widget-text-editor p { margin-block: 0 1.2em; }
.mesbah-document .elementor-widget-text-editor a { text-underline-offset: 4px; }
.mesbah-visual .elementor-widget-loop-carousel .swiper-pagination-bullet-active { background: var(--mesbah-teal); }
.mesbah-visual .gform_wrapper { margin-block: 0; }
.mesbah-visual .gform_wrapper :where(.gform_confirmation_message) { color: var(--mesbah-ink); }
@media (min-width: 768px) {
  .mesbah-support .gform_wrapper.gravity-theme .gform_fields .gfield--width-quarter { grid-column: span 6; }
}
@media(max-width:767px) {
  body.mesbah-visual { --mesbah-header-height: 68px; --mesbah-gutter: 18px; }
  .mesbah-visual .gform_wrapper { padding: 24px 18px; }
  .mesbah-visual .gform_wrapper :where(input[type="submit"],button[type="submit"]) { width:100%; }
  .mesbah-visual #cupri_form { padding:24px 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .mesbah-visual :where(a, button, input, select, textarea, .e-gallery-image) { transition: none; }
  .mesbah-visual .chevron { animation: none; opacity: .6; }
  .mesbah-visual .e-off-canvas .e-off-canvas__main { animation-duration: 1ms; }
}