/* Conjurly UI Core — PLUGINS
   Source of truth: plugin file
   Do not hardcode values elsewhere.

   Scope in this version:
   - WP GeoDirectory / WPGD bridge styling
   - Global focus system tokens in use
   - Shared meta baseline and opt-in meta layout utilities
   - Standard WordPress content surfaces (non-News baseline)

   Notes:
   - The Events Calendar belongs in its own dedicated plugin.
   - News and News Watch typography/presentation belongs in News Enhancements.
   - This file is for bridge styling and shared site baselines, not feature-specific one-offs.
*/

/* ======================================================
   Global Focus System
   ====================================================== */

:where(
  a,
  button,
  input,
  select,
  textarea,
  summary,
  [role="button"],
  [tabindex]:not([tabindex="-1"]),
  .button,
  .wp-element-button,
  .components-button
):focus{
  outline: none;
}

:where(
  a,
  button,
  input,
  select,
  textarea,
  summary,
  [role="button"],
  [tabindex]:not([tabindex="-1"]),
  .button,
  .wp-element-button,
  .components-button
):focus-visible{
  outline: var(--cj-focus-outline-width) solid var(--cj-focus-outline-color);
  outline-offset: var(--cj-focus-outline-offset);
}

:where(
  input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  select,
  textarea
):focus,
:where(
  input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
  select,
  textarea
):focus-visible{
  border-color: var(--cj-accent);
  box-shadow: var(--cj-focus-ring-shadow);
}

:where(input[type="checkbox"], input[type="radio"]):focus,
:where(input[type="checkbox"], input[type="radio"]):focus-visible{
  box-shadow: var(--cj-focus-ring-shadow);
}

/* ======================================================
   Shared Meta System
   ====================================================== */

.entry-meta,
.cnjrly-meta{
  font-family: var(--cj-meta-font-family);
  font-size: var(--cj-meta-font-size);
  line-height: var(--cj-meta-line-height);
  font-weight: var(--cj-meta-font-weight);
  color: var(--cj-meta-color);
}

.entry-meta a,
.cnjrly-meta a{
  color: var(--cj-meta-link-color);
  text-decoration: none;
}

.entry-meta a:hover,
.entry-meta a:focus-visible,
.cnjrly-meta a:hover,
.cnjrly-meta a:focus-visible{
  color: var(--cj-meta-link-hover-color);
}

.entry-meta [aria-hidden="true"],
.cnjrly-meta [aria-hidden="true"],
.entry-meta .meta-separator,
.cnjrly-meta .meta-separator{
  color: var(--cj-meta-separator-color);
}

.cnjrly-meta--row{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--cj-meta-gap);
  margin-top: var(--cj-meta-row-margin-top);
  margin-bottom: var(--cj-meta-row-margin-bottom);
}

/* ======================================================
   WP GeoDirectory (WPGD) Overrides
   ====================================================== */

/* Ensure GeoDirectory notices adopt Conjurly alert styling */
.wpgeodirectory .alert,
.geodir-notification,
.geodir-message,
.geodir-alert{
  border-radius: var(--cj-alert-radius);
  border: 1px solid var(--cj-alert-border);
}

/* Map GeoDirectory notice types to Conjurly alert tokens */
.geodir-notification-info,
.geodir-message-info{
  background: var(--cj-alert-info-bg);
  color: var(--cj-alert-info-text);
  border-color: var(--cj-alert-info-border);
}

.geodir-notification-success,
.geodir-message-success{
  background: var(--cj-alert-success-bg);
  color: var(--cj-alert-success-text);
  border-color: var(--cj-alert-success-border);
}

.geodir-notification-warning,
.geodir-message-warning{
  background: var(--cj-alert-warning-bg);
  color: var(--cj-alert-warning-text);
  border-color: var(--cj-alert-warning-border);
}

.geodir-notification-error,
.geodir-message-error{
  background: var(--cj-alert-danger-bg);
  color: var(--cj-alert-danger-text);
  border-color: var(--cj-alert-danger-border);
}

/* GeoDirectory links inside notices */
.wpgeodirectory .alert a,
.geodir-notification a,
.geodir-message a{
  color: var(--cj-accent);
  text-decoration: none;
  font-weight: 600;
}

