/* =============================================================================
   SXSW 2026 — PanelPicker CSS
   =============================================================================
   STRUCTURE
   ─────────────────────────────────────────────────────────────────────────────
   SECTION 1 · FOUNDATIONAL
     1.1  Checkbox Validation
     1.2  Radio Label Capitalization

   SECTION 2 · CUSTOMIZATIONS
     2.1  Hidden RF Field IDs
     2.2  Agreement Form — Button Text Swap
     2.3  Home Page Session Table
     2.4  Session Summary Page
     2.5  Confirmation Page Redesign
     2.6  Community Voting — Label Renames
     2.7  Conf / EDU Participant Display Logic
     2.8  JS-Controlled State Classes
   ============================================================================= */


/* ── 1.1 Checkbox Validation ────────────────────────────────────────────────── */

/* Required-field indicator rendered in red below checkbox groups */
.rf-checkbox-container span.text-info {
    color: red !important;
    display: block;
    margin-bottom: .3em;
}


/* ── 1.2 Radio Label Capitalization ─────────────────────────────────────────── */

.rf-radio-container label,
.rf-checkbox-container label span {
    text-transform: capitalize;
}


/* =============================================================================
   SECTION 2 · CUSTOMIZATIONS
   Owner: Jennifer / JS team
   NOTE: Many selectors are coupled to specific RF field IDs, body-class guards,
   or class names toggled at runtime. Do not refactor independently of the JS.
   ============================================================================= */


/* ── 2.1 Hidden RF Field IDs ────────────────────────────────────────────────── */

/*
   Fields that must stay in the DOM for RF to read/write, but are hidden from users:
     wf-1749825374719001aVJc  — PanelPicker Special Link
     wf-1746546037836001NnUx  — PanelPicker Single Submission flag
     wf-1750187826268001pdG7  — (third control field)
     wf-1778011332696001sJqn  — idea_submitted_at (hidden in speaker workflow)
*/
body div#contact-info form div#wf-1749825374719001aVJc,
body div#contact-info form div#wf-1746546037836001NnUx,
body div#contact-info form div#wf-1750187826268001pdG7 {
    display: none !important;
}

#wf-1778011332696001sJqn {
    display: none;
}


/* ── 2.2 Agreement Form — Button Text Swap ──────────────────────────────────── */

/*
   Hides RF's generic submit button text and injects "Submit Application" via
   ::after. Matches both Conference and EDU agreement forms across all years.
*/
body[class*="form-agreementform"] button#wf-btn-submit span,
body[class*="form-agreementform"] button#wf-btn-submit:hover span,
body[class*="form-agreementform"] button#wf-btn-submit:hover {
    color: transparent !important;
    position: relative;
}

body[class*="form-agreementform"] button#wf-btn-submit span::after {
    content: "Submit Application";
    color: white;
    position: absolute;
    left: 0;
    top: 0;
}

body[class*="form-agreementform"] button#wf-btn-submit:hover span::after {
    content: "Submit Application";
    color: white;
    position: absolute;
    left: 0;
    top: 0;
}


/* ── 2.3 Home Page Session Table ────────────────────────────────────────────── */

/*
   - Renames column 3 header and link text: "Participant(s)" → "View Summary"
   - Hides column 4 ("Resend Email") entirely
   - Adds a pencil icon before the session title link in column 2
*/

/* Column 3 — rename link text */
div.sessionsAndSubmissions div.table-body div.table-row div:nth-child(3) a {
    visibility: hidden;
    font-size: 0px;
}
div.sessionsAndSubmissions div.table-body div.table-row div:nth-child(3) a:after {
    content: "View Summary";
    visibility: visible;
    font-size: 13px;
}

/* Column 3 — rename header */
div.sessionsAndSubmissions div.table-body div.table-header div:nth-child(3) {
    visibility: hidden;
    font-size: 0px !important;
}
div.sessionsAndSubmissions div.table-body div.table-header div:nth-child(3):after {
    content: "View Summary";
    visibility: visible;
    font-size: 13px;
}

/* Column 4 — hide entirely */
div.sessionsAndSubmissions div.table-body div.table-row div:nth-child(4) {
    display: none;
}

