.ezrx-dialog {
    box-sizing: border-box;
    --rx-accent: #5D317D;
    --rx-border: #0C06101A;
    --rx-text: #0C0610;
    --rx-muted: #828282;
    width: min(1280px, calc(100% - 28px));
    max-height: 92vh;
    max-height: 92dvh;
    margin: auto;
    padding: 26px;
    border: 0;
    border-radius: 14px;
    color: var(--rx-text);
    background: #fff;
    box-shadow: 0 20px 80px #0004;
    overflow: auto;
    font-family: inherit;
    font-size: 14px;
    line-height: 1.5;
    overscroll-behavior: contain
}
.ezrx-dialog::-webkit-scrollbar,
.ezp-page.ezp-layout-v2 .ezp-dialog::-webkit-scrollbar {
    width: 8px;
}
.ezrx-dialog::-webkit-scrollbar-thumb,
.ezp-page.ezp-layout-v2 .ezp-dialog::-webkit-scrollbar-thumb {
    background: var(--rx-border);
    border-radius: 20px;
}
.ezrx-dialog::-webkit-scrollbar-track,
.ezp-page.ezp-layout-v2 .ezp-dialog::-webkit-scrollbar-track {
    margin: 15px 0;
}
.ezrx-dialog::backdrop {
    background: rgb(20 15 28 / 60%)
}
.ezrx-dialog * {
    box-sizing: border-box
}
.ezrx-dialog [hidden] {
    display: none !important
}
.ezrx-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 24px
}
.ezrx-head h2 {
    font-size: 28px;
    margin: 0;
    color: var(--black);
}
.ezrx-head-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0
}
.ezrx-dialog .ezrx-back {
    background: #fff;
    border: 1px solid var(--rx-border);
    border-radius: 24px;
    color: var(--rx-text);
    padding: 12px 49px;
    font: inherit;
    font-size: 16px;
    cursor: pointer;
    font-weight: 500;
    transition: var(--transition);
}
.ezrx-dialog .ezrx-close {
    width: 30px;
    height: 30px;
    line-height: 1;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--rx-muted);
    font-size: 24px;
    cursor: pointer;
    transition: var(--transition);
}
.ezrx-dialog .ezrx-close:hover {
    color: var(--rx-accent);
}
.ezrx-dialog .ezrx-back:hover {
    border-color: var(--rx-accent);
    color: var(--rx-accent);
}
.ezrx-product {
    color: var(--rx-muted)
}
.ezrx-ready .ezrx-product,
.ezrx-progress,
.ezrx-dialog section>h3 {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap
}
.ezrx-dialog h4 {
    font-size: 24px;
    font-weight: 800;
    margin: 0 0 18px;
    font-family: "Manrope", sans-serif;
    font-style: normal;
    color: var(--black);
}
.ezrx-use-card {
    min-width: 0;
    display: grid;
    grid-template-columns: 102px minmax(0, 1fr) auto;
    align-items: start;
    gap: 16px;
    border: 1px solid var(--rx-border);
    border-radius: 16px;
    padding: 24px;
    margin: 0 0 30px;
    background: #fff;
}
.ezrx-use-icon {
    width: 102px !important;
    height: 102px !important;
    object-fit: contain
}
.ezrx-use-title {
    font-size: 17px;
    font-weight: 700;
    margin: 0 0 12px
}
.ezrx-use-description {
    margin-bottom: 18px;
}
.ezrx-use-options {
    display: flex;
    align-items: center;
    gap: 10px 21px;
    flex-wrap: wrap
}
.ezrx-use-option {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    font-size: 16px;
    color: var(--rx-text)
}
.ezrx-dialog input[type=radio],
.ezrx-dialog input[type=checkbox] {
    accent-color: var(--rx-text);
    width: 26px;
    height: 26px;
    margin: 0;
    flex-shrink: 0;
    vertical-align: middle;
    cursor: pointer;
}
.ezrx-use-continue {
    align-self: end
}
.ezrx-dialog .ezrx-use-continue, .ezrx-dialog .ezrx-select-label, .ezrx-dialog .ezrx-next, .ezrx-dialog .ezrx-submit, .ezrx-buy {
    border: 0;
    border-radius: 30px;
    background: var(--rx-accent);
    color: #fff;
    padding: 12px 22px;
    font: inherit;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    box-shadow: 4px 4px 0 #5D317D4D;
    text-align: center;
    min-width: 136px;
    transition: var(--transition);
}
.ezrx-dialog .ezrx-use-continue:hover, 
.ezrx-dialog .ezrx-select-label:hover, 
.ezrx-dialog .ezrx-next:hover, 
.ezrx-dialog .ezrx-submit:hover, 
.ezrx-buy:hover{
    box-shadow: 0px 0px 0 #5D317D4D;
}
.ezrx-buy {
    font-size: 14px;
    margin-left: 10px
}
.ezrx-dialog button:disabled {
    opacity: .6;
    cursor: wait
}
.ezrx-dialog :focus-visible,
.ezrx-buy:focus-visible {
    outline: 3px solid #a087c4;
    outline-offset: 3px
}
.ezrx-card-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 40px 20px
}
.ezrx-package-card {
    position: relative;
    display: flex;
    flex-direction: column;
    border: 1px solid transparent;
    border-radius: 20px;
    padding: 24px;
    background: #f7f7f7;
    min-width: 0;
}
.ezrx-package-card:has(.ezrx-recommended) {
    border-color: #a087c4
}
.ezrx-package-card>input,
.ezrx-lens-card>input,
.ezrx-route>input,
.ezrx-clear-choice>input {
    position: absolute;
    width: 1px !important;
    height: 1px !important;
    opacity: 0;
    margin: 0;
    pointer-events: none
}
.ezrx-package-card:has(>input:focus-visible),
.ezrx-lens-card:has(>input:focus-visible),
.ezrx-route:has(>input:focus-visible),
.ezrx-clear-choice:has(>input:focus-visible) {
    outline: 3px solid #a087c4;
    outline-offset: 3px
}
.ezrx-package-card .ezrx-option-label {
    margin: 0 0 10px;
}
.ezrx-package-card .ezrx-option-price {
    font-size: 30px;
    color: var(--rx-accent);
    font-weight: 800;
    margin-bottom: 18px;
    font-family: "Manrope", sans-serif;
    line-height: 1.3;
}
.ezrx-package-card ul {
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
    flex: 1
}
.ezrx-package-card li {
    position: relative;
    padding-left: 40px;
    margin-bottom: 16px !important;
    color: var(--rx-muted);
    font-size: 16px;
    padding-top: 3px;
    padding-bottom: 3px;
    display: block;
}
.ezrx-package-card li::before {
    content: "";
    background-image: url(./icons/index-plastic-lenses.svg);
    position: absolute;
    left: 0;
    top: 0;
    height: 30px;
    width: 30px;
    background-repeat: no-repeat;
    background-position: center;
}
.ezrx-package-card li.ezrx-feature-lens-2::before {
    background-image: url(./icons/Scratch-resistant.svg);
}
.ezrx-package-card li.ezrx-feature-reflect::before {
    background-image: url(./icons/Anti-reflective-glass.svg);
}
.ezrx-package-card li.ezrx-feature-uv::before {
    background-image: url(./icons/sun.svg);
}
.ezrx-package-card li.ezrx-feature-light::before {
    background-image: url(./icons/light-Weight.svg);
}
.ezrx-package-card .ezrx-select-label {
    display: block;
    width: 100%;
    margin-top: auto
}
.ezrx-recommended {
    position: absolute;
    top: -26px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 18px;
    line-height: 1.5;
    border-radius: 22px;
    padding: 7px 24px;
    color: #fff;
    background: var(--rx-accent);
    white-space: nowrap;
    text-transform: capitalize;
}
.ezrx-packages {
    padding-top: 35px
}
.ezrx-dialog .ezrx-clear-choice {
    position: relative;
    display: inline-block;
    background: var(--rx-accent);
    color: #fff;
    padding: 12px 44px;
    border: 0;
    border-radius: 24px;
    font: inherit;
    font-size: 16px;
    cursor: pointer;
    box-shadow: 4px 4px 0 #5D317D4D;
    font-weight: 500;
    transition: all 0.3s;
}
.ezrx-dialog .ezrx-clear-choice:hover{
    box-shadow: 0px 0px 0 #5D317D4D;
}
.ezrx-screen-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: center;
    gap: 28px;
    min-width: 0
}
.ezrx-screen-image {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    aspect-ratio: 1.24;
    object-fit: cover;
    border-radius: 12px;
    background: #f4eff8
}
.ezrx-screen-content {
    min-width: 0
}
.ezrx-screen-content h4 {
    font-size: 21px;
    line-height: 1.4;
    margin-bottom: 16px
}
.ezrx-screen-content p {
    font-size: 14px;
    line-height: 1.8;
    color: var(--rx-muted);
    margin: 0 0 20px
}
.ezrx-screen-content .ezrx-screen-selection {
    color: var(--rx-accent);
    font-size: 12px
}
.ezrx-screen-benefits {
    list-style: disc outside;
    margin: 0 0 18px;
    padding-left: 22px;
    font-size: 14px;
    line-height: 1.65;
    color: var(--rx-muted);
}
.ezrx-screen-benefits li { margin-bottom: 7px; }
.ezrx-screen-benefits[hidden] { display: none; }
.ezrx-screen-content .ezrx-screen-question {
    font-weight: 600;
    color: var(--rx-text);
    margin: 0 0 12px;
}
.ezrx-screen-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px
}
.ezrx-dialog .ezrx-screen-no {
    background: #fff;
    color: var(--rx-text);
    border: 1px solid var(--rx-border);
    border-radius: 24px;
    padding: 10px 20px;
    font: inherit;
    font-size: 12px;
    cursor: pointer;
    font-size: 16px;
    transition: var(--transition);
}
.ezrx-dialog .ezrx-screen-no:hover{
    border-color: var(--rx-accent);
    color: var(--rx-accent);
}
.ezrx-screen-actions button {
    max-width: 100%;
    white-space: normal
}
.ezrx-lens-divider {
    position: relative;
    border-top: 1px solid var(--rx-border);
    margin: 38px 0 30px;
    text-align: center;
    height: 1px;
}
.ezrx-lens-divider span {
    display: inline-block;
    background: #fff;
    position: relative;
    top: -14px;
    color: #FF4848;
    font-weight: 500;
    padding: 0 12px;
    font-size: 18px;
}   
.ezrx-lens-intro {
    margin: 0 0 35px;
    font-size: 18px;
    font-weight: 800;
    color: var(--black);
    font-family: "Manrope", sans-serif;
}
.ezrx-lens-card {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 20px;
    border: 1px solid var(--rx-border);
    border-radius: 20px;
    min-width: 0;
}
.ezrx-lens-card img {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    height: auto;
    aspect-ratio: 2.2;
    object-fit: cover;
    border-radius: 20px;
    margin: 0 0 14px;
    background: #eeebf0
}
.ezrx-lens-card .ezrx-option-price {
    font-size: 24px;
    font-weight: 800;
    margin: 0 0 8px;
    font-family: "Manrope", sans-serif;
    line-height: normal;
}
.ezrx-lens-card .ezrx-option-label{
    font-family: "Manrope", sans-serif;
    font-weight: 800;
    margin: 0 0 8px;
    font-size: 18px;
}
.ezrx-lens-description {
    font-size: 16px;
    line-height: 20px;
    color: var(--rx-muted);
    margin: 0 0 20px;
    flex: 1;
}
.ezrx-lens-card .ezrx-select-label {
    margin-top: 0;
    padding: 7px 16px;
    align-self: flex-start
}
.ezrx-package-card:has(input:checked),
.ezrx-lens-card:has(input:checked),
.ezrx-color-card:has(input:checked),
.ezrx-route:has(input:checked) {
    border-color: var(--rx-accent);
}
.ezrx-color-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin: 16px 0
}
.ezrx-colors {
    margin-top: 22px
}
.ezrx-color-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 14px 8px;
    border: 1px solid var(--rx-border);
    border-radius: 12px;
    font-size: 12px;
    cursor: pointer
}
.ezrx-color-card>input {
    position: absolute;
    right: 6px;
    top: 6px
}
.ezrx-swatch {
    display: block;
    width: 42px;
    height: 42px;
    margin-top: 10px;
    border-radius: 50%;
    background: #aaa;
    box-shadow: inset -12px -5px 0 #0001
}
.ezrx-route-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    margin-bottom: 22px
}
.ezrx-route {
    position: relative;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 16px;
    border: 1px solid var(--rx-border);
    border-radius: 20px;
    padding: 24px;
    cursor: pointer;
    font-size: 18px;
    line-height: normal;
}
.ezrx-route strong{
    font-weight: 800;
    font-family: "Manrope", sans-serif;
}
.ezrx-route>span:not(.ezrx-route-action) {
    font-size: 16px;
    line-height: 1.6;
    color: var(--rx-muted);
    flex: 1
}
.ezrx-route .ezrx-route-action {
    display: inline-block;
    color: #fff;
    background: var(--rx-accent);
    border-radius: 24px;
    padding: 14px 37px;
    font-size: 16px;
    font-weight: 500;
    transition: var(--transition);
    box-shadow: 4px 4px 0 #5D317D4D;
    text-transform: capitalize;
}
.ezrx-route .ezrx-route-action:hover{
    box-shadow: 0px 0px 0 #5D317D4D;
}
.ezrx-entry-methods {
    display: flex;
    flex-wrap: wrap;
    gap: 22px;
    margin: 22px 0
}
.ezrx-entry-methods label,
.ezrx-upload fieldset label {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 13px
}
.ezrx-field {
    display: block;
    margin: 16px 0;
    font-weight: 500;
    font-size: 16px;
}
.ezrx-dialog select, .ezrx-dialog textarea, .ezrx-field input[type=tel], .ezrx-field input[type=file] {
    display: block;
    width: 100%;
    border: 1px solid #d6d0df;
    border-radius: 5px;
    padding: 10px 15px;
    background: #fff;
    color: var(--rx-text);
    font: inherit;
    min-height: 50px;
    font-weight: 300;
    font-size: 14px;
}
.ezrx-field input[type=file]{
    padding: 13px 15px 10px;
}
.ezrx-dialog select {
    appearance: none;
    padding-right: 25px !important;
    background-image: url(./icons/arrow-down.svg);
    background-repeat: no-repeat;
    background-position: calc(100% - 8px) 50%;
}
.ezrx-field select,
.ezrx-field input {
    max-width: 300px;
    margin-top: 7px
}
.ezrx-field textarea {
    margin-top: 7px
}
.ezrx-table-wrap {
    overflow-x: auto;
    max-width: 100%
}
.ezrx-table {
    border-collapse: collapse;
    width: 100%;
    min-width: 630px;
    margin: 16px 0
}
.ezrx-table th,
.ezrx-table td {
    padding: 8px;
    border: 1px solid var(--rx-border);
    text-align: left
}
.ezrx-table th {
    font-size: 12px;
    background: #f6f3f9
}
.ezrx-table select {
    min-width: 86px;
    font-size: 12px;
    padding: 8px
}
.ezrx-pd-dual {
    display: flex;
    gap: 16px
}
.ezrx-upload fieldset {
    padding: 16px;
    border: 1px solid var(--rx-border);
    border-radius: 10px;
    margin: 20px 0
}
.ezrx-upload fieldset label {
    margin-right: 20px
}
.ezrx-review {
    border: 1px solid var(--rx-border);
    border-radius: 20px;
    padding: 18px;
    margin-bottom: 20px;
}
.ezrx-review dl {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr);
    gap: 10px;
    margin: 0;
    font-size: 13px
}
.ezrx-review dt {
    font-weight: 800;
    font-size: 16px;
    font-family: "Manrope", sans-serif;
}
.ezrx-review dd {
    margin: 0;
    overflow-wrap: anywhere;
    font-size: 16px;
    color: var(--rx-muted);
}
.ezrx-review+label{
    display: inline-flex;
    gap: 10px;
}
.ezrx-review+label input[type="checkbox"]{
    width: 20px;
    height: 20px;
    position: relative;
    top: 0; 
    color: var(--rx-accent);
}
.ezrx-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    border-top: 1px solid var(--rx-border);
    margin-top: 24px;
    padding-top: 18px
}
.ezrx-footer span,
.ezrx-footer strong,
.ezrx-footer small {
    display: block
}
.ezrx-footer span {
    font-size: 14px;
}
.ezrx-footer strong {
    font-size: 30px;
    line-height: 1.4
}
.ezrx-footer small {
    font-size: 12px;
    color: var(--rx-muted)
}
.ezrx-actions {
    display: flex;
    gap: 10px
}
.ezrx-error {
    padding: 12px;
    background: #fff1f0;
    color: #a61b16;
    border: 1px solid #f3b9b6;
    border-radius: 8px;
    margin: 16px 0;
}
.ezrx-color-card input[type=radio]{
    opacity: 0;
    visibility: hidden;
}
@media only screen and (min-width: 992px) {
    .ezrx-dialog .ezrx-use-continue:hover, 
    .ezrx-dialog .ezrx-select-label:hover, 
    .ezrx-dialog .ezrx-next:hover, 
    .ezrx-dialog .ezrx-submit:hover, 
    .ezrx-dialog .ezrx-buy:hover,
    .ezrx-dialog .ezrx-clear-choice:hover,
    .ezrx-route .ezrx-route-action:hover{
        transform: translate(3px, 3px);
    }
}
@media(max-width: 1199px) {
    .ezrx-lens-card .ezrx-option-label{
        font-size: 16px;
    }
}
@media(max-width: 991px) {
    .ezrx-use-card {
        padding: 20px;
        grid-template-columns: 90px minmax(0, 1fr) auto;
    }
    .ezrx-use-icon{
        width: 90px !important;
        height: 90px !important;
    }
    .ezrx-card-grid{
        gap: 15px;
    }
    .ezrx-recommended{
        font-size: 13px;
        top: -18px;
    }
    .ezrx-package-card {
        padding: 24px 15px 15px;
    }
    .ezrx-package-card .ezrx-option-label{
        font-size: 20px;
    }
    .ezrx-package-card .ezrx-option-price{
        font-size: 24px;
    }
    .ezrx-package-card li {
        font-size: 14px;
        line-height: normal;
        padding-left: 30px;
    }
    .ezrx-package-card li::before{
        height: 24px;
        width: 24px;
        background-size: 20px;
    }
    .ezrx-lens-card{
        padding: 15px;
    }
    .ezrx-lens-description{
        font-size: 14px;
    }
}
@media(max-width: 767px) {
    .ezrx-dialog {
        padding: 20px
    }
    .ezrx-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }
    .ezrx-use-card {
        grid-template-columns: 50px minmax(0, 1fr);
        gap: 12px;
        padding: 15px;
        margin-bottom: 15px;
    }
    .ezrx-use-continue {
        grid-column: 2;
        justify-self: start
    }
    .ezrx-color-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }
    .ezrx-screen-panel {
        grid-template-columns: 1fr;
        gap: 20px
    }
    .ezrx-screen-image {
        aspect-ratio: 1.8;
        max-height: 230px
    }
    .ezrx-screen-content h4 {
        font-size: 19px
    }
    .ezrx-screen-actions {
        gap: 10px
    }
    .ezrx-dialog h4 {
        font-size: 16px;
        margin-bottom: 6px;
    }
    .ezrx-dialog {
        padding: 16px;
        width: calc(100% - 16px)
    }
    .ezrx-head h2 {
        font-size: 16px
    }
    .ezrx-head {
        gap: 10px
    }
    .ezrx-dialog .ezrx-back {
        padding: 6px 16px;
        font-size: 14px;
    }
    .ezrx-card-grid,
    .ezrx-route-grid {
        grid-template-columns: 1fr
    }
    .ezrx-use-title {
        font-size: 15px
    }
    .ezrx-use-description {
        font-size: 12px
    }
    .ezrx-use-options {
        gap: 10px
    }
    .ezrx-footer {
        flex-direction: column;
        align-items: stretch
    }
    .ezrx-actions button {
        width: 100%
    }
    .ezrx-review dl {
        grid-template-columns: 1fr;
        gap: 4px;
    }
    .ezrx-review dd {
        margin-bottom: 10px;
        font-size: 14px;
    }
    .ezrx-review dt,.ezrx-route>span:not(.ezrx-route-action){
        font-size: 14px;
    }
    .ezrx-buy {
        margin: 10px 0 0
    }
    .ezrx-pd-dual {
        flex-direction: column;
        gap: 0
    }
    .ezrx-dialog .ezrx-close{
        width: 20px;
        height: 20px;
    }
    .ezrx-use-icon {
        width: 50px !important;
        height: 50px !important;
    }
    .ezrx-use-option {
        font-size: 12px;
        line-height: normal;
        align-items: start;
    }
    .ezrx-dialog input[type=radio], .ezrx-dialog input[type=checkbox] {
        width: 16px;
        height: 16px;
    }
    .ezrx-dialog .ezrx-use-continue, .ezrx-dialog .ezrx-select-label, .ezrx-dialog .ezrx-next, .ezrx-dialog .ezrx-submit, .ezrx-buy {
        padding: 10px 24px;
        font-size: 14px;
        min-width: auto;
    }
    .ezrx-card-grid{
        padding-top: 0;
    }
    .ezrx-package-card:has(.ezrx-recommended){
        margin-top: 20px;
    }
    .ezrx-lens-card img {
        width: 100% !important;
    }
    .ezrx-dialog .ezrx-clear-choice,
    .ezrx-dialog .ezrx-screen-no{
        font-size: 14px;
        padding: 12px 25px;
    }
    .ezrx-lens-intro {
        font-size: 16px;
        line-height: normal;
        margin-bottom: 20px;
    }
    .ezrx-swatch{
        height: 35px;
        width: 35px;
    }
    .ezrx-route .ezrx-route-action{
        font-size: 14px;
        padding: 11px 20px;
    }
    .ezrx-route{
        padding: 15px;
    }
    /* "I want to" radios under each other */
    .ezrx-now-panel .ezrx-entry-methods{
        flex-direction: column;
        gap: 12px;
        margin: 16px 0;
    }
    .ezrx-now-panel .ezrx-entry-methods label{font-size: 16px;}
    .ezrx-now-panel p{font-size: 14px;line-height: 1.6;}
 
    /* no sideways scroll */
    .ezrx-now-panel .ezrx-table-wrap{overflow-x: visible;}
 
    /* table -> grid: [label] [right eye] [left eye] */
    .ezrx-now-panel .ezrx-table{
        display: grid;
        grid-template-columns: 72px minmax(0, 1fr) minmax(0, 1fr);
        width: 100%;
        min-width: 0;
        margin: 16px 0;
        border-collapse: separate;
        border-top: 1px solid var(--rx-border);
        border-left: 1px solid var(--rx-border);
    }
    .ezrx-now-panel .ezrx-table thead,
    .ezrx-now-panel .ezrx-table tbody,
    .ezrx-now-panel .ezrx-table tr{display: contents;}
 
    .ezrx-now-panel .ezrx-table th,
    .ezrx-now-panel .ezrx-table td{
        display: flex;
        align-items: center;
        min-width: 0;
        padding: 10px 8px;
        border: 0;
        border-right: 1px solid var(--rx-border);
        border-bottom: 1px solid var(--rx-border);
    }
 
    /* --- row 1: column headings (Right / Left eye) --- */
    .ezrx-now-panel .ezrx-table thead th:nth-child(1){
        grid-column: 1;
        grid-row: 1;
        font-size: 0;
    }
    .ezrx-now-panel .ezrx-table tbody th[scope="row"]{
        justify-content: center;
        font-size: 12px;
        font-weight: 700;
        text-align: center;
        text-transform: uppercase;
        background: #f6f3f9;
        color: var(--rx-text);
    }
    .ezrx-now-panel .ezrx-table tbody tr:nth-child(1) th[scope="row"]{grid-column: 2;grid-row: 1;}
    .ezrx-now-panel .ezrx-table tbody tr:nth-child(2) th[scope="row"]{grid-column: 3;grid-row: 1;}
 
    /* --- column 1: field names (read from the old header cells) --- */
    .ezrx-now-panel .ezrx-table thead th:nth-child(n+2){
        grid-column: 1;
        justify-content: flex-end;
        font-size: 0;
        text-align: right;
        background: #f6f3f9;
    }
    .ezrx-now-panel .ezrx-table thead th:nth-child(n+2){padding: 10px 6px;}
    .ezrx-now-panel .ezrx-table thead th:nth-child(n+2)::after{
        font-size: 11px;
        font-weight: 500;
        line-height: 1.3;
        overflow-wrap: anywhere;
        color: var(--rx-text);
    }
    .ezrx-now-panel .ezrx-table thead th:nth-child(2){grid-row: 2;}
    .ezrx-now-panel .ezrx-table thead th:nth-child(3){grid-row: 3;}
    .ezrx-now-panel .ezrx-table thead th:nth-child(4){grid-row: 4;}
    .ezrx-now-panel .ezrx-table thead th:nth-child(5){grid-row: 5;}
    .ezrx-now-panel .ezrx-table thead th:nth-child(6){grid-row: 6;}
    .ezrx-now-panel .ezrx-table thead th:nth-child(2)::after{content: "Sphere (SPH)";}
    .ezrx-now-panel .ezrx-table thead th:nth-child(3)::after{content: "Cylinder (CYL)";}
    .ezrx-now-panel .ezrx-table thead th:nth-child(4)::after{content: "Axis (AXIS)";}
    .ezrx-now-panel .ezrx-table thead th:nth-child(5)::after{content: "Near addition (ADD)";}
    .ezrx-now-panel .ezrx-table thead th:nth-child(6)::after{content: "Inter addition (ADD)";}
 
    /* --- columns 2 and 3: the dropdowns --- */
    .ezrx-now-panel .ezrx-table tbody tr:nth-child(1) td{grid-column: 2;}
    .ezrx-now-panel .ezrx-table tbody tr:nth-child(2) td{grid-column: 3;}
    .ezrx-now-panel .ezrx-table tbody tr td:nth-child(2){grid-row: 2;}
    .ezrx-now-panel .ezrx-table tbody tr td:nth-child(3){grid-row: 3;}
    .ezrx-now-panel .ezrx-table tbody tr td:nth-child(4){grid-row: 4;}
    .ezrx-now-panel .ezrx-table tbody tr td:nth-child(5){grid-row: 5;}
    .ezrx-now-panel .ezrx-table tbody tr td:nth-child(6){grid-row: 6;}
 
    .ezrx-now-panel .ezrx-table td select {
        width: 100%;
        min-width: 0;
        min-height: 35px;
        padding: 8px 22px 8px 6px;
        font-size: 11px;
        padding-right: 16px !important;
        background-size: 8px;
        background-position: calc(100% - 4px) 53%;
    }
 
    /* PD + notes: full width */
    .ezrx-now-panel .ezrx-field select,
    .ezrx-now-panel .ezrx-field input,
    .ezrx-now-panel .ezrx-field textarea{
        width: 100%;
        max-width: none;
    }
}
@media(prefers-reduced-motion:reduce) {
    .ezrx-dialog * {
        scroll-behavior: auto
    }
}
@media(max-width:500px) {
    .ezrx-dialog .ezrx-clear-choice{
        padding: 12px 18px;
    }
}
/* 2.4.0 — Scoped comparison and prescription acknowledgement overlays. */
.ezrx-dialog { position: relative; }
.ezrx-dialog .ezrx-overlay[hidden] { display: none !important; }
.ezrx-dialog .ezrx-overlay {
    position: absolute;
    inset: 0;
    z-index: 30;
    background: #fff;
    padding: clamp(18px, 3vw, 32px);
    min-height: 100%;
    overflow: auto;
    border-radius: inherit;
}
.ezrx-overlay-content { max-width: 850px; margin: 0 auto; position: relative; }
.ezrx-overlay h3 { font-size: clamp(22px, 3vw, 28px); line-height: 1.25; margin: 0 40px 8px 0; font-weight: 800; }
.ezrx-overlay-intro { color: #5f6370; font-size: 14px; margin: 0 0 24px; }
.ezrx-dialog .ezrx-overlay-close {
    position: absolute; top: -6px; right: 0; width: 34px; height: 34px;
    border: 1px solid #dfe1e6; border-radius: 50%; background: #fff;
    color: #383838; font-size: 22px; line-height: 1; cursor: pointer;
}
.ezrx-upgrade-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.ezrx-upgrade-card { display: flex; flex-direction: column; gap: 0; min-width: 0; border: 1px solid #e5e6ea; border-radius: 15px; padding: 16px; }
.ezrx-upgrade-elite { border-color: #ab93c3; background: #fcfafe; }
.ezrx-upgrade-card img { width: 100%; height: auto; aspect-ratio: 1.06; object-fit: cover; border-radius: 12px; margin-bottom: 13px; }
.ezrx-dialog .ezrx-upgrade-card h4 { font-size: clamp(15px, 1.8vw, 19px); line-height: 1.35; font-weight: 800; margin: 0 0 8px; }
.ezrx-upgrade-card h4 span { color: #5d317d; white-space: nowrap; }
.ezrx-upgrade-card ul { list-style: none; margin: 0 0 18px; padding: 0; flex: 1; }
.ezrx-upgrade-card li { color: #606570; margin: 0 0 7px; padding-left: 23px; position: relative; font-size: 13px; }
.ezrx-upgrade-card li::before { content: '✓'; position: absolute; left: 0; top: 0; font-weight: 800; color: #16b3ca; }
.ezrx-dialog .ezrx-upgrade-secondary, .ezrx-dialog .ezrx-upgrade-primary {
    cursor: pointer; border-radius: 24px; padding: 12px 16px; font: inherit;
    font-weight: 700; font-size: 13px; line-height: 1.3;
    border: 1px solid #5d317d; background: #fff; color: #5d317d; text-align: center;
}
.ezrx-dialog .ezrx-upgrade-primary { background: #5d317d; color: #fff; }
.ezrx-warning-overlay { display: flex; align-items: center; justify-content: center; }
.ezrx-warning-box { text-align: center; max-width: 470px; padding: clamp(12px, 3vw, 28px); }
.ezrx-warning-box h3 { margin: 0 0 12px; }
.ezrx-warning-box p { font-size: 17px; margin: 0 0 28px; line-height: 1.6; }
.ezrx-warning-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; }
@media (max-width: 590px) {
    .ezrx-upgrade-grid { gap: 10px; }
    .ezrx-upgrade-card { padding: 10px; }
    .ezrx-dialog .ezrx-upgrade-card h4 { font-size: 13px; }
    .ezrx-upgrade-card li { font-size: 11px; padding-left: 17px; }
    .ezrx-dialog .ezrx-upgrade-primary, .ezrx-dialog .ezrx-upgrade-secondary { padding: 10px; font-size: 12px; }
    .ezrx-overlay h3 { font-size: 19px; }
}
@media (max-width: 350px) { .ezrx-upgrade-grid { grid-template-columns: 1fr; } }
/* Admin-editable Blue Light Filter introduction may contain paragraph breaks. */
.ezrx-screen-content #ezrx-screen-description { white-space: pre-line; }
