a, a:visited {
	color:#031c66;
}
a:hover {
	color:#031c66;
}

/* LAYOUT */
body {
	background-color:#e0e0e0;	color:#000000;
	font-family:Helvetica, Arial, sans-serif;
    font-size:14px;
}

.fButton, 
.fForm .buttons input,
.page-filters input {
	background-color:#616061;
	font-size: 14px;
	padding: 8px 14px;
	color:#ffffff !important;
	text-decoration: none;
	display: inline-block;
	border: 0px none;
}

#fWrapper {
	margin:20px auto;
	width:1024px;
	
	}

.fForm input,
.fForm select,
.fForm textarea {
	border-color: #a3a3a3;
}
.fForm input:focus,
.fForm select:focus,
.fForm textarea:focus {
    outline:none;
}

#fPage {
	border:1px solid #a3a3a3;background-color:#ffffff;}

#fHeader {
	background-color:#ffffff;
			display:none	border:0px none;
}
#fContent h1 {
	color:#000000;
	font-family:Helvetica, Arial, sans-serif;
    font-size:18px;
}

.fModuleTitle,
.fForm legend {
	background-color:#616061;	
}
.fModuleTitle h3,
.fForm legend {
	color:#ffffff;
	font-family:Helvetica, Arial, sans-serif;
    font-size:14px;
}
.fForm legend {
	display:block;
	width:100%;
	padding:0px !important;
}

#fSidebarLeft {
	display:none;
}

#fSidebarRight {
display:none;
}

#fContent {
	background-color:#ffffff;}
#fContentContainer {
	width: 1024px;
	margin: 0 auto;
}

#fMatter {
	width: 100%;
}
#fMatter.sR {
		width:1004px;	
}
#fMatter.sL {
		width:1004px;	
}
#fMatter.sR.sL {
		width:1004px;
}


#fFooter {
	border:0px none;
}

/* FORM */
.fForm input, .fForm select, .fForm textarea {
font-size:;
}

.fListing {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid #a3a3a3;
}
.fListing td,
.fListing th {
	padding: 0.5rem;
	border-bottom: 1px solid #a3a3a3;
	vertical-align: top;
	text-align: left;
}
.fListing th {
	color:#ffffff;
	font-family:Helvetica, Arial, sans-serif;
    font-size:14px;
	background-color:#616061;
	text-transform: uppercase;
}


/* ==========================================================
   INFANTILE SEIZURE SOCIETY
   26th ANNUAL MEETING | 7–9 JULY 2027 | KOCHI, KERALA

   Custom CSS theme based on the supplied registration-page
   screenshot. Palette: navy blue, aqua, sky blue, teal and gold.

   Add this stylesheet after the website's existing CSS.
   ========================================================== */

:root {
    --iss-navy: #15558a;
    --iss-navy-dark: #103f70;
    --iss-blue: #2477b8;
    --iss-sky: #e5f5fb;
    --iss-aqua: #d9f3f1;
    --iss-teal: #28aaa5;
    --iss-teal-dark: #168b8b;
    --iss-gold: #e8bd48;
    --iss-gold-pale: #fff4cf;
    --iss-white: #ffffff;
    --iss-text: #24445f;
    --iss-muted: #6c8799;
    --iss-border: #d5e9f0;
    --iss-shadow: 0 14px 36px rgba(21, 85, 138, 0.10);
    --iss-radius: 18px;
}

/* ---------- Base ---------- */

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    color: var(--iss-text);
    background: #f7fbfd;
    font-family: "Poppins", "Segoe UI", Arial, sans-serif;
    font-size: 15px;
    line-height: 1.6;
}

* {
    box-sizing: border-box;
}

img {
    max-width: 100%;
    height: auto;
}

a {
    color: var(--iss-blue);
    text-decoration: none;
    transition: color .2s ease, background .2s ease;
}

a:hover {
    color: var(--iss-teal-dark);
}

/* ---------- Main page width ---------- */

.container,
.site-container,
.page-container,
.registration-container,
#fPage {
    width: min(100% - 32px, 1380px);
    margin-inline: auto;
}

/* ---------- Event header / logo area ---------- */

.site-header,
.event-header,
.main-header,
#site-header,
#main-header {
    position: relative;
    z-index: 20;
    background: var(--iss-white);
    border-bottom: 1px solid #e4eff4;
}

.header-inner,
.event-header-inner,
.site-header-inner,
.branding,
.header-branding {
    width: min(100% - 32px, 1380px);
    min-height: 300px;
    margin: 0 auto;
    padding: 20px 0 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 28px;
    position: relative;
}

.header-logos,
.logo-group,
.event-logos {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    flex-wrap: wrap;
}

.header-logos img,
.logo-group img,
.event-logos img,
.site-logo,
.event-logo {
    display: block;
    width: auto;
    max-width: 190px;
    max-height: 92px;
    object-fit: contain;
}

.header-left-image,
.header-right-image,
.header-character {
    width: auto;
    max-width: 150px;
    max-height: 180px;
    object-fit: contain;
}

.event-heading,
.header-event-details,
.event-brand {
    flex: 1 1 auto;
    text-align: center;
}

.event-title,
.site-title,
.header-title,
.event-heading h1,
h1.event-name {
    margin: 8px 0 4px;
    color: var(--iss-navy);
    font-size: clamp(27px, 3.2vw, 48px);
    font-weight: 850;
    line-height: 1.15;
    letter-spacing: .3px;
    text-transform: uppercase;
}

.event-subtitle,
.event-heading h2,
.meeting-title {
    margin: 0;
    color: var(--iss-navy);
    font-size: clamp(20px, 2.5vw, 34px);
    font-weight: 700;
    line-height: 1.25;
    text-transform: uppercase;
}

.event-date,
.event-date-pill,
.meeting-date {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    margin-top: 18px;
    padding: 9px 22px;
    color: var(--iss-navy);
    background: linear-gradient(90deg, var(--iss-aqua), var(--iss-gold-pale));
    border: 1px solid #b9e3e2;
    border-radius: 999px;
    font-size: 16px;
    font-weight: 700;
}

/* ---------- Navigation ---------- */

.site-nav,
.main-nav,
.navbar,
nav.main-navigation,
#main-nav,
#site-navigation {
    position: relative;
    z-index: 15;
    background: #fff;
    border-top: 1px solid #e7f0f5;
    border-bottom: 1px solid #dcecf3;
}

.site-nav .nav-inner,
.main-nav .nav-inner,
.navbar .container,
.navigation-inner {
    width: min(100% - 32px, 1380px);
    min-height: 62px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.site-nav a,
.main-nav a,
.navbar a,
nav.main-navigation a,
#main-nav a,
#site-navigation a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 9px 15px;
    color: var(--iss-blue);
    border-radius: 9px;
    font-size: 15px;
    font-weight: 600;
}

.site-nav a:hover,
.main-nav a:hover,
.navbar a:hover,
nav.main-navigation a:hover,
#main-nav a:hover,
#site-navigation a:hover,
.site-nav .active > a,
.main-nav .active > a,
.navbar .active > a,
nav.main-navigation .active > a {
    color: var(--iss-navy-dark);
    background: #ddf3f1;
}

/* ---------- Registration hero ---------- */

.registration-hero,
.page-hero,
.hero-section,
.registration-banner,
#registration-hero {
    position: relative;
    isolation: isolate;
    min-height: 450px;
    padding: 70px 24px 64px;
    overflow: hidden;
    text-align: center;
    background:
        radial-gradient(circle at 50% 18%, rgba(95, 190, 185, .17) 0 160px, transparent 161px),
        linear-gradient(120deg, #dcf5f1 0%, #e2f3fa 52%, #e8f5ff 100%);
}

