/* ============================================================
   logRegNew.css  –  Nuova grafica B2C per Login/Registrazione
   Basato su style_new.0fd647febb72ce8e.css
   ============================================================ */

/* ---- Font ---- */
@font-face {
    font-family: "Inter";
    src: url('../fonts/Inter/Inter_18pt-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: "Inter";
    src: url('../fonts/Inter/Inter_18pt-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

/* ---- CSS Variables ---- */
:root {
    --primary: #01a2b7;
    --primary-dark: #03606B;
    --secondary: #f9bd00;
    --background-clear: #FFFFFF;
    --background-disabled: #c3d4da;
    --text-black: #000000;
    --text-disabled: #6e6e6e;
    --disabled: #b6b6b6;
    --primary-light: #00b6cb;
    --background-primary: #f2f2f2;
    --secondary-dark: #e5a901;
    --primary-dark2: #00424c;
    --invalid-color: #dc3545;
}

/* ---- Reset ---- */
*, *::before, *::after {
    box-sizing: border-box;
}

*,
*:focus,
*:hover {
    outline: none;
}

[hidden] {
    display: none;
}

body,
html {
    margin: 0;
    padding: 0;
    height: 100%;
    font-family: 'Inter', sans-serif;
    color: var(--text-black);
    line-height: normal;
}

/* ---- Background ---- */
.background-pattern {
    background-color: var(--primary);
    position: absolute;
    inset: 0;
    z-index: 0;
}

.background-pattern::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("../images/pattern_aquilone.svg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    opacity: 0.2;
}

/* ---- Container ---- */
.container {
    width: 100vw;
    min-height: 100vh;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--background-clear);
}

/* ---- Login Box ---- */
.login-box {
    display: flex;
    flex-direction: row;
    width: 90%;
    max-width: 912px;
    height: 680px;
    max-height: calc(100vh - 40px);
    background-color: var(--background-clear);
    border-radius: 8px;
    padding: 32px;
    z-index: 1;
    gap: 28px;
    box-shadow: 0 4px 16px var(--text-black);
    overflow: hidden;
}

    .login-box::-webkit-scrollbar,
    .right-panel::-webkit-scrollbar {
        width: 8px;
    }

    .login-box::-webkit-scrollbar-track,
    .right-panel::-webkit-scrollbar-track {
        background: transparent;
        margin-top: 8px;
        margin-bottom: 8px;
    }

    .login-box::-webkit-scrollbar-thumb,
    .right-panel::-webkit-scrollbar-thumb {
        background-color: var(--background-disabled);
        border-radius: 4px;
    }

/* ---- Left Panel ---- */
.left-panel {
    flex: 45;
    border-right: 1px solid var(--primary);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.logo {
    width: 227px;
    height: auto;
}

.slogan {
    color: var(--primary-dark);
    font-size: 16px;
    text-align: center;
    margin-top: 24px;
    max-width: 300px;
}

/* ---- Right Panel ---- */
.right-panel {
    flex: 55;
    display: flex;
    flex-direction: column;
    gap: 16px;
    position: relative;
    overflow-y: auto;
    scrollbar-color: var(--background-disabled) transparent;
    scrollbar-width: thin;
    padding-right: 8px; /* Offset per la scrollbar */
    padding-left: 4px;
}

    .right-panel::before,
    .right-panel::after {
        content: "";
        margin: auto;
    }

.right-panel h1,
.right-panel h1#hh {
    font-size: 36px;
    font-weight: 400;
    color: #3D3C3C;
    margin: 0 0 10px 0;
    display: block !important;
}

/* ---- Forms ---- */
form,
.attr {
    width: 100%;
}

/* ---- Floating Label Container ---- */
.float-label {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
}

/* ---- General Input Styling ---- */
.right-panel input[type="text"],
.right-panel input[type="password"],
.right-panel input[type="email"],
.right-panel textarea,
.right-panel .riTextBox,
.right-panel .RadInput .riTextBox {
    width: 100%;
    padding: 20px 40px 6px 10px;
    height: 56px;
    border: 1px solid var(--background-disabled);
    border-radius: 2px;
    font-size: 16px;
    outline: none;
    background: transparent;
    font-family: 'Inter', sans-serif;
    color: var(--text-black);
    z-index: 1;
}

.right-panel input[type="text"]:focus,
.right-panel input[type="password"]:focus,
.right-panel input[type="email"]:focus,
.right-panel textarea:focus,
.right-panel .riTextBox:focus,
.right-panel .RadInput .riTextBox:focus {
    border-color: var(--primary-light);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary-light) 25%, transparent);
}

