/*
 * Section colours on hover. Loaded on every page next to c/hub-tokens.css.
 *
 * Buttons (the gradient buttons in a section's row, div.subMenues from Menu::SubMenu) take the
 * section's colour on hover. On trial: Ven buttons turn Ven green, the Ultra Assets button violet to pink.
 *
 * Cards (the white boxes on the blue page) get a thin edge on hover, the way the home page's
 * Flow and News cards light up in white or blue. Ultra asset cards: a violet-to-pink edge.
 * Ven cards: a pale green edge, in c/ven/ven-pages.css.
 */
div.subMenues a.hub-gradient-btn { transition: box-shadow .2s ease, background .2s ease; }

#sub-ven a.hub-gradient-btn:hover,
#sub-ven a.hub-gradient-btn:focus-visible {
    background: linear-gradient(264deg, #3F8F6B 0%, #3A8664 45%, #347A5B 75%, #3A8664 100%) 0% 0% no-repeat !important;
    box-shadow: 0 0 0 2px #BFE5D2, 0 0 20px rgba(96, 191, 147, .45);
    outline: 0;
}

#sub-markets a.hub-gradient-btn[href*="ultra"]:hover,
#sub-markets a.hub-gradient-btn[href*="ultra"]:focus-visible {
    background: linear-gradient(264deg, #BE185D 0%, #9D2BB5 50%, #6D28D9 100%) 0% 0% no-repeat !important;
    box-shadow: 0 0 0 2px rgba(240, 171, 252, .9), -6px 0 22px rgba(168, 85, 247, .7), 6px 0 22px rgba(236, 72, 153, .7);
    outline: 0;
}

/* Ultra asset cards: a 1px violet-to-pink edge, drawn as an overlay so the card's own
   background (often the asset's image) is untouched. */
.ultra-assets-flip-container .thecard::after,
.my-ultra-assets .thecard::after,
.thecard.asset-view-block::after,
.thecard.ultra-project-card::after,
.thecard.ultra-secondaries::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: 1px;
    background: linear-gradient(135deg, #A855F7 0%, #D946EF 50%, #EC4899 100%);
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
    opacity: 0;
    transition: opacity .2s ease;
    pointer-events: none;
}
.ultra-assets-flip-container .thecard:hover::after,
.my-ultra-assets .thecard:hover::after,
.thecard.asset-view-block:hover::after,
.thecard.ultra-project-card:hover::after,
.thecard.ultra-secondaries:hover::after { opacity: 1; }

@media (prefers-reduced-motion: reduce) {
    div.subMenues a.hub-gradient-btn { transition: none; }
}