/* Fourth account tab and registration overview. Kept separate from user.css. */
.cc-space-navigation {
    width: 100%;
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

/* The last desktop dropdown is flush with the viewport edge. Open it inward. */
@media (min-width: 992px) {
    header.header .grid-child.container-nav ul.mod-menu > li:last-child > ul.mm-collapse {
        right: 0;
        left: auto;
        margin-inline-end: 0;
        max-width: calc(100vw - 2rem);
    }
}

.cc-space-navigation__item {
    width: 100%;
    min-width: 0;
}

.cc-space-navigation__item small {
    white-space: normal;
    line-height: 1.3;
}

.cc-registrations-page {
    --cc-space-active: #65318a;
    --cc-space-active-ink: #ffffff;
    --cc-space-active-muted: rgba(255, 255, 255, 0.72);
    --cc-space-active-icon: #65318a;
    --cc-space-accent: #9b6ab3;
    width: 100%;
    max-width: 74rem;
    margin-block: clamp(1rem, 3vw, 2rem) 4rem;
    margin-inline: auto;
}

.cc-space-hero--registrations {
    background:
        radial-gradient(circle at 92% 15%, rgba(255, 255, 255, 0.12), transparent 24%),
        linear-gradient(120deg, #30213a 0%, #4b3158 66%, #654077 100%);
}

/* Personal-space section headers all use the Mon profil violet palette. */
.cc-resource-module[data-cc-resource-group="intro"],
.cc-orders-page,
.cc-order-history-page,
.cc-order-detail-page {
    --cc-space-active: #65318a;
    --cc-space-active-ink: #ffffff;
    --cc-space-active-muted: rgba(255, 255, 255, 0.72);
    --cc-space-active-icon: #65318a;
    --cc-space-accent: #9b6ab3;
}

.cc-account-intro,
.cc-orders-hero,
.cc-order-history-hero,
.cc-order-detail-hero {
    background:
        radial-gradient(circle at 92% 15%, rgba(255, 255, 255, 0.12), transparent 24%),
        linear-gradient(120deg, #30213a 0%, #4b3158 66%, #654077 100%);
}

.cc-account-intro::before {
    color: #e0c6eb;
}

.cc-orders-hero .cc-orders-kicker,
.cc-order-history-hero .cc-orders-kicker,
.cc-order-detail-hero .cc-orders-kicker {
    color: #e0c6eb;
}

.cc-registrations-hero__count {
    padding: .55rem .85rem;
    color: #fff;
    border: 1px solid rgba(255, 255, 255, .32);
    border-radius: 999px;
    background: rgba(255, 255, 255, .09);
    font-size: .75rem;
    font-weight: 750;
    white-space: nowrap;
}

.cc-registrations-journey {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem .7rem;
    align-items: center;
    margin: 1.35rem 0 2rem;
    padding: .95rem 1.2rem;
    color: #55475b;
    background: #fbf8fc;
    border: 1px solid #eee5f0;
    border-radius: .85rem;
    font-size: .79rem;
    font-weight: 650;
}

.cc-registrations-journey [aria-hidden] {
    color: #b26c90;
}

.cc-registrations-section {
    margin: 0 0 2.25rem;
}

.cc-registrations-section__heading {
    display: flex;
    gap: .9rem;
    align-items: center;
    margin-bottom: 1rem;
    padding-bottom: .85rem;
    border-bottom: 1px solid #e8e0ea;
}

.cc-registrations-section__heading > span:first-child {
    display: grid;
    flex: 0 0 2.65rem;
    height: 2.65rem;
    place-items: center;
    color: #633877;
    background: #f2ebf5;
    border-radius: .8rem;
}

.cc-registrations-section--event .cc-registrations-section__heading > span:first-child {
    color: #84532a;
    background: #fbefdf;
}

.cc-registrations-section--training .cc-registrations-section__heading > span:first-child {
    color: #14687b;
    background: #e5f5f7;
}

.cc-registrations-section--volunteer .cc-registrations-section__heading > span:first-child {
    color: #a4435c;
    background: #faedf0;
}

.cc-registrations-section__heading h2 {
    margin: 0;
    color: #432d4e;
    font-size: clamp(1.3rem, 2vw, 1.55rem);
    font-weight: 850;
}

.cc-registrations-section__heading p {
    margin: .1rem 0 0;
    color: #786e7c;
    font-size: .83rem;
}

.cc-registrations-section__count {
    margin-left: auto;
    color: #7a6c80;
    font-size: .74rem;
    font-weight: 750;
    white-space: nowrap;
}

.cc-registrations-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 20rem), 1fr));
    gap: 1rem;
}

