.app-input{font:inherit;color:#222;background:#fff;border:1px solid #767676;border-radius:3px;min-height:42px;padding:8px 10px;max-width:100%;box-sizing:border-box}
.app-input:disabled{background:#ececec;color:#606060;cursor:not-allowed}
.app-input:focus-visible,.app-button:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #2464a0;outline-offset:3px}
.app-button{font:inherit;font-weight:600;background:#111;color:#fff;border:1px solid #111;border-radius:3px;padding:10px 18px;min-height:42px;cursor:pointer;line-height:1.35}
.app-button:hover:not(:disabled){background:#383838;color:#fff}
.app-button:disabled{background:#ddd;border-color:#aaa;color:#555;cursor:not-allowed}
.app-form-items{display:grid;grid-template-columns:repeat(var(--form-columns,1),minmax(0,1fr));gap:20px}
.app-form-item{min-width:0}.app-form-item>label{display:block;margin-bottom:6px}
.app-form-buttons{display:flex;gap:12px;margin-top:24px}.app-radio{border:0;padding:0;margin:8px 0;display:flex;gap:24px;flex-wrap:wrap;min-width:0}
.app-radio label,.app-multiselect label{display:flex;align-items:center;gap:8px;cursor:pointer}.app-radio input,.app-multiselect input[type=checkbox]{width:18px;height:18px;accent-color:#111}
.app-multiselect{border:1px solid #767676;border-radius:3px;padding:8px;min-width:0}.app-multiselect legend{font-size:14px;float:none;width:auto;padding:0 4px}.app-multiselect-options{max-height:180px;overflow:auto;display:grid;gap:8px;margin-top:8px}
.app-dialog{position:fixed;inset:0;margin:auto!important;height:fit-content;max-width:calc(100vw - 32px);max-height:85vh;border:1px solid #555;border-radius:6px;padding:24px;background:#fff;color:#171717;box-shadow:0 16px 48px #0003}
.app-dialog::backdrop{background:#0009}.app-dialog-heading{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:20px}.app-dialog h2{font-size:1.4rem;margin:0}.app-dialog p{line-height:1.6}
.app-dialog.popupwindownew{min-width:0!important;max-width:min(420px,calc(100vw - 32px))!important;overflow:auto!important}
.app-loading{display:block;padding:24px}.app-table-toolbar{display:flex;gap:16px;align-items:end;flex-wrap:wrap;padding:16px 0}.app-table-toolbar label{display:grid;gap:5px}.app-table-toolbar span{align-self:center;font-variant-numeric:tabular-nums}
.app-table-scroll{overflow:auto;max-width:100%;border:1px solid #ccc}.app-table{border-collapse:collapse;width:100%;font-size:14px;background:#fff;color:#222}.app-table th,.app-table td{padding:12px;border-bottom:1px solid #ddd;text-align:left;vertical-align:top}
.app-table thead{background:#f2f2f2}.app-column-width{width:170px;min-width:100px;resize:horizontal;overflow:auto}.app-column-width .app-input{width:100%;margin-top:8px;min-height:36px}
.app-sort{background:none;border:0;font:inherit;font-weight:700;padding:0;cursor:pointer;text-align:left;color:#171717}.app-group{background:#ececec}.app-table tbody tr:hover{background:#f6f6f6}
.app-pagination{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:16px 0}.app-pagination span{font-variant-numeric:tabular-nums}.app-column-options{margin:8px 0}.app-column-options>div{display:flex;gap:8px;align-items:center;padding:5px}.app-column-options>div>span{min-width:200px}
.recipient-list{padding-left:20px}.recipient-list li{margin:8px 0}
::selection{background:#222;color:#fff}.app-input{caret-color:#111}
fieldset.app-form-items{border:0;padding:0;margin:0;min-width:0}
.input-hint{display:block;font-size:14px;line-height:1.5;color:#555;margin:6px 0 0}
.app-input.invalid{border-color:#a41515}
.form-errors{padding:12px 16px;margin:16px 0;color:#8c1010;background:#fff3f3;border:1px solid #a41515;line-height:1.5}
.form-errors ul{margin-bottom:0}.validation-message{color:#a41515!important}
.app-input,.app-button{min-height:44px}
.app-radio label{min-height:44px;padding:4px 0}
.app-form-buttons{flex-wrap:wrap;align-items:center}
.app-form-buttons>p{flex:1 1 220px;margin:0}
.confirmation-content{display:block!important;overflow-y:auto;padding:40px!important}
.confirmation-content h1{font-size:clamp(28px,3vw,40px);margin-bottom:24px}
.confirmation-details{margin:28px 0}.confirmation-details dt{margin-top:20px}.confirmation-details dd{margin:6px 0 0}
.confirmation-content .app-button{display:inline-block;text-decoration:none;margin:12px 0}
dialog.edit-side-panel{border:0;padding:0;margin:0!important;inset:0!important;width:100vw!important;height:100dvh!important;max-width:none;max-height:100dvh;background:transparent;overflow:hidden;transition:opacity .2s ease-out!important}
dialog.edit-side-panel::backdrop{background:#0008}
.edit-side-panel .edit-panel-content{top:0;height:100%;width:min(440px,100vw);max-width:100%}
.edit-side-panel .edit-panel-header .close-btn{font-size:16px;min-height:44px;min-width:64px;color:#222}
.edit-side-panel .edit-panel-body{min-height:0}
.edit-side-panel .edit-panel-footer{flex-wrap:wrap}
.loginformContainer input{font-size:16px;min-height:44px}
.app-table-toolbar input,.app-table-toolbar select{font-size:16px}
.app-column-options summary,.app-sort{min-height:44px}
@media(max-width:700px){
 .statusBlockReminder>div{flex-wrap:wrap;gap:12px;padding-inline:12px!important}
 .statusBlockReminder h3{font-size:24px}.statusBlockReminder h5{font-size:14px}
 .grid-Wrap{margin:12px!important;min-width:0}
 .confirmation-content{padding:24px 20px!important}
 .app-table th,.app-table td{padding:10px}.app-table-scroll{max-width:100%}
 .filter-container.filterWrapper{flex-wrap:wrap}.filter-container.filterWrapper>div{width:100%!important;min-width:0}
}

@media(prefers-reduced-motion:reduce){.edit-side-panel,.edit-side-panel .edit-panel-content{transition:none!important}}
.app-dialog [style*="height:90px"]{height:auto!important;min-height:90px}
.event-eligibility-note a{display:inline-flex;align-items:center;min-height:44px}
.frmAddReminder .column_right .form-errors{overflow-wrap:anywhere}
@media(min-width:901px) and (max-width:1200px){
 .frmAddReminder .app-form-items{grid-template-columns:minmax(0,1fr)}
 .frmAddReminder .app-form-item{grid-column:1!important}
 .frmAddReminder .mobile-form-fields{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
 .frmAddReminder .mobile-form-field{width:100%!important}
}
@media(min-width:600px) and (max-width:900px) and (max-height:500px){
 .frmAddReminder .container-flex .column.column_left{height:62svh;min-height:220px;aspect-ratio:auto;background-size:100% auto;background-position:50% 75%}
 .frmAddReminder .column.column_left img.logoaudiring{width:18%}
}
@media(max-width:700px){.app-form-items{grid-template-columns:1fr}.app-form-item{grid-column:1!important}.app-table-toolbar>label{width:100%}.app-table-toolbar .app-input{width:100%}.app-dialog{padding:18px}.app-dialog-heading{flex-wrap:wrap}.app-column-options>div{flex-wrap:wrap}.app-pagination{gap:10px}}


/* Use the same public-form breakpoint for disclosures and their always-visible choices. */
@media(max-width:900px){
 .frmAddReminder .event-section .mobile-event-info{display:block!important}
 .frmAddReminder .event-section .desktop-event-registration{display:none!important}
 .frmAddReminder .event-section .event-datetime{display:none!important}
 .frmAddReminder .event-section .event-summary{display:block;cursor:pointer!important;pointer-events:auto!important}
 .frmAddReminder .event-section .event-summary .flexin{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%}
 .frmAddReminder .event-section .event-summary .info-icon{display:block!important;flex-shrink:0}
 .frmAddReminder .titlesecondary{display:none!important}
 .frmAddReminder .titlesecondary-m{display:block!important;margin:24px 0 8px}
}
@media(min-width:901px){
 .frmAddReminder .event-section .mobile-event-info{display:none!important}
 .frmAddReminder .event-section .desktop-event-registration{display:block!important}
 .frmAddReminder .event-section .info-icon{display:none!important}
}

@media(max-width:900px){.frmAddReminder .event-section .mobile-event-datetime{display:block!important}}
@media(min-width:901px){.frmAddReminder .event-section .event-datetime{display:block!important}.frmAddReminder .event-section .mobile-event-datetime{display:none!important}}

.connection-dialog{border:1px solid #aaa;background:#fff;color:#111;width:min(440px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:24px;overflow:auto}
.connection-dialog::backdrop{background:rgba(0,0,0,.6)}
.connection-dialog h2{font-size:24px;line-height:1.25;margin:0 0 16px}
.connection-dialog p{font-size:16px;line-height:1.5}
.connection-actions{display:flex;gap:12px;flex-wrap:wrap}
.connection-actions button{min-height:44px;white-space:normal}
.connection-actions [hidden]{display:none!important}
.connection-dialog{position:fixed;inset:0!important;margin:auto!important;height:fit-content;max-width:calc(100vw - 32px)}

/* Two-step booking: give the form slightly more room than the photograph. */
@media(min-width:901px){
 .registration-flow .container-flex .column.column_left{width:45%;flex-basis:45%}
 .registration-flow .container-flex .column.column_right{width:55%;flex-basis:55%}
 .registration-flow .column_right .formWrapper{padding-right:40px}
}
.registration-flow .booking-review{padding-bottom:20px;border-bottom:1px solid #ccc}
.booking-review h2{font-size:21px;margin:0 0 18px;line-height:1.3}
.booking-review dl{margin:0}
.booking-review dt{font-size:16px;font-weight:600;margin-top:16px}
.booking-review dd{font-size:16px;line-height:1.5;margin:4px 0 0}
.booking-review .change-events{font:inherit;font-size:16px;min-height:44px;background:none;border:0;padding:8px 0;text-decoration:underline;text-underline-offset:4px;margin-top:10px}
.booking-review .input-hint{margin:8px 0 0}
.registration-flow .step-back{background:#fff;color:#111;border:1px solid #111}
.registration-flow .app-form-buttons{gap:12px;align-items:center}
.registration-flow .app-form-buttons .step-forward{margin-left:auto}
.registration-flow .app-form-buttons>p{flex-basis:100%;margin:0}
/* Once validation explains the missing slot, show that message only. */
.registration-flow #registration-errors + .app-form-buttons .booking-reminder{display:none}
@media(max-width:900px){
 .registration-details-step .container-flex .column.column_left{display:none!important}
 .registration-flow .app-form-buttons .app-button{width:100%}
}

/* Public accordions must not inherit the legacy white-on-dark details colors. */
.frmAddReminder .event-section .mobile-collapsible,.frmAddReminder .ride-schedule{color:#111}
.registration-flow .formWrapper>.registration-stack{width:100%;min-width:0;max-width:none;gap:24px}
.registration-flow .booking-review{padding-bottom:12px}
.registration-flow .booking-review-heading{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;margin-bottom:12px}
.registration-flow .booking-review-heading h2{font-size:1.1em;line-height:1.4;margin:0}
.registration-flow .booking-review-heading .change-events{margin:0;font-size:inherit;flex-shrink:0}
.registration-flow .booking-review-list{display:grid;gap:12px;margin:0}
.registration-flow .booking-review-list>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px 20px}
.registration-flow .booking-review-list dt,.registration-flow .booking-review-list dd{margin:0;font-size:inherit;line-height:1.5}
.registration-flow .booking-review-list dd{text-align:right}

/* Align the campaign introduction with the full-width booking controls. */
.registration-flow .event-content p{max-width:none}
.registration-flow .campaign-intro{display:grid;gap:12px;width:100%;max-width:none}
.registration-flow .campaign-intro p{margin:0}
.registration-flow .registration-stack>.input-hint{margin:0}
.registration-flow:not(.registration-details-step) .app-form-items{gap:32px}
.registration-flow .event-option{margin:0;padding:0}
.registration-flow .event-option .titlesecondary,.registration-flow .event-option .titlesecondary-m{margin:0 0 8px;padding:0}
.registration-flow .event-section .event-summary{padding:0;margin:0 0 8px}
.registration-flow .event-summary h2.subtitle{margin:0;font-weight:400}
.registration-management .editinfo{width:100%;padding:0;height:auto;overflow:visible}
.registration-management .info-item{min-width:0;overflow-wrap:anywhere}
.registration-management h2.subtitle{margin:0 0 12px;font-weight:400}
.registration-management .section-header{margin:0 0 32px}
.registration-management .event-header{margin-top:0!important}
.registration-management .titlesecondary,.registration-management .titlesecondary-m{margin:0 0 8px;padding:0}
.registration-management .event-header .save-ride-drive{position:static;display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
.registration-management .edit-fields{gap:16px}
.registration-management .field-group{min-width:0}
.registration-management .field-group label{display:block;margin-bottom:6px}
.registration-management .statusGrid{align-items:center;flex-wrap:wrap;gap:16px}
.registration-management .status-text.not-registered{color:#784700}
.registration-management .status-text.registered{color:#426700}
.registration-management .info-item .phonemasked{border:0;padding:0;background:transparent;min-height:0}
.registration-confirmation .confirmation-content h1{font-family:"AudiType-ExtendedBold",Verdana,sans-serif;line-height:1.15}
.registration-flow #ride-date{scroll-margin-top:24px}
.registration-flow .schedule-notice{padding:14px 16px;margin:16px 0;background:#f3f3f3;border:1px solid #ccc;color:#222;line-height:1.5}
.registration-flow .schedule-notice p{margin:6px 0 0!important}
.registration-flow .event-section .event-content{padding:0}
.registration-flow .event-section .event-content>p{margin:0 0 12px}
.registration-flow .event-section .event-content>p:last-of-type{margin-bottom:0}
.registration-flow .event-section p.event-datetime,.registration-flow .event-section p.mobile-event-datetime{margin:0 0 12px}
.registration-flow .desktop-event-registration,.registration-flow .mobile-event-registration{margin-top:16px}
.registration-flow .event-eligibility-note{margin:16px 0 0}
.registration-flow .desktop-event-registration>.event-eligibility-note{margin:0 0 16px}
.registration-flow .app-form-item>label,.registration-flow .mobile-form-field>label{margin-bottom:6px}
.registration-flow .mobile-form-fields{margin-top:0;gap:16px}
.registration-flow .mobile-form-field{margin:0}
.registration-flow .app-radio{margin:4px 0 0}
.registration-flow .ride-booking>.mobile-collapsible{margin-bottom:var(--registration-text,20px)}
@media(min-width:901px){
 .registration-flow .registration-jump{display:none}
}

/* Large monitors: scale the reading and control sizes, not only the columns. */
@media(min-width:1800px){
 .registration-flow{--registration-text:clamp(18px,calc(.625vw + 6px),28px);--registration-space:calc(var(--registration-text) * 1.5);--registration-gutter:clamp(40px,2.5vw,80px)}
 .registration-flow .column_right{padding:var(--registration-gutter) 0}
 .registration-flow .column_right>.d-flex{min-height:0}
 .registration-flow .column_right .titleMain{font-size:calc(var(--registration-text) * 2.5)!important;line-height:1.1;padding:0 var(--registration-gutter);margin:0 0 var(--registration-text);flex-shrink:0}
 .registration-flow .column_right .formWrapper{font-size:var(--registration-text);line-height:1.5;padding:0 var(--registration-gutter);min-height:0}
 .registration-confirmation .column_right.confirmation-content{padding:var(--registration-gutter)!important;font-size:var(--registration-text);line-height:1.5}
 .registration-confirmation .confirmation-content h1{font-size:calc(var(--registration-text) * 2.5);margin-bottom:var(--registration-space)}
 .registration-confirmation .confirmation-content p,.registration-confirmation .confirmation-details,.registration-confirmation .confirmation-content .input-hint{font-size:inherit}
 .registration-confirmation .confirmation-details dt{margin-top:var(--registration-space)}
 .registration-flow .column_right .formWrapper *{font-size:inherit}
 .registration-flow .column_right .subtitle{font-size:calc(var(--registration-text) * 1.65)!important;line-height:1.25}
 .registration-flow .column_right .titlesecondary{font-size:calc(var(--registration-text) * 1.25)!important;line-height:1.3}
 .registration-flow .column_right .input-hint,.registration-flow .column_right .event-eligibility-note{font-size:calc(var(--registration-text) * .9)}
 .registration-flow .column_right .registration-stack{gap:var(--registration-space)}
 .registration-flow .column_right .campaign-intro{gap:calc(var(--registration-text) * .75)}
 .registration-flow .column_right .event-content>p{margin-bottom:calc(var(--registration-text) * .75)}
 .registration-flow .column_right .event-content>p:last-of-type{margin-bottom:0}
 .registration-flow .column_right .app-form-items{gap:var(--registration-space)}
 .registration-flow:not(.registration-details-step) .column_right .app-form-items{row-gap:calc(var(--registration-text) * 2)}
 .registration-flow .column_right .app-input{min-height:calc(var(--registration-text) * 2.75);padding:calc(var(--registration-text) * .5) calc(var(--registration-text) * .75)}
 .registration-flow .column_right .app-button{min-height:calc(var(--registration-text) * 2.75);padding:calc(var(--registration-text) * .6) var(--registration-text)}
 .registration-flow .column_right .app-radio label{min-height:calc(var(--registration-text) * 2.5);gap:calc(var(--registration-text) * .5)}
 .registration-flow .column_right .app-radio input,.registration-flow .column_right input[type=checkbox]{width:calc(var(--registration-text) * 1.2)!important;height:calc(var(--registration-text) * 1.2)!important}
 .registration-flow .column_right .mobile-form-fields{gap:var(--registration-text)}
 .registration-flow .column_right .event-eligibility-note{padding:var(--registration-text)}
 .registration-flow .column.column_left img.logoaudiring{max-width:calc(var(--registration-text) * 13.75)}
 .registration-flow .column.column_left img.logouncorked{max-width:calc(var(--registration-text) * 10.625)}
}
@media(min-width:2200px){
 .registration-flow:not(.registration-details-step) .app-form-item:has(.event-option){grid-column:span 1!important}
 .registration-flow .event-option{height:100%}
}

/* Share the two experience columns' rows, so copy length cannot displace choices. */
@supports(grid-template-rows:subgrid){
 @media(min-width:2200px){
  .registration-flow:not(.registration-details-step) .column_right .app-form-items{row-gap:0}
  .registration-flow .app-form-item:has(.ride-booking){padding-bottom:var(--registration-space,32px)}
  .registration-flow:not(.registration-details-step) .app-form-item:has(.event-option){display:grid;grid-template-rows:subgrid;grid-row:span 6;row-gap:0}
  .registration-flow .event-option,.registration-flow .event-option .event-section,.registration-flow .event-option .mobile-collapsible,.registration-flow .event-option .event-section .mobile-collapsible .event-content{display:contents!important}
  .registration-flow .event-option .mobile-collapsible::details-content{display:contents}
  .registration-flow .event-option .desktop-event-registration{margin-top:16px;align-self:start}
 }
}

/* Keep check-in actions usable with a thumb and the filter control in normal flow. */
.cardWrapper .card-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;align-items:stretch}
.cardWrapper .card-actions .batch{display:contents}
.cardWrapper .card-actions .btn{width:100%;min-width:0;min-height:44px;padding:8px;white-space:normal;justify-content:center}
.cardWrapper .pencil-edit{width:44px;height:44px;min-width:44px;background-position:center;background-size:20px}
.filterBtnContainer.d-flex.justify-content-end.p-0{position:static!important;margin-bottom:12px;z-index:auto}
@media(max-width:700px){.cardWrapper{grid-template-columns:minmax(0,1fr)!important;padding:0!important}.cardWrapper .card{min-width:0}.cardWrapper .email{overflow-wrap:anywhere}}

.registration-flow #registration-errors{margin:20px 0 0}
.registration-flow #registration-errors p{margin:0}
.registration-flow #registration-errors a{display:inline-flex;align-items:center;min-height:44px;margin-top:4px;color:inherit;text-underline-offset:3px}

/* Three choices share a row only when the form has room for readable controls. */
.registration-flow .ride-selection-fields{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
.registration-flow .ride-selection-fields>.mobile-form-field{width:auto!important;min-width:0}
@media(min-width:1400px){.registration-flow .ride-selection-fields{grid-template-columns:repeat(3,minmax(0,1fr))}}
.registration-management .edit-fields{flex-wrap:wrap}
.registration-management .edit-fields>.field-group{flex:1 1 200px;min-width:0}