.wpgeodirectory .alert a:hover,
.geodir-notification a:hover,
.geodir-message a:hover{
  color: var(--cj-accent-hover);
  text-decoration: underline;
}

/* ======================================================
   WP GeoDirectory (BSUI) — override Bootstrap alert vars
   ====================================================== */

/* Base: radius */
.geodir-add-listing.bsui .alert{
  --bs-alert-border-radius: var(--cj-alert-radius) !important;
}

/* INFO */
.geodir-add-listing.bsui .alert.alert-info{
  --bs-alert-bg: var(--cj-alert-info-bg) !important;
  --bs-alert-color: var(--cj-alert-info-text) !important;
  --bs-alert-border-color: var(--cj-alert-info-border) !important;
}

/* SUCCESS */
.geodir-add-listing.bsui .alert.alert-success{
  --bs-alert-bg: var(--cj-alert-success-bg) !important;
  --bs-alert-color: var(--cj-alert-success-text) !important;
  --bs-alert-border-color: var(--cj-alert-success-border) !important;
}

/* WARNING */
.geodir-add-listing.bsui .alert.alert-warning{
  --bs-alert-bg: var(--cj-alert-warning-bg) !important;
  --bs-alert-color: var(--cj-alert-warning-text) !important;
  --bs-alert-border-color: var(--cj-alert-warning-border) !important;
}

/* DANGER */
.geodir-add-listing.bsui .alert.alert-danger{
  --bs-alert-bg: var(--cj-alert-danger-bg) !important;
  --bs-alert-color: var(--cj-alert-danger-text) !important;
  --bs-alert-border-color: var(--cj-alert-danger-border) !important;
}

/* Links inside the alert (if any) */
.geodir-add-listing.bsui .alert a{
  color: var(--cj-accent) !important;
  font-weight: 600;
  text-decoration: none;
}

.geodir-add-listing.bsui .alert a:hover{
  color: var(--cj-accent-hover) !important;
  text-decoration: underline;
}

/* =========================
   GeoDirectory / WPGD (bsui)
   Checkboxes + radios + focus
   ========================= */

/* Unchecked visibility + border consistency (match .bsui .form-control) */
.geodir-add-listing.bsui .form-check-input{
  background-color: var(--cj-surface-primary) !important;
  border: 1px solid var(--cj-border-light) !important;
}

/* Checked state background + border */
.geodir-add-listing.bsui .form-check-input:checked{
  background-color: var(--cj-accent) !important;
  border-color: var(--cj-accent) !important;
}

/* Checkbox tick (white) */
.geodir-add-listing.bsui .form-check-input[type="checkbox"]:checked{
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-7'/%3e%3c/svg%3e") !important;
}

/* Radio dot (white) */
.geodir-add-listing.bsui .form-check-input[type="radio"]:checked{
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e") !important;
}

/* Focus: remove browser outline + use Conjurly focus system */
.geodir-add-listing.bsui .form-check-input:focus,
.geodir-add-listing.bsui .form-check-input:focus-visible{
  outline: none !important;
  border-color: var(--cj-accent) !important;
  box-shadow: var(--cj-focus-ring-shadow) !important;
}

/* Ensure radios are circular */
.geodir-add-listing.bsui .form-check-input[type="radio"]{
  border-radius: 50%;
}

/* Checkboxes remain square but soft */
.geodir-add-listing.bsui .form-check-input[type="checkbox"]{
  border-radius: 4px;
}

/* =========================
   WPGD inputs/selects/textarea: Conjurly focus system
   ========================= */
.geodir-add-listing.bsui .form-control:focus,
.geodir-add-listing.bsui .form-control:focus-visible,
.geodir-add-listing.bsui .form-select:focus,
.geodir-add-listing.bsui .form-select:focus-visible,
.geodir-add-listing.bsui textarea.form-control:focus,
.geodir-add-listing.bsui textarea.form-control:focus-visible{
  border-color: var(--cj-accent) !important;
  box-shadow: var(--cj-focus-ring-shadow) !important;
  outline: none !important;
}