/* Column 2 — pencil icon before session title link */
[data-test^="rf-session-title-"] a {
    position: relative;
    display: inline-flex;
    align-items: center;
    font-size: 13px;
}
[data-test^="rf-session-title-"]:not(.uneditable) a::before {
    content: "";
    background: url(https://static.rainfocus.com/sxsw/sxsw26/static/staticfile/staticfile/icon-pencil_1750433859977001sdl5.svg) no-repeat;
    background-size: cover;
    width: 13px;
    height: 13px;
    display: inline-block;
    margin: 0 8px 0 0;
}
[data-test^="rf-session-title-"].uneditable a{
   color: gray !important;
}
[data-test^="rf-session-title-"] a:hover {
    text-decoration: underline;
}


/* ── 2.4 Session Summary Page ───────────────────────────────────────────────── */

/*
   Conference: renames submit button to "back" (this page is a review step, not final submit).
   EDU: hides submit button entirely.
*/

/* Conference — rename submit → "back" */
body[class*="panelpickerconference-form-submissionsummary"] #wf-btn-submit span {
    visibility: hidden;
    font-size: 0px;
}
body[class*="panelpickerconference-form-submissionsummary"] #wf-btn-submit span:after {
    content: "back";
    font-size: 13px;
    visibility: visible;
}

/* EDU — hide submit button */
body[class*="panelpickeredu-form-submissionsummaryform"] #wf-btn-submit {
    display: none;
}

/* ── 2.5 Confirmation Page - Redesign ───────────────────────────────────── */

#special-div .confirmation-page h1.success .confirm-check-mark {
    display: block;
}

/* ── 2.6 Community Voting — Label Renames ───────────────────────────────────── */

/*
   RF renders raw attribute keys as visible labels. These replace them with
   human-readable copy via visibility:hidden + ::after.
*/

/* "SessionTracks" → "Track: " */
body[class*="community-voting-page-community-voting"] .attribute-SessionTracks .attribute-name {
    visibility: hidden;
    font-size: 0px;
}
body[class*="community-voting-page-community-voting"] .attribute-SessionTracks .attribute-name::after {
    content: "Track: ";
    visibility: visible;
    font-size: var(--rf-brand-font-size);
}

/* "ConferenceName" → "Conference: " */
body[class*="community-voting-page-community-voting"] .attribute-ConferenceName .attribute-name {
    visibility: hidden;
    font-size: 0px;
}
body[class*="community-voting-page-community-voting"] .attribute-ConferenceName .attribute-name::after {
    content: "Conference: ";
    visibility: visible;
    font-size: var(--rf-brand-font-size);
}

/* "DescribeyourSessionIdea" → "Description" */
div.attribute-DescribeyourSessionIdea span.attribute-name {
    visibility: hidden;
    font-size: 0px;
}
div.attribute-DescribeyourSessionIdea span.attribute-name::after {
    content: "Description";
    font-size: 1.1em;
    visibility: visible;
}


/* ── 2.7 Conf / EDU Participant Display Logic ───────────────────────────────── */

/*
   Fields marked .show-for are conditionally shown based on whether the user
   is on a Conference or EDU participant page. JS adds the appropriate body
   class; CSS handles show/hide.
   ⚠️  Do not refactor these selectors independently of JS class-toggle logic.
*/

/* Hide all show-for fields by default */
div.wf-form-element-div:has(.show-for) {
    display: none;
}

/* Reveal Conference-specific fields on Conference participant pages */
body[class*="panelpickerconference"] div.wf-form-element-div:has(.show-for.conf),
body[class*="partner-programming-conference"] div.wf-form-element-div:has(.show-for.conf) {
    display: block;
}
/* Reveal EDU-specific fields on EDU participant pages */
body[class*="panelpickeredu"] div.wf-form-element-div:has(.show-for.edu),
body[class*="partner-programming-edu"] div.wf-form-element-div:has(.show-for.edu) {
    display: block;
}

/* Safari: checkbox input renders off-screen left; margin-left on label pulls it into view */
body[class*="form-organizer"] .rf-checkbox-container .checkbox > label {
    margin-left: 13px;
}

/* Fix list rendering inside revealed Conference fields */
body[class*="participant"] .wf-form-element-div li {
    display: list-item;
    list-style-position: outside;
    margin-left: 2em;
    font-size: .9em;
    margin-bottom: .3em;
    list-style-type: disc;
}