.registration-hero::before,
.page-hero::before,
.hero-section::before,
.registration-banner::before,
#registration-hero::before {
    content: "";
    position: absolute;
    z-index: -1;
    left: -95px;
    bottom: -130px;
    width: 290px;
    height: 290px;
    border: 2px solid rgba(40, 170, 165, .16);
    border-radius: 50%;
}

.registration-hero::after,
.page-hero::after,
.hero-section::after,
.registration-banner::after,
#registration-hero::after {
    content: "";
    position: absolute;
    z-index: -1;
    right: -110px;
    top: 90px;
    width: 270px;
    height: 270px;
    border: 2px solid rgba(36, 119, 184, .12);
    border-radius: 50%;
}

.hero-content,
.registration-hero-content,
.page-hero-content {
    position: relative;
    z-index: 2;
    width: min(100%, 950px);
    margin: 0 auto;
}

.hero-icon,
.registration-illustration,
.hero-illustration {
    display: block;
    width: auto;
    max-width: 110px;
    max-height: 115px;
    margin: 0 auto 28px;
    object-fit: contain;
}

.section-badge,
.hero-badge,
.eyebrow,
.registration-label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0 auto 24px;
    padding: 8px 20px;
    color: var(--iss-navy);
    background: #fff9e4;
    border: 1px solid var(--iss-gold);
    border-radius: 999px;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 2px;
    line-height: 1.3;
    text-transform: uppercase;
}

.section-badge::before,
.hero-badge::before,
.eyebrow::before,
.registration-label::before {
    content: "";
    width: 8px;
    height: 8px;
    flex: 0 0 8px;
    background: var(--iss-gold);
    border-radius: 50%;
}

.registration-hero h1,
.page-hero h1,
.hero-section h1,
.registration-banner h1,
#registration-hero h1,
.section-title {
    margin: 0;
    color: var(--iss-navy);
    font-size: clamp(34px, 4vw, 58px);
    font-weight: 850;
    line-height: 1.15;
    letter-spacing: -1px;
}

.registration-hero p,
.page-hero p,
.hero-section p,
.registration-banner p,
#registration-hero p {
    max-width: 760px;
    margin: 16px auto 0;
    color: #55768e;
    font-size: 17px;
}

/* ---------- Registration content / cards ---------- */

.registration-section,
.registration-content,
.form-section,
.page-content {
    padding: 44px 24px 60px;
    background: #fff;
}

.registration-card,
.form-card,
.content-card,
.fModule,
fieldset {
    margin: 0 0 24px;
    padding: 24px;
    background: #fff;
    border: 1px solid var(--iss-border);
    border-radius: var(--iss-radius);
    box-shadow: 0 8px 26px rgba(21, 85, 138, .07);
}

.card-title,
.registration-card h2,
.form-card h2,
.fModuleTitle,
fieldset legend {
    color: var(--iss-navy);
    font-size: 20px;
    font-weight: 800;
}

.fModuleTitle {
    margin: -24px -24px 22px;
    padding: 15px 22px;
    color: #fff;
    background: linear-gradient(90deg, var(--iss-navy), var(--iss-blue));
    border-bottom: 4px solid var(--iss-gold);
}

.fModuleTitle h3 {
    margin: 0;
    color: #fff;
    font-size: 18px;
    font-weight: 800;
}

/* ---------- Form fields ---------- */

.form-group,
.field-para,
.form-row {
    margin-bottom: 18px;
}

.form-group label,
.field-para label,
.form-row label,
label {
    color: var(--iss-navy-dark);
    font-weight: 650;
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="date"],
input[type="time"],
select,
textarea,
.form-control {
    width: 100%;
    min-height: 46px;
    padding: 11px 13px;
    color: var(--iss-text);
    background: #fff;
    border: 1px solid #cfe3eb;
    border-radius: 10px;
    outline: none;
    box-shadow: inset 0 1px 2px rgba(21, 85, 138, .03);
    transition: border-color .2s ease, box-shadow .2s ease;
}

textarea {
    min-height: 110px;
    resize: vertical;
}

input:focus,
select:focus,
textarea:focus,
.form-control:focus {
    border-color: var(--iss-teal);
    box-shadow: 0 0 0 4px rgba(40, 170, 165, .13);
}

input[type="radio"],
input[type="checkbox"] {
    accent-color: var(--iss-teal-dark);
}

/* ---------- Registration fee tables ---------- */

table,
.registration_slab,
.fTable,
.financial {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--iss-border);
    border-radius: 12px;
}

th,
table thead td,
.registration_slab tr.heading td,
.fTable tr.heading td,
.financial tr.heading td {
    padding: 14px 12px;
    color: #fff !important;
    background: linear-gradient(135deg, var(--iss-navy), var(--iss-blue)) !important;
    border-color: rgba(255,255,255,.2);
    text-align: center;
    font-weight: 750;
}

.registration_slab tr.heading td *,
.registration_slab .headingDate,
.registration_slab .headingDate *,
table thead th * {
    color: #fff !important;
    opacity: 1 !important;
}

.registration_slab tr.heading td small,
.registration_slab tr.heading td span {
    display: block;
    margin-top: 4px;
    color: #fff0bd !important;
    font-size: 13px;
    font-weight: 600;
}

td,
th {
    padding: 12px 14px;
    border-right: 1px solid #e4eff4;
    border-bottom: 1px solid #e4eff4;
}

tr:last-child td {
    border-bottom: 0;
}

td:last-child,
th:last-child {
    border-right: 0;
}

tbody tr:nth-child(even) {
    background: #f7fcfd;
}

tbody tr:hover {
    background: #eef9f8;
}

.registration_cost,
.registration-fee,
.fee-amount {
    color: #d33b35 !important;
    font-weight: 800;
}

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

button,
.btn,
.button,
input[type="submit"],
input[type="button"],
input.submit,
a.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 11px 25px;
    color: #fff !important;
    background: linear-gradient(135deg, var(--iss-navy), var(--iss-blue));
    border: 0;
    border-radius: 999px;
    box-shadow: 0 7px 18px rgba(21, 85, 138, .17);
    cursor: pointer;
    font-size: 15px;
    font-weight: 750;
    text-decoration: none;
    transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

button:hover,
.btn:hover,
.button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input.submit:hover,
a.btn:hover {
    color: #fff !important;
    background: linear-gradient(135deg, var(--iss-teal-dark), var(--iss-teal));
    box-shadow: 0 10px 22px rgba(40, 170, 165, .22);
    transform: translateY(-1px);
}

/* ---------- Registration progress / steps ---------- */

ul.runner {
    margin: 0;
    padding: 0;
    list-style: none;
}

ul.runner li {
    position: relative;
    margin: 0 0 10px;
}

ul.runner li a {
    display: block;
    padding: 13px 16px;
    color: var(--iss-navy);
    background: #f2fafb;
    border: 1px solid var(--iss-border);
    border-radius: 11px;
    font-weight: 650;
}

ul.runner li.current a {
    color: #fff;
    background: var(--iss-navy);
    border-color: var(--iss-navy);
}

ul.runner li.completed a {
    color: #fff;
    background: var(--iss-teal-dark);
    border-color: var(--iss-teal-dark);
}

/* ---------- Notices / alerts ---------- */

.alert,
.notice,
.message {
    padding: 14px 17px;
    border-radius: 11px;
    border: 1px solid var(--iss-border);
    background: #f1fafb;
    color: var(--iss-navy-dark);
}

