/*
 * org-chart.v8.css  (plugin v1.2.6 / ZIP v10)
 * Additive layer on top of v4 → v5 → v6 → v7.
 * Do NOT modify v1–v7 CSS files.
 *
 * Changes in this file:
 *
 *   1. Bridge geometry fix
 *      v7 moved bridges to side-column pseudo-elements (::after / ::before).
 *      Those bridges terminated at the card's left/right EDGE, while the
 *      full-height vertical connector (org-card-anchor::before) sits at the
 *      card CENTER (left:50%).  The gap between bridge-end and vertical line
 *      produced a disconnected "kink" instead of a clean T-junction.
 *
 *      Fix: bridges return to org-card-anchor::before / ::after.
 *      New width formula:  calc(50% + 32px)
 *        • right:50% / left:50%  → right/left edge of bridge anchors exactly
 *          at the vertical connector line (card centre).  ✓
 *        • calc(50% + 32px) spans from the vertical line outward:
 *          50% = half the card-anchor width (to the card edge) +
 *          32px = the flex gap  →  left edge lands at the spine.  ✓
 *      The v7 side-column bridge rules are suppressed with content:none.
 *
 *   2. Filled card style   (.org-chart__card--filled)
 *      Adds a light 12%-opacity tint of --node-color as the card background.
 *      PHP emits --card-fill-alpha as an rgba() value computed from the
 *      stored hex colour.  The top stripe (border-top-color) is unchanged.
 *
 *   3. Text colour         (--card-text-color)
 *      Optional per-node CSS custom property.  When set (PHP emits it on
 *      the card's style attribute), all card text inherits this colour.
 *      When absent, cards inherit the document's default text colour — no
 *      change for existing charts.
 *
 * Cascade strategy
 *   Same selectors as v7 where an override is needed → later load order
 *   decides the winner.  No !important used.
 */

/* ─────────────────────────────────────────────────────────────────────────────
 * 1.  Bridge geometry fix
 * ─────────────────────────────────────────────────────────────────────────── */

/*
 * STEP A — Suppress v7 side-column bridge pseudo-elements.
 * Same selectors → v8 wins by cascade.  ✓
 */
.org-card-row.has-side-left  .org-side-column--left::after  { content: none; }
.org-card-row.has-side-right .org-side-column--right::before { content: none; }

/*
 * STEP B — Suppress v6 left-bridge rule that v7 had already suppressed
 * (included here for clarity; cascade already handles it, but explicit is safer).
 */
.org-card-row.has-side-left .org-card-anchor::before {
	content: none;
}

/*
 * STEP C — Re-enable ::before on org-card-anchor when has-main-children.
 * Specificity (0,4,1) beats STEP B's (0,3,1).  ✓
 * This rule is identical to v7's full-height connector — it is re-stated here
 * to ensure the correct content:''/position:absolute declaration stays active
 * after STEP B's content:none.  Same selector → v8 cascade wins over v7. ✓
 */
.org-card-row.has-side-left  .org-card-anchor.has-main-children::before,
.org-card-row.has-side-right .org-card-anchor.has-main-children::before {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	right: auto;
	transform: translateX(-50%);
	width: var(--org-line-weight, 1.5px);
	height: auto;
	background: var(--org-line-color, rgba(100,116,139,0.55));
	z-index: 0;
	pointer-events: none;
}

/*
 * STEP D — LEFT BRIDGE on org-card-anchor::before (nodes WITHOUT main children).
 *
 * For nodes that have a left side column but NO main children, has-main-children
 * is absent, so STEP C does not fire.  We need a bridge but NOT the full-height
 * line.  Use the same pseudo-element with a horizontal-only rule.
 *
 * Specificity (0,3,1) — same as STEP B.  v8 cascade wins over v6's original
 * left-bridge rule (also 0,3,1).  ✓
 *
 * right: 50%              → right edge at card centre (= vertical connector axis)
 * width: calc(50% + 32px) → spans from card centre to spine:
 *                            50% = half card-anchor to card left-edge,
 *                            32px = flex gap to spine.  ✓
 * top: 50%                → card vertical centre (anchor is align-self:stretch,
 *                            justify-content:center, so 50% = card centre).  ✓
 */
.org-card-row.has-side-left .org-card-anchor::before {
	content: '';
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 50%;
	width: calc(50% + 32px);
	height: var(--org-line-weight, 1.5px);
	background: var(--org-line-color, rgba(100,116,139,0.55));
	z-index: 1;
	pointer-events: none;
}

/*
 * STEP E — RIGHT BRIDGE on org-card-anchor::after.
 *
 * v6 already defined this rule (0,3,1); v7 suppressed it with content:none
 * (same specificity, cascade).  v8 re-enables with new geometry.
 * v8 cascade wins over v7's suppression.  ✓
 *
 * left: 50%               → left edge at card centre.
 * width: calc(50% + 32px) → spans from card centre to right spine.  ✓
 */
.org-card-row.has-side-right .org-card-anchor::after {
	content: '';
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 50%;
	width: calc(50% + 32px);
	height: var(--org-line-weight, 1.5px);
	background: var(--org-line-color, rgba(100,116,139,0.55));
	z-index: 1;
	pointer-events: none;
}

/* ─────────────────────────────────────────────────────────────────────────────
 * 2.  Filled card style
 * ─────────────────────────────────────────────────────────────────────────── */

/*
 * PHP adds class org-chart__card--filled and emits --card-fill-alpha as an
 * rgba() value computed from node_color at 12% opacity.
 *
 * The top stripe (border-top-color: var(--node-color)) is unchanged — it is
 * defined in v4.css and this rule does not touch it.
 *
 * Specificity (0,2,0) — higher than v4's .org-chart__card (0,1,0).  ✓
 */
.org-chart__card.org-chart__card--filled {
	background: var(--card-fill-alpha, rgba(156,163,175,0.12));
}

/* ─────────────────────────────────────────────────────────────────────────────
 * 3.  Text colour
 * ─────────────────────────────────────────────────────────────────────────── */

/*
 * --card-text-color is emitted by PHP only when text_color is non-empty.
 * When the property is absent, `inherit` means the card picks up the
 * surrounding document colour — no visual change for existing charts.  ✓
 *
 * All text inside the card (title, name, role, description, contact links)
 * is wrapped in .card__content which is a child of .org-chart__card.
 * Setting `color` on the card cascades into every child element.
 *
 * Specificity (0,1,0) — same as v4's .org-chart__card declaration.
 * v8 cascade wins.  ✓
 */
.org-chart__card {
	color: var(--card-text-color, inherit);
}