/* EDU Mentor field — move ⓘ icon to end of sentence */
#wf-temp_1777564944447 .rf-text-container {
    display: flex;
    align-items: center;
    gap: 6px;
}
#wf-temp_1777564944447 .rf-text-container button[data-test="rf-icon"] {
    order: 1;
}
#wf-temp_1777564944447 .rf-text-container .edu.show-for {
    order: 0;
    font-size: 16px;
    font-weight: 600 !important;
}

/* Hide participant labels where Conf/EDU differentiation was needed */
#wf-1748025617615001w0XM label.rf-label,
#wf-1748025679865001Ky8J label.rf-label,
#wf-1746202888417002bcvr label.rf-label,
#wf-1746202888424003bQtV label.rf-label {
    display: none;
}

/* Inline label style used by show-for elements */
.show-for.label {
    font-size: 16px;
    font-weight: 600;
}
body[class*="panelpickeredu"] ul.conf,
body[class*="partner-programming-edu"] ul.conf{
    display: none;
}
body[class*="panelpickerconf"] ul.edu,
body[class*="partner-programming-conference"] ul.edu{
    display: none;
}


/* Hide all workflow-specific lists by default */
.pp-conf,
.pp-edu,
.ppg-conf,
.ppg-edu { display: none; }

/* Reveal based on body class */
body[class*="panelpickerconference"] .pp-conf { display: block; }
body[class*="panelpickeredu"] .pp-edu { display: block; }
body[class*="partner-programming-conference"] .ppg-conf { display: block; }
body[class*="partner-programming-edu"] .ppg-edu { display: block; }


/* Hide Partner Programming-only fields on PanelPicker workflows */
body[class*="panelpicker"] #wf-temp_1781044640106,
body[class*="panelpicker"] #wf-formFileUpload_1781044855145001X7g4 { display: none; }


/* Hide panelpicker/partner-specific elements by default */
.panelpicker-only,
.partner-programming-only { display: none; }

/* Reveal on PanelPicker pages */
body[class*="panelpicker"] .panelpicker-only { display: block; }

/* Reveal on Partner Programming pages */
body[class*="partner-programming"] .partner-programming-only { display: block; }


/* ── 2.8 JS-Controlled State Classes ────────────────────────────────────────── */

/*
   .cfp-hidden   — toggled by JS to hide elements after a proposal is submitted
   .sxrfv-gated  — applied by JS to the submit button when URL validation fails
*/

.cfp-hidden {
    display: none;
}

/* Gated button — disabled appearance */
button.sxrfv-gated,
button.sxrfv-gated:hover {
    opacity: 0.45 !important;
    cursor: not-allowed !important;
    pointer-events: none;
}

/* Error message shown below the footer when submit is gated */
.form-footer-actions:has(button.sxrfv-gated)::after,
.modal-footer:has(button.sxrfv-gated)::after {
    content: 'Please enter a valid URL to continue.';
    display: block;
    text-align: right;
    margin-top: 6px;
    font-size: 0.8rem;
    color: #c0392b;
}

/* Foundational Rules */

body .rf-workflow .rf-text-container :is(ol,ul) li{
  list-style-position: outside;
  margin-bottom: 10px;
  margin-left: 1px;
}

/* ── Partner Programming — Landing Page Date/List Styles ────────────────────── */

body[class*="partner-programming"] main.panel_picker .voting .dates small em {
    font-family: inherit;
}
body[class*="partner-programming"] main.panel_picker .voting .dates ul {
    padding: 0px;
}
body[class*="partner-programming"] main.panel_picker .voting .dates ul li {
    list-style-type: none;
}
body[class*="partner-programming"] main.panel_picker .voting .dates h5 {
    font-size: 21px;
    text-transform: initial !important;
    font-family: var(--font-button) !important;
    margin-bottom: 0 !important;
}
body[class*="partner-programming"] .voting .dates h4 {
    padding-top: 0px;
    margin-top: 10px;
}
body[class*="partner-programming"] .voting .dates h4 em {
    font-family: inherit;
}
body[class*="partner-programming"] a.hide-before::before {
    display: none !important;
}

.rf-tooltip ul {
    margin-left: 15px;
    margin-bottom: 10px;
    margin-top: 10px;
    padding-left: 20px;
}

/* sxds-rf.css sets the tooltip <li>s to display:flex, which kills the
   list marker — force them back to list-item so bullets render.
   Match the font to the surrounding <p> (18px Founders-Text). */
.rf-tooltip ul li {
    display: list-item;
    font-size: 18px;
    font-family: Founders-Text, Helvetica, Arial, sans-serif;
}