.alert-success,
.message.success {
    color: #236044;
    background: #edf8f1;
    border-color: #c9e8d4;
}

.alert-danger,
.alert-warning,
.message.error,
.message.warning {
    color: #8b3030;
    background: #fff1ef;
    border-color: #f1ceca;
}

/* ---------- Footer ---------- */

.site-footer,
#footer,
#fFooter {
    padding: 22px;
    color: #fff;
    text-align: center;
    background: linear-gradient(90deg, var(--iss-navy-dark), var(--iss-navy));
    border-top: 5px solid var(--iss-gold);
}

.site-footer a,
#footer a,
#fFooter a {
    color: #fff0bd;
}

/* ---------- eRegNow layout compatibility ---------- */

#fWrapper {
    width: 100%;
    padding: 24px 14px;
}

#fPageTitle {
    padding: 22px 28px;
    background: #f4fbfd;
    border-bottom: 1px solid var(--iss-border);
}

#fPageTitle h1 {
    margin: 0;
    color: var(--iss-navy);
    font-weight: 850;
}

#fContentContainer {
    padding: 28px;
}

#fMatter {
    min-width: 0;
}

#fSidebarRight {
    width: 250px;
}

/* ---------- Responsive ---------- */

@media (max-width: 900px) {
    .header-inner,
    .event-header-inner,
    .site-header-inner,
    .branding,
    .header-branding {
        min-height: auto;
        flex-wrap: wrap;
        gap: 16px;
    }

    .header-left-image,
    .header-right-image,
    .header-character {
        max-height: 110px;
        max-width: 100px;
    }

    .site-nav .nav-inner,
    .main-nav .nav-inner,
    .navbar .container,
    .navigation-inner {
        flex-wrap: wrap;
        padding: 8px 0;
    }

    #fContentContainer {
        display: block;
    }

    #fSidebarRight {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .container,
    .site-container,
    .page-container,
    .registration-container,
    #fPage {
        width: 100%;
    }

    .header-inner,
    .event-header-inner,
    .site-header-inner,
    .branding,
    .header-branding {
        padding: 16px 10px;
    }

    .header-logos,
    .logo-group,
    .event-logos {
        gap: 12px;
    }

    .header-logos img,
    .logo-group img,
    .event-logos img,
    .site-logo,
    .event-logo {
        max-width: 105px;
        max-height: 65px;
    }

    .event-title,
    .site-title,
    .header-title,
    .event-heading h1,
    h1.event-name {
        font-size: 25px;
    }

    .event-subtitle,
    .event-heading h2,
    .meeting-title {
        font-size: 19px;
    }

    .event-date,
    .event-date-pill,
    .meeting-date {
        font-size: 13px;
        padding: 8px 13px;
    }

    .site-nav a,
    .main-nav a,
    .navbar a,
    nav.main-navigation a,
    #main-nav a,
    #site-navigation a {
        padding: 8px 10px;
        font-size: 13px;
    }

    .registration-hero,
    .page-hero,
    .hero-section,
    .registration-banner,
    #registration-hero {
        min-height: 340px;
        padding: 55px 16px 45px;
    }

    .registration-hero h1,
    .page-hero h1,
    .hero-section h1,
    .registration-banner h1,
    #registration-hero h1,
    .section-title {
        font-size: 34px;
    }

    .registration-section,
    .registration-content,
    .form-section,
    .page-content {
        padding: 28px 14px 40px;
    }

    .registration-card,
    .form-card,
    .content-card,
    .fModule,
    fieldset {
        padding: 17px;
    }

    #fContentContainer {
        padding: 16px;
    }

    table,
    .registration_slab,
    .fTable,
    .financial {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }

    button,
    .btn,
    .button,
    input[type="submit"],
    input[type="button"],
    input.submit {
        max-width: 100%;
    }
}

/* ---------- Print ---------- */

@media print {
    body {
        background: #fff;
    }

    .site-nav,
    .main-nav,
    .navbar,
    nav.main-navigation,
    #main-nav,
    #site-navigation,
    .site-footer,
    #footer,
    #fFooter {
        display: none !important;
    }

    .registration-card,
    .form-card,
    .content-card,
    .fModule,
    fieldset {
        box-shadow: none;
        break-inside: avoid;
    }
}


/* ==========================================================
   FORM ALIGNMENT UPDATE
   Desktop: keep each field label and its input on one row.
   Mobile: stack labels above inputs for comfortable viewing.
   ========================================================== */

@media (min-width: 768px) {
    .field-para,
    .form-group,
    .form-row {
        display: grid !important;
        grid-template-columns: minmax(190px, 230px) minmax(0, 1fr);
        align-items: center;
        column-gap: 24px;
        row-gap: 8px;
        margin-bottom: 20px;
    }

    .field-para > label,
    .form-group > label,
    .form-row > label {
        grid-column: 1;
        margin: 0;
        text-align: right;
        line-height: 1.4;
    }

    .field-para > :first-child:not(input):not(select):not(textarea):not(button),
    .form-group > :first-child:not(input):not(select):not(textarea):not(button),
    .form-row > :first-child:not(input):not(select):not(textarea):not(button) {
        grid-column: 1;
    }

    .field-para > input,
    .field-para > select,
    .field-para > textarea,
    .field-para > .form-control,
    .form-group > input,
    .form-group > select,
    .form-group > textarea,
    .form-group > .form-control,
    .form-row > input,
    .form-row > select,
    .form-row > textarea,
    .form-row > .form-control {
        grid-column: 2;
        width: 100%;
        min-width: 0;
        margin: 0;
    }

    .field-para > :not(label):not(:first-child),
    .form-group > :not(label):not(:first-child),
    .form-row > :not(label):not(:first-child) {
        min-width: 0;
    }

    .field-para .hint,
    .form-group .hint,
    .form-row .hint,
    .field-para .help-block,
    .form-group .help-block,
    .form-row .help-block {
        grid-column: 2;
        margin: 2px 0 0;
        text-align: left;
    }

    /* Some registration forms place the control inside a wrapper. */
    .field-para > label + div,
    .field-para > label + p,
    .form-group > label + div,
    .form-group > label + p,
    .form-row > label + div,
    .form-row > label + p {
        grid-column: 2;
        width: 100%;
        min-width: 0;
        margin: 0;
    }

    .field-para > label + div input,
    .field-para > label + div select,
    .field-para > label + div textarea,
    .field-para > label + p input,
    .field-para > label + p select,
    .field-para > label + p textarea,
    .form-group > label + div input,
    .form-group > label + div select,
    .form-group > label + div textarea,
    .form-group > label + p input,
    .form-group > label + p select,
    .form-group > label + p textarea,
    .form-row > label + div input,
    .form-row > label + div select,
    .form-row > label + div textarea,
    .form-row > label + p input,
    .form-row > label + p select,
    .form-row > label + p textarea {
        width: 100%;
    }
}

/* Keep registration fields readable on phones and narrow tablets. */
@media (max-width: 767px) {
    .field-para,
    .form-group,
    .form-row {
        display: block;
        margin-bottom: 17px;
    }

    .field-para > label,
    .form-group > label,
    .form-row > label {
        display: block;
        margin: 0 0 7px;
        text-align: left;
    }

    .field-para input,
    .field-para select,
    .field-para textarea,
    .form-group input,
    .form-group select,
    .form-group textarea,
    .form-row input,
    .form-row select,
    .form-row textarea {
        width: 100%;
    }
}
/* ==========================================================
   ISS 2027 REGISTRATION FEE TABLE – ALIGNMENT FIX
   Body row structure:
   selector | category | early radio | early fee |
   standard radio | standard fee
   Header uses grouped Early Bird and Standard Fee cells.
   ========================================================== */