/* ======================================================
   WordPress Content Surfaces (standard posts/pages/blog)
   Site-wide defaults outside News and plugin-specific surfaces
   ====================================================== */

:root{
  --conjurly-loop-ratio: 3 / 2;
  --conjurly-single-ratio: 16 / 9;
  --conjurly-single-ratio-mobile: 4 / 3;
}

/* Blog loop — featured image ratio */
.post-grid .ratio-wrap,
.bb-standard .ratio-wrap{
  padding-top: 0 !important;
  aspect-ratio: var(--conjurly-loop-ratio) !important;
  overflow: hidden !important;
  position: relative !important;
}

.post-grid .ratio-wrap .entry-media,
.bb-standard .ratio-wrap .entry-media{
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}

.post-grid .ratio-wrap img,
.bb-standard .ratio-wrap img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* Global heading baseline — News and plugin-specific surfaces can override intentionally */
:where(h1, h2, h3, h4, h5, h6){
  font-family: var(--cj-heading-font-family);
  font-weight: var(--cj-heading-font-weight);
  letter-spacing: var(--cj-heading-letter-spacing-tight);
  line-height: var(--cj-heading-line-height-tight);
}

/* Blog loop headline rhythm — non-news baseline */
.post-grid .entry-title,
.bb-standard .entry-title{
  font-family: var(--cj-heading-font-family);
  line-height: 1.15 !important;
  margin-bottom: 12px !important;
  letter-spacing: var(--cj-heading-letter-spacing-tight) !important;
  font-weight: 600 !important;
}

@media (max-width: 768px){
  .post-grid .entry-title,
  .bb-standard .entry-title{
    line-height: 1.05 !important;
  }
}

/* Single post featured image ratio box */
.single .entry-media.entry-img,
.single .entry-media.entry-img a,
.single .entry-media.entry-img figure,
.single-post .entry-media.entry-img,
.single-post .entry-media.entry-img a,
.single-post .entry-media.entry-img figure{
  position: relative !important;
  display: block !important;
  width: 100% !important;
  aspect-ratio: var(--conjurly-single-ratio) !important;
  overflow: hidden !important;
}

.single .entry-media.entry-img img.wp-post-image,
.single-post .entry-media.entry-img img.wp-post-image{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  margin: 0 !important;
  display: block !important;
}

@media (max-width: 768px){
  .single .entry-media.entry-img,
  .single .entry-media.entry-img a,
  .single .entry-media.entry-img figure,
  .single-post .entry-media.entry-img,
  .single-post .entry-media.entry-img a,
  .single-post .entry-media.entry-img figure{
    aspect-ratio: var(--conjurly-single-ratio-mobile) !important;
  }
}

/* Single post/page card shells */
.single-post .entry-content-wrap {
  background: var(--bb-content-background-color);
  border: 1px solid var(--bb-content-border-color);
  border-radius: var(--bb-block-radius);
  padding: 22px 25px;
}

.single-post #primary .site-main {
  padding-top: 0;
  padding-bottom: 24px;
}

@media (max-width: 768px) {
  .single-post .entry-content-wrap {
    padding: 18px 16px;
  }
}

/* Standard post/page heading hierarchy (non-News baseline) */
.single-post .entry-title,
.single-post h1,
.single-post h2,
.page h1,
.page h2,
.page h3,
.page h4,
.page h5,
.page h6 {
  font-family: var(--cj-heading-font-family);
  line-height: var(--cj-heading-line-height-tight);
  letter-spacing: var(--cj-heading-letter-spacing-tight);
  font-weight: var(--cj-heading-font-weight);
}

.single-post h1,
.page h1 {
  font-size: clamp(2.1rem, 2.4vw, 3rem);
  margin-bottom: 14px;
}

@media (max-width: 768px){
  .single-post .entry-title,
  .single-post h1,
  .single-post h2,
  .page h1,
  .page h2,
  .page h3,
  .page h4,
  .page h5,
  .page h6 {
    line-height: var(--cj-heading-line-height-tight);
    margin-bottom: 12px;
    letter-spacing: var(--cj-heading-letter-spacing-tight);
    font-weight: var(--cj-heading-font-weight);
  }

  .single-post h1,
  .page h1 {
    font-size: clamp(1.9rem, 6.2vw, 2.25rem);
  }
}

