:root {
    --ek-tint-soft: #FAFBFC;
    --ek-tint: #F1F4F7;
    --ek-tint-hero: #F6F8FA;
    --ek-ink: #1a202c;
}

@supports (color: color-mix(in srgb, red 50%, blue)) {
    :root {
        --ek-tint-soft: color-mix(in srgb, var(--theme-primary-safe, #438244) 4%, #ffffff);
        --ek-tint: color-mix(in srgb, var(--theme-primary-safe, #438244) 12%, #ffffff);
        --ek-tint-hero: color-mix(in srgb, var(--theme-primary-safe, #438244) 9%, #ffffff);
        --ek-ink: color-mix(in srgb, var(--theme-primary-safe, #438244) 70%, #000000);
    }
}

.doc-shell.panel,
.ipv-shell.panel,
.gen-shell.panel,
.rv-shell.panel,
.pan-shell.panel,
.ek-shell.panel {
    border: 0;
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 16px 40px rgba(16, 24, 40, .08);
    overflow: hidden;
}

.doc-shell > .panel-body,
.ipv-shell > .panel-body,
.gen-shell > .panel-body,
.rv-shell > .panel-body,
.pan-shell > .panel-body,
.ek-shell > .panel-body {
    padding: 0;
}

.ipv-shell [class^=col-] {
    border-color: white;
}

.doc-hero {
    display: grid;
    grid-template-columns: 1fr minmax(220px, 280px);
    gap: 24px;
    align-items: end;
    padding: 28px 28px 24px;
    background: linear-gradient(180deg, var(--ek-tint-hero, #F6F8FA) 0%, #ffffff 100%);
    border-bottom: 1px solid #E6EAEF;
    text-align: left;
}

    .doc-hero h1,
    .ipv-hero h1,
    .gen-hero h1,
    .rv-hero h1,
    .es-hero h1,
    .pan-hero h1,
    .ek-hero h1 {
        margin: 0 0 6px;
        font-size: 26px;
        font-weight: 700;
        line-height: 1.25;
        color: #1a202c;
    }

.doc-hero-lead,
.rv-lead {
    margin: 0 0 14px;
    color: #4a5568;
    font-size: 15px;
}

.doc-tips,
.rv-tips,
.lm-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

    .doc-tips li,
    .rv-tips li {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 5px 12px;
        border: 1px solid #DDE3EA;
        border-radius: 999px;
        background: #ffffff;
        color: #3d4652;
        font-size: 13px;
        font-weight: 500;
    }

    .doc-tips svg,
    .rv-tips svg {
        width: 14px;
        height: 14px;
        color: var(--theme-primary-safe, #438244);
    }

.doc-meter {
    padding: 14px 16px;
    border: 1px solid #E6EAEF;
    border-radius: 14px;
    background: #ffffff;
}

.doc-meter-label {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px;
    margin-bottom: 8px;
    font-size: 13px;
    color: #4a5568;
}

    .doc-meter-label strong {
        color: #1a202c;
        font-size: 15px;
    }

.doc-meter-track {
    height: 8px;
    border-radius: 999px;
    background: #E6EAEF;
    overflow: hidden;
}

    .doc-meter-track span {
        display: block;
        height: 100%;
        border-radius: 999px;
        background: var(--theme-primary-safe, #438244);
        transition: width .6s ease;
    }

.doc-content {
    padding: 24px 28px 28px;
}

.doc-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 14px;
}

.doc-card {
    position: relative;
    display: grid;
    grid-template-columns: 60px 1fr auto;
    gap: 18px;
    align-items: center;
    padding: 18px 20px;
    border: 1px solid #E3E8EE;
    border-radius: 16px;
    background: #ffffff;
    text-align: left;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}

    .doc-card:hover,
    .doc-card:focus-within {
        border-color: #C9D2DC;
        box-shadow: 0 8px 24px rgba(16, 24, 40, .08);
        transform: translateY(-1px);
    }

    .doc-card.is-done,
    .ek-shell .ddpi-table > tbody > tr:has(input:checked) > td {
        background: var(--ek-tint-soft, #FAFBFC);
    }

.doc-icon {
    position: relative;
    width: 60px;
    height: 60px;
    border-radius: 16px;
    background: #F1F4F7;
    display: flex;
    align-items: center;
    justify-content: center;
}

.doc-card.is-done .doc-icon {
    background: var(--ek-tint, #F1F4F7);
}

.doc-card.is-pending .doc-icon {
    background: #FFF4E5;
}

.doc-icon img {
    max-width: 36px;
    max-height: 36px;
}

.doc-card.is-done .doc-icon::after {
    content: "";
    position: absolute;
    right: -4px;
    bottom: -4px;
    width: 20px;
    height: 20px;
    border: 2px solid #ffffff;
    border-radius: 50%;
    background: var(--theme-primary-safe, #438244) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center / 12px no-repeat;
}

.doc-main h2 {
    margin: 0 0 4px;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.3;
    color: #1a202c;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.doc-main p,
.es-sub {
    margin: 0;
    color: #4a5568;
    font-size: 14px;
}

.doc-status {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
    white-space: nowrap;
}

    .doc-status svg,
    .es-eyebrow svg {
        width: 13px;
        height: 13px;
    }

    .doc-status.is-done {
        background: var(--ek-tint, #F1F4F7);
        color: var(--ek-ink, #1a202c);
    }

    .doc-status.is-pending {
        background: #FFF1DC;
        color: #8A4B00;
    }

.doc-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 160px;
}

html body .ui.button.ithub-primary2.doc-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 42px;
    margin: 0;
    padding: 9px 16px;
    border: 2px solid var(--theme-primary-safe, #438244) !important;
    border-radius: 10px;
    font-size: 14px;
    line-height: 1.2;
    font-weight: 600;
    white-space: nowrap;
    transition: background-color .2s ease, color .2s ease, box-shadow .2s ease;
}

    html body .ui.button.ithub-primary2.doc-btn svg {
        width: 16px;
        height: 16px;
        flex: none;
    }

    html body .ui.button.ithub-primary2.doc-btn.is-re {
        background-color: #ffffff !important;
        background-image: none !important;
        color: var(--theme-primary-safe, #438244) !important;
    }

        html body .ui.button.ithub-primary2.doc-btn.is-re:hover,
        html body .ui.button.ithub-primary2.doc-btn.is-re:focus,
        html body .ui.button.ithub-primary2.doc-btn.is-re:active {
            background-color: var(--theme-primary-safe, #438244) !important;
            color: #ffffff !important;
        }

    html body .ui.button.ithub-primary2.doc-btn:focus-visible,
    a.rv-link-btn:focus-visible,
    html body .es-btn.ui.button:focus-visible {
        outline: 3px solid #1558A8;
        outline-offset: 2px;
    }

.doc-pending {
    display: grid;
    grid-template-columns: 40px 1fr;
    gap: 14px;
    margin-top: 20px;
    padding: 18px 20px;
    border: 1px solid #F5D9A8;
    border-radius: 16px;
    background: #FFF8EC;
    color: #5c3300;
    text-align: left;
}

.doc-pending-icon {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: #FFE7C2;
    color: #8A4B00;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .doc-pending-icon svg {
        width: 22px;
        height: 22px;
    }

.doc-pending h2 {
    margin: 0 0 10px;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.35;
    color: #5c3300;
}

.doc-pending ul {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.doc-pending li {
    padding: 4px 12px;
    border: 1px solid #F0C98A;
    border-radius: 999px;
    background: #ffffff;
    font-size: 13px;
    font-weight: 600;
}

.doc-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #E6EAEF;
    flex-wrap: wrap;
}

    .doc-nav .ui.large.button {
        min-width: 140px;
        margin: 0;
        border-radius: 10px;
        text-align: center;
    }

.doc-modal label,
.li-card .ui.form .ui.left.icon.input {
    width: 100%;
}

.ipv-hero,
.gen-hero,
.rv-hero,
.pan-hero,
.ek-hero {
    padding: 28px 28px 24px;
    background: linear-gradient(180deg, var(--ek-tint-hero, #F6F8FA) 0%, #ffffff 100%);
    border-bottom: 1px solid #E6EAEF;
    text-align: left;
}

    .ipv-hero p,
    .gen-hero p,
    .es-hero p.es-lead,
    .pan-lead,
    .ek-lead {
        margin: 0;
        color: #4a5568;
        font-size: 15px;
    }

.ipv-content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 20px;
    padding: 24px 28px 8px;
    text-align: left;
}

.ipv-card {
    padding: 20px;
    border: 1px solid #E3E8EE;
    border-radius: 16px;
    background: #ffffff;
}

    .ipv-card h2 {
        display: flex;
        align-items: center;
        gap: 10px;
        margin: 0 0 14px;
        font-size: 17px;
        font-weight: 700;
        line-height: 1.35;
        color: #1a202c;
    }

.ipv-card-icon,
.rv-file-icon,
.done-summary-icon {
    flex: none;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: var(--ek-tint, #F1F4F7);
    color: var(--theme-primary-safe, #438244);
    display: flex;
    align-items: center;
    justify-content: center;
}

    .ipv-card-icon svg,
    .rv-file-icon svg,
    .done-summary-icon svg {
        width: 20px;
        height: 20px;
    }

.ipv-steps {
    margin: 0 0 14px;
    padding-left: 20px;
    color: #4a5568;
    font-size: 14px;
}

    .ipv-steps li + li {
        margin-top: 4px;
    }

.ipv-script {
    margin: 0;
    padding: 16px 18px;
    border-left: 4px solid var(--theme-primary-safe, #438244);
    border-radius: 12px;
    background: #F6F8FA;
    color: #1a202c;
    font-size: 16px;
    line-height: 1.7;
}

    .ipv-script b {
        color: #1a202c;
        background: #ffffff;
        padding: 1px 6px;
        border-radius: 6px;
        border: 1px solid #E3E8EE;
        white-space: nowrap;
    }

.ipv-later h2,
h3.ek-subhead-title {
    font-size: 16px;
}

.ipv-later p {
    margin: 0 0 12px;
    color: #4a5568;
    font-size: 14px;
}

.ipv-later label {
    display: block;
    margin: 0 0 6px;
    font-size: 13px;
    font-weight: 600;
    color: #3d4652;
}

.ipv-copy,
.ek-shell .ithub-choice-options .form-radio {
    display: flex;
    gap: 8px;
}

    .ipv-copy .form-control {
        min-width: 0;
        height: 42px;
        border: 1px solid #767676;
        border-radius: 10px;
        background: #F6F8FA;
        font-size: 13px;
    }

html body .btn.ipv-copy-btn {
    flex: none;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 42px;
    padding: 0 14px;
    border: 2px solid var(--theme-primary-safe, #438244) !important;
    border-radius: 10px;
    background: #ffffff !important;
    color: var(--theme-primary-safe, #438244) !important;
    font-weight: 600;
}

    html body .btn.ipv-copy-btn:hover,
    html body .btn.ipv-copy-btn:focus,
    html body .btn.ipv-copy-btn:active,
    html body .es-btn.es-btn--outline.ui.button:hover,
    html body .es-btn.es-btn--outline.ui.button:focus,
    html body .es-btn.es-btn--outline.ui.button:active {
        background: var(--theme-primary-safe, #438244) !important;
        color: #ffffff !important;
    }

    html body .btn.ipv-copy-btn svg,
    a.rv-link-btn svg {
        width: 16px;
        height: 16px;
    }

.ipv-copy-status {
    min-height: 20px;
    margin: 6px 0 0;
    font-size: 13px;
    font-weight: 600;
    color: var(--theme-primary-safe, #438244);
}

.ipv-divider {
    height: 1px;
    margin: 14px 0;
    background: #E6EAEF;
}

html body .ipv-later .ui.red.large.button {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    margin: 0;
    border-radius: 10px;
    text-align: center;
}

.ipv-recorder {
    padding: 8px 28px 24px;
    text-align: left;
}

.ipv-support,
.done-support,
.pan-support,
.ek-support {
    padding: 0 28px 20px;
}

.gen-content {
    padding: 32px 28px 28px;
}

.gen-card {
    max-width: 520px;
    margin: 0 auto;
    padding: 28px 24px 24px;
    border: 1px solid #E3E8EE;
    border-radius: 16px;
    background: #ffffff;
    text-align: center;
}

.gen-mark {
    position: relative;
    width: 88px;
    height: 88px;
    margin: 0 auto 18px;
    border-radius: 50%;
    background: var(--ek-tint, #F1F4F7);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--theme-primary-safe, #438244);
}

    .gen-mark svg {
        width: 36px;
        height: 36px;
    }

    .gen-mark::before {
        content: "";
        position: absolute;
        inset: 0;
        border-radius: 50%;
        border: 4px solid transparent;
        border-top-color: var(--theme-primary-safe, #438244);
        border-right-color: var(--theme-primary-safe, #438244);
        animation: gen-spin 1s linear infinite;
    }

.gen-card.is-done .gen-mark::before,
.gen-card.is-error .gen-mark::before,
.ek-shell .ui.form .field > .fields > .field:not(:has(*)),
.li-card .field-error-message:empty {
    display: none;
}

.gen-card.is-error .gen-mark {
    background: #FDECEC;
    color: #B42318;
}

.gen-icon-done,
.gen-icon-error,
.gen-card.is-done .gen-icon-doc,
.gen-card.is-error .gen-icon-doc,
.ek-shell .ithub-choice-field > div[style*="clear"] {
    display: none;
}

.gen-card.is-done .gen-icon-done,
.gen-card.is-error .gen-icon-error {
    display: block;
}

.gen-status {
    margin: 0 0 6px;
    font-size: 18px;
    font-weight: 700;
    color: #1a202c;
}

.gen-sub {
    margin: 0 0 22px;
    color: #4a5568;
    font-size: 14px;
}

.gen-steps {
    list-style: none;
    margin: 0;
    padding: 16px 18px;
    border-radius: 12px;
    background: #F6F8FA;
    text-align: left;
}

    .gen-steps li {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 6px 0;
        color: #4a5568;
        font-size: 14px;
    }

.gen-dot {
    flex: none;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 2px solid #8A94A3;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .gen-dot svg {
        width: 12px;
        height: 12px;
        display: none;
    }

.gen-steps li.is-done,
[data-theme="dark"] .ek-shell .ui.form .field > label,
[data-theme="dark"] .pan-shell .ui.form .field > label {
    color: #1a202c;
}

    .gen-steps li.is-done .gen-dot {
        border-color: var(--theme-primary-safe, #438244);
        background: var(--theme-primary-safe, #438244);
        color: #ffffff;
    }

        .gen-steps li.is-done .gen-dot svg {
            display: block;
        }

.gen-steps li.is-active {
    color: #1a202c;
    font-weight: 600;
}

    .gen-steps li.is-active .gen-dot {
        border-color: var(--theme-primary-safe, #438244);
        box-shadow: inset 0 0 0 4px #ffffff, inset 0 0 0 11px var(--theme-primary-safe, #438244);
    }

.gen-steps li.is-error {
    color: #B42318;
    font-weight: 600;
}

    .gen-steps li.is-error .gen-dot {
        border-color: #B42318;
        background: #B42318;
    }

.gen-note {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 18px 0 0;
    padding: 12px 14px;
    border: 1px solid #F5D9A8;
    border-radius: 12px;
    background: #FFF8EC;
    color: #5c3300;
    font-size: 13px;
    text-align: left;
}

    .gen-note svg,
    .es-note svg {
        flex: none;
        width: 18px;
        height: 18px;
        margin-top: 1px;
    }

.gen-error {
    display: none;
    margin-top: 18px;
}

.gen-card.is-error .gen-error {
    display: block;
}

.gen-card.is-error .gen-note,
.ek-check-error:empty {
    display: none;
}

html body .gen-retry.ui.button {
    min-width: 160px;
    min-height: 44px;
    margin: 0;
    border-radius: 10px;
}

.rv-content,
.at-content {
    padding: 24px 28px 28px;
    text-align: left;
}

.rv-viewer {
    border: 1px solid #E3E8EE;
    border-radius: 16px;
    background: #ffffff;
    overflow: hidden;
}

.rv-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 12px 16px;
    border-bottom: 1px solid #E6EAEF;
    background: #F6F8FA;
}

.rv-file {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

    .rv-file h2 {
        margin: 0;
        font-size: 16px;
        font-weight: 700;
        color: #1a202c;
    }

    .rv-file p {
        margin: 0;
        font-size: 13px;
        color: #4a5568;
    }

.rv-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

a.rv-link-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 38px;
    padding: 6px 14px;
    border: 2px solid var(--theme-primary-safe, #438244);
    border-radius: 10px;
    background: #ffffff;
    color: var(--theme-primary-safe, #438244);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: background-color .2s ease, color .2s ease;
}

    a.rv-link-btn:hover,
    a.rv-link-btn:focus {
        background: var(--theme-primary-safe, #438244);
        color: #ffffff;
        text-decoration: none;
    }

.rv-frame {
    display: block;
    width: 100%;
    height: 72vh;
    min-height: 480px;
    border: 0;
    background: #EEF1F4;
}

.rv-mobile-note {
    display: none;
    margin: 0;
    padding: 12px 16px;
    border-top: 1px solid #E6EAEF;
    color: #4a5568;
    font-size: 13px;
}

.rv-nav {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #E6EAEF;
}

    .rv-nav p {
        margin: 0 auto 0 0;
        color: #4a5568;
        font-size: 14px;
    }

html body .rv-nav .ui.red.large.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 160px;
    min-height: 46px;
    margin: 0;
    border-radius: 10px;
}

    html body .rv-nav .ui.red.large.button svg {
        width: 18px;
        height: 18px;
    }

.es-wrap {
    max-width: 1000px;
    margin: 20px auto 0;
}

.es-shell {
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 16px 40px rgba(16, 24, 40, .08);
    overflow: hidden;
    text-align: left;
}

.es-hero {
    padding: 28px 28px 24px;
    background: linear-gradient(180deg, var(--ek-tint-hero, #F6F8FA) 0%, #ffffff 100%);
    border-bottom: 1px solid #E6EAEF;
}

.es-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 8px;
    padding: 3px 10px;
    border-radius: 999px;
    background: var(--ek-tint, #F1F4F7);
    color: var(--ek-ink, #1a202c);
    font-size: 12px;
    font-weight: 600;
}

.es-content {
    display: grid;
    grid-template-columns: 1.15fr 1fr;
    gap: 20px;
    padding: 24px 28px 28px;
}

.es-card {
    display: flex;
    flex-direction: column;
    padding: 22px;
    border: 1px solid #E3E8EE;
    border-radius: 16px;
    background: #ffffff;
}

    .es-card.is-primary {
        border: 2px solid var(--theme-primary-safe, #438244);
    }

.es-card-head {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 14px;
}

.es-card-icon {
    flex: none;
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: var(--ek-tint, #F1F4F7);
    color: var(--theme-primary-safe, #438244);
    display: flex;
    align-items: center;
    justify-content: center;
}

    .es-card-icon svg {
        width: 24px;
        height: 24px;
    }

.es-card:not(.is-primary) .es-card-icon {
    background: #F1F4F7;
    color: #3d4652;
}

.es-card h2,
.pan-title,
.ek-title {
    margin: 0 0 4px;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
    color: #1a202c;
}

.es-tag {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 999px;
    background: var(--ek-tint, #F1F4F7);
    color: var(--ek-ink, #1a202c);
    font-size: 12px;
    font-weight: 600;
}

.es-checks {
    margin: 0 0 16px;
    padding: 0;
    list-style: none;
}

    .es-checks li {
        position: relative;
        padding: 5px 0 5px 28px;
        color: #2d3748;
        font-size: 14px;
    }

        .es-checks li::before {
            content: "";
            position: absolute;
            left: 0;
            top: 7px;
            width: 18px;
            height: 18px;
            border-radius: 50%;
            background: var(--theme-primary-safe, #438244) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center / 11px no-repeat;
        }

.es-note {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0 0 18px;
    padding: 12px 14px;
    border: 1px solid #F5D9A8;
    border-radius: 12px;
    background: #FFF8EC;
    color: #5c3300;
    font-size: 13px;
}

.es-actions {
    display: grid;
    gap: 10px;
    margin-top: auto;
}

html body .es-btn.ui.button,
html body a.es-btn.ui.button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    min-height: 48px;
    margin: 0;
    padding: 10px 16px;
    border: 2px solid var(--theme-primary-safe, #438244) !important;
    border-radius: 10px;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
}

    html body .es-btn.ui.button svg {
        flex: none;
        width: 18px;
        height: 18px;
    }

html body .es-btn.es-btn--outline.ui.button {
    background: #ffffff !important;
    background-image: none !important;
    color: var(--theme-primary-safe, #438244) !important;
}

.es-card h3 {
    margin: 4px 0 10px;
    font-size: 15px;
    font-weight: 700;
    color: #1a202c;
}

.es-steps {
    counter-reset: es;
    margin: 0 0 16px;
    padding: 0;
    list-style: none;
}

    .es-steps li {
        counter-increment: es;
        position: relative;
        padding: 5px 0 5px 34px;
        color: #2d3748;
        font-size: 14px;
    }

        .es-steps li::before {
            content: counter(es);
            position: absolute;
            left: 0;
            top: 3px;
            width: 24px;
            height: 24px;
            border-radius: 50%;
            background: #EEF1F4;
            color: #1a202c;
            font-size: 12px;
            font-weight: 700;
            line-height: 24px;
            text-align: center;
        }

.es-address {
    margin: 0 0 18px;
    padding: 14px 16px;
    border-radius: 12px;
    background: #F6F8FA;
    font-style: normal;
}

.es-row,
.dl-row {
    display: grid;
    grid-template-columns: 20px 1fr;
    gap: 10px;
    padding: 6px 0;
    font-size: 14px;
    color: #2d3748;
}

    .es-row + .es-row,
    .dl-row + .dl-row {
        border-top: 1px solid #E6EAEF;
    }

    .es-row svg,
    .dl-row svg {
        width: 18px;
        height: 18px;
        margin-top: 1px;
        color: #4a5568;
    }

    .es-row .es-label {
        display: block;
        font-weight: 600;
        font-size: 12px;
        color: #4a5568;
    }

    .es-row .es-value {
        display: block;
        margin: 0;
        overflow-wrap: anywhere;
    }

        .es-row .es-value a,
        .dl-value a,
        .dl-lead a,
        .dl-retry a {
            color: #1558A8;
            text-decoration: underline;
        }

.done-wrap,
.dl-wrap {
    max-width: 640px;
    margin: 20px auto 0;
}

.done-shell,
.dl-shell {
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 16px 40px rgba(16, 24, 40, .08);
    overflow: hidden;
    text-align: center;
}

.done-hero,
.dl-hero {
    padding: 40px 28px 28px;
    background: linear-gradient(180deg, var(--ek-tint-hero, #F6F8FA) 0%, #ffffff 100%);
}

.done-mark,
.dl-mark {
    width: 104px;
    height: 104px;
    margin: 0 auto 20px;
    border-radius: 50%;
    background: var(--ek-tint, #F1F4F7);
    display: flex;
    align-items: center;
    justify-content: center;
}

    .done-mark svg,
    .dl-mark svg {
        width: 70px;
        height: 70px;
    }

    .done-mark circle,
    .dl-mark circle {
        fill: var(--theme-primary-safe, #438244);
    }

    .done-mark path {
        fill: none;
        stroke: #ffffff;
        stroke-width: 3.5;
        stroke-linecap: round;
        stroke-linejoin: round;
        stroke-dasharray: 30;
        stroke-dashoffset: 30;
        animation: done-draw .5s .2s ease-out forwards;
    }

.done-eyebrow,
.dl-eyebrow {
    display: inline-block;
    margin: 0 0 8px;
    padding: 3px 12px;
    border-radius: 999px;
    background: var(--ek-tint, #F1F4F7);
    color: var(--ek-ink, #1a202c);
    font-size: 12px;
    font-weight: 600;
}

.done-hero h1,
.dl-hero h1 {
    margin: 0 0 10px;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.25;
    color: #1a202c;
}

.done-lead,
.dl-lead {
    max-width: 460px;
    margin: 0 auto;
    color: #4a5568;
    font-size: 16px;
    line-height: 1.6;
}

.done-body,
.dl-body {
    padding: 8px 28px 28px;
}

.done-summary {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    text-align: left;
}

    .done-summary li {
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 14px 16px;
        border: 1px solid #E3E8EE;
        border-radius: 14px;
        background: #ffffff;
        color: #1a202c;
        font-size: 15px;
        font-weight: 600;
    }

    .done-summary small {
        display: block;
        color: var(--ek-ink, #1a202c);
        font-size: 12px;
        font-weight: 600;
    }

.done-thanks,
.dl-thanks {
    margin: 22px 0 0;
    padding: 16px 18px;
    border-radius: 12px;
    background: #F6F8FA;
    color: #2d3748;
    font-size: 15px;
}

.dl-mark path {
    fill: none;
    stroke: #ffffff;
    stroke-width: 3.5;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 30;
    stroke-dashoffset: 30;
    animation: dl-draw .5s .2s ease-out forwards;
}

.dl-steps {
    counter-reset: dl;
    margin: 0 0 16px;
    padding: 16px 18px;
    border-radius: 12px;
    background: #F6F8FA;
    list-style: none;
    text-align: left;
}

    .dl-steps li {
        counter-increment: dl;
        position: relative;
        padding: 6px 0 6px 36px;
        color: #2d3748;
        font-size: 15px;
    }

        .dl-steps li::before {
            content: counter(dl);
            position: absolute;
            left: 0;
            top: 4px;
            width: 26px;
            height: 26px;
            border-radius: 50%;
            background: var(--theme-primary-safe, #438244);
            color: #ffffff;
            font-size: 13px;
            font-weight: 700;
            line-height: 26px;
            text-align: center;
        }

.dl-body h2 {
    margin: 0 0 10px;
    font-size: 16px;
    font-weight: 700;
    color: #1a202c;
    text-align: left;
}

.dl-address {
    margin: 0;
    padding: 14px 16px;
    border: 1px solid #E3E8EE;
    border-radius: 12px;
    font-style: normal;
    text-align: left;
}

.dl-label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: #4a5568;
}

.dl-value {
    display: block;
    overflow-wrap: anywhere;
}

.dl-retry {
    margin: 16px 0 0;
    color: #4a5568;
    font-size: 14px;
}

.pan-content,
.ek-content {
    padding: 24px 28px 8px;
    text-align: left;
}

.pan-required,
.ek-required {
    margin: 0 0 18px;
    color: #4a5568;
    font-size: 13px;
}

.pan-star,
.pan-shell .ui.form label sup.color-red,
.ek-star,
.ek-shell .ui.form label sup.color-red,
.at-field label sup.color-red,
.li-star,
.li-card label sup.color-red {
    color: #C0000C;
}

.pan-shell .ui.form .field > label,
.pan-shell .ui.form .wide.field > label,
.ek-shell .ui.form .field > label,
.at-field label,
.li-card .ui.form .field > label,
.li-card .ui.form .wide.field > label {
    display: block;
    margin: 0 0 6px;
    color: #1a202c;
    font-size: 14px;
    font-weight: 600;
}

.pan-shell .ui.form .form-control,
.ek-shell .ui.form .form-control {
    height: 44px;
    padding: 8px 12px;
    border: 1px solid #767676;
    border-radius: 10px;
    box-shadow: none;
    font-size: 15px;
}

    .pan-shell .ui.form .form-control:focus,
    .ek-shell .ui.form .form-control:focus {
        border-color: #1558A8;
        outline: 2px solid #1558A8;
        outline-offset: 0;
    }

    .pan-shell .ui.form .form-control:disabled,
    .ek-shell .ui.form .form-control:disabled,
    .ek-shell .ui.form .form-control[readonly] {
        background: #F4F4F4;
        color: #3d4652;
        cursor: not-allowed;
    }

.pan-shell #FullName,
.pan-shell #PanCard,
.pan-shell #DateOfBirth {
    text-transform: uppercase;
}

.pan-shell .ui.form > .field,
.ek-shell .ui.form > .field,
.ek-shell .ui.form .ek-section > .field {
    margin-bottom: 18px;
}

.pan-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

    .pan-grid > .field,
    .bk-grid > .ek-section {
        margin: 0;
    }

.pan-shell .text-danger,
.pan-error,
.ek-shell .text-danger,
.li-card .field-error-message {
    display: block;
    margin-top: 6px;
    color: #C0000C;
    font-size: 13px;
    font-weight: 600;
}

.pan-shell .validation-summary-errors,
.ek-shell .validation-summary-errors {
    margin: 0 0 18px;
    padding: 12px 14px;
    border: 1px solid #F3B4B4;
    border-radius: 12px;
    background: #FDECEC;
    color: #A61B1B;
}

    .pan-shell .validation-summary-errors ul,
    .ek-shell .validation-summary-errors ul {
        margin: 0;
        padding-left: 18px;
    }

.pan-consent {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 6px 12px;
    padding: 16px 18px;
    border: 1px solid #E3E8EE;
    border-radius: 14px;
    background: #F6F8FA;
}

    .pan-consent input[type="checkbox"],
    .ek-check input[type="checkbox"] {
        flex: none;
        width: 20px;
        height: 20px;
        margin: 1px 0 0;
        accent-color: var(--theme-primary-safe, #438244);
        cursor: pointer;
    }

.pan-shell .ui.form .pan-consent-label,
.ek-shell .ui.form .ek-check label {
    flex: 1 1 0;
    min-width: 0;
    margin: 0;
    color: #1a202c;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
    cursor: pointer;
}

.pan-consent-terms {
    flex: 1 1 100%;
    padding-left: 32px;
    color: #4a5568;
    font-size: 13px;
    line-height: 1.6;
    overflow-wrap: anywhere;
}

    .pan-consent-terms a,
    .ao-link a {
        color: #1558A8;
        font-weight: 600;
        text-decoration: underline;
    }

.pan-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 8px;
    padding-top: 20px;
    border-top: 1px solid #E6EAEF;
}

html body .pan-shell .ui.red.button {
    min-width: 180px;
    min-height: 46px;
    margin: 0;
    padding: 12px 22px;
    border-radius: 10px;
    background-color: var(--theme-primary-safe, #438244) !important;
    border-color: var(--theme-primary-safe, #438244) !important;
    color: #ffffff !important;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;
    white-space: normal;
    height: auto;
}

html body .pan-shell .ui.button:focus-visible,
.bootbox.modal .bootbox-close-button:focus,
.bootbox.modal .close:focus {
    outline: 2px solid #1558A8 !important;
    outline-offset: 2px !important;
}

.bootbox.modal .modal-dialog[role="dialog"] {
    outline: none;
}

.ek-shell .ui.form .field > .fields {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
    margin: 0;
}

.ek-shell .ui.form .field > .two.fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.ek-shell .ui.form .field > .fields > .field {
    width: auto !important;
    min-width: 0;
    margin: 0;
    padding: 0 !important;
}

.ek-label-spacer {
    display: block;
    height: 25px;
}

.ek-shell .k-widget.k-dropdown,
.ek-shell .k-widget.k-autocomplete {
    width: 100% !important;
}

.ek-shell .k-dropdown .k-dropdown-wrap,
.ek-shell .k-widget.k-autocomplete {
    border: 1px solid #767676;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: none;
}

    .ek-shell .k-dropdown .k-dropdown-wrap .k-input,
    .ek-shell .k-autocomplete .k-input {
        height: 42px;
        line-height: 42px;
        padding: 0 12px;
        font-size: 15px;
        text-indent: 0;
    }

.ek-shell .k-widget.k-autocomplete {
    position: relative;
    display: block;
    height: 44px;
    padding: 0;
    overflow: hidden;
}

.ek-shell .ui.form .k-autocomplete .k-input,
.ek-shell .ui.form .field.error .k-autocomplete .k-input {
    display: block;
    width: 100% !important;
    height: 42px !important;
    margin: 0;
    padding: 0 40px 0 12px !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #1a202c !important;
    font-size: 15px;
    line-height: 42px;
    text-transform: uppercase;
}

    .ek-shell .ui.form .k-autocomplete .k-input:focus {
        outline: none;
    }

.ek-shell .k-autocomplete.k-state-focused {
    border-color: #1558A8;
}

.ek-shell .k-autocomplete .k-clear-value {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    color: #4a5568;
}

.ek-shell .ui.form .field.error .k-autocomplete,
.ek-shell .k-autocomplete.a11y-invalid {
    border-color: #C0000C !important;
    background: #FFF6F6;
}

.ek-shell .k-autocomplete.k-state-disabled .k-input {
    color: #3d4652 !important;
    cursor: not-allowed;
}

.ek-shell .k-dropdown .k-select {
    line-height: 42px;
    min-height: 42px;
}

.ek-shell .k-autocomplete.k-state-disabled,
.ek-shell .k-dropdown .k-state-disabled {
    background: #F4F4F4;
}

.k-dropdown:focus,
.k-dropdown.k-state-focused,
.ek-shell .k-autocomplete.k-state-focused {
    outline: 2px solid #1558A8 !important;
    outline-offset: 2px !important;
}

.a11y-field-error {
    display: block;
    margin-top: 6px;
    color: #C0000C;
    font-size: 13px;
    font-weight: 600;
}

    .a11y-field-error:empty {
        display: none;
    }

.k-dropdown[aria-invalid="true"] .k-dropdown-wrap,
.ui.form .field.error input,
.k-autocomplete[aria-invalid="true"],
.k-autocomplete.a11y-invalid {
    border-color: #C0000C !important;
}

.ek-section {
    margin: 0 0 18px;
    padding: 20px;
    border: 1px solid #E3E8EE;
    border-radius: 16px;
    background: #ffffff;
}

.ek-section-title {
    margin: 0 0 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #E6EAEF;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.3;
    color: #1a202c;
}

.ek-check {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin: 0 0 18px;
    padding: 14px 16px;
    border: 1px solid #E3E8EE;
    border-radius: 14px;
    background: #F6F8FA;
}

.address-locked-note {
    display: none;
    margin: 0 0 18px;
    padding: 12px 14px;
    border: 1px solid #C9D7EA;
    border-left: 4px solid #1558A8;
    border-radius: 12px;
    background: #F2F6FB;
    color: #1a202c;
    font-size: 14px;
}

.ek-actions {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 8px;
    padding-top: 20px;
    border-top: 1px solid #E6EAEF;
}

html body .ek-actions .ui.large.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 140px;
    min-height: 46px;
    margin: 0;
    border-radius: 10px;
    text-align: center;
}

html body .ek-shell .ui.button:focus-visible {
    outline: 2px solid #1558A8 !important;
    outline-offset: 2px !important;
}

.ek-shell .panel-body a:not(.button):not(.btn) {
    text-decoration: underline;
}

    .ek-shell .panel-body a:not(.button):not(.btn):hover,
    .ek-shell .panel-body a:not(.button):not(.btn):focus {
        text-decoration-thickness: 2px;
    }

.ek-shell .ui.form .field > .ithub-grid-4col {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.ek-shell .ithub-no-boarder {
    border-color: transparent !important;
}

.ek-shell .ithub-choice-field {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 0;
    padding: 14px 0;
    border: 0;
    border-bottom: 1px solid #E6EAEF;
}

    .ek-shell .ithub-choice-field:last-child {
        border-bottom: 0;
        padding-bottom: 0;
    }

    .ek-shell .ithub-choice-field:first-child {
        padding-top: 0;
    }

.ek-shell .ithub-choice-legend {
    float: left;
    flex: 1 1 auto;
    width: auto !important;
    min-width: 0;
    margin: 0;
    padding: 0 !important;
    border: 0;
    color: #1a202c;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
}

.ek-shell .ithub-choice-options {
    float: none;
    flex: none;
    width: auto !important;
    padding: 0;
}

.ek-shell .ithub-radio-option {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    padding: 8px 14px;
    border: 1px solid #767676;
    border-radius: 999px;
    background: #ffffff;
    cursor: pointer;
}

    .ek-shell .ithub-radio-option + .ithub-radio-option {
        margin-left: 0;
    }

    .ek-shell .ithub-radio-option input[type="radio"] {
        width: 18px;
        height: 18px;
        margin: 0;
        accent-color: var(--theme-primary-safe, #438244);
        cursor: pointer;
    }

.ek-shell .ui.form .ithub-radio-option label {
    margin: 0;
    color: #1a202c;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}

.ek-shell .ithub-radio-option:has(input:checked) {
    border-color: var(--theme-primary-safe, #438244);
    background: var(--ek-tint, #F1F4F7);
}

.ek-shell .ithub-radio-option:focus-within {
    outline: 2px solid #1558A8;
    outline-offset: 2px;
}

.ek-check {
    flex-wrap: wrap;
}

.ek-check-error {
    flex: 1 1 100%;
    color: #C0000C;
    font-size: 13px;
    font-weight: 600;
}

.ek-shell .btn.btn-link.ek-inline-link {
    padding: 0;
    border: 0;
    vertical-align: baseline;
    color: #1558A8;
    font: inherit;
    font-weight: 600;
    text-decoration: underline;
}

.ek-shell .ek-check label a {
    color: #1558A8;
    font-weight: 600;
}

.modal-backdrop.in {
    opacity: .55;
}

.modal-backdrop {
    background-color: #0f1720;
}

.modal-content {
    border: 0;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 24px 64px rgba(16, 24, 40, .28);
    overflow: hidden;
    text-align: left;
}

.modal-header {
    padding: 18px 56px 16px 24px;
    border-bottom: 1px solid #E6EAEF;
    background: linear-gradient(180deg, var(--ek-tint-hero, #F6F8FA) 0%, #ffffff 100%);
    position: relative;
}

    .modal-header .modal-title,
    .modal-title {
        margin: 0;
        color: #1a202c;
        font-size: 19px;
        font-weight: 700;
        line-height: 1.35;
    }

    .modal-header .close,
    .modal-header .bootbox-close-button {
        position: absolute;
        top: 50%;
        right: 14px;
        float: none;
        width: 36px;
        height: 36px;
        margin: 0;
        padding: 0;
        border-radius: 50%;
        transform: translateY(-50%);
        background: transparent;
        color: #3d4652;
        font-size: 24px;
        font-weight: 400;
        line-height: 36px;
        text-align: center;
        text-shadow: none;
        opacity: 1;
    }

        .modal-header .close:hover,
        .modal-header .close:focus,
        .modal-header .bootbox-close-button:hover,
        .modal-header .bootbox-close-button:focus {
            background: #EEF1F4;
            color: #1a202c;
            opacity: 1;
        }

.modal-content > .bootbox-close-button {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 2;
    width: 36px;
    height: 36px;
    margin: 0;
    border-radius: 50%;
    color: #3d4652;
    font-size: 24px;
    line-height: 36px;
    text-align: center;
    opacity: 1;
    text-shadow: none;
}

.modal-body {
    padding: 20px 24px;
    color: #2d3748;
    font-size: 15px;
    line-height: 1.6;
}

.bootbox .modal-body {
    padding: 24px 56px 20px 24px;
}

.bootbox:not(:has(.modal-header)) .bootbox-body {
    font-size: 16px;
    font-weight: 500;
    color: #1a202c;
}

.modal-body h3 {
    margin: 0 0 12px;
    color: #1a202c;
    font-size: 16px;
    font-weight: 700;
}

.modal-body > .row,
.modal-body > [class^="col-"] {
    margin-bottom: 4px;
}

.modal-body p.color-red,
.modal-body .color-red[role="note"] {
    margin: 4px 0 14px;
    padding: 10px 12px;
    border: 1px solid #F5D9A8;
    border-radius: 10px;
    background: #FFF8EC;
    color: #5c3300 !important;
    font-size: 13px;
    line-height: 1.5;
}

.modal-body label {
    color: #1a202c;
    font-size: 14px;
    font-weight: 600;
}

.modal-body .k-upload {
    border: 2px dashed #C9D2DC;
    border-radius: 12px;
    background: #F6F8FA;
}

    .modal-body .k-upload .k-dropzone {
        padding: 14px;
        background: transparent;
    }

    .modal-body .k-upload .k-upload-button {
        border-radius: 8px;
    }

.modal-body .table {
    margin-bottom: 0;
    border-radius: 12px;
    overflow: hidden;
}

.modal-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    gap: 10px;
    padding: 14px 24px 18px;
    border-top: 1px solid #E6EAEF;
    background: #ffffff;
}

    .modal-footer:before,
    .modal-footer:after {
        content: none;
    }

    .modal-footer .btn + .btn {
        margin-left: 0;
    }

    .modal-footer .btn,
    .modal .modal-footer .btn {
        min-width: 96px;
        min-height: 42px;
        padding: 9px 18px;
        border-radius: 10px;
        font-size: 14px;
        font-weight: 600;
        line-height: 1.2;
        box-shadow: none;
    }

.modal .btn-primary,
.modal .btn-success {
    border: 2px solid var(--theme-primary-safe, #438244) !important;
    background-color: var(--theme-primary-safe, #438244) !important;
    background-image: none;
    color: #ffffff !important;
}

    .modal .btn-primary:hover,
    .modal .btn-primary:focus,
    .modal .btn-primary:active,
    .modal .btn-success:hover,
    .modal .btn-success:focus,
    .modal .btn-success:active {
        background-image: linear-gradient(rgba(0, 0, 0, .12), rgba(0, 0, 0, .12)) !important;
        color: #ffffff !important;
    }

.modal .btn-default {
    border: 2px solid #767676;
    background: #ffffff;
    color: #1a202c;
}

    .modal .btn-default:hover,
    .modal .btn-default:focus,
    .modal .btn-default:active {
        border-color: #3d4652;
        background: #EEF1F4;
        color: #1a202c;
    }

.modal .btn-danger {
    border: 2px solid #B42318;
    background: #B42318;
    color: #ffffff;
}

.modal .btn:focus-visible,
.modal .close:focus-visible {
    outline: 2px solid #1558A8 !important;
    outline-offset: 2px !important;
}

.modal .btn-sm {
    min-height: 38px;
    padding: 7px 14px;
}

.bootbox .modal-body {
    position: relative;
}

    .bootbox .modal-body > .bootbox-close-button {
        position: absolute;
        top: 14px;
        right: 14px;
        float: none;
        width: 36px;
        height: 36px;
        margin: 0;
        border-radius: 50%;
        color: #3d4652;
        font-size: 24px;
        font-weight: 400;
        line-height: 36px;
        text-align: center;
        text-shadow: none;
        opacity: 1;
    }

        .bootbox .modal-body > .bootbox-close-button:hover,
        .bootbox .modal-body > .bootbox-close-button:focus {
            background: #EEF1F4;
            color: #1a202c;
            opacity: 1;
        }

.ddpi-instruction {
    margin: 0 0 14px;
    color: #4a5568;
    font-size: 14px;
}

.ek-shell .ddpi-table {
    margin: 0 0 16px;
    border: 1px solid #E3E8EE;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 14px;
    overflow: hidden;
    background: #ffffff;
}

    .ek-shell .ddpi-table > thead > tr > th {
        padding: 12px 14px;
        border: 0;
        border-bottom: 1px solid #E3E8EE;
        background: #F6F8FA;
        color: #3d4652;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: .02em;
        text-transform: uppercase;
        vertical-align: middle;
    }

    .ek-shell .ddpi-table > tbody > tr > td {
        padding: 14px;
        border: 0;
        border-top: 1px solid #E6EAEF;
        color: #2d3748;
        font-size: 14px;
        line-height: 1.6;
        vertical-align: top;
    }

    .ek-shell .ddpi-table > tbody > tr:first-child > td {
        border-top: 0;
    }

    .ek-shell .ddpi-table .ddpi-select {
        width: 72px;
    }

    .ek-shell .ddpi-table .sno {
        width: 64px;
        color: #4a5568;
        font-weight: 600;
    }

    .ek-shell .ddpi-table input[type="checkbox"] {
        width: 20px;
        height: 20px;
        margin: 2px 0 0;
        accent-color: var(--theme-primary-safe, #438244);
        cursor: pointer;
    }

#consentForm tr.ddpi-invalid td {
    background: #FFF6F6 !important;
    border-color: #F3B4B4;
}

    #consentForm tr.ddpi-invalid td:first-child {
        box-shadow: inset 4px 0 0 #C0000C;
    }

#consentForm input[type="checkbox"]:focus,
#consentForm input[type="checkbox"]:focus-visible {
    outline: 2px solid #1558A8;
    outline-offset: 2px;
}

.ddpi-error {
    min-height: 0;
    margin: 0 0 10px;
    color: #C0000C;
    font-size: 13px;
}

    .ddpi-error:not(:empty) {
        padding: 12px 14px;
        border: 1px solid #F3B4B4;
        border-radius: 12px;
        background: #FDECEC;
        color: #A61B1B;
        font-weight: 600;
    }

.ek-actions.ddpi-actions {
    justify-content: flex-end;
}

html body .ek-actions .btn.btn-primary {
    min-width: 160px;
    min-height: 46px;
    padding: 10px 22px;
    border: 2px solid var(--theme-primary-safe, #438244);
    border-radius: 10px;
    background: var(--theme-primary-safe, #438244);
    color: #ffffff;
    font-size: 15px;
    font-weight: 600;
}

    html body .ek-actions .btn.btn-primary:hover,
    html body .ek-actions .btn.btn-primary:focus {
        background-image: linear-gradient(rgba(0, 0, 0, .12), rgba(0, 0, 0, .12));
        color: #ffffff;
    }

.modal-header h2.modal-title[style] {
    font-size: 19px !important;
    font-weight: 700 !important;
}

.ek-choice {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px 16px;
    margin: 0 0 12px;
    padding: 16px 18px;
    border: 1px solid #E3E8EE;
    border-radius: 14px;
    background: #F6F8FA;
}

.ek-choice-legend {
    float: left;
    width: auto;
    margin: 0;
    padding: 0;
    border: 0;
    color: #1a202c;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
}

.ek-choice-options {
    display: flex;
    gap: 8px;
}

.ek-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    margin: 0;
    padding: 8px 16px;
    border: 1px solid #767676;
    border-radius: 999px;
    background: #ffffff;
    color: #1a202c;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}

    .ek-pill input[type="radio"] {
        width: 18px;
        height: 18px;
        margin: 0;
        accent-color: var(--theme-primary-safe, #438244);
        cursor: pointer;
    }

    .ek-pill:has(input:checked) {
        border-color: var(--theme-primary-safe, #438244);
        background: var(--ek-tint, #F1F4F7);
    }

    .ek-pill:focus-within {
        outline: 2px solid #1558A8;
        outline-offset: 2px;
    }

.ek-inline-error {
    display: block;
    margin: 6px 0 0;
    color: #C0000C;
    font-size: 13px;
    font-weight: 600;
}

    .ek-inline-error:empty {
        display: none;
    }

.ek-nominee-section {
    margin-top: 20px;
}

.ek-subhead {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 0 0 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid #E6EAEF;
}

.ek-subhead-title {
    margin: 0;
    color: #1a202c;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
}

    .ek-subhead-title:focus {
        outline: 2px solid #1558A8;
        outline-offset: 4px;
        border-radius: 4px;
    }

.ek-shell .ek-subhead .btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 40px;
    padding: 8px 16px;
    border-radius: 10px;
    font-size: 14px;
    font-weight: 600;
}

.ek-shell .ek-subhead .btn-primary {
    border: 2px solid var(--theme-primary-safe, #438244);
    background: #ffffff;
    color: var(--theme-primary-safe, #438244);
}

    .ek-shell .ek-subhead .btn-primary:hover,
    .ek-shell .ek-subhead .btn-primary:focus {
        background: var(--theme-primary-safe, #438244);
        color: #ffffff;
    }

.ek-shell .ek-subhead .btn-danger {
    min-height: 36px;
    padding: 6px 12px;
    border: 1px solid #F3B4B4;
    background: #ffffff;
    color: #B42318;
}

    .ek-shell .ek-subhead .btn-danger:hover,
    .ek-shell .ek-subhead .btn-danger:focus {
        border-color: #B42318;
        background: #FDECEC;
        color: #8F1C13;
    }

.ek-shell .ek-nominee {
    margin: 0 0 16px;
    padding: 20px;
    border: 1px solid #E3E8EE;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
}

    .ek-shell .ek-nominee > .fields,
    .ek-shell .ek-nominee .guardian-section > .fields {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        gap: 16px;
        margin: 0 0 16px;
    }

    .ek-shell .ek-nominee > .two.fields,
    .ek-shell .ek-nominee .guardian-section > .two.fields {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .ek-shell .ek-nominee > .fields > .field,
    .ek-shell .ek-nominee .guardian-section > .fields > .field {
        width: auto !important;
        min-width: 0;
        margin: 0;
        padding: 0 !important;
    }

    .ek-shell .ek-nominee > .field {
        margin: 0 0 16px;
    }

    .ek-shell .ek-nominee h4.ui.dividing.header {
        margin: 8px 0 14px;
        padding-bottom: 8px;
        border-bottom: 1px solid #E6EAEF;
        color: #1a202c;
        font-size: 15px;
        font-weight: 700;
    }

    .ek-shell .ek-nominee .guardian-section {
        margin-top: 4px;
        padding: 16px;
        border: 1px solid #F5D9A8;
        border-radius: 14px;
        background: #FFFBF3;
    }

        .ek-shell .ek-nominee .guardian-section h4.ui.dividing.header {
            margin-top: 0;
            border-bottom-color: #F5D9A8;
        }

        .ek-shell .ek-nominee .guardian-section > .fields:last-child {
            margin-bottom: 0;
        }

    .ek-shell .ek-nominee select.form-control {
        height: 44px;
        padding: 8px 12px;
        border: 1px solid #767676;
        border-radius: 10px;
        background-color: #ffffff;
        box-shadow: none;
        font-size: 15px;
    }

html body .ek-actions .btn.btn-success {
    min-width: 160px;
    min-height: 46px;
    padding: 10px 22px;
    border: 2px solid var(--theme-primary-safe, #438244) !important;
    border-radius: 10px;
    background: var(--theme-primary-safe, #438244) !important;
    color: #ffffff !important;
    font-size: 15px;
    font-weight: 600;
}

    html body .ek-actions .btn.btn-success:hover,
    html body .ek-actions .btn.btn-success:focus {
        background-image: linear-gradient(rgba(0, 0, 0, .12), rgba(0, 0, 0, .12));
        color: #ffffff;
    }

#loaderOverlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9999;
    padding-top: 20%;
    background: rgba(255, 255, 255, .75);
    color: #1a202c;
    font-size: 18px;
    font-weight: 700;
    text-align: center;
}

.ek-segments {
    margin: 0 0 8px;
    padding: 0;
    border: 0;
    min-width: 0;
}

.ek-segments-legend {
    width: 100%;
    margin: 0 0 4px;
    padding: 0;
    border: 0;
}

.ek-seg-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 14px;
    margin-top: 14px;
}

.ek-seg-col {
    min-width: 0;
}

.ek-seg-card {
    height: 100%;
    border: 1px solid #E3E8EE;
    border-radius: 16px;
    background: #ffffff;
    overflow: hidden;
}

.ek-seg-head {
    padding: 12px 16px;
    border-bottom: 1px solid #E6EAEF;
    background: #F6F8FA;
}

.ek-seg-title {
    margin: 0;
    color: #1a202c;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
}

.ek-seg-body {
    display: grid;
    gap: 8px;
    padding: 12px;
}

.ek-seg-option {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin: 0;
    padding: 14px;
    border: 1px solid #E3E8EE;
    border-radius: 12px;
    background: #ffffff;
    transition: border-color .2s ease, background-color .2s ease;
}

    .ek-seg-option:hover {
        border-color: #C9D2DC;
    }

    .ek-seg-option:has(input[type="checkbox"]:checked) {
        border-color: var(--theme-primary-safe, #438244);
        background: var(--ek-tint-soft, #FAFBFC);
    }

    .ek-seg-option input[type="checkbox"] {
        flex: none;
        width: 20px;
        height: 20px;
        margin: 1px 0 0;
        accent-color: var(--theme-primary-safe, #438244);
        cursor: pointer;
    }

        .ek-seg-option input[type="checkbox"]:focus-visible {
            outline: 2px solid #1558A8;
            outline-offset: 2px;
        }

    .ek-seg-option label {
        flex: 1 1 auto;
        min-width: 0;
        margin: 0;
        color: #1a202c;
        font-size: 14px;
        font-weight: 600;
        line-height: 1.45;
        cursor: pointer;
    }

        .ek-seg-option label::after {
            content: "";
            position: absolute;
            inset: 0;
        }

html body .ek-actions .ui.button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 140px;
    min-height: 46px;
    margin: 0;
    border-radius: 10px;
    font-size: 15px;
    text-align: center;
}

.ek-seg-card:not(:has(.ek-seg-head)) {
    border: 0;
    border-radius: 0;
    background: transparent;
    overflow: visible;
}

    .ek-seg-card:not(:has(.ek-seg-head)) > .ek-seg-body {
        padding: 0;
    }

.pay-sublead {
    margin: 6px 0 0;
    color: #4a5568;
    font-size: 13px;
}

.pay-content {
    text-align: center;
}

.payment-tabs {
    display: inline-flex;
    gap: 4px;
    margin: 0 auto 18px;
    padding: 4px;
    border: 1px solid #E3E8EE;
    border-radius: 12px;
    background: #F1F4F7;
}

.payment-tab-btn {
    min-height: 40px;
    padding: 8px 20px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: #3d4652;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color .15s ease, color .15s ease, box-shadow .15s ease;
}

    .payment-tab-btn:hover {
        color: #1a202c;
    }

    .payment-tab-btn.active {
        background: #ffffff;
        color: var(--ek-ink, #1a202c);
        box-shadow: 0 1px 3px rgba(16, 24, 40, .14);
    }

    .payment-tab-btn:focus-visible,
    .upi-option-btn:focus-visible {
        outline: 2px solid #1558A8;
        outline-offset: 2px;
    }

.payment-pane {
    display: none;
}

    .payment-pane.active {
        display: block;
    }

#upiPane,
#netBankingPane {
    max-width: 460px;
    margin: 0 auto;
    padding: 20px;
    border: 1px solid #E3E8EE;
    border-radius: 16px;
    background: #ffffff;
}

.upi-option-tabs {
    display: flex;
    justify-content: center;
    gap: 8px;
    margin: 0 0 4px;
}

.upi-option-btn {
    min-height: 38px;
    padding: 6px 18px;
    border: 1px solid #767676;
    border-radius: 999px;
    background: #ffffff;
    color: #1a202c;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: border-color .15s ease, background-color .15s ease;
}

    .upi-option-btn:hover {
        border-color: var(--theme-primary-safe, #438244);
    }

    .upi-option-btn.active {
        border-color: var(--theme-primary-safe, #438244);
        background: var(--theme-primary-safe, #438244);
        color: #ffffff;
    }

.pay-note {
    margin: 8px 0 0;
    color: #4a5568;
    font-size: 13px;
}

.pay-qr-frame {
    display: inline-block;
    margin: 16px auto;
    padding: 12px;
    border: 1px solid #E3E8EE;
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 4px 14px rgba(16, 24, 40, .08);
}

    .pay-qr-frame img {
        display: block;
        width: 180px;
        height: 180px;
    }

.pay-upi-id {
    display: flex;
    align-items: center;
    gap: 12px;
    max-width: 340px;
    margin: 0 auto;
    padding: 10px 14px;
    border: 1px solid #E3E8EE;
    border-radius: 12px;
    background: #F6F8FA;
    text-align: left;
    font-size: 14px;
}

    .pay-upi-id .glyphicon {
        color: var(--theme-primary-safe, #438244);
        font-size: 18px;
    }

.pay-upi-label {
    color: #4a5568;
    font-size: 12px;
    font-weight: 600;
}

#upiIdText {
    color: #1a202c;
    word-break: break-all;
}

.bank-table {
    width: 100%;
    margin: 14px 0 0;
    border: 1px solid #E3E8EE;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: 12px;
    overflow: hidden;
    font-size: 14px;
}

    .bank-table th,
    .bank-table td {
        padding: 10px 12px;
        border: 0;
        border-top: 1px solid #E6EAEF;
        color: #1a202c;
        text-align: left;
    }

    .bank-table th {
        border-top: 0;
        background: #F6F8FA;
        color: #3d4652;
        font-size: 12px;
        font-weight: 700;
        letter-spacing: .02em;
        text-transform: uppercase;
    }

    .bank-table tbody td {
        background: #ffffff;
        font-variant-numeric: tabular-nums;
    }

.pay-timer-row {
    margin: 18px 0 0;
}

.timer-wrap {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    border: 1px solid #F5D9A8;
    border-radius: 999px;
    background: #FFF8EC;
    color: #5c3300;
    font-size: 14px;
}

#paymentTimer {
    color: #8A1C1C;
    font-size: 15px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    letter-spacing: .5px;
}

.pay-after {
    max-width: 380px;
    margin: 16px auto 4px;
    color: #4a5568;
    font-size: 13px;
}

.ek-actions.pay-actions {
    justify-content: center;
    margin: 8px 28px 24px;
}

.ek-shell .ui.form input[type="text"],
.ek-shell .ui.form input[type="password"],
.ek-shell .ui.form input[type="email"],
.ek-shell .ui.form input[type="tel"],
.ek-shell .ui.form input[type="number"],
.ek-shell .ui.form input[type="date"] {
    height: 44px;
    padding: 8px 12px;
    border: 1px solid #767676;
    border-radius: 10px;
    background: #ffffff;
    box-shadow: none;
    color: #1a202c;
    font-size: 15px;
}

    .ek-shell .ui.form input[type="text"]:focus,
    .ek-shell .ui.form input[type="password"]:focus,
    .ek-shell .ui.form input[type="email"]:focus,
    .ek-shell .ui.form input[type="tel"]:focus,
    .ek-shell .ui.form input[type="number"]:focus,
    .ek-shell .ui.form input[type="date"]:focus {
        border-color: #1558A8;
        border-radius: 10px;
        outline: 2px solid #1558A8;
        outline-offset: 0;
    }

.ek-shell .ui.form input:disabled {
    border-color: #C9D2DC;
    background: #F4F4F4;
    color: #1a202c;
    opacity: 1;
    cursor: not-allowed;
}

.ui.form .disabled.fields .field,
.ui.form .disabled.field,
.ui.form .field :disabled {
    opacity: 1;
}

.ek-shell .ui.form .field.error input[type="text"],
.ek-shell .ui.form .field.error input[type="password"] {
    border-color: #C0000C;
    background: #FFF6F6;
}

.ek-shell .ui.form .k-autocomplete .k-input,
.ek-shell .ui.form .field.error .k-autocomplete .k-input {
    height: 42px !important;
    border: 0 !important;
    border-radius: 10px !important;
    background: transparent !important;
    outline: none;
}

.field-hint {
    display: block;
    margin-top: 6px;
    color: #4a5568;
    font-size: 12px;
}

.bk-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 20px;
    align-items: start;
}

.ek-shell .ui.form .bk-grid .field {
    margin: 0 0 16px;
}

    .ek-shell .ui.form .bk-grid .field .field {
        margin: 0;
    }

.ek-shell .bk-fetched.alert {
    margin: 0;
    padding: 20px;
    border: 1px solid #E3E8EE;
    border-radius: 16px;
    background: #F6F8FA;
    color: #1a202c;
}

.bk-fetched-title {
    margin: 0 0 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid #E3E8EE;
    color: #1a202c;
    font-size: 15px;
    font-weight: 700;
}

.ek-shell .bk-fetched .field:last-child {
    margin-bottom: 0;
}

.ek-shell .bk-fetched input:disabled {
    background: #ffffff;
    border-style: dashed;
}

.ek-shell .ui.form input::placeholder,
.ek-shell .ui.form .form-control::placeholder,
.li-card .ui.form .ui.left.icon.input > input::placeholder {
    color: #6b7280;
    opacity: 1;
}

.ek-shell .ui.form input:disabled::placeholder {
    color: #4a5568;
}

.ek-shell,
.doc-shell,
.ipv-shell,
.gen-shell,
.rv-shell,
.pan-shell,
.es-shell,
.done-shell,
.dl-shell {
    color: #1a202c;
}

[data-theme="dark"] .ek-shell.panel,
[data-theme="dark"] .doc-shell.panel,
[data-theme="dark"] .ipv-shell.panel,
[data-theme="dark"] .gen-shell.panel,
[data-theme="dark"] .rv-shell.panel,
[data-theme="dark"] .pan-shell.panel,
[data-theme="dark"] .es-shell,
[data-theme="dark"] .done-shell,
[data-theme="dark"] .dl-shell {
    border-color: transparent;
    background: #ffffff;
    color: #1a202c;
}

[data-theme="dark"] .ek-shell .panel,
[data-theme="dark"] .ek-shell .table,
[data-theme="dark"] .ek-shell .ddpi-table {
    background-color: #ffffff;
    color: #1a202c;
}

[data-theme="dark"] .modal-content {
    background: #ffffff;
    color: #2d3748;
}

.ithub-footer-text {
    margin: 0;
    padding: 6px 0;
    font-size: 12px;
    line-height: 1.5;
}

.ithub-logout {
    padding-top: 12px;
}

html body .ithub-nav .ithub-logout a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 36px;
    padding: 6px 18px;
    border: 2px solid var(--theme-primary-safe, #438244) !important;
    border-radius: 999px;
    background: var(--theme-primary-safe, #438244) !important;
    color: #ffffff !important;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none !important;
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .35);
}

    html body .ithub-nav .ithub-logout a:hover,
    html body .ithub-nav .ithub-logout a:focus {
        background-image: linear-gradient(rgba(0, 0, 0, .14), rgba(0, 0, 0, .14)) !important;
        color: #ffffff !important;
    }

    html body .ithub-nav .ithub-logout a:focus-visible {
        outline: 2px solid #ffffff;
        outline-offset: 2px;
        box-shadow: 0 0 0 4px #1558A8;
    }

.ao-content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    gap: 16px;
    align-items: stretch;
    padding: 24px 28px 28px;
}

.ao-or {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #4a5568;
    font-size: 13px;
    font-weight: 700;
}

    .ao-or::before,
    .ao-or::after {
        content: "";
        flex: 1 1 auto;
        width: 1px;
        background: #E3E8EE;
    }

    .ao-or span {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        border: 1px solid #E3E8EE;
        border-radius: 50%;
        background: #ffffff;
    }

.ao-text {
    margin: 0 0 12px;
    color: #2d3748;
    font-size: 14px;
    line-height: 1.6;
}

.ao-link {
    margin: 0 0 14px;
    font-size: 14px;
}

.ao-rcspl-note {
    margin: 0 0 18px;
    padding: 12px 14px;
    border: 1px solid #E3E8EE;
    border-radius: 12px;
    background: #F6F8FA;
    color: #2d3748;
    font-size: 13px;
    line-height: 1.6;
}

.ao-format {
    display: inline;
    padding: 1px 6px;
    border-radius: 6px;
    background: #FDECEC;
    color: #A61B1B;
    font-weight: 700;
}

html body a.es-btn.ui.button {
    white-space: normal;
    height: auto;
}

.ao-narrow {
    max-width: 560px;
}

.at-content .account-type-select {
    height: 44px;
    padding: 8px 12px;
    border: 1px solid #767676;
    border-radius: 10px;
    background-color: #ffffff;
    box-shadow: none;
    color: #1a202c;
    font-size: 15px;
}

    .at-content .account-type-select:focus {
        border-color: #1558A8;
        outline: 2px solid #1558A8;
        outline-offset: 0;
        box-shadow: none;
    }

    .at-content .account-type-select[aria-invalid="true"] {
        border-color: #C0000C;
        background-color: #FFF6F6;
    }

.at-actions.ek-actions {
    justify-content: flex-end;
    margin-top: 20px;
}

.at-message.alert {
    margin: 16px 0 0;
    padding: 12px 14px;
    border: 1px solid #C9D7EA;
    border-left: 4px solid #1558A8;
    border-radius: 12px;
    background: #F2F6FB;
    color: #1a202c;
    font-size: 14px;
}

.li-page {
    padding-top: 16px;
    padding-bottom: 24px;
}

.li-row {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}

.li-card {
    margin-top: 8px;
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 16px 40px rgba(16, 24, 40, .08);
    overflow: hidden;
    color: #1a202c;
    text-align: left;
}

.li-hero {
    padding: 26px 28px 20px;
    border-bottom: 1px solid #E6EAEF;
    background: linear-gradient(180deg, var(--ek-tint-hero, #F6F8FA) 0%, #ffffff 100%);
}

    .li-hero h1 {
        margin: 0 0 8px;
        color: #1a202c;
        font-size: 24px;
        font-weight: 700;
        line-height: 1.3;
    }

.li-lead {
    margin: 0;
    color: #4a5568;
    font-size: 15px;
    line-height: 1.55;
}

.li-body {
    padding: 22px 28px 26px;
}

.li-required {
    margin: 0 0 6px;
    color: #4a5568;
    font-size: 13px;
}

.li-card .field.p-top-15 {
    padding-top: 12px;
}

.li-card .ui.form .ui.left.icon.input > input {
    height: 46px;
    padding-left: 42px !important;
    border: 1px solid #767676;
    border-radius: 10px;
    background: #ffffff;
    color: #1a202c;
    font-size: 15px;
}

    .li-card .ui.form .ui.left.icon.input > input:focus {
        border-color: #1558A8;
        border-radius: 10px;
    }

    .li-card .ui.form .ui.left.icon.input > input[aria-invalid="true"] {
        border: 2px solid #C0000C !important;
        background: #FFF6F6;
    }

.li-card .ui.form .ui.left.icon.input > i.icon {
    color: var(--theme-primary-safe, #438244);
    opacity: 1;
}

.li-consent {
    margin: 4px 0 18px;
    padding: 12px 14px;
    border: 1px solid #E3E8EE;
    border-radius: 12px;
    background: #F6F8FA;
}

    .li-consent p {
        margin: 0;
        color: #4a5568;
        font-size: 12px;
        line-height: 1.6;
    }

        .li-consent p + p {
            margin-top: 8px;
        }

html body .li-card #submitclientCode {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 48px;
    margin: 0;
    border: 2px solid var(--theme-primary-safe, #438244) !important;
    border-radius: 10px;
    background-color: var(--theme-primary-safe, #438244) !important;
    color: #ffffff !important;
    font-size: 16px;
    font-weight: 600;
}

    html body .li-card #submitclientCode:hover,
    html body .li-card #submitclientCode:focus {
        background-image: linear-gradient(rgba(0, 0, 0, .12), rgba(0, 0, 0, .12)) !important;
    }

.li-login {
    margin: 0;
    padding-top: 14px;
    border-top: 1px solid #E6EAEF;
    color: #4a5568;
    font-size: 14px;
    text-align: center;
}

    .li-login a {
        color: #1558A8;
        font-weight: 700;
        text-decoration: underline;
    }

.li-page a:focus-visible,
.li-page button:focus-visible,
.li-page input:focus-visible,
.li-page select:focus-visible,
.li-page textarea:focus-visible,
.li-page [tabindex]:not([tabindex="-1"]):focus-visible {
    outline: 3px solid #1558A8 !important;
    outline-offset: 2px !important;
}

.li-card .ui.form .wide.field > input[type="text"] {
    height: 46px;
    padding: 8px 14px;
    border: 1px solid #767676;
    border-radius: 10px;
    background: #ffffff;
    color: #1a202c;
    font-size: 16px;
    letter-spacing: .04em;
}

    .li-card .ui.form .wide.field > input[type="text"]::placeholder {
        color: #6b7280;
        opacity: 1;
        letter-spacing: .04em;
    }

    .li-card .ui.form .wide.field > input[type="text"]:focus {
        border-color: #1558A8;
        border-radius: 10px;
    }

.li-card .ui.form .wide.field > input[aria-invalid="true"] {
    border: 2px solid #C0000C !important;
    background: #FFF6F6;
}

.li-proceed {
    margin: 20px 0 18px;
}

.hint-text a,
.link-button {
    text-decoration: underline;
}

.link-button {
    padding: 0;
    border: 0;
    background: none;
    color: #1558A8;
    font-weight: 700;
    cursor: pointer;
}

.modal #McOtp {
    height: 46px;
    margin-top: 6px;
    padding: 8px 14px;
    border: 1px solid #767676;
    border-radius: 10px;
    box-shadow: none;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: .3em;
    text-align: center;
}

    .modal #McOtp:focus {
        border-color: #1558A8;
        outline: 2px solid #1558A8;
        outline-offset: 0;
    }

    .modal #McOtp[aria-invalid="true"] {
        border: 2px solid #C0000C;
        background: #FFF6F6;
    }

.modal .field-error-message {
    display: block;
    margin-top: 6px;
    color: #C0000C;
    font-size: 13px;
    font-weight: 600;
}

    .modal .field-error-message:empty {
        display: none;
    }

.modal .bottom-right p {
    margin: 14px 0 0;
    color: #4a5568;
    font-size: 14px;
    text-align: right;
}

.modal .lMobile {
    color: #1a202c;
    font-weight: 700;
}

.lm-panel {
    position: relative;
    margin-top: 8px;
    padding: 28px 28px 24px;
    border-radius: 20px;
    background: linear-gradient(160deg, var(--ek-tint, #F1F4F7) 0%, #ffffff 70%);
    border: 1px solid #E6EAEF;
    color: #1a202c;
    text-align: left;
    overflow: hidden;
}

    .lm-panel::before {
        content: "";
        position: absolute;
        top: -70px;
        right: -70px;
        width: 200px;
        height: 200px;
        border-radius: 50%;
        background: var(--theme-primary-safe, #438244);
        opacity: .08;
        pointer-events: none;
    }

.lm-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 14px;
    padding: 5px 12px;
    border-radius: 999px;
    background: #ffffff;
    border: 1px solid var(--ek-tint, #E3E8EE);
    color: var(--ek-ink, #2f5f30);
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .02em;
}

    .lm-eyebrow svg {
        width: 14px;
        height: 14px;
        flex: none;
        color: var(--theme-primary-safe, #438244);
    }

.lm-title {
    margin: 0 0 8px;
    color: #1a202c;
    font-size: 26px;
    font-weight: 700;
    line-height: 1.25;
}

.lm-lead {
    margin: 0 0 8px;
    color: #4a5568;
    font-size: 15px;
    line-height: 1.5;
}

.lm-art {
    margin: 4px auto 12px;
    max-width: 420px;
}

    .lm-art img {
        mix-blend-mode: multiply;
        width: 100%;
        height: auto;
        margin: 0 auto;
    }

.lm-steps {
    position: relative;
    margin: 0 0 18px;
    padding: 0;
    list-style: none;
}

    .lm-steps li {
        position: relative;
        display: flex;
        align-items: center;
        gap: 12px;
        padding: 8px 0;
        color: #2d3748;
        font-size: 14px;
        line-height: 1.4;
    }

        .lm-steps li:not(:last-child)::after {
            content: "";
            position: absolute;
            left: 15px;
            top: 40px;
            bottom: -8px;
            width: 2px;
            background: var(--theme-primary-safe, #438244);
            opacity: .25;
        }

    .lm-steps strong {
        color: #1a202c;
        font-weight: 700;
    }

.lm-num {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--theme-primary-safe, #438244);
    color: #ffffff;
    font-size: 14px;
    font-weight: 700;
    box-shadow: 0 0 0 4px #ffffff;
}

.lm-handy {
    padding: 14px 16px;
    border-radius: 14px;
    background: #ffffff;
    border: 1px solid #E6EAEF;
}

.lm-handy-title {
    margin: 0 0 10px;
    color: #4a5568;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.lm-chips li {
    padding: 5px 12px;
    border-radius: 999px;
    background: var(--ek-tint, #F1F4F7);
    color: var(--ek-ink, #2f5f30);
    font-size: 13px;
    font-weight: 500;
}

[data-theme="dark"] .lm-panel {
    background: #ffffff;
    color: #1a202c;
}

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

@keyframes done-draw {
    to {
        stroke-dashoffset: 0;
    }
}

@keyframes dl-draw {
    to {
        stroke-dashoffset: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .doc-card,
    .doc-meter-track span,
    html body .ui.button.ithub-primary2.doc-btn,
    .ek-seg-option {
        transition: none;
    }

        .doc-card:hover,
        .doc-card:focus-within {
            transform: none;
        }

    .gen-mark::before {
        animation-duration: 3s;
    }

    .done-mark path,
    .dl-mark path {
        animation: none;
        stroke-dashoffset: 0;
    }

    .payment-tab-btn,
    .upi-option-btn {
        transition: none;
    }
}

@media (min-width: 768px) {
    #defaultCheck .modal-lg {
        width: 900px;
        max-width: calc(100% - 20px);
    }

    .modal-dialog {
        margin: 40px auto;
    }
}

@media (max-width: 991px) {
    .ipv-content {
        grid-template-columns: 1fr;
    }

    .ek-shell .ui.form .field > .ithub-grid-4col {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .li-row > [class*="col-md-"] {
        width: 100%;
        margin-left: 0;
    }

    .li-row > .li-side {
        order: 2;
        margin-top: 20px;
    }

    .lm-panel {
        padding: 22px 18px 18px;
    }

    .lm-title {
        font-size: 22px;
    }

    .lm-art {
        max-width: 300px;
    }
}

@media (max-width: 860px) {
    .es-content,
    .ao-content {
        grid-template-columns: 1fr;
    }

    .ao-or {
        flex-direction: row;
    }

        .ao-or::before,
        .ao-or::after {
            width: auto;
            height: 1px;
        }
}

@media (max-width: 767px) {
    .doc-hero {
        grid-template-columns: 1fr;
        gap: 16px;
        padding: 22px 18px 18px;
    }

        .doc-hero h1,
        .rv-hero h1 {
            font-size: 22px;
        }

    .doc-content,
    .rv-content {
        padding: 18px 14px 20px;
    }

    .rv-hero {
        padding: 22px 18px 18px;
    }

    .rv-frame {
        height: 60vh;
        min-height: 360px;
    }

    .rv-mobile-note {
        display: block;
    }

    .rv-actions {
        width: 100%;
    }

    a.rv-link-btn {
        flex: 1 1 0;
        justify-content: center;
        white-space: nowrap;
    }

    .rv-nav {
        flex-direction: column;
        align-items: stretch;
    }

        .rv-nav p {
            margin: 0;
        }

    html body .rv-nav .ui.red.large.button {
        width: 100%;
    }

    .ek-shell .ui.form .field > .fields,
    .ek-shell .ui.form .field > .two.fields {
        grid-template-columns: 1fr;
    }

    .ek-label-spacer {
        display: none;
    }

    .ek-shell .ithub-choice-field {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .ek-shell .ithub-radio-option {
        flex: 1 1 0;
        justify-content: center;
    }

    .modal-dialog {
        width: auto;
        margin: 12px;
    }

    .ek-shell .ek-nominee > .fields,
    .ek-shell .ek-nominee > .two.fields,
    .ek-shell .ek-nominee .guardian-section > .fields,
    .ek-shell .ek-nominee .guardian-section > .two.fields {
        grid-template-columns: 1fr;
    }

    .bk-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 600px) {
    .doc-card {
        grid-template-columns: 48px 1fr;
        gap: 14px;
        padding: 16px;
    }

    .doc-icon {
        width: 48px;
        height: 48px;
        border-radius: 12px;
        align-self: start;
    }

        .doc-icon img {
            max-width: 30px;
            max-height: 30px;
        }

    .doc-actions {
        grid-column: 1 / -1;
        flex-direction: row;
        flex-wrap: wrap;
        min-width: 0;
    }

        .doc-actions .doc-btn {
            flex: 1 1 140px;
        }

    .doc-pending,
    .done-summary,
    .pan-grid,
    .ek-seg-grid {
        grid-template-columns: 1fr;
    }

    .doc-pending-icon,
    .ek-shell .ddpi-table .sno,
    .ek-shell .ddpi-table th.sno {
        display: none;
    }

    .doc-nav .ui.large.button,
    html body .ek-actions .ui.large.button {
        flex: 1 1 0;
        min-width: 0;
    }

    .ipv-hero,
    .gen-hero,
    .es-hero,
    .pan-hero,
    .ek-hero {
        padding: 22px 18px 18px;
    }

        .ipv-hero h1,
        .gen-hero h1,
        .es-hero h1,
        .pan-hero h1,
        .ek-hero h1 {
            font-size: 22px;
        }

    .ipv-content,
    .pan-content,
    .ek-content {
        padding: 18px 14px 4px;
    }

    .ipv-recorder,
    .ipv-support {
        padding-left: 14px;
        padding-right: 14px;
    }

    .ipv-card {
        padding: 16px;
    }

    .ipv-script b {
        white-space: normal;
    }

    .gen-content {
        padding: 20px 14px;
    }

    .gen-card {
        padding: 22px 16px 18px;
    }

    .es-wrap,
    .done-wrap,
    .dl-wrap {
        margin-top: 12px;
    }

    .es-content,
    .ao-content,
    .at-content {
        padding: 18px 14px 20px;
    }

    .es-card {
        padding: 18px 16px;
    }

    .done-hero,
    .dl-hero {
        padding: 30px 18px 22px;
    }

        .done-hero h1,
        .dl-hero h1 {
            font-size: 23px;
        }

    .done-body,
    .dl-body {
        padding: 4px 14px 20px;
    }

    .done-support,
    .pan-support,
    .ek-support {
        padding: 0 14px 16px;
    }

    .show-grid.col-md-10:has(.pan-shell) {
        width: 100%;
        margin-left: 0;
        padding-left: 8px;
        padding-right: 8px;
    }

    .pan-consent {
        padding: 14px;
    }

    .pan-consent-terms {
        padding-left: 0;
    }

    .pan-actions {
        justify-content: stretch;
    }

    html body .pan-shell .ui.red.button,
    .ek-choice-options {
        width: 100%;
    }

    .ek-section {
        padding: 16px 14px;
    }

    .modal-header {
        padding: 16px 52px 14px 18px;
    }

        .modal-title,
        .modal-header .modal-title {
            font-size: 17px;
        }

    .modal-body,
    .bootbox .modal-body {
        padding: 18px;
    }

    .modal-footer {
        padding: 12px 18px 16px;
    }

        .modal-footer .btn {
            flex: 1 1 0;
        }

    .bootbox:not(:has(.modal-header)) .modal-body {
        padding-right: 52px;
    }

    .ek-shell .ddpi-table .ddpi-select {
        width: 56px;
    }

    .ek-shell .ddpi-table > tbody > tr > td {
        padding: 12px 10px;
    }

    html body .ek-actions .btn.btn-primary {
        flex: 1 1 100%;
    }

    .modal-header h2.modal-title[style] {
        font-size: 17px !important;
    }

    .ek-pill {
        flex: 1 1 0;
        justify-content: center;
    }

    .ek-shell .ek-nominee {
        padding: 16px 14px;
    }

        .ek-shell .ek-nominee .guardian-section {
            padding: 14px 12px;
        }

    html body .ek-actions .btn.btn-success {
        flex: 1 1 100%;
    }

    html body .ek-actions .ui.button {
        flex: 1 1 0;
        min-width: 0;
    }

    .payment-tabs {
        display: flex;
        width: 100%;
    }

    .payment-tab-btn {
        flex: 1 1 0;
        padding: 8px 10px;
    }

    #upiPane,
    #netBankingPane {
        padding: 16px 12px;
    }

    .bank-table th,
    .bank-table td {
        padding: 8px;
        font-size: 13px;
    }

    .ek-actions.pay-actions {
        margin: 8px 14px 20px;
    }

    .li-hero {
        padding: 22px 18px 16px;
    }

        .li-hero h1 {
            font-size: 21px;
        }

    .li-body {
        padding: 18px 16px 20px;
    }
}