.registration_slab {
    display: table !important;
    width: 100% !important;
    max-width: 100% !important;
    table-layout: auto !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    margin: 0 auto !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
    border-radius: 12px !important;
}

/* Fixed proportions for the six registration row columns. */
.registration_slab tr:not(.heading) td:nth-child(1) {
    width: 2.5% !important;
    min-width: 26px !important;
    padding: 9px 2px !important;
    text-align: center !important;
    vertical-align: middle !important;
}

.registration_slab tr:not(.heading) td:nth-child(2) {
    width: 76% !important;
    min-width: 280px !important;
    padding: 9px 10px !important;
    text-align: left !important;
    vertical-align: middle !important;
}

.registration_slab tr:not(.heading) td:nth-child(3) {
    width: 2.5% !important;
    min-width: 26px !important;
    padding: 9px 2px !important;
    text-align: center !important;
    vertical-align: middle !important;
}

.registration_slab tr:not(.heading) td:nth-child(4) {
    width: 7.5% !important;
    min-width: 82px !important;
    padding: 9px 5px !important;
    text-align: right !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
}

.registration_slab tr:not(.heading) td:nth-child(5) {
    width: 2.5% !important;
    min-width: 26px !important;
    padding: 9px 2px !important;
    text-align: center !important;
    vertical-align: middle !important;
}

.registration_slab tr:not(.heading) td:nth-child(6) {
    width: 9% !important;
    min-width: 90px !important;
    padding: 9px 7px 9px 4px !important;
    text-align: right !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
}

/* Grouped heading cells align over the corresponding fee columns. */
.registration_slab tr.heading td:nth-child(1) {
    width: 2.5% !important;
}

.registration_slab tr.heading td:nth-child(2) {
    width: 76% !important;
    text-align: center !important;
}

.registration_slab tr.heading td:nth-child(3) {
    width: 10% !important;
    text-align: center !important;
}

.registration_slab tr.heading td:nth-child(4) {
    width: 11.5% !important;
    text-align: center !important;
}

.registration_slab tr.heading td {
    height: 145px;
    padding: 13px 6px !important;
    vertical-align: middle !important;
    line-height: 1.4 !important;
    overflow-wrap: normal !important;
}

.registration_slab tr.heading td *,
.registration_slab .headingDate,
.registration_slab .headingDate * {
    color: #fff !important;
    opacity: 1 !important;
}

.registration_slab tr.heading td span,
.registration_slab tr.heading td small {
    display: block !important;
    margin-top: 5px !important;
    color: #fff0bd !important;
    font-size: 13px !important;
    font-weight: 650 !important;
    line-height: 1.4 !important;
    white-space: normal !important;
}

/* Keep radio buttons centered in their own narrow columns. */
.registration_slab input[type="radio"] {
    display: inline-block !important;
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    max-width: 16px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    vertical-align: middle !important;
    accent-color: var(--iss-teal-dark);
}

/* Price amounts stay on one line and align to the right. */
.registration_slab .registration_cost,
.registration_slab .registration_fee,
.registration_slab .amount {
    display: inline-block;
    margin: 0 !important;
    color: #d33b35 !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
    white-space: nowrap !important;
}

/* Category names remain left-aligned. */
.registration_slab tr:not(.heading) td:nth-child(2) label,
.registration_slab tr:not(.heading) td:nth-child(2) strong,
.registration_slab tr:not(.heading) td:nth-child(2) span {
    margin: 0 !important;
    line-height: 1.35 !important;
}

/* Tablet and mobile: preserve readable fee columns with scrolling. */
@media (max-width: 900px) {
    .registration_slab {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: auto !important;
        table-layout: auto !important;
        white-space: nowrap !important;
    }

    .registration_slab tr:not(.heading) td:nth-child(2) {
        min-width: 280px !important;
    }

    .registration_slab tr:not(.heading) td:nth-child(4),
    .registration_slab tr:not(.heading) td:nth-child(6) {
        min-width: 92px !important;
    }

    .registration_slab tr.heading td {
        height: auto;
        min-width: 85px;
    }
}

/* ==========================================================
   ISS 2027 – 800PX PAGE WIDTH AND 60/20/20 FEE TABLE
   Desktop table groups:
     TYPE       60%
     EARLY BIRD 20%
     STANDARD   20%
   The radio controls are included inside each fee group's 20%.
   ========================================================== */

/* Keep the registration page compact and centred. */
#fWrapper {
    width: 100% !important;
    max-width: 100% !important;
    padding: 18px 12px !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
}

#fPage {
    width: 100% !important;
    max-width: 800px !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
}

#fContent,
#fContentContainer,
#fMatter {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

#fContentContainer {
    display: block !important;
    padding: 18px !important;
}

#fMatter {
    float: none !important;
}

#fPageTitle {
    padding: 18px 22px !important;
}

.fModule,
fieldset {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

.fModuleContent {
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

/* Fee table: 60% Type, 20% Early Bird, 20% Standard Fee. */
.registration_slab {
    display: table !important;
    width: 100% !important;
    max-width: 100% !important;
    table-layout: fixed !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    box-sizing: border-box !important;
    margin: 0 auto !important;
}

/* Header has four cells: selector spacer, Type, Early Bird, Standard. */
.registration_slab tr.heading td:nth-child(1) {
    width: 2.5% !important;
}

.registration_slab tr.heading td:nth-child(2) {
    width: 57.5% !important;
    text-align: center !important;
}

.registration_slab tr.heading td:nth-child(3) {
    width: 20% !important;
    text-align: center !important;
}

.registration_slab tr.heading td:nth-child(4) {
    width: 20% !important;
    text-align: center !important;
}

/* Registration rows have six cells. The first radio is part of
   the Type group; each fee group includes its radio + amount. */
.registration_slab tr:not(.heading) td:nth-child(1) {
    width: 2.5% !important;
    min-width: 22px !important;
    padding: 9px 2px !important;
    text-align: center !important;
    vertical-align: middle !important;
}

.registration_slab tr:not(.heading) td:nth-child(2) {
    width: 57.5% !important;
    min-width: 0 !important;
    padding: 9px 8px !important;
    text-align: left !important;
    vertical-align: middle !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
}

.registration_slab tr:not(.heading) td:nth-child(3) {
    width: 3.5% !important;
    min-width: 22px !important;
    padding: 9px 2px !important;
    text-align: center !important;
    vertical-align: middle !important;
}

.registration_slab tr:not(.heading) td:nth-child(4) {
    width: 16.5% !important;
    min-width: 0 !important;
    padding: 9px 5px !important;
    text-align: right !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
}

.registration_slab tr:not(.heading) td:nth-child(5) {
    width: 3.5% !important;
    min-width: 22px !important;
    padding: 9px 2px !important;
    text-align: center !important;
    vertical-align: middle !important;
}

.registration_slab tr:not(.heading) td:nth-child(6) {
    width: 16.5% !important;
    min-width: 0 !important;
    padding: 9px 6px 9px 3px !important;
    text-align: right !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
}

/* Consistent radio-button sizing. */
.registration_slab input[type="radio"] {
    display: inline-block !important;
    width: 15px !important;
    height: 15px !important;
    min-width: 15px !important;
    max-width: 15px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    vertical-align: middle !important;
}

/* Keep all prices on one line within their 20% fee groups. */
.registration_slab .registration_cost,
.registration_slab .registration_fee,
.registration_slab .amount {
    display: inline-block !important;
    margin: 0 !important;
    color: #d33b35 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    white-space: nowrap !important;
}

/* Compact header height and keep date text visible. */
.registration_slab tr.heading td {
    height: 125px !important;
    padding: 10px 5px !important;
    vertical-align: middle !important;
    line-height: 1.35 !important;
    overflow-wrap: normal !important;
}

.registration_slab tr.heading td *,
.registration_slab .headingDate,
.registration_slab .headingDate * {
    color: #ffffff !important;
    opacity: 1 !important;
}

.registration_slab tr.heading td span,
.registration_slab tr.heading td small {
    display: block !important;
    margin-top: 4px !important;
    color: #fff0bd !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
    white-space: normal !important;
}

/* Mobile: retain usable text and permit horizontal table scrolling. */
@media (max-width: 767px) {
    #fWrapper {
        padding: 8px 4px !important;
    }

    #fContentContainer {
        padding: 10px !important;
    }

    .registration_slab {
        display: block !important;
        width: 100% !important;
        overflow-x: auto !important;
        table-layout: auto !important;
        white-space: nowrap !important;
    }

    .registration_slab tr:not(.heading) td:nth-child(2) {
        min-width: 210px !important;
    }

    .registration_slab tr:not(.heading) td:nth-child(4),
    .registration_slab tr:not(.heading) td:nth-child(6) {
        min-width: 78px !important;
    }

    .registration_slab tr.heading td {
        height: auto !important;
        min-width: 70px !important;
    }
}