.right-panel input[type="text"]:focus-visible,
.right-panel input[type="password"]:focus-visible,
.right-panel input[type="email"]:focus-visible {
    outline: none;
}

/* Hide native placeholder text */
.float-label input::placeholder {
    color: transparent;
    opacity: 0;
}

/* ---- Floating Labels ---- */

/* Default label state: centered inside the input */
.float-label > label {
    position: absolute;
    left: 10px;
    top: 28px;
    transform: translateY(-50%);
    font-size: 16px;
    font-weight: 400;
    color: var(--text-disabled);
    transition: all 0.2s ease-out;
    pointer-events: none;
    z-index: 2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: left;
    user-select: none;
    margin: 0;
    padding: 0;
}

/* Floated state: on focus */
.float-label:focus-within > label {
    top: 5px;
    transform: none;
    font-size: 13px;
    color: var(--text-disabled);
}

/* Floated state: when input has content (uses :placeholder-shown) */
.float-label:has(> input:not(:placeholder-shown)) > label,
.float-label:has(> .password-wrapper input:not([hidden]):not(:placeholder-shown)) > label,
.float-label:has(> textarea:not(:placeholder-shown)) > label {
    top: 5px;
    transform: none;
    font-size: 13px;
    color: var(--text-disabled);
}

/* Floated state: autofill */
.float-label:has(> input:-webkit-autofill) > label,
.float-label:has(> input:autofill) > label,
.float-label:has(> .password-wrapper input:not([hidden]):-webkit-autofill) > label,
.float-label:has(> .password-wrapper input:not([hidden]):autofill) > label {
    top: 5px;
    transform: none;
    font-size: 13px;
    color: var(--text-disabled);
    transition: none !important;
}

/* Float when password-wrapper has focus */
.float-label:has(> .password-wrapper :focus) > label {
    top: 5px;
    transform: none;
    font-size: 13px;
    color: var(--text-disabled);
}

/* Non-floating labels (outside .float-label) */
.right-panel label {
    font-weight: 400;
    font-size: 14px;
    color: var(--text-disabled);
    display: block;
    margin-bottom: 4px;
}

/* ---- Buttons (primary action) ---- */
.right-panel .buttons button,
.right-panel .button-login button,
.right-panel .button-login input[type="submit"],
.right-panel input[type="submit"],
.right-panel .btn-avanti,
.right-panel .btn-accedi,
.right-panel .btn-conf-reg {
    width: 100%;
    height: 50px;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    background-color: var(--secondary);
    color: var(--text-black);
    border: 2px solid var(--secondary);
    cursor: pointer;
    border-radius: 2px;
    margin-top: 20px;
    line-height: 1.5;
    text-transform: uppercase;
    font-weight: 400;
    font-family: 'Inter', sans-serif;
    display: block;
}

.right-panel .buttons button:hover,
.right-panel .buttons button:focus,
.right-panel .button-login button:hover,
.right-panel .button-login button:focus,
.right-panel .button-login input[type="submit"]:hover,
.right-panel .button-login input[type="submit"]:focus,
.right-panel input[type="submit"]:hover,
.right-panel input[type="submit"]:focus,
.right-panel .btn-avanti:hover,
.right-panel .btn-avanti:focus,
.right-panel .btn-accedi:hover,
.right-panel .btn-accedi:focus,
.right-panel .btn-conf-reg:hover,
.right-panel .btn-conf-reg:focus {
    background-color: var(--secondary-dark);
    border-color: var(--secondary-dark);
}

.right-panel .buttons button:focus-visible,
.right-panel .button-login button:focus-visible,
.right-panel .button-login input[type="submit"]:focus-visible,
.right-panel input[type="submit"]:focus-visible,
.right-panel .btn-avanti:focus-visible,
.right-panel .btn-accedi:focus-visible,
.right-panel .btn-conf-reg:focus-visible {
    box-shadow: 0 0 0 0.25rem var(--primary-dark2);
    outline: none;
}

.right-panel .buttons button:disabled {
    opacity: 1;
    background-color: var(--disabled);
    border-color: var(--disabled);
    color: var(--background-primary);
}

/* ---- Button area ---- */
.button-login {
    display: flex;
    justify-content: center;
    width: 100%;
}

