/**
 * CCIS Access Rights field — frontend styling ("Tipologie di ticket CCIS").
 *
 * Minimal, theme-neutral defaults for the Phase 2 multi-ticket builder.
 *
 * Specificity note: every rule is scoped under `.gform_wrapper` so the
 * resulting selectors weigh (0,2,0). This is required to beat the
 * Gravity Forms framework reset
 *   `.gform-theme--framework :where(...) { all: unset; display: revert; }`
 * which weighs (0,1,0) and is loaded after our stylesheet.
 *
 * Class names (stable):
 *   .ccis-access-rights                 — outer wrapper (data-* attrs)
 *   .ccis-access-rights__list           — list of ticket-type cards
 *   .ccis-access-rights__list--{layout} — espanso | accordion
 *   .ccis-ar-card[.is-collapsed]        — single ticket-type card
 *   .ccis-ar-card__header               — name + badges + price (accordion toggle)
 *   .ccis-ar-card__body                 — groups + add button
 *   .ccis-ar-groups / .ccis-ar-group    — ticket groups (M participant rows each)
 *   .ccis-ar-group__head                — group title + remove (M > 1)
 *   .ccis-ar-participant / .ccis-ar-pp  — participant row + its inputs
 *   .ccis-ar-add                        — add ticket/participant button
 *   .ccis-ar-remove-group               — remove a ticket group
 *   .ccis-ar-badge                      — single badge pill
 *   .ccis-ar-name / .ccis-ar-price      — card name / price label
 *
 * @since    0.4.0
 * @modified 0.5.0 Restyled for the multi-ticket builder (cards + groups).
 */

.gform_wrapper .ccis-access-rights {
    display: block;
    margin: 8px 0;
}

.gform_wrapper .ccis-access-rights.is-unconfigured .ccis-access-rights__placeholder,
.gform_wrapper .ccis-access-rights .ccis-access-rights__placeholder {
    background: #fff8e1;
    border: 1px solid #f1c40f;
    padding: 10px 12px;
    border-radius: 3px;
    font-size: 13px;
    color: #7a5c00;
}

.gform_wrapper .ccis-access-rights__empty {
    background: #f7f7f7;
    border: 1px dashed #cfcfcf;
    padding: 12px;
    text-align: center;
    color: #666;
    border-radius: 3px;
}

/* ---------- List container ---------- */

.gform_wrapper .ccis-access-rights__list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* ---------- Loading skeleton (initial / precompile) ---------- */

.gform_wrapper .ccis-ar-skeleton {
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: relative;
}

.gform_wrapper .ccis-ar-skeleton__spinner {
    position: absolute;
    top: 8px;
    right: 8px;
    width: 18px;
    height: 18px;
    border: 2px solid #dcdcde;
    border-top-color: #2271b1;
    border-radius: 50%;
    animation: ccis-ar-spin 0.7s linear infinite;
}

.gform_wrapper .ccis-ar-skeleton__card {
    border: 1px solid #ededed;
    border-radius: 6px;
    padding: 14px;
    background: #fff;
}