/* ==========================================================
   ISS 2027 – FINAL FEE TABLE OVERLAP CORRECTION
   IMPORTANT: use auto table layout because the heading cells
   group two body columns with colspan. Fixed layout caused
   Early Bird and Standard Fee choices to overlap.
   ========================================================== */

/* Keep the overall registration page at a maximum 800px. */
#fWrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 18px 12px !important;
    box-sizing: border-box !important;
}

#fPage {
    width: 100% !important;
    max-width: 800px !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
}

#fContent,
#fContentContainer,
#fMatter,
.fModule,
.fModuleContent,
fieldset {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

#fContentContainer {
    display: block !important;
    padding: 18px !important;
}

/* The table must use auto layout to respect grouped header cells. */
.registration_slab {
    display: table !important;
    width: 100% !important;
    max-width: 100% !important;
    table-layout: auto !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}

/* Six body columns:
   1 selector + 2 category = 60% Type
   3 radio + 4 price = 20% Early Bird
   5 radio + 6 price = 20% Standard Fee
*/
.registration_slab tr:not(.heading) td:nth-child(1) {
    width: 2.5% !important;
    min-width: 20px !important;
    padding: 9px 2px !important;
    text-align: center !important;
    vertical-align: middle !important;
}

.registration_slab tr:not(.heading) td:nth-child(2) {
    width: 57.5% !important;
    min-width: 0 !important;
    padding: 9px 8px !important;
    text-align: left !important;
    vertical-align: middle !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
}

.registration_slab tr:not(.heading) td:nth-child(3) {
    width: 2.5% !important;
    min-width: 20px !important;
    padding: 9px 2px !important;
    text-align: center !important;
    vertical-align: middle !important;
}

.registration_slab tr:not(.heading) td:nth-child(4) {
    width: 17.5% !important;
    min-width: 0 !important;
    padding: 9px 5px !important;
    text-align: right !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
}

.registration_slab tr:not(.heading) td:nth-child(5) {
    width: 2.5% !important;
    min-width: 20px !important;
    padding: 9px 2px !important;
    text-align: center !important;
    vertical-align: middle !important;
}

.registration_slab tr:not(.heading) td:nth-child(6) {
    width: 17.5% !important;
    min-width: 0 !important;
    padding: 9px 6px 9px 4px !important;
    text-align: right !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
}

/* Header cells: blank selector, Type, Early Bird (colspan 2),
   Standard Fee (colspan 2). */
.registration_slab tr.heading td:nth-child(1) {
    width: 2.5% !important;
}

.registration_slab tr.heading td:nth-child(2) {
    width: 57.5% !important;
    text-align: center !important;
}

.registration_slab tr.heading td:nth-child(3) {
    width: 20% !important;
    text-align: center !important;
}

.registration_slab tr.heading td:nth-child(4) {
    width: 20% !important;
    text-align: center !important;
}

/* Keep the fee group headings and dates readable. */
.registration_slab tr.heading td {
    height: 125px !important;
    padding: 10px 5px !important;
    vertical-align: middle !important;
    line-height: 1.35 !important;
    overflow-wrap: normal !important;
}

.registration_slab tr.heading td *,
.registration_slab .headingDate,
.registration_slab .headingDate * {
    color: #ffffff !important;
    opacity: 1 !important;
}

.registration_slab tr.heading td span,
.registration_slab tr.heading td small {
    display: block !important;
    margin-top: 4px !important;
    color: #fff0bd !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
    white-space: normal !important;
}

/* Radio buttons stay inside their own fee columns. */
.registration_slab input[type="radio"] {
    display: inline-block !important;
    position: static !important;
    float: none !important;
    width: 15px !important;
    height: 15px !important;
    min-width: 15px !important;
    max-width: 15px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    vertical-align: middle !important;
    accent-color: var(--iss-teal-dark);
}

/* Fee values remain on one line and inside their own cells. */
.registration_slab .registration_cost,
.registration_slab .registration_fee,
.registration_slab .amount {
    display: inline-block !important;
    position: static !important;
    float: none !important;
    margin: 0 !important;
    color: #d33b35 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    white-space: nowrap !important;
}

/* Prevent labels and wrappers from forcing fee content over
   neighbouring cells. */
.registration_slab tr:not(.heading) td:nth-child(3) *,
.registration_slab tr:not(.heading) td:nth-child(4) *,
.registration_slab tr:not(.heading) td:nth-child(5) *,
.registration_slab tr:not(.heading) td:nth-child(6) * {
    max-width: 100%;
}

/* Mobile: scroll the fee table rather than compressing columns. */
@media (max-width: 767px) {
    #fWrapper {
        padding: 8px 4px !important;
    }

    #fContentContainer {
        padding: 10px !important;
    }

    .registration_slab {
        display: block !important;
        width: 100% !important;
        overflow-x: auto !important;
        table-layout: auto !important;
        white-space: nowrap !important;
    }

    .registration_slab tr:not(.heading) td:nth-child(2) {
        min-width: 210px !important;
    }

    .registration_slab tr:not(.heading) td:nth-child(4),
    .registration_slab tr:not(.heading) td:nth-child(6) {
        min-width: 82px !important;
    }

    .registration_slab tr.heading td {
        height: auto !important;
        min-width: 70px !important;
    }
}

/* ==========================================================
   ISS 2027 – CORRECT FOUR-COLUMN REGISTRATION FEE TABLE
   Actual table structure:
     1. Type selection radio
     2. Delegate category / Type
     3. Early Bird radio + fee amount
     4. Standard Fee radio + fee amount

   Width allocation:
     Type group (columns 1 + 2): 60%
     Early Bird (column 3):      20%
     Standard Fee (column 4):    20%
   ========================================================== */

/* Keep the registration page centred and within 800px. */
#fWrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 18px 12px !important;
    box-sizing: border-box !important;
}

#fPage {
    display: block !important;
    width: 100% !important;
    max-width: 800px !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
}

#fContent,
#fContentContainer,
#fMatter,
.fModule,
.fModuleContent,
fieldset {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

#fContentContainer {
    display: block !important;
    padding: 18px !important;
}