.button-login button,
.button-login input[type="submit"] {
    float: none !important;
    width: 100% !important;
}

.row-login {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    width: 100%;
}

/* ---- Error messages ---- */
/*.errorMessage {
    background-color: transparent;
    text-align: center;
    font-weight: 500;
    color: var(--invalid-color);
    font-size: 14px;
    margin-top: 10px;
    display: block;
}

.errorMessage:empty {
    display: none;
}*/

/* Error Message */
.errorMessage {
    background-color: transparent;
    font-weight: 500;
    color: var(--invalid-color);
    display: block;

    align-items: center;
    justify-content: flex-start;
    width: 100%;
    margin-top: 6px;
    margin-bottom: 2px;
    font-size: 13px;
    text-align: left;
    position: relative;
}

    .errorMessage:empty {
        display: none;
    }

    /* Warning icon inside error message */
    .errorMessage:not([aria-hidden="true"]):not(:empty)::before {
        content: "";
        display: inline-block;
        width: 18px;
        height: 18px;
        /* SVG Warning Icon (Outlined Rounded Triangle with !) - var(--invalid-color) */
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23dc3545' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z'/%3E%3Cline x1='12' y1='9' x2='12' y2='13'/%3E%3Cline x1='12' y1='17' x2='12.01' y2='17'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        margin-right: 8px;
        flex-shrink: 0;
        vertical-align: middle;
    }

.right-panel .error {
    color: var(--invalid-color);
    font-weight: 500;
    text-align: center;
    font-size: 14px;
    margin-bottom: 2px;
}

/* ---- Links ---- */

/* Password dimenticata / subtitle links */
.subtitle-login-forgot-password {
    display: block;
    font-size: 14px;
    margin-top: 10px;
    text-align: center;
    color: var(--primary-dark2);
    text-decoration: none;
}

    .subtitle-login-forgot-password:focus-visible {
        outline: 2px solid var(--primary-dark2) !important;
        border-radius: 2px;
    }

.subtitle-login {
    display: block;
    font-size: 14px;
    margin-top: 5px;
    text-align: center;
}

/* ---- Password wrapper ---- */
.password-wrapper {
    position: relative;
    display: flex;
    width: 100%;
}

.password-wrapper input[type="password"],
.password-wrapper input[type="text"] {
    width: 100%;
    padding-right: 40px;
}

.password-icon {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    color: #68A3BB;
    z-index: 2;
}

.password-icon:focus-visible {
    outline: 2px solid var(--primary-dark2);
    border-radius: 2px;
}

input[type="password"]::-ms-reveal,
input[type="password"]::-ms-clear {
    display: none;
}

/* ---- Legal Links (footer) ---- */
.legal-links {
    width: 100%;
    justify-content: center;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    text-align: center;
}

.legal-links a {
    margin-top: 0;
    font-size: 13px;
    color: var(--text-disabled);
    display: inline-block;
    padding: 0.375rem 0.75rem;
    font-weight: 400;
    line-height: 1.5;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    cursor: pointer;
    border: 1px solid transparent;
    background-color: transparent;
    transition: color 0.15s ease-in-out;
}

.legal-links a:hover {
    color: var(--primary-dark);
    text-decoration: underline;
}

.legal-links a:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(49, 132, 253, .5);
}

.legal-links span {
    display: flex;
    align-items: center;
    color: var(--text-disabled);
    font-size: 13px;
}

/* ---- Lists ---- */
ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

li {
    margin-bottom: 10px;
}

/* ProblemiAccesso link list */
.right-panel .problemi-link a,
.right-panel .problemi-link input {
    color: var(--primary-dark2);
    font-weight: 700;
    font-size: 16px;
    text-decoration: underline;
    cursor: pointer;
    background: none;
    border: none;
    padding: 0;
}

.right-panel .problemi-link a:hover,
.right-panel .problemi-link input:hover {
    color: var(--primary-dark);
}

.right-panel .problemi-link a:focus-visible {
    outline: 2px solid var(--primary-dark2);
    border-radius: 2px;
}

/* ---- Back Button (landscape & portrait) ---- */
.btn-back-landscape {
    display: flex;
    margin-bottom: 10px;
}

.btn-back-landscape a,
.btn-back-portrait a {
    color: var(--primary-dark2) !important;
    text-decoration: none;
    font-weight: 400;
    font-size: 14px;
}