.gform_wrapper .ccis-ar-skeleton__line {
    height: 12px;
    border-radius: 6px;
    margin: 0 0 10px;
    background: linear-gradient(90deg, #eee 25%, #f5f5f5 37%, #eee 63%);
    background-size: 400% 100%;
    animation: ccis-ar-shimmer 1.2s ease-in-out infinite;
}

.gform_wrapper .ccis-ar-skeleton__line:last-child {
    margin-bottom: 0;
}

.gform_wrapper .ccis-ar-skeleton__line--title {
    width: 45%;
    height: 16px;
}

.gform_wrapper .ccis-ar-skeleton__line--short {
    width: 65%;
}

@keyframes ccis-ar-shimmer {
    0%   { background-position: 100% 0; }
    100% { background-position: 0 0; }
}

@keyframes ccis-ar-spin {
    to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
    .gform_wrapper .ccis-ar-skeleton__spinner,
    .gform_wrapper .ccis-ar-skeleton__line {
        animation: none;
    }
}

/* ---------- Ticket-type card ---------- */

.gform_wrapper .ccis-ar-card {
    background: #fff;
    border: 1px solid #dcdcde;
    border-radius: 6px;
    overflow: hidden;
}

.gform_wrapper .ccis-ar-card__header {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    padding: 12px 14px;
    background: #f6f7f7;
    border-bottom: 1px solid #e2e2e4;
}

.gform_wrapper .ccis-access-rights__list--accordion .ccis-ar-card__header {
    cursor: pointer;
}

.gform_wrapper .ccis-access-rights__list--accordion .ccis-ar-card__header::after {
    content: "\25BE"; /* ▾ */
    margin-left: 4px;
    transition: transform 0.15s ease;
}

.gform_wrapper .ccis-access-rights__list--accordion .ccis-ar-card.is-collapsed .ccis-ar-card__header::after {
    transform: rotate(-90deg);
}

.gform_wrapper .ccis-ar-card.is-collapsed .ccis-ar-card__body {
    display: none;
}

.gform_wrapper .ccis-ar-card__body {
    padding: 12px 14px;
}

.gform_wrapper .ccis-ar-name {
    font-weight: 600;
    font-size: 14px;
}

.gform_wrapper .ccis-ar-price {
    margin-left: auto;
    font-weight: 600;
    font-size: 13px;
    color: #2c2c2c;
}

.gform_wrapper .ccis-ar-price--free {
    color: #1a7f37;
}

/* ---------- Ticket groups ---------- */

.gform_wrapper .ccis-ar-groups {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.gform_wrapper .ccis-ar-group {
    border: 1px solid #ededed;
    border-radius: 4px;
    padding: 10px 12px;
    background: #fcfcfc;
}

.gform_wrapper .ccis-ar-group__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
}

.gform_wrapper .ccis-ar-group__title {
    font-weight: 600;
    font-size: 13px;
}

/* ---------- Participant row ---------- */

.gform_wrapper .ccis-ar-participant {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 8px;
}

.gform_wrapper .ccis-ar-participant + .ccis-ar-participant {
    margin-top: 8px;
}

.gform_wrapper .ccis-ar-pp-field {
    display: flex;
    flex-direction: column;
    gap: 2px;
    flex: 1 1 140px;
    font-size: 12px;
    color: #555;
}

.gform_wrapper .ccis-ar-pp {
    width: 100%;
    padding: 6px 8px;
}

/* ---------- Buttons ---------- */

.gform_wrapper .ccis-ar-add {
    margin-top: 12px;
    padding: 8px 14px;
    border: 1px dashed #2271b1;
    border-radius: 4px;
    background: #f0f6fc;
    color: #2271b1;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

.gform_wrapper .ccis-ar-add:hover {
    background: #e0eefb;
}

.gform_wrapper .ccis-ar-add[disabled] {
    opacity: 0.5;
    cursor: not-allowed;
}

.gform_wrapper .ccis-ar-remove-group {
    border: none;
    background: transparent;
    color: #d63638;
    font-size: 12px;
    cursor: pointer;
    padding: 2px 6px;
}

.gform_wrapper .ccis-ar-remove-inline {
    flex: 0 0 auto;
    font-size: 18px;
    line-height: 1;
    align-self: center;
}

.gform_wrapper .ccis-ar-cap-note {
    margin: 8px 0 0;
    font-size: 12px;
    color: #777;
}

/* ---------- Badges ---------- */

.gform_wrapper .ccis-ar-badge {
    display: inline-block;
    padding: 2px 8px;
    border-radius: 999px;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    line-height: 1.4;
}

/* ---------- Audience toggle (Phase 1 § Scope Extension C) ---------- */

.gform_wrapper .ccis-access-rights__audience {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    margin: 0 0 16px 0;
    padding: 12px 14px;
    border: 1px solid #dcdcde;
    border-radius: 6px;
    background: #f6f7f7;
}

.gform_wrapper .ccis-access-rights__audience-legend {
    flex: 1 0 100%;
    padding: 0;
    margin: 0 0 4px 0;
    font-weight: 600;
    font-size: 14px;
    color: #1d2327;
}

.gform_wrapper .ccis-access-rights__audience-option {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: 1px solid #c3c4c7;
    border-radius: 999px;
    background: #fff;
    font-size: 13px;
    cursor: pointer;
    user-select: none;
    transition: background-color 0.12s ease, border-color 0.12s ease;
}

.gform_wrapper .ccis-access-rights__audience-option:hover {
    border-color: #2271b1;
}

.gform_wrapper .ccis-access-rights__audience-option.is-selected {
    border-color: #2271b1;
    background: #2271b1;
    color: #fff;
}

.gform_wrapper .ccis-access-rights__audience-option input[type="radio"] {
    /* Hide the native input visually but keep it accessible. */
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    border: 0;
}