/* Minimal front-end friendly overrides built on top of core wp-pointer.css */
.wp-pointer-content .wat-pointer-title:before { content: "\f223"; }
.wp-pointer-content .wat-pointer-title .dashicons-no {
  position: absolute; right: 20px; font-size: 30px; top: 10px; cursor: pointer;
}
.cct-ptr-open:after {
  content: ""; width: 100%; height: 100%; position: fixed; background: rgba(0,0,0,0.32);
  inset: 0; z-index: 99998;
}
/* Button styles for front-end parity */
body:not(.wp-admin) .wat-next,
body:not(.wp-admin) .wat-prev,
body:not(.wp-admin) .wat-next:hover,
body:not(.wp-admin) .wat-prev:hover {
  background: #2271b1; border-color: #2271b1; color: #fff; text-shadow: none; display: inline-block;
  font-size: 13px; line-height: 2.15384615; min-height: 30px; margin: 0 8px 0 0; padding: 0 10px;
  cursor: pointer; border-width: 1px; border-style: solid; border-radius: 3px; white-space: nowrap; box-sizing: border-box;
}
body:not(.wp-admin) .wat-go-to, body:not(.wp-admin) .wat-go-to:hover {
  display: inline-block; text-decoration: none; font-size: 13px; line-height: 2.15384615; min-height: 30px;
  margin: 0 8px 0 0; padding: 0 10px; cursor: pointer; border-width: 1px; border-style: solid; border-radius: 3px;
  white-space: nowrap; box-sizing: border-box;
}
.wat-pointer.wp-pointer-right .wp-pointer-arrow { left: unset !important; }



.wp-pointer-content h3 {
    border: 1px solid #253746 !important;
    background: #253746 !important;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.wp-pointer-content {
    border: 1px solid #253746 !important;
    border-radius: 5px !important;
}

.wp-pointer-top .wp-pointer-arrow, .wp-pointer-undefined .wp-pointer-arrow {
    border-bottom-color: #253746 !important;
}

.wp-pointer-top .wp-pointer-arrow-inner, .wp-pointer-undefined .wp-pointer-arrow-inner {
    border-bottom-color: #253746 !important;
}

body:not(.wp-admin) .wat-next, body:not(.wp-admin) .wat-prev, body:not(.wp-admin) .wat-next:hover, body:not(.wp-admin) .wat-prev:hover {
    background: #fd7e14 !important;
    border-color: #fd7e14 !important;
}

.wat-status {
    padding: 0 20px;
}

/* Overlay stays for structure, but doesn't tint */
.cct-overlay {
  position: fixed;
  inset: 0;
  background: transparent;       /* was rgba(0,0,0,0.55) */
  z-index: 900000;
  pointer-events: none;
}

/* Ring dims the rest of the page, but NOT the hole */
.cct-highlight-ring {
  position: absolute;
  border-radius: 10px;
  outline: 3px solid rgba(255,255,255,0.95);
  box-shadow:
    0 8px 24px rgba(0,0,0,0.45),
    0 0 0 9999px rgba(0,0,0,0.60);  /* outside area darkens */
  z-index: 900001;
  pointer-events: none;
  transition: all .2s ease;
}

/* Ensure the target sits above everything */
.cct-spotlit { position: relative; z-index: 900002; isolation: isolate; }


/* Make sure the pointer beats everything */
.wat-pointer {
  z-index: 2147483647 !important;
  position: absolute !important; /* lets WP Pointer position reliably */
}
.wat-pointer .wp-pointer-arrow,
.wat-pointer .wp-pointer-arrow-inner {
  z-index: 2147483647 !important;
}

/* Turn off any old pseudo-icon */
.wp-pointer-content .wat-pointer-title:before { content: none !important; }

/* Title layout */
.wp-pointer-content .wat-pointer-title {
  display: flex; align-items: center; gap: .5rem; margin: 0 0 .25rem 0;
}
.wat-ico { display: inline-flex; align-items: center; justify-content: center; line-height: 1; }
.wat-ico-fa i { font-size: 1.1em; }
.wat-ico-dash .dashicons { font-size: 20px; width: 20px; height: 20px; }
.wat-ico-uni { font-size: 1.1em; }