.btn-back-landscape a:focus-visible,
.btn-back-portrait a:focus-visible {
    outline: 2px solid var(--primary-dark2);
    border-radius: 2px;
}

.btn-back-portrait {
    margin-top: 20px;
    display: none;
}

/* ---- RadAjaxLoadingPanel ---- */
.RadAjaxLoadingPanel {
    z-index: 100;
}

/* ===================================
   Registrazione / Wizard / Telerik
   =================================== */

/* RadLabel */
.RadLabel {
    color: inherit;
    font-family: 'Inter', sans-serif;
}

/* Custom label for form fields */
.custom-label {
    font-size: 14px;
    color: var(--text-disabled);
    font-weight: 400;
}

.rosso {
    color: var(--invalid-color) !important;
    font-size: 14px;
}

/* Custom textbox override */
.right-panel .custom-textbox,
.right-panel .custom-textbox .riTextBox {
    width: 100% !important;
    height: 56px;
    border: 1px solid var(--background-disabled);
    border-radius: 2px;
    padding: 20px 40px 6px 10px;
    font-size: 16px;
    font-family: 'Inter', sans-serif;
    color: var(--text-black);
    background: transparent;
    z-index: 1;
}

/* Hide placeholder in Telerik inputs inside float-label */
.float-label .custom-textbox .riTextBox::placeholder,
.float-label .RadInput .riTextBox::placeholder {
    color: transparent;
    opacity: 0;
}

/* Floating label for Telerik RadTextBox/RadMaskedTextBox */
.float-label:has(.riTextBox:focus) > label,
.float-label:has(.riTextBox:focus) > .custom-label {
    top: 5px;
    transform: none;
    font-size: 13px;
    color: var(--text-disabled);
}

.float-label:has(.riTextBox:not(:placeholder-shown)) > label,
.float-label:has(.riTextBox:not(:placeholder-shown)) > .custom-label {
    top: 5px;
    transform: none;
    font-size: 13px;
    color: var(--text-disabled);
}

/* RadLabel as floating label inside .float-label */
.float-label > .custom-label,
.float-label > .RadLabel {
    position: absolute;
    left: 10px;
    top: 28px;
    transform: translateY(-50%);
    font-size: 16px;
    font-weight: 400;
    color: var(--text-disabled);
    transition: all 0.2s ease-out;
    pointer-events: none;
    z-index: 2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: left;
    user-select: none;
    margin: 0;
    padding: 0;
}

.right-panel .custom-textbox:focus,
.right-panel .custom-textbox .riTextBox:focus {
    border-color: var(--primary-light);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary-light) 25%, transparent);
}

.right-panel .custom-textbox:focus-visible,
.right-panel input[name^="txt"]:focus-visible {
    outline: none;
    border-color: var(--primary-light);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--primary-light) 25%, transparent);
}

/* container-tipo (scelta tipo utente) */
.container-tipo {
    padding: 10px 0;
    display: flex;
    flex-direction: column;
}

/* RadRadioButtonList */
.RadRadioButtonList .rbButton {
    margin-bottom: 5px !important;
    vertical-align: middle;
    display: inline-flex;
    align-items: center;
}

.RadRadioButtonList .rbToggleRadio,
.RadRadioButtonList .rbToggleRadioChecked {
    transform: scale(1.3);
    margin-right: 10px;
    vertical-align: middle !important;
    margin-top: 0;
}

.RadRadioButtonList .rbText {
    font-size: 1.1rem !important;
    padding-top: 0;
    vertical-align: middle !important;
    color: var(--text-black) !important;
}

.RadRadioButtonList .rbToggleRadio::before {
    color: var(--primary);
}

.RadRadioButtonList .rbToggleRadioChecked::before {
    color: var(--primary);
}

.rbVerticalList .rbCheckBox,
.rbVerticalList .rbRadioButton,
.rbVerticalList .rbToggleButton {
    display: block;
    padding: 5px 5px 5px 1px !important;
    margin-bottom: 10px;
}

.rbRadioButton:focus-visible {
    outline: 2px solid var(--primary-dark2) !important;
    padding: 5px;
}

.RadButton .rbText {
    color: inherit;
}

.RadButton_Bootstrap.rbRadioButton .rbText {
    color: var(--text-black) !important;
}

/* RadWizard */
.RadWizard_Bootstrap {
    background: transparent !important;
}