.cc-registration-card {
    display: flex;
    min-height: 19rem;
    min-width: 0;
    flex-direction: column;
    justify-content: space-between;
    padding: clamp(1.25rem, 2vw, 1.65rem);
    color: #442950;
    background: #fbf9fc;
    border: 1px solid #e5deea;
    border-radius: 1.25rem;
    box-shadow: 0 .8rem 2rem rgba(51, 25, 64, .07);
}

.cc-registration-card--open {
    background: #fff;
    border-color: #d9cce2;
    box-shadow: 0 .9rem 2.2rem rgba(70, 35, 87, .095);
}

.cc-registration-card--validated,
.cc-registration-card--closed {
    background: #f6f5f7;
    border-color: #e5e2e8;
    box-shadow: 0 .4rem 1.25rem rgba(51, 25, 64, .035);
}

.cc-registration-card--validated .cc-registration-card__icon,
.cc-registration-card--closed .cc-registration-card__icon {
    color: #817887;
    background: #ebe8ee;
}

.cc-registration-card--validated .cc-registration-card__eyebrow,
.cc-registration-card--closed .cc-registration-card__eyebrow {
    color: #8b818e;
}

.cc-registration-card.cc-registration-card--validated h3,
.cc-registration-card.cc-registration-card--closed h3 {
    color: #665d6a;
}

.cc-registration-card--validated .cc-registration-card__description,
.cc-registration-card--closed .cc-registration-card__description {
    color: #817985;
}

.cc-registration-card--validated .cc-registration-card__action {
    color: #fff;
    background: #623985;
    border-color: #623985;
    box-shadow: 0 .35rem .8rem rgba(69, 35, 97, .16);
}

.cc-registration-card--validated .cc-registration-card__action:hover,
.cc-registration-card--validated .cc-registration-card__action:focus-visible {
    color: #fff;
    background: #442660;
    border-color: #442660;
}

.cc-registration-card__top {
    display: flex;
    gap: .6rem;
    align-items: center;
    justify-content: space-between;
}

.cc-registration-card__icon {
    display: grid;
    width: 2.7rem;
    height: 2.7rem;
    place-items: center;
    color: #704889;
    background: #f0e9f5;
    border-radius: .8rem;
}

.cc-registration-card__status {
    padding: .38rem .66rem;
    color: #5c3971;
    background: #efe8f4;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 800;
    line-height: 1.25;
    text-align: center;
}

.cc-registration-card--pending .cc-registration-card__status {
    color: #77541a;
    background: #fff5dc;
}

.cc-registration-card--validated .cc-registration-card__status {
    color: #246448;
    background: #e7f5ed;
}

.cc-registration-card--closed .cc-registration-card__status {
    color: #665d69;
    background: #f1eef2;
}

.cc-registration-card__body {
    margin-top: .6rem;
}

.cc-registration-card__eyebrow {
    margin: 0 0 .4rem;
    color: #806991;
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.cc-registration-card h3 {
    margin: 0 0 .45rem;
    color: #432d4e;
    font-size: clamp(1.45rem, 2vw, 1.8rem);
    font-weight: 870;
    letter-spacing: -.035em;
    line-height: 1.18;
}

.cc-registration-card__description {
    margin: 0;
    color: #776a7e;
    font-size: .82rem;
    line-height: 1.5;
}

.cc-registration-card__detail {
    margin: .55rem 0 0;
    color: #765d7d;
    font-size: .73rem;
    line-height: 1.45;
}

.cc-registration-card__action {
    display: inline-flex;
    gap: .65rem;
    align-items: center;
    align-self: flex-start;
    justify-content: space-between;
    min-height: 2.55rem;
    margin-top: 1.15rem;
    padding: .55rem .88rem;
    color: #5a2c83;
    background: #fff;
    border: 1px solid #e2d7e8;
    border-radius: 999px;
    font-size: .76rem;
    font-weight: 800;
    text-decoration: none;
    transition: color .18s ease, background-color .18s ease, border-color .18s ease;
}

.cc-registration-card__action:hover,
.cc-registration-card__action:focus-visible {
    color: #fff;
    background: #65318a;
    border-color: #65318a;
    text-decoration: none;
}

@media (prefers-reduced-motion: reduce) {
    .cc-registration-card__action {
        transition: none;
    }
}

@media (max-width: 1100px) {
    .cc-space-navigation {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 800px) {
    .cc-space-navigation {
        grid-template-columns: 1fr;
    }

    .cc-registrations-hero__count {
        justify-self: start;
    }
}