/* Page-specific title patch migrated from Customizer */
.page-id-2778 .entry-title,
.page-id-2778 h1{
  font-family: var(--cj-font-sans);
  color: var(--cj-text-on-accent);
  line-height: var(--cj-heading-line-height-tight);
  letter-spacing: var(--cj-heading-letter-spacing-tight);
  margin: 4px 0 14px 4px;
  font-size: 2rem;
  font-weight: 500;
}

/* Single post meta/action bar */
.single-post .post-meta-wrapper-main{
  background: var(--bb-content-background-color);
  border: 1px solid var(--bb-content-border-color);
  border-radius: var(--bb-block-radius);
  padding: 14px 18px;
  margin: 16px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  position: relative;
}

.single-post .post-meta-wrapper,
.single-post .post-meta-wrapper-main .show-support,
.single-post .post-meta-wrapper-main .author-box-share-wrap{
  background: transparent;
  border: 0;
  padding: 0;
  margin: 0;
}

.single-post .post-meta-wrapper-main .show-support{
  margin-left: auto;
  display: flex;
  align-items: center;
  height: auto;
}

.single-post .post-meta-wrapper-main .author-post-meta{
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end;
  gap: 12px;
  line-height: 1;
  margin: 0;
  padding: 0;
}

.single-post .post-meta-wrapper-main .author-post-meta a,
.single-post .post-meta-wrapper-main .author-post-meta a.push-right{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  position: relative;
  top: 0 !important;
  transform: none !important;
}

.single-post .post-meta-wrapper-main .author-post-meta a i,
.single-post .post-meta-wrapper-main .author-post-meta a.push-right i{
  display: block;
  line-height: 1 !important;
  vertical-align: middle;
}

.single-post .post-meta-wrapper-main .author-post-meta .pa-share-fix{
  display: none !important;
}

.single-post .post-meta-wrapper-main .cat-links{
  margin: 0 !important;
  line-height: 1 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px;
}

/* Remove BuddyBoss share UI on single posts */
.single-post .author-box-share-wrap,
.single-post a.bb-share,
.single-post .bb-share-container,
.single-post .bb-share-author-box {
  display: none !important;
}

.author-post-meta i {
  font-size: 24px;
  color: var(--bb-primary-color);
  -webkit-transition: all linear .2s;
  transition: all linear .2s;
}

@media (max-width: 768px){
  .single-post .post-meta-wrapper-main{
    flex-wrap: wrap;
  }
  .single-post .post-meta-wrapper-main .show-support{
    width: 100%;
    display: flex;
    justify-content: flex-end;
  }
}

/* Related posts module */
.single-post .post-related-posts{
  background: var(--bb-content-background-color);
  border: 1px solid var(--bb-content-border-color);
  border-radius: var(--bb-block-radius);
  padding: 20px 25px;
  margin-top: 16px;
}

/* Global figure cleanup */
body figure:not(.wp-block-image){
  margin: 0;
  margin-bottom: 2rem;
}

/* Caption alignment */
.wp-caption-text {
  text-align: left;
}


/* ======================================================
   BuddyBoss mobile right panel — normalize accordion state
   Bring account/profile toggles down toward the calmer
   Conjurly left-nav pattern for soft-launch consistency.
   ====================================================== */