.RadWizard_Bootstrap .rwzSelected .rwzLink,
.RadWizard_Bootstrap .rwzSelected .rwzLink:before {
    border-color: var(--secondary) !important;
    background-color: var(--secondary) !important;
    color: var(--primary-dark2);
}

.RadWizard_Bootstrap .rwzSelected .rwzLink .rwzText {
    color: var(--primary-dark2) !important;
}

.RadWizard_Bootstrap .rwzLink:before {
    border-color: var(--background-disabled) !important;
    background-color: var(--background-disabled) !important;
}

.RadWizard_Bootstrap .rwzLink {
    border-color: var(--background-disabled) !important;
    background-color: var(--background-disabled) !important;
    color: var(--text-disabled) !important;
}

/*.rwzBreadCrumb .rwzLink {
    padding: 10px 10px 10px 20px !important;
}*/

.rwzBreadCrumb {
    padding-right: 24px !important;
}

    .rwzBreadCrumb .rwzLast .rwzLink {
        margin-right: 24px !important;
    }

#WizardRegistrazioneEC .rwzButton {
    background-color: var(--secondary) !important;
    border-color: var(--secondary) !important;
    font-weight: 400;
    border-radius: 2px;
    text-transform: uppercase;
}

#WizardRegistrazioneEC .rwzButton span {
    color: var(--text-black) !important;
}

#WizardRegistrazioneEC .rwzButton:hover {
    background-color: var(--secondary-dark) !important;
    border-color: var(--secondary-dark) !important;
}

#WizardRegistrazioneEC .rwzButton:focus-visible {
    outline: 2px solid black !important;
}

.rwzNext {
    margin-right: 2px !important;
}

.rwzFocused {
    outline: 2px solid var(--primary-dark2) !important;
    outline-offset: 0px;
    box-shadow: none !important;
}

/* Wizard step content */
.wizard-step-content {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: 4px;
}

.row-content-wizard {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 8px;
}

/* Grid rows for registration form */
.row-grid {
    display: grid;
    align-items: center;
    position: relative;
    row-gap: 0.5rem;
    overflow: visible;
    grid-template-columns: 1fr;
    margin-bottom: 12px;
}

.row-grid-button {
    display: flex;
    justify-content: center;
    margin-top: 10px;
}

/* Validation icons */
.val {
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
}

.imagineValidazione {
    width: 20px;
    height: 20px;
}

.pwd-toggle {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    color: #68A3BB;
}

.box-text-val {
    position: relative;
    width: 100%;
}

.telefono-box {
    display: flex;
    align-items: baseline;
}

.telefono-box b {
    color: var(--text-black);
}

/* RadListBox */
.localiBox {
    height: 200px;
    width: 100%;
    border: 1px solid var(--background-disabled);
    border-radius: 2px;
}

.RadListBox .rlbGroup {
    height: inherit;
}

.RadListBox .rlbTemplate {
    display: inline-flex !important;
}

.rlbItem label {
    margin-top: 0px !important;
    display: initial !important;
}

.rlbCheckAllItems label {
    margin-top: 0px !important;
    display: initial !important;
}

.rlbCheckAllItemsCheckBox {
    margin-right: 8px !important;
}

.rlbItem.rlbSelected {
    color: #fff !important;
    background-color: var(--primary) !important;
}

.templateContainer {
    margin-left: 5px;
}

.templateRow1 {
    font-size: 16px;
    color: var(--text-black);
}

.templateRow2 {
    font-size: 11px;
    color: var(--text-disabled);
}

.localeSelContainer {
    margin-top: 10px;
    margin-bottom: 10px;
    display: inline-flex;
    align-items: center;
}

.localeSelContainer div {
    margin: auto;
}

.localeSelContainer div button {
    margin-left: 10px;
}

/* RadComboBox */
.RadComboBox .rcbInner {
    padding: 0px !important;
    border: none !important;
    box-shadow: none !important;
}

.RadComboBox input {
    padding-top: 13px !important;
    padding-bottom: 13px !important;
}

.RadComboBox .rcbActionButton {
    height: unset !important;
    margin-top: 1px;
    margin-bottom: 1px;
    margin-right: 1px;
    border-left: 1px solid var(--background-disabled) !important;
    border-color: transparent transparent transparent var(--background-disabled) !important;
}

.RadComboBoxDropDown .rcbItem {
    color: var(--text-black);
}

/* Privacy section */
#PrivacyUTPanel {
    font-size: 14px;
    color: var(--text-black);
}

