/* ==========================================================
   Titan toggle - crimson wipe across the header on open
   ----------------------------------------------------------
   WHY THIS FILE EXISTS
   Divi 5 handles the open/closed COLOURS natively (openToggle,
   closedTitle, openToggleIcon, closedToggleIcon on the preset).
   What it cannot express is the wipe itself:
     1. transform-origin (must flip right -> left)
     2. a pseudo-element keyed to the module's open state

   Deliberately scoped to the HEADER only. If the wipe covered
   the whole open toggle, the body copy would sit on crimson -
   the exact grey-on-red pairing the token system exists to
   prevent - and seven open toggles would turn the page red.

   NOTHING IN HERE IS A HARDCODED VALUE. Every colour and size
   is a Divi global colour or global variable.

   APPLIES TO
   Any toggle given the CSS class "titan-toggle".
   ========================================================== */

/* The module preset sets padding to 0 so the title's own box IS
   the header bar. Padding is restored here, on the two parts. */
.titan-toggle .et_pb_toggle_title {
  position: relative;
  z-index: 0;
  margin: 0;
  padding: var(--gvid-f75cfecf-61cf-4639-85f0-33d96e4a7891)   /* Space 24 */
           var(--gvid-49648f77-b6a6-4a6a-9d26-92ce57465351)   /* Space 48 - clears the icon */
           var(--gvid-f75cfecf-61cf-4639-85f0-33d96e4a7891)
           var(--gvid-f75cfecf-61cf-4639-85f0-33d96e4a7891);
  transition: color 180ms ease-out;
}

/* Top padding separates the answer from the crimson header bar
   when open (Space 24, matching the sides). */
.titan-toggle .et_pb_toggle_content {
  padding: var(--gvid-f75cfecf-61cf-4639-85f0-33d96e4a7891)   /* Space 24 */
           var(--gvid-f75cfecf-61cf-4639-85f0-33d96e4a7891)
           var(--gvid-f75cfecf-61cf-4639-85f0-33d96e4a7891);
}

/* Divi draws the +/- icon as ::before on the title, so the wipe
   uses ::after. Sits behind the title text via z-index. */
.titan-toggle .et_pb_toggle_title::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--gcid-2bb8a513-465e-4f74-9d35-e2947186ec89); /* Titan Crimson */
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform 180ms ease-out;
}

.titan-toggle.et_pb_toggle_open .et_pb_toggle_title::after {
  transform: scaleX(1);
  transform-origin: left center;
}

/* Keep Divi's icon inside the restored padding rather than flush
   to the card edge. */
.titan-toggle .et_pb_toggle_title::before {
  right: var(--gvid-f75cfecf-61cf-4639-85f0-33d96e4a7891);
}

@media (prefers-reduced-motion: reduce) {
  .titan-toggle .et_pb_toggle_title,
  .titan-toggle .et_pb_toggle_title::after {
    transition: none;
  }
}