@media (max-width: 960px){
  .bb-mobile-panel-wrapper.right .buddypanel .side-panel-menu li.current-menu-item > a,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .side-panel-menu > .current-menu-item > a,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .side-panel-menu .current-menu-parent.current-menu-item > a,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .side-panel-inner.is_block .buddypanel-menu-block li.current-menu-item > a,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .widget.widget_block .side-panel-inner.is_block .buddypanel-menu-block li.current-menu-item > a {
    background-color: var(--bb-sidenav-menu-background-color-regular, var(--bb-content-background-color)) !important;
    color: var(--bb-sidenav-text-regular, var(--bb-body-text-color)) !important;
  }

  .bb-mobile-panel-wrapper.right .buddypanel .side-panel-menu li.current-menu-item > a > i:not(.bb-icon-angle-down),
  .bb-mobile-panel-wrapper.right .buddypanel .side-panel-menu li.current-menu-item > a > .bs-submenu-toggle,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .side-panel-menu > .current-menu-item > a > .bs-submenu-toggle,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .side-panel-menu .current-menu-parent.current-menu-item > a > .bs-submenu-toggle,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .side-panel-inner.is_block .buddypanel-menu-block li.current-menu-item > a > .bs-submenu-toggle,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .widget.widget_block .side-panel-inner.is_block .buddypanel-menu-block li.current-menu-item > a > .bs-submenu-toggle {
    color: var(--bb-sidenav-text-regular, var(--bb-body-text-color)) !important;
    opacity: .58 !important;
  }

  .bb-mobile-panel-wrapper.right .buddypanel .side-panel-menu li.current-menu-item > a .count,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .side-panel-menu > .current-menu-item > a .count,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .side-panel-menu .current-menu-parent.current-menu-item > a .count,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .side-panel-inner.is_block .buddypanel-menu-block li.current-menu-item > a .count,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .widget.widget_block .side-panel-inner.is_block .buddypanel-menu-block li.current-menu-item > a .count {
    color: var(--bb-sidenav-count-text-color-regular, var(--bb-headings-color)) !important;
    background-color: var(--bb-sidenav-count-background-color-regular, var(--bb-content-alternate-background-color)) !important;
    border-color: rgba(0,0,0,0.05) !important;
  }

  .bb-mobile-panel-wrapper.right .buddypanel .side-panel-menu li:not(.current-menu-item) a:hover,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .buddypanel .side-panel-menu li:not(.current-menu-item) a:hover,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .side-panel-inner.is_block .buddypanel-menu-block li a:hover,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .widget.widget_block .side-panel-inner.is_block .buddypanel-menu-block li a:hover {
    background-color: var(--bb-sidenav-menu-background-color-hover, var(--bb-content-alternate-background-color)) !important;
  }

  /* Remove residual BuddyBoss toggle chrome while preserving tap area */
  .bb-mobile-panel-wrapper.right .bb-mobile-panel-inner .side-panel-menu a > .bs-submenu-toggle,
  .bb-mobile-panel-wrapper.right .bb-mobile-panel-inner .side-panel-menu .sub-menu a > .bs-submenu-toggle,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .bb-mobile-panel-inner .side-panel-menu a > .bs-submenu-toggle,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .bb-mobile-panel-inner .side-panel-menu .sub-menu a > .bs-submenu-toggle,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .side-panel-inner.is_block .buddypanel-menu-block li a > .bs-submenu-toggle,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .widget.widget_block .side-panel-inner.is_block .buddypanel-menu-block li a > .bs-submenu-toggle {
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
    border-radius: 0 !important;
    text-shadow: none !important;
    filter: none !important;
    width: 44px !important;
    height: 44px !important;
    line-height: 44px !important;
    text-align: center !important;
  }

  .bb-mobile-panel-wrapper.right .bb-mobile-panel-inner .side-panel-menu a > .bs-submenu-toggle::before,
  .bb-mobile-panel-wrapper.right .bb-mobile-panel-inner .side-panel-menu a > .bs-submenu-toggle::after,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .bb-mobile-panel-inner .side-panel-menu a > .bs-submenu-toggle::before,
  .bb-mobile-panel-wrapper.right .bb-template-v2 .bb-mobile-panel-inner .side-panel-menu a > .bs-submenu-toggle::after {
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
  }
}


/* =========================================================
   Mobile Header Logo Spacing
   Conjurly logo asset already includes optical breathing room.
   BuddyBoss default margin-left creates double spacing in Header 2.
   ========================================================= */
.bb-mobile-header .mobile-logo-wrapper {
  margin-left: 0 !important;
}


/* =========================================================
   Mobile Header Button Spacing
   Scope BuddyBoss button reset adjustment to custom mobile header.
   ========================================================= */
.bb-mobile-header button,
.bb-mobile-header html [type="button"],
.bb-mobile-header [type="reset"],
.bb-mobile-header [type="submit"] {
  appearance: button;
  margin-left: 8px !important;
}