#PrivacyUTPanel td {
    vertical-align: top;
    padding-top: 8px;
}

.privacy-item-container {
    display: flex;
    flex-direction: column;
}

.privacy-item {
    display: flex;
    margin-top: 15px;
    margin-bottom: 10px;
    justify-content: space-between;
}

.privacy-item-ut {
    display: grid !important;
    grid-template-columns: 5fr 1fr;
    row-gap: 10px;
}

.privacy-radio {
    display: flex;
    margin-bottom: 5px;
}

button[name^="rblPrivacy"] {
    margin-right: 2px;
}

.privacy-radio-disabled > input,
.privacy-radio-disabled > label {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
}

.radioPrivacy {
    display: flex;
    flex-direction: row;
}

/* PIN / verification code */
.codver {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 10px;
}

.upper-align {
    align-items: baseline !important;
}

/* Various Telerik Button styles */
.btn-pin {
    background-color: var(--secondary) !important;
    color: var(--text-black) !important;
    border: none !important;
    padding: 10px 20px !important;
    border-radius: 2px !important;
    font-weight: 400 !important;
    cursor: pointer !important;
    transition: background-color 0.3s ease !important;
    line-height: 1 !important;
    height: auto !important;
    width: 175px !important;
    text-transform: uppercase;
    font-family: 'Inter', sans-serif !important;
}

.btn-pin:hover {
    background-color: var(--secondary-dark) !important;
}

.btn-pin:focus-visible,
.btn-conf-reg:focus-visible {
    outline: 2px solid var(--primary-dark2);
}

.btnRegistra-box {
    justify-content: center;
    display: flex;
    margin-top: 16px;
}

.btnRegUT,
.btnRegEC,
.btnEC,
.btnUT {
    background-color: var(--secondary) !important;
    border-color: var(--secondary) !important;
    color: var(--text-black) !important;
    border-radius: 2px !important;
    text-transform: uppercase;
    font-family: 'Inter', sans-serif !important;
}

.btnRegUT input,
.btnRegEC input,
.btnEC input,
.btnUT input {
    color: var(--text-black) !important;
}

.btnRegUT:hover,
.btnRegEC:hover,
.btnEC:hover,
.btnUT:hover {
    background-color: var(--secondary-dark) !important;
    border-color: var(--secondary-dark) !important;
}

.RadButton_Bootstrap.rbButton:focus {
    box-shadow: none !important;
    outline-width: 2px !important;
    outline-offset: 0px !important;
    outline-color: var(--primary-dark2) !important;
}

.rbCheckBox:focus-visible {
    outline: 2px solid var(--primary-dark2) !important;
    padding: 4px 7px;
}

/* Bold helper */
.bold {
    font-weight: 700;
}

/* Title areas */
.titleDTAnagEC,
.titleDTAnagUT {
    padding-bottom: 16px;
    overflow: hidden;
}

.lblRegistrazione {
    color: var(--text-black);
}

/* Link helpers */
.btn-link,
.text-link-row a {
    color: var(--primary-dark2);
    font-size: 14px;
    padding: 10px;
    text-decoration: none;
    cursor: pointer;
    border: none;
    background: none;
}

.text-link-row a {
    padding: 0px;
    margin-top: 0px;
}

    .text-link-row a:focus-visible {
        outline: 2px solid var(--primary-dark2) !important;
        border-radius: 2px;
    }

.text-link-row {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    padding: 10px;
}

    .text-link-row span {
        font-size: 14px;
    }

/*.btn-link:hover {
    color: var(--primary-dark);
}*/

.btn-link:focus-visible {
    outline: 2px solid var(--primary-dark2) !important;
    border-radius: 2px;
}

/* Divider */
hr {
    border: none;
    border-top: 1px solid var(--background-disabled);
    margin: 16px 0;
}

.message2 {
    margin-top: 10px;
}

/* Register hint */
.register-hint {
    display: flex;
    align-items: center;
    font-size: 1rem;
    font-weight: 400;
}

.highlight-text {
    margin-right: 0.4rem;
    color: #333;
}

/* RadCaptcha */
.rcRefreshImage:focus-visible {
    outline: 2px solid var(--primary-dark2);
}

/* RadToolTip */
.RadToolTip {
    z-index: 10000;
}

/* helpLink */
.helpLink {
    color: var(--primary);
    margin-left: 7px;
    display: none;
}