#fMatter {
    float: none !important;
}

/* Remove horizontal scrolling and use the real four-column layout. */
.registration_slab {
    display: table !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    table-layout: fixed !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    margin: 0 auto !important;
    overflow: hidden !important;
    white-space: normal !important;
    box-sizing: border-box !important;
}

/* Header row: blank selector column, Type, Early Bird, Standard Fee. */
.registration_slab tr.heading td:nth-child(1) {
    width: 2.5% !important;
}

.registration_slab tr.heading td:nth-child(2) {
    width: 57.5% !important;
    text-align: center !important;
}

.registration_slab tr.heading td:nth-child(3),
.registration_slab tr.heading td:nth-child(4) {
    width: 20% !important;
    text-align: center !important;
}

/* Body row: exactly four cells. */
.registration_slab tr:not(.heading) td:nth-child(1) {
    width: 2.5% !important;
    min-width: 0 !important;
    padding: 9px 2px !important;
    text-align: center !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
}

.registration_slab tr:not(.heading) td:nth-child(2) {
    width: 57.5% !important;
    min-width: 0 !important;
    padding: 9px 9px !important;
    text-align: left !important;
    vertical-align: middle !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
}

.registration_slab tr:not(.heading) td:nth-child(3),
.registration_slab tr:not(.heading) td:nth-child(4) {
    width: 20% !important;
    min-width: 0 !important;
    padding: 9px 5px !important;
    text-align: center !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
}

/* Header heights and date visibility. */
.registration_slab tr.heading td {
    height: 125px !important;
    padding: 10px 5px !important;
    vertical-align: middle !important;
    line-height: 1.35 !important;
    overflow-wrap: normal !important;
}

.registration_slab tr.heading td *,
.registration_slab .headingDate,
.registration_slab .headingDate * {
    color: #ffffff !important;
    opacity: 1 !important;
}

.registration_slab tr.heading td span,
.registration_slab tr.heading td small {
    display: block !important;
    margin-top: 4px !important;
    color: #fff0bd !important;
    font-size: 12px !important;
    line-height: 1.35 !important;
    white-space: normal !important;
}

/* Radio button in the Type selection cell. */
.registration_slab tr:not(.heading) td:nth-child(1) input[type="radio"] {
    display: inline-block !important;
    position: static !important;
    float: none !important;
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    max-width: 16px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    vertical-align: middle !important;
}

/* Each fee cell contains ONE radio button and ONE price.
   Keep them side by side, centred, and within that cell. */
.registration_slab tr:not(.heading) td:nth-child(3) input[type="radio"],
.registration_slab tr:not(.heading) td:nth-child(4) input[type="radio"] {
    display: inline-block !important;
    position: static !important;
    float: none !important;
    width: 15px !important;
    height: 15px !important;
    min-width: 15px !important;
    max-width: 15px !important;
    margin: 0 5px 0 0 !important;
    padding: 0 !important;
    vertical-align: middle !important;
    accent-color: var(--iss-teal-dark);
}

.registration_slab tr:not(.heading) td:nth-child(3) label,
.registration_slab tr:not(.heading) td:nth-child(4) label {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    max-width: 100% !important;
    margin: 0 !important;
    white-space: nowrap !important;
}

/* Keep prices compact and prevent overlap into the next column. */
.registration_slab tr:not(.heading) td:nth-child(3) .registration_cost,
.registration_slab tr:not(.heading) td:nth-child(4) .registration_cost,
.registration_slab tr:not(.heading) td:nth-child(3) .registration_fee,
.registration_slab tr:not(.heading) td:nth-child(4) .registration_fee,
.registration_slab tr:not(.heading) td:nth-child(3) .amount,
.registration_slab tr:not(.heading) td:nth-child(4) .amount {
    display: inline-block !important;
    position: static !important;
    float: none !important;
    max-width: 100% !important;
    margin: 0 !important;
    color: #d33b35 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.25 !important;
    white-space: nowrap !important;
}

/* If the price is plain text rather than a classed span,
   preserve the inline layout of the radio and amount. */
.registration_slab tr:not(.heading) td:nth-child(3),
.registration_slab tr:not(.heading) td:nth-child(4) {
    font-size: 14px !important;
}

/* Phone layout: keep the four columns intact and scroll only
   when the viewport is too narrow to read the fee amounts. */
@media (max-width: 767px) {
    #fWrapper {
        padding: 8px 4px !important;
    }

    #fContentContainer {
        padding: 10px !important;
    }

    .registration_slab {
        display: block !important;
        width: 100% !important;
        overflow-x: auto !important;
        table-layout: auto !important;
        white-space: nowrap !important;
    }

    .registration_slab tr:not(.heading) td:nth-child(2) {
        min-width: 205px !important;
    }

    .registration_slab tr:not(.heading) td:nth-child(3),
    .registration_slab tr:not(.heading) td:nth-child(4) {
        min-width: 125px !important;
    }

    .registration_slab tr.heading td {
        height: auto !important;
        min-width: 75px !important;
    }
}

/* ==========================================================
   ISS 2027 – HTML-VERIFIED FEE TABLE FIX
   Based on the supplied registration page HTML.

   Actual structure in each fee row:
     TD 1: main category radio
     TD 2: category label (colspan="2")
     TD 3: Early Bird radio + amount (class registration_cost)
     TD 4: Standard Fee radio + amount (class registration_cost)

   Header:
     TD 1: blank
     TD 2: Type (colspan="2")
     TD 3: Early Bird
     TD 4: Standard Fee

   Widths: Type group 60%, Early Bird 20%, Standard Fee 20%.
   ========================================================== */

/* Page width: 800px maximum, centred. */
#fWrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 16px 10px !important;
    box-sizing: border-box !important;
}

#fPage {
    display: block !important;
    width: 100% !important;
    max-width: 800px !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
}

#fContent,
#fContentContainer,
#fMatter,
#fMatter > form,
.fModule,
.fModuleContent,
fieldset {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
}

#fContentContainer {
    display: block !important;
    padding: 16px !important;
}

#fMatter {
    float: none !important;
}

/* Correct table layout using the actual four TDs and colspan. */
table.registration_slab {
    display: table !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    white-space: normal !important;
}

/* Header: first cell 3%, Type cell spans two columns (57%),
   Early Bird 20%, Standard Fee 20%. */
table.registration_slab tr.heading > td:nth-child(1) {
    width: 3% !important;
    padding: 10px 2px !important;
}

table.registration_slab tr.heading > td:nth-child(2) {
    width: 57% !important;
    text-align: center !important;
    padding: 10px 8px !important;
}

table.registration_slab tr.heading > td:nth-child(3),
table.registration_slab tr.heading > td:nth-child(4) {
    width: 20% !important;
    text-align: center !important;
    padding: 10px 5px !important;
}

/* Body rows: category label spans the two Type columns.
   Each fee option is one table cell containing radio + amount. */
table.registration_slab tr.trtype > td:nth-child(1) {
    width: 3% !important;
    padding: 9px 3px !important;
    text-align: center !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
}

table.registration_slab tr.trtype > td:nth-child(2) {
    width: 57% !important;
    padding: 9px 9px !important;
    text-align: left !important;
    vertical-align: middle !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
}

table.registration_slab tr.trtype > td:nth-child(3),
table.registration_slab tr.trtype > td:nth-child(4) {
    width: 20% !important;
    min-width: 0 !important;
    padding: 9px 5px !important;
    text-align: center !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
}

/* CRITICAL FIX:
   .registration_cost is the TABLE CELL itself, not a price span.
   Keep it as table-cell; never change it to inline-block. */
table.registration_slab td.registration_cost {
    display: table-cell !important;
    position: static !important;
    float: none !important;
    box-sizing: border-box !important;
    text-align: center !important;
    vertical-align: middle !important;
    white-space: nowrap !important;
    overflow: visible !important;
    color: #d33b35 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.35 !important;
}

/* All fee radios remain inline with their own amount. */
table.registration_slab td.registration_cost input[type="radio"] {
    display: inline-block !important;
    position: static !important;
    float: none !important;
    width: 15px !important;
    height: 15px !important;
    min-width: 15px !important;
    max-width: 15px !important;
    margin: 0 5px 0 0 !important;
    padding: 0 !important;
    vertical-align: -2px !important;
}

/* Main category radio. */
table.registration_slab tr.trtype > td:first-child input[type="radio"] {
    display: inline-block !important;
    position: static !important;
    float: none !important;
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    max-width: 16px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    vertical-align: middle !important;
}

/* Keep category names readable. */
table.registration_slab .registration_fee {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    text-align: left !important;
    line-height: 1.35 !important;
}

table.registration_slab .registration_fee label {
    display: inline !important;
    margin: 0 !important;
    white-space: normal !important;
    color: #124b7d !important;
    font-weight: 700 !important;
}

/* Date headings: readable, visible, and wrapped within 20% cells. */
table.registration_slab tr.heading > td {
    height: 112px !important;
    vertical-align: middle !important;
    line-height: 1.35 !important;
    overflow-wrap: normal !important;
}

table.registration_slab tr.heading > td,
table.registration_slab tr.heading > td * {
    color: #ffffff !important;
    opacity: 1 !important;
}

table.registration_slab tr.heading > td .lowlight {
    display: block !important;
    margin-top: 5px !important;
    color: #fff0bd !important;
    font-size: 12px !important;
    font-weight: 650 !important;
    line-height: 1.35 !important;
    white-space: normal !important;
}

/* Preserve alternating row background and borders. */
table.registration_slab tr.trtype > td {
    border-bottom: 1px solid #dceaf3 !important;
}

/* Narrow screens: allow horizontal scrolling instead of overlap. */
@media (max-width: 767px) {
    #fWrapper {
        padding: 8px 4px !important;
    }

    #fContentContainer {
        padding: 10px !important;
    }

    table.registration_slab {
        display: block !important;
        width: 100% !important;
        overflow-x: auto !important;
        table-layout: auto !important;
    }

    table.registration_slab tr.trtype > td:nth-child(2) {
        min-width: 205px !important;
    }

    table.registration_slab tr.trtype > td:nth-child(3),
    table.registration_slab tr.trtype > td:nth-child(4) {
        min-width: 125px !important;
    }

    table.registration_slab tr.heading > td {
        height: auto !important;
        min-width: 75px !important;
    }
}

/* ==========================================================
   ISS 2027 – MOBILE OPTIMIZATION V8
   Desktop styles remain unchanged.
   On phones, only the fee table can scroll horizontally;
   the overall page and registration form fit the viewport.
   ========================================================== */

/* Prevent page-level horizontal overflow. */
html,
body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
}

#fWrapper,
#fPage,
#fContent,
#fContentContainer,
#fMatter,
#fMatter > form {
    box-sizing: border-box !important;
    min-width: 0 !important;
    max-width: 100% !important;
}

@media (max-width: 767px) {

    /* Compact page spacing. */
    #fWrapper {
        width: 100% !important;
        padding: 8px !important;
        margin: 0 auto !important;
    }

    #fPage {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        border-left: 0 !important;
        border-right: 0 !important;
    }

    #fHeader {
        padding: 12px 14px !important;
    }

    #fHeader h1 {
        font-size: clamp(25px, 7vw, 34px) !important;
        line-height: 1.2 !important;
        margin: 8px 0 !important;
    }

    #fContent {
        width: 100% !important;
        padding: 0 !important;
    }

    #fPageTitle {
        padding: 14px 16px !important;
    }

    #fPageTitle h1 {
        font-size: 21px !important;
        line-height: 1.25 !important;
    }

    #fContentContainer {
        display: block !important;
        width: 100% !important;
        padding: 10px !important;
    }

    #fSidebarLeft {
        display: none !important;
        width: 0 !important;
    }

    #fMatter {
        display: block !important;
        float: none !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    #fMatter > form {
        width: 100% !important;
        margin: 0 !important;
    }

    /* Registration fee card. */
    .fModuleFeeSlab {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 18px !important;
        border-radius: 12px !important;
        overflow: hidden !important;
    }

    .fModuleFeeSlab .fModuleTitle {
        padding: 13px 15px !important;
    }

    .fModuleFeeSlab .fModuleTitle h3 {
        font-size: 18px !important;
        line-height: 1.3 !important;
    }

    .fModuleFeeSlab .fModuleContent {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding: 10px !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
    }

    /*
      Keep the actual four-cell table intact.
      Give it a readable minimum width and scroll inside
      the fee-table area only, not across the whole page.
    */
    table.registration_slab {
        display: table !important;
        width: 100% !important;
        min-width: 650px !important;
        max-width: none !important;
        table-layout: fixed !important;
        border-collapse: separate !important;
        border-spacing: 0 !important;
        margin: 0 !important;
        overflow: visible !important;
        white-space: normal !important;
    }

    .fModuleFeeSlab .fModuleContent {
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        scrollbar-width: thin;
        scrollbar-color: #2b78ad #e8f1f7;
    }

    table.registration_slab tr.heading > td:nth-child(1),
    table.registration_slab tr.trtype > td:nth-child(1) {
        width: 30px !important;
        min-width: 30px !important;
    }

    table.registration_slab tr.heading > td:nth-child(2),
    table.registration_slab tr.trtype > td:nth-child(2) {
        width: 360px !important;
        min-width: 360px !important;
    }

    table.registration_slab tr.heading > td:nth-child(3),
    table.registration_slab tr.heading > td:nth-child(4),
    table.registration_slab tr.trtype > td:nth-child(3),
    table.registration_slab tr.trtype > td:nth-child(4) {
        width: 130px !important;
        min-width: 130px !important;
    }

    /* Keep each fee radio and amount together. */
    table.registration_slab td.registration_cost {
        display: table-cell !important;
        min-width: 130px !important;
        padding: 10px 6px !important;
        text-align: center !important;
        white-space: nowrap !important;
        font-size: 14px !important;
    }

    table.registration_slab td.registration_cost input[type="radio"] {
        width: 17px !important;
        height: 17px !important;
        min-width: 17px !important;
        max-width: 17px !important;
        margin: 0 5px 0 0 !important;
        vertical-align: -3px !important;
    }

    table.registration_slab tr.trtype > td:first-child input[type="radio"] {
        width: 18px !important;
        height: 18px !important;
        min-width: 18px !important;
        max-width: 18px !important;
    }

    table.registration_slab .registration_fee label {
        font-size: 14px !important;
        line-height: 1.4 !important;
    }

    table.registration_slab tr.heading > td {
        height: auto !important;
        min-height: 92px !important;
        padding: 12px 7px !important;
        font-size: 14px !important;
        line-height: 1.35 !important;
    }

    table.registration_slab tr.heading > td .lowlight {
        font-size: 12px !important;
        line-height: 1.35 !important;
    }

    /* Start Registration section. */
    .fModuleLoginInfo {
        width: 100% !important;
        max-width: 100% !important;
        margin-top: 16px !important;
        border-radius: 12px !important;
        overflow: hidden !important;
    }

    .fModuleLoginInfo .fModuleTitle {
        padding: 13px 15px !important;
    }

    .fModuleLoginInfo .fModuleTitle h3 {
        font-size: 18px !important;
    }

    .fModuleLoginInfo .fModuleContent {
        width: 100% !important;
        padding: 14px !important;
        box-sizing: border-box !important;
    }

    #register-login {
        font-size: 14px !important;
        line-height: 1.5 !important;
        margin: 0 0 16px !important;
    }

    /* Mobile form fields: label above input. */
    .field-para,
    #field-para-username,
    #field-para-password,
    #field-para-password0 {
        display: block !important;
        width: 100% !important;
        margin: 0 0 16px !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    .field-para > label {
        display: block !important;
        width: 100% !important;
        margin: 0 0 7px !important;
        padding: 0 !important;
        text-align: left !important;
        font-size: 14px !important;
        line-height: 1.4 !important;
    }

    .field-para > input,
    .field-para > select,
    .field-para > textarea,
    #field-para-username input,
    #field-para-password input,
    #field-para-password0 input {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        min-height: 44px !important;
        margin: 0 !important;
        padding: 10px 12px !important;
        box-sizing: border-box !important;
        font-size: 16px !important;
        border-radius: 9px !important;
    }

    /* Captcha and submit button. */
    .cf-turnstile {
        max-width: 100% !important;
        margin: 12px 0 !important;
        overflow: hidden !important;
    }

    .buttons {
        width: 100% !important;
        margin: 14px 0 4px !important;
        padding: 0 !important;
    }

    .buttons input[type="submit"],
    input.submit,
    button.submit {
        display: block !important;
        width: 100% !important;
        min-height: 46px !important;
        margin: 0 !important;
        padding: 12px 18px !important;
        box-sizing: border-box !important;
        border-radius: 9px !important;
        font-size: 16px !important;
    }

    /* Footer spacing. */
    #fFooter,
    #fFooterContainer {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        text-align: center !important;
        padding: 12px !important;
        font-size: 12px !important;
    }
}