/* SelezionaProfilo specific */
#txtRagSoc {
    font-weight: 700;
}

/* #forgotPassword style */
#forgotPassword,
.right-panel #forgotPassword {
    color: var(--primary-dark2);
    display: block;
    text-align: center;
    word-wrap: break-word;
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
    font-size: 14px;
    text-decoration: none;
    margin-top: 1rem;
}

/* countdown timer */
#countdown {
    text-align: center;
}

/* testo1rosso class */
.testo1rosso {
    color: var(--invalid-color);
}

/* ---- Message Container (PreLogin/SelezionaProfilo) ---- */
#message-container {
    text-align: center;
    z-index: 1;
}

#message-container .message-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--primary-dark);
    margin: 10px 0;
}

#message-container .message-paragraph {
    font-size: 16px;
    color: var(--text-black);
    margin: 0;
}

/* ---- Manutenzione ---- */
.manutenzione .right-panel {
    text-align: center;
    align-items: center;
}

.manutenzione .message-title {
    font-size: 24px;
    font-weight: 700;
    color: #3D3C3C;
    margin: 10px 0;
    line-height: 1.3;
}

.manutenzione .message-paragraph {
    font-size: 16px;
    color: #3D3C3C;
    margin: 0;
    font-weight: 400;
    line-height: 1.5;
}

/* Breadcrumb box */
.breadcrumbbox {
    padding: 10px 0px !important;
}

.selectedBreadcrumb,
.unselectedBreadcrumb {
    width: 100%;
}

/* Copyright (hidden — now using legal-links inside right-panel) */
.copyright {
    display: none;
}

.copyrightPortrait,
.copyrightLandscape {
    display: none;
}

/* login-wrapper-inner (Registrazione panel wrapper) */
.login-wrapper-inner {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
}

.login-wrapper-inner.login-wrapper-no-padding {
    padding: 0;
}

.btnEsci {
    font-size: 1.1rem;
    text-decoration: none;
    color: var(--primary-dark2);
}

/* =====================
   Responsive (Mobile)
   ===================== */
@media screen and (max-width: 768px) {
    .login-box {
        flex-direction: column;
        height: 720px;
        max-height: calc(100vh - 40px);
        padding: 24px;
        width: 90%;
        max-width: 912px;
        gap: 23px;
        overflow-y: auto;
        scrollbar-color: var(--background-disabled) transparent;
        scrollbar-width: thin;
    }

    .left-panel {
        border-right: none;
        border-bottom: 1px solid var(--primary);
        padding: 16px;
        flex: 1;
    }

    /*.logo {
        width: 180px;
    }*/

    .slogan {
        font-size: 14px;
        margin-top: 12px;
    }

    .right-panel h1,
    .right-panel h1#hh {
        font-size: 24px;
    }

    .btn-back-portrait {
        display: flex;
    }

    .btn-back-landscape {
        display: none;
    }

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

    .localiBox {
        height: 160px;
    }

    .legal-links {
        flex-direction: column;
        align-items: center;
    }

    .legal-links span {
        display: none;
    }
}

@media (max-width: 576px) {
    .legal-links a {
        font-size: 11px;
    }

    .login-box {
        height: 720px;
        overflow-y: auto;
        scrollbar-color: var(--background-disabled) transparent;
        scrollbar-width: thin;
    }

    .slogan {
        max-width: 100%;
    }

    .right-panel {
        padding: 0;
        overflow-y: unset;
    }
}

@media (max-height: 680px) {
    .login-box {
        height: 580px;
        overflow-y: auto;
        scrollbar-color: var(--background-disabled) transparent;
        scrollbar-width: thin;
    }

    .left-panel {
        justify-content: center;
        padding: 0;
    }
}

@media screen and (max-width: 768px) and (max-height: 680px) {
    .right-panel {
        padding: 0;
        overflow-y: unset;
    }
}

@media screen and (max-width: 480px) and (min-width: 769px) {
    .login-box {
        display: flex;
        flex-direction: row;
        overflow-y: auto;
        scrollbar-color: var(--background-disabled) transparent;
        scrollbar-width: thin;
    }

    .left-panel {
        border-bottom: none;
    }

    /*.logo {
        width: 140px;
    }*/

    .right-panel {
        font-size: 15px;
        gap: 8px;
        overflow-y: hidden;
    }

        .right-panel h1,
        .right-panel h1#hh {
            font-size: 14px;
            margin-bottom: unset;
        }
}