/* Very small phones. */
@media (max-width: 380px) {
    #fWrapper {
        padding: 4px !important;
    }

    #fContentContainer {
        padding: 7px !important;
    }

    .fModuleFeeSlab .fModuleContent {
        padding: 7px !important;
    }

    .fModuleLoginInfo .fModuleContent {
        padding: 11px !important;
    }
}

/* ==========================================================
   ISS 2027 – DESKTOP FORM OPTIMIZATION V9
   Desktop: centred 800px page, fixed label column and input
   column on the same row. Mobile rules from V8 remain active.
   ========================================================== */

@media (min-width: 768px) {

    html,
    body {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    #fWrapper {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        padding: 20px 12px !important;
        box-sizing: border-box !important;
    }

    #fPage {
        display: block !important;
        width: calc(100% - 24px) !important;
        max-width: 800px !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
    }

    #fContent,
    #fContentContainer,
    #fMatter,
    #fMatter > form {
        display: block !important;
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    #fContentContainer {
        padding: 18px 20px !important;
    }

    #fSidebarLeft,
    #fSidebarRight {
        display: none !important;
        width: 0 !important;
    }

    #fPageTitle {
        padding: 17px 22px !important;
    }

    #fPageTitle h1 {
        font-size: 23px !important;
    }

    /* Keep personal-information and other form modules within page. */
    #fMatter .fModule,
    #fMatter fieldset {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 20px !important;
        box-sizing: border-box !important;
        border-radius: 12px !important;
        overflow: hidden !important;
    }

    #fMatter .fModuleTitle {
        margin: 0 !important;
        padding: 13px 18px !important;
        color: #fff !important;
        background: linear-gradient(100deg, #15558a, #2477b8) !important;
        border-bottom: 4px solid #e8bd48 !important;
    }

    #fMatter .fModuleTitle h3 {
        margin: 0 !important;
        color: #fff !important;
        font-size: 17px !important;
        font-weight: 800 !important;
    }

    #fMatter .fModuleContent {
        width: 100% !important;
        max-width: 100% !important;
        padding: 20px !important;
        box-sizing: border-box !important;
    }

    /* Consistent desktop form grid: labels left, controls right. */
    #fMatter .field-para,
    #fMatter .form-group,
    #fMatter .form-row {
        display: grid !important;
        grid-template-columns: 220px minmax(0, 1fr) !important;
        align-items: center !important;
        column-gap: 18px !important;
        row-gap: 5px !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 0 14px !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    #fMatter .field-para > label,
    #fMatter .form-group > label,
    #fMatter .form-row > label {
        display: block !important;
        grid-column: 1 !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        text-align: right !important;
        white-space: normal !important;
        overflow-wrap: break-word !important;
        line-height: 1.35 !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        color: #103f70 !important;
    }

    #fMatter .field-para > input,
    #fMatter .field-para > select,
    #fMatter .field-para > textarea,
    #fMatter .field-para > .form-control,
    #fMatter .form-group > input,
    #fMatter .form-group > select,
    #fMatter .form-group > textarea,
    #fMatter .form-group > .form-control,
    #fMatter .form-row > input,
    #fMatter .form-row > select,
    #fMatter .form-row > textarea,
    #fMatter .form-row > .form-control {
        display: block !important;
        grid-column: 2 !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        min-height: 42px !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    /* If eRegNow wraps a control in a div, place the wrapper in col 2. */
    #fMatter .field-para > label + div,
    #fMatter .field-para > label + p,
    #fMatter .form-group > label + div,
    #fMatter .form-group > label + p,
    #fMatter .form-row > label + div,
    #fMatter .form-row > label + p {
        display: block !important;
        grid-column: 2 !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    #fMatter .field-para > label + div input,
    #fMatter .field-para > label + div select,
    #fMatter .field-para > label + div textarea,
    #fMatter .field-para > label + p input,
    #fMatter .field-para > label + p select,
    #fMatter .field-para > label + p textarea,
    #fMatter .form-group > label + div input,
    #fMatter .form-group > label + div select,
    #fMatter .form-group > label + div textarea,
    #fMatter .form-row > label + div input,
    #fMatter .form-row > label + div select,
    #fMatter .form-row > label + div textarea {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    #fMatter .field-para .help-block,
    #fMatter .field-para .hint,
    #fMatter .form-group .help-block,
    #fMatter .form-group .hint,
    #fMatter .form-row .help-block,
    #fMatter .form-row .hint {
        grid-column: 2 !important;
        margin: 3px 0 0 !important;
        text-align: left !important;
    }

    /* The registration fee table keeps the four verified columns. */
    #fMatter table.registration_slab {
        width: 100% !important;
        max-width: 100% !important;
        table-layout: fixed !important;
    }

    /* Buttons remain aligned and do not stretch across the whole form. */
    #fMatter .buttons {
        margin: 16px 0 0 238px !important;
        text-align: left !important;
    }

    #fMatter .buttons input[type="submit"],
    #fMatter input.submit {
        display: inline-flex !important;
        width: auto !important;
        min-width: 180px !important;
        max-width: 260px !important;
    }
}

/* Medium desktop/tablet landscape: slightly narrower label column. */
@media (min-width: 768px) and (max-width: 1024px) {
    #fMatter .field-para,
    #fMatter .form-group,
    #fMatter .form-row {
        grid-template-columns: 190px minmax(0, 1fr) !important;
        column-gap: 14px !important;
    }

    #fMatter .buttons {
        margin-left: 204px !important;
    }
}