/* Paridad visual Alta/Baja: variables, shell, tarjetas, Telerik Bootstrap, CTA y pie */

form#form1 {
    --alta-marco-margin: 1.25rem;
    --alta-marco-margin-top: 0.4rem;
    /* Color corporativo botones (Alta/Baja/Consulta) */
    --alta-btn-primary: #1E5F7D;
    --alta-accent: #0b5ed7;
    --alta-accent-soft: #e8f1fc;
    --alta-border: #e2e6ef;
    --alta-text: #1a2744;
    --alta-muted: #5c6578;
    /* Esquinas suaves, menos redondeadas que 10px (textos, rddl, pickers) */
    --alta-field-radius: 4px;
}

/* Fondo de página como Autenticacion.aspx */
body {
    margin: 0;
    background-color: #ffffff;
}

/* Listas .custom-list: mismo estilo que en Alta.aspx */
form#form1 ul.custom-list {
    margin: 0.35rem 0 0;
    padding-left: 0;
    list-style: none;
}

form#form1 ul.custom-list li {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    padding: 0.35rem 0;
    color: #334155;
    font-size: 0.92rem;
    line-height: 1.45;
}

form#form1 ul.custom-list li::before {
    content: "";
    width: 5px;
    height: 5px;
    margin-top: 0.45rem;
    border-radius: 999px;
    background: var(--alta-btn-primary);
    box-shadow: none;
    flex: 0 0 auto;
}

form#form1 ul.custom-list li > * {
    flex: 1;
    min-width: 0;
}

form#form1 .RadDropDownList,
form#form1 .RadDropDownList_Bootstrap {
    border-radius: var(--alta-field-radius);
}

form#form1 .RadDropDownList .rddlInner,
form#form1 .RadDropDownList_Bootstrap .rddlInner {
    border-radius: var(--alta-field-radius) !important;
    border-color: #d6dbe6 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}

form#form1 .RadDropDownList_Bootstrap.rddlFocused .rddlInner,
form#form1 .RadDropDownList_Bootstrap .rddlInner:focus-within,
form#form1 .RadDropDownList.rddlFocused .rddlInner,
form#form1 .RadDropDownList .rddlInner:focus-within {
    border-color: rgba(26, 95, 191, 0.55) !important;
    box-shadow: 0 0 0 3px rgba(26, 95, 191, 0.12) !important;
}

form#form1 .RadTextBox,
form#form1 .RadTextBox_Bootstrap,
form#form1 .RadInput,
form#form1 .RadInput_Bootstrap {
    border-radius: var(--alta-field-radius);
}

form#form1 .RadTextBox .riTextBox,
form#form1 .RadTextBox_Bootstrap .riTextBox,
form#form1 .RadTextBox textarea,
form#form1 .RadTextBox_Bootstrap textarea,
form#form1 .RadInput .riTextBox,
form#form1 .RadInput_Bootstrap .riTextBox,
form#form1 .RadInput textarea,
form#form1 .RadInput_Bootstrap textarea {
    border-radius: var(--alta-field-radius) !important;
    border-color: #d6dbe6 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}

form#form1 .RadInput.riFocused .riTextBox,
form#form1 .RadInput_Bootstrap.riFocused .riTextBox,
form#form1 .RadInput.riFocused textarea,
form#form1 .RadInput_Bootstrap.riFocused textarea,
form#form1 .RadTextBox .RadInput.riFocused .riTextBox,
form#form1 .RadTextBox_Bootstrap .RadInput_Bootstrap.riFocused .riTextBox,
form#form1 .RadTextBox .RadInput.riFocused textarea,
form#form1 .RadTextBox_Bootstrap .RadInput_Bootstrap.riFocused textarea,
form#form1 .RadInput .riTextBox:focus,
form#form1 .RadInput_Bootstrap .riTextBox:focus,
form#form1 .RadInput textarea:focus,
form#form1 .RadInput_Bootstrap textarea:focus,
form#form1 .RadTextBox .riTextBox:focus,
form#form1 .RadTextBox_Bootstrap .riTextBox:focus,
form#form1 .RadTextBox textarea:focus,
form#form1 .RadTextBox_Bootstrap textarea:focus {
    border-color: rgba(26, 95, 191, 0.55) !important;
    box-shadow: 0 0 0 3px rgba(26, 95, 191, 0.12) !important;
    outline: none !important;
}

/* RadDatePicker / RadTimePicker (mismo radio y borde que textos) */
form#form1 .RadPicker,
form#form1 .RadPicker_Bootstrap,
form#form1 .RadTimePicker,
form#form1 .RadTimePicker_Bootstrap {
    border-radius: var(--alta-field-radius);
}

form#form1 .RadPicker .riTextBox,
form#form1 .RadPicker_Bootstrap .riTextBox,
form#form1 .RadPicker .RadInput .riTextBox,
form#form1 .RadPicker_Bootstrap .RadInput_Bootstrap .riTextBox,
form#form1 .RadTimePicker .riTextBox,
form#form1 .RadTimePicker_Bootstrap .riTextBox,
form#form1 .RadTimePicker .RadInput .riTextBox,
form#form1 .RadTimePicker_Bootstrap .RadInput_Bootstrap .riTextBox {
    border-radius: var(--alta-field-radius) !important;
    border-color: #d6dbe6 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}

form#form1 .RadPicker .RadInput.riFocused .riTextBox,
form#form1 .RadPicker_Bootstrap .RadInput_Bootstrap.riFocused .riTextBox,
form#form1 .RadPicker .RadInput .riTextBox:focus,
form#form1 .RadTimePicker .RadInput.riFocused .riTextBox,
form#form1 .RadTimePicker_Bootstrap .RadInput_Bootstrap.riFocused .riTextBox,
form#form1 .RadTimePicker .RadInput .riTextBox:focus {
    border-color: rgba(26, 95, 191, 0.55) !important;
    box-shadow: 0 0 0 3px rgba(26, 95, 191, 0.12) !important;
    outline: none !important;
}

/* Controles HTML Bootstrap bajo el mismo formulario: mismo radio que Telerik */
form#form1 input.form-control:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
form#form1 select.form-control,
form#form1 textarea.form-control {
    border-radius: var(--alta-field-radius) !important;
}

form#form1 .panel-body {
    padding-bottom: 1rem;
}

form#form1 .alta-shell {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    box-sizing: border-box;
    margin: var(--alta-marco-margin-top) var(--alta-marco-margin) 1rem var(--alta-marco-margin);
    width: calc(100% - (2 * var(--alta-marco-margin)));
    max-width: calc(100% - (2 * var(--alta-marco-margin)));
}

/* Autenticación: marco compacto y centrado (no a todo el ancho de la ventana) */
form#form1 .alta-shell.alta-shell--auth-narrow {
    max-width: min(36rem, calc(100% - (2 * var(--alta-marco-margin))));
    margin-left: auto;
    margin-right: auto;
}

form#form1 .alta-shell--auth-narrow > .alta-intro.panel-body.alta-intro--slim {
    padding-top: 0.4rem !important;
    padding-bottom: 0.4rem !important;
}

form#form1 .pie > .alta-shell.alta-consejos-seccion {
    margin: 0;
    width: 100%;
    max-width: 100%;
}

form#form1 .alta-shell > .panel-heading {
    border: 1px solid rgba(226, 230, 239, 0.95) !important;
    border-radius: 12px 12px 0 0 !important;
    background: linear-gradient(180deg, #ffffff 0%, #f3f6fc 100%) !important;
    padding: 0.9rem 1.25rem !important;
}

form#form1 .alta-shell > .panel-heading .panel-title {
    margin: 0 !important;
    display: flex;
    align-items: center;
    gap: 0;
}

/* Cabeceras panel (con o sin .alta-shell): sin círculo ::before */
form#form1 .panel-heading .panel-title::before {
    content: none !important;
    display: none !important;
}

form#form1 .alta-consejos-seccion .panel-title::before {
    content: none !important;
    display: none !important;
}

form#form1 .alta-shell .Titulo {
    font-weight: 750;
    font-size: 1.15rem;
    letter-spacing: 0.01em;
    color: #0f172a;
}

form#form1 .alta-shell > .alta-intro.panel-body {
    border: 1px solid rgba(226, 230, 239, 0.95) !important;
    border-top: 0 !important;
    border-radius: 0 0 12px 12px !important;
    background: #fff !important;
    padding: 0.9rem 1.25rem 1rem !important;
}

form#form1 .alta-shell > .alta-intro .row1 {
    margin-bottom: 0.35rem;
}

form#form1 .alta-shell > .alta-intro #LblInicio,
form#form1 .alta-shell > .alta-intro .rlbText,
form#form1 .alta-shell > .alta-intro span {
    color: #334155;
}

form#form1 .ZonaInputDatos {
    box-sizing: border-box;
/*    margin: 0 var(--alta-marco-margin) 0 var(--alta-marco-margin);
    width: calc(100% - (2 * var(--alta-marco-margin)));
    max-width: calc(100% - (2 * var(--alta-marco-margin)));*/
}

/* ZonaInputDatos dentro del shell principal: un solo marco (laterales continuos) */
form#form1 .alta-shell--con-formulario > .alta-intro.panel-body {
    border-radius: 0 !important;
    border-bottom: 0 !important;
}

form#form1 .alta-shell--con-formulario > .ZonaInputDatos {
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0.35rem 1.25rem 1.15rem;
    border: 1px solid rgba(226, 230, 239, 0.95);
    border-top: 0;
    border-radius: 0 0 12px 12px;
    background: #fff;
    box-sizing: border-box;
}

form#form1 .alta-shell--con-formulario > .ZonaInputDatos .alta-card {
    border: 0;
    box-shadow: none;
    background: transparent;
    padding: 0.75rem 0 0;
    margin-bottom: 0;
}

form#form1 .alta-card {
    background: #fff;
    border: 1px solid #e8eaed;
    border-radius: 10px;
    padding: 1.1rem 1.25rem 1.2rem;
    margin-bottom: 1rem;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.045);
}

form#form1 .alta-card:last-child {
    margin-bottom: 0;
}

form#form1 .alta-card-pasos .row1 {
    display: grid;
    grid-template-columns: minmax(12rem, 15.5rem) minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.5rem 0.85rem;
    padding: 0.25rem 0;
}

form#form1 .alta-card-pasos .row1 .Pasos,
form#form1 .alta-card-pasos .row1 .PasosObligatorio {
    margin-bottom: 0 !important;
    font-weight: 650;
    font-size: 0.95rem;
    color: #1a2744;
}

form#form1 .alta-card-pasos .row1 .RadDropDownList,
form#form1 .alta-card-pasos .row1 .RadDropDownList_Bootstrap {
    width: 100% !important;
    min-width: 0;
}

form#form1 .alta-card-pasos .row1 .RadCheckBox,
form#form1 .alta-card-pasos .row1 .RadCheckBox_Bootstrap {
    justify-self: end;
    margin-left: 0.25rem;
    color: #5c6578;
    font-size: 0.9rem;
}

@media (max-width: 767px) {
    form#form1 .alta-card-pasos .row1 {
        grid-template-columns: 1fr;
        align-items: start;
    }

    form#form1 .alta-card-pasos .row1 .RadCheckBox,
    form#form1 .alta-card-pasos .row1 .RadCheckBox_Bootstrap {
        justify-self: start;
        margin-top: 0.25rem;
    }
}

form#form1 .Pasos {
    font-weight: 600;
    font-size: 1.02rem;
    letter-spacing: 0.01em;
    color: #1a2744;
}

/* Avisos (ParrafoGrupo, texto servicio, notas en Baja/Consulta): callout informativo */
form#form1 .alta-nota-callout {
    box-sizing: border-box;
    margin: 0.65rem 0 0.55rem;
    border-radius: 10px;
    border: 0;
    border-left: 4px solid #2f5ea3;
    background-color: #e8f1ff;
    background-image: none;
    box-shadow: 0 1px 5px rgba(15, 23, 42, 0.055);
    overflow: hidden;
}

form#form1 .alta-nota-callout .Notas,
form#form1 .alta-nota-callout .RadLabel,
form#form1 .alta-nota-callout .RadLabel_Bootstrap {
    display: block !important;
    margin: 0 !important;
    padding: 0.75rem 1rem 0.85rem !important;
    font-size: 0.91rem !important;
    line-height: 1.55 !important;
    font-weight: 400 !important;
    color: #243047 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
}

form#form1 .alta-nota-callout .Notas:before {
    content: none !important;
}

form#form1 .alta-nota-callout b,
form#form1 .alta-nota-callout strong {
    color: #2f5ea3;
    font-weight: 650;
}

form#form1 .alta-nota-callout a {
    color: #2f5ea3 !important;
    font-weight: 600;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

form#form1 .alta-nota-callout a:hover {
    color: #163d52 !important;
}

form#form1 .alta-nota-callout ul {
    margin: 0.45rem 0 0;
    padding-left: 0;
    list-style: none;
}

form#form1 .alta-nota-callout ol {
    margin: 0.45rem 0 0;
    padding-left: 1.25rem;
    list-style: decimal;
    color: #243047;
    font-size: 0.91rem;
    line-height: 1.55;
}

form#form1 .alta-nota-callout ul li {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    padding: 0.32rem 0;
    margin: 0;
    font-size: 0.91rem;
    line-height: 1.55;
    color: #243047;
}

form#form1 .alta-nota-callout ul li::before {
    content: "";
    width: 5px;
    height: 5px;
    margin-top: 0.48rem;
    border-radius: 999px;
    background: #2f5ea3;
    box-shadow: none;
    flex: 0 0 auto;
}

form#form1 .alta-nota-callout ul li > * {
    flex: 1;
    min-width: 0;
}

form#form1 .alta-nota-callout ol li {
    margin-bottom: 0.32rem;
}

/* Código de cita: ancho fijo, no ocupar toda la columna del grid */
form#form1 .baja-codigo-cita-wrap {
    justify-self: start;
    width: auto;
    max-width: 100%;
    box-sizing: border-box;
}

form#form1 .baja-codigo-cita-wrap .RadTextBox,
form#form1 .baja-codigo-cita-wrap .RadTextBox_Bootstrap,
form#form1 .baja-codigo-cita-wrap .RadInput,
form#form1 .baja-codigo-cita-wrap .riTextBox {
    width: 108px !important;
    max-width: 108px !important;
    box-sizing: border-box;
}

/* Autenticación: usuario / contraseña compactos (no a todo el ancho del grid) */
form#form1 .alta-auth-cred-wrap {
    justify-self: start;
    width: auto;
    max-width: 100%;
    box-sizing: border-box;
}

form#form1 .alta-auth-cred-wrap .RadTextBox,
form#form1 .alta-auth-cred-wrap .RadTextBox_Bootstrap,
form#form1 .alta-auth-cred-wrap .RadInput,
form#form1 .alta-auth-cred-wrap .riTextBox {
    width: 180px !important;
    max-width: 100% !important;
    box-sizing: border-box;
}

form#form1 .baja-dni-group {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    min-width: 0;
}

/* AutoReserva: fecha + hora en la misma fila del grid */
form#form1 .autoreserva-fecha-line {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.45rem 0.75rem;
    min-width: 0;
    justify-self: start;
}

form#form1 .autoreserva-fecha-line .RadLabel.autoreserva-sub,
form#form1 .autoreserva-sub {
    font-size: 0.88rem !important;
    font-weight: 600 !important;
    color: var(--alta-muted) !important;
    margin: 0 !important;
    width: auto !important;
    min-width: 2.5rem;
}

form#form1 .autoreserva-fecha-line .RadPicker,
form#form1 .autoreserva-fecha-line .RadPicker_Bootstrap,
form#form1 .autoreserva-fecha-line .RadTimePicker,
form#form1 .autoreserva-fecha-line .RadTimePicker_Bootstrap {
    flex: 0 0 auto;
}

/* Fila 3: Nombre + Apellido 1 + Apellido 2 en una línea */
form#form1 .baja-nombres-tres {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 0.65rem;
    width: 100%;
    min-width: 0;
    align-items: end;
}

form#form1 .baja-nombre-celda {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0.3rem;
    min-width: 0;
}

form#form1 .baja-etiq-campo,
form#form1 .baja-nombre-celda .baja-etiq-campo {
    font-size: 0.82rem !important;
    font-weight: 600 !important;
    color: var(--alta-muted) !important;
    margin: 0 !important;
}

form#form1 .baja-nombre-celda .RadTextBox,
form#form1 .baja-nombre-celda .RadTextBox_Bootstrap {
    width: 100% !important;
    max-width: 100%;
    box-sizing: border-box;
}

@media (max-width: 767px) {
    form#form1 .baja-nombres-tres {
        grid-template-columns: 1fr;
    }
}

/* Fila de acción: sin grid de tres columnas */
form#form1 .alta-card-pasos .row1.row1--cta {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 0.75rem;
    margin-top: 0.75rem;
    padding-top: 0.65rem;
    border-top: 1px solid #eef0f5;
}

form#form1 .alta-btn-cta {
    padding: 0.55rem 1.75rem !important;
    font-size: 1.05rem !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    margin-top: 0.35rem;
    min-width: 220px;
    text-align: center;
}

@media (max-width: 575px) {
    form#form1 .alta-btn-cta {
        width: 100%;
        min-width: 0;
    }
}

form#form1 .pie {
    margin-top: 1.5rem;
    box-sizing: border-box;
    margin-left: var(--alta-marco-margin);
    margin-right: var(--alta-marco-margin);
    width: calc(100% - (2 * var(--alta-marco-margin)));
    max-width: calc(100% - (2 * var(--alta-marco-margin)));
    background: transparent;
    border: 0;
    border-radius: 0;
    padding: 0;
    box-shadow: none;
}

/* Texto de pie alineado con Autenticacion.aspx (.auth-card-footer) */
form#form1 .pie > p {
    margin: 0;
    padding-top: 0.75rem;
    font-size: 0.8rem;
    line-height: 1.45;
    color: #64748b;
    text-align: center;
}

form#form1 .ZonaInputDatos .pie {
    margin: 1rem 0 0;
    max-width: 100%;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

/* Txandas: rejilla bajo los filtros */
form#form1 .txandas-datos-grid {
    margin-top: 0.85rem;
    padding-top: 0.75rem;
    border-top: 1px solid #eef0f5;
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    box-sizing: border-box;
}

/* --- RadGrid Metro + RadGridCustomClass (Consulta, Txandas, RecursosDiasSemana) --- */
form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass {
    border: 1px solid var(--alta-border) !important;
    border-radius: 10px !important;
    overflow: hidden;
    background: #fff !important;
    box-shadow: 0 1px 8px rgba(15, 23, 42, 0.07);
}

form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgHeader,
form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgHeader .rgGroupCol,
form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass th.rgResizeCol {
    background: linear-gradient(180deg, #f8fafc 0%, #e8f0fc 100%) !important;
    color: var(--alta-text) !important;
    border-color: var(--alta-border) !important;
    font-weight: 650;
}

form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgHeader a,
form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgHeader span {
    color: var(--alta-text) !important;
}

form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgRow > td,
form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgAltRow > td,
form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgEditRow > td,
form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgFooter > td {
    border-color: #e2e8f0 !important;
    color: var(--alta-text) !important;
    padding: 0.45rem 0.65rem !important;
}

form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgRow > td:not(.CitaPresencial):not(.CitaTelefonica):not(.CitaNoDisponible) {
    background-color: #fff !important;
}

form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgAltRow > td:not(.CitaPresencial):not(.CitaTelefonica):not(.CitaNoDisponible) {
    background-color: #f5f7fb !important;
}

form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgActiveRow > td,
form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgSelectedRow > td {
    background-color: rgba(11, 94, 215, 0.12) !important;
    color: var(--alta-text) !important;
}

form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgGroupHeader td {
    background: #eef2f7 !important;
    color: var(--alta-muted) !important;
    font-weight: 600;
    border-color: var(--alta-border) !important;
}

form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass table.rgMasterTable tr .rgGroupCol,
form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass table.rgMasterTable tr .rgExpandCol {
    background: linear-gradient(180deg, #f8fafc 0%, #e8f0fc 100%) !important;
    border-color: var(--alta-border) !important;
}

form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgCommandCell,
form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgCommandRow > td {
    background: #f1f4fa !important;
    border-color: var(--alta-border) !important;
}

form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgPager,
form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgPagerCell {
    background: #fafbfd !important;
    border-color: var(--alta-border) !important;
    color: var(--alta-muted) !important;
}

form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgInfoPart {
    color: var(--alta-muted) !important;
}

form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgNumPart a {
    border-radius: 6px !important;
    border: 1px solid transparent !important;
}

form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgNumPart a.rgCurrentPage {
    background: var(--alta-accent) !important;
    color: #fff !important;
    border-color: var(--alta-accent) !important;
}

form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgFilterRow > td {
    background: #fff !important;
}

form#form1 .RadGrid.RadGrid_Metro.RadGridCustomClass .rgDataDiv {
    border-color: var(--alta-border) !important;
}

/* Consulta: el grid puede ser más ancho que la ventana; el scroll queda en el bloque, no en toda la página */
form#form1 .consulta-grid-block {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

form#form1 .consulta-grid-block .RadGrid {
    max-width: none;
}

/* Consulta: RadGrid Bootstrap + EstiloGridAytoGetxo (misma línea visual que WebKontratuak / DatosTramitesWEB, eudala.getxo.eus) */
form#form1 .RadGrid.EstiloGridAytoGetxo {
    border: 1px solid #b8d4e8 !important;
    border-radius: 4px;
    overflow: hidden;
    background: #fff !important;
}

/* Fila de comandos (exportar, etc.): gris casi blanco */
form#form1 .RadGrid.EstiloGridAytoGetxo .rgCommandRow,
form#form1 .RadGrid.EstiloGridAytoGetxo .rgCommandRow > td,
form#form1 .RadGrid.EstiloGridAytoGetxo .rgCommandCell {
    background: #fafafa !important;
    background-color: #fafafa !important;
    color: #1a1a1a !important;
    border-color: #f0f0f0 #ececec #e6e6e6 !important;
}

form#form1 .RadGrid.EstiloGridAytoGetxo .rgCommandRow a,
form#form1 .RadGrid.EstiloGridAytoGetxo .rgCommandRow button,
form#form1 .RadGrid.EstiloGridAytoGetxo .rgCommandRow input {
    color: #1a1a1a !important;
}

/* Cabecera de columnas: azul plano #337ab7 (sin gradiente) */
form#form1 .RadGrid.EstiloGridAytoGetxo .rgHeaderDiv {
    background: #337ab7 !important;
    background-color: #337ab7 !important;
}

form#form1 .RadGrid.EstiloGridAytoGetxo .rgHeader,
form#form1 .RadGrid.EstiloGridAytoGetxo .rgHeader .rgGroupCol,
form#form1 .RadGrid.EstiloGridAytoGetxo th.rgResizeCol,
form#form1 .RadGrid.EstiloGridAytoGetxo .rgHeader > th,
form#form1 .RadGrid.EstiloGridAytoGetxo tr.rgHeader th {
    background: #337ab7 !important;
    background-color: #337ab7 !important;
    color: #fff !important;
    font-weight: 700 !important;
    font-size: 0.8rem !important;
    border-color: #2e6da4 #286090 #255a7a !important;
}

form#form1 .RadGrid.EstiloGridAytoGetxo .rgHeader a,
form#form1 .RadGrid.EstiloGridAytoGetxo .rgHeader span {
    color: #fff !important;
}

form#form1 .RadGrid.EstiloGridAytoGetxo .rgHeader img {
    opacity: 0.95;
    vertical-align: middle;
}

/* Cabecera de cada grupo (p. ej. Fecha: dd/MM/yyyy): gris neutro */
form#form1 .RadGrid.EstiloGridAytoGetxo tr.rgGroupHeader td,
form#form1 .RadGrid.EstiloGridAytoGetxo tr.rgGroupHeader th {
    background: #e8e8e8 !important;
    background-color: #e8e8e8 !important;
    color: #333 !important;
    font-weight: 600 !important;
    font-size: 0.9em !important;
    border-color: #dadada #d0d0d0 #c6c6c6 !important;
}

form#form1 .RadGrid.EstiloGridAytoGetxo tr.rgGroupHeader a {
    color: #333 !important;
}

form#form1 .RadGrid.EstiloGridAytoGetxo .rgRow > td {
    color: #337ab7 !important;
    font-size: 0.9em !important;
}

form#form1 .RadGrid.EstiloGridAytoGetxo .rgAltRow > td {
    background: #e8f1f8 !important;
    color: #337ab7 !important;
    font-size: 0.9em !important;
}

form#form1 .RadGrid.EstiloGridAytoGetxo .rgSelectedRow > td,
form#form1 .RadGrid.EstiloGridAytoGetxo .rgActiveRow > td {
    background-color: #f9f9ec !important;
    color: #286090 !important;
}

form#form1 .RadGrid.EstiloGridAytoGetxo .rgPager,
form#form1 .RadGrid.EstiloGridAytoGetxo .rgPagerCell {
    background: #f5fafc !important;
    border-color: #cfe0ea !important;
}

/* -------------------------------------------------------------------------- */
/* Telerik radalert / radconfirm / radprompt (RadWindow predeterminados)     */
/* Requiere :has() (navegadores actuales). Alineado con citas (marino, 4px). */
/* -------------------------------------------------------------------------- */

.RadWindow:has(.rwAlertDialog),
.RadWindow:has(.rwConfirmDialog),
.RadWindow:has(.rwPromptDialog) {
    padding: 0 !important;
    border: 1px solid #c5cad3 !important;
    border-radius: 4px !important;
    box-shadow: 0 10px 40px rgba(15, 23, 42, 0.2) !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    overflow: hidden !important;
    /* Ancho al contenido (mensajes cortos no dejan franja vacía), con tope */
    width: fit-content !important;
    max-width: min(92vw, 440px) !important;
    min-width: min(240px, 88vw) !important;
    /* Altura al contenido: evita franja vacía entre texto y botones */
    height: auto !important;
    max-height: 92vh !important;
    /* Más abajo que el borde superior (Telerik suele dejarlo en ~0px) */
    top: 14vh !important;
}

.RadWindow:has(.rwAlertDialog) table.rwTable,
.RadWindow:has(.rwConfirmDialog) table.rwTable,
.RadWindow:has(.rwPromptDialog) table.rwTable {
    width: auto !important;
    max-width: 100% !important;
    table-layout: auto !important;
}

.RadWindow:has(.rwAlertDialog) .rwTitleBar,
.RadWindow:has(.rwConfirmDialog) .rwTitleBar,
.RadWindow:has(.rwPromptDialog) .rwTitleBar {
    margin: 0 !important;
    background: linear-gradient(180deg, var(--alta-btn-primary) 0%, #16485e 100%) !important;
    border: none !important;
    border-bottom: 1px solid #152a45 !important;
    border-radius: 3px 3px 0 0 !important;
}

.RadWindow:has(.rwAlertDialog) .rwTitleWrapper,
.RadWindow:has(.rwConfirmDialog) .rwTitleWrapper,
.RadWindow:has(.rwPromptDialog) .rwTitleWrapper {
    padding: 0.55rem 2.5rem 0.55rem 0.65rem !important;
    height: auto !important;
    min-height: 2.25rem !important;
    line-height: 1.35 !important;
    overflow: visible !important;
}

.RadWindow:has(.rwAlertDialog) .rwTitle,
.RadWindow:has(.rwConfirmDialog) .rwTitle,
.RadWindow:has(.rwPromptDialog) .rwTitle {
    color: #fff !important;
    font-weight: 600 !important;
    /* Sin icono de ventana: la fuente WebComponents suele no cargar y se ve un cuadrado */
    padding-left: 0 !important;
    padding-right: 0.25rem !important;
    width: auto !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    text-overflow: clip !important;
}

/* Ocultar icono de ventana en barra de título (evita “cuadrado” si no hay WebComponentsIcons) */
.RadWindow:has(.rwAlertDialog) .rwIcon,
.RadWindow:has(.rwConfirmDialog) .rwIcon,
.RadWindow:has(.rwPromptDialog) .rwIcon {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    left: -9999px !important;
}

.RadWindow:has(.rwAlertDialog) .rwCommandButton,
.RadWindow:has(.rwConfirmDialog) .rwCommandButton,
.RadWindow:has(.rwPromptDialog) .rwCommandButton {
    color: #fff !important;
    border-color: transparent !important;
    opacity: 0.92;
}

.RadWindow:has(.rwAlertDialog) .rwCommandButton:hover,
.RadWindow:has(.rwConfirmDialog) .rwCommandButton:hover,
.RadWindow:has(.rwPromptDialog) .rwCommandButton:hover {
    opacity: 1;
    background-color: rgba(255, 255, 255, 0.12) !important;
}

.RadWindow:has(.rwAlertDialog) .rwContent,
.RadWindow:has(.rwConfirmDialog) .rwContent,
.RadWindow:has(.rwPromptDialog) .rwContent {
    border: none !important;
    padding: 0 !important;
    background: #fff !important;
}

.RadWindow:has(.rwAlertDialog) .rwDialog,
.RadWindow:has(.rwConfirmDialog) .rwDialog,
.RadWindow:has(.rwPromptDialog) .rwDialog {
    margin: 0.4rem 0.65rem 0 !important;
    padding: 0 0.35rem 0 0 !important;
    background-position: left 0.35rem center !important;
}

.RadWindow:has(.rwAlertDialog) .rwDialogContent,
.RadWindow:has(.rwConfirmDialog) .rwDialogContent,
.RadWindow:has(.rwPromptDialog) .rwDialogContent {
    color: #1a2744 !important;
    line-height: 1.5 !important;
    min-height: 0 !important;
    padding-bottom: 0 !important;
}

.RadWindow:has(.rwAlertDialog) .rwDialog:before,
.RadWindow:has(.rwConfirmDialog) .rwDialog:before {
    color: #b8860b !important;
    font-size: 28px !important;
    top: 0.85rem !important;
    left: 1rem !important;
}

.RadWindow:has(.rwPromptDialog) .rwDialog:before {
    color: #337ab7 !important;
}

.RadWindow:has(.rwPromptDialog) .rwPromptInput {
    border-radius: 4px !important;
    border-color: #d6dbe6 !important;
}

/* Pie del radalert: sin forzar position (comportamiento Telerik por defecto) */
.RadWindow:has(.rwAlertDialog) .rwDialogButtons,
.RadWindow:has(.rwConfirmDialog) .rwDialogButtons,
.RadWindow:has(.rwPromptDialog) .rwDialogButtons {
    /* position: relative !important; */
    /* left: auto !important; */
    /* right: auto !important; */
    /* bottom: auto !important; */
    margin-top: 0 !important;
    padding: 0.25rem 0.65rem 0.35rem !important;
    border-top: 1px solid #eef0f5 !important;
    background: #f8f9fb !important;
}

.RadWindow:has(.rwAlertDialog) .rwContentRow,
.RadWindow:has(.rwConfirmDialog) .rwContentRow,
.RadWindow:has(.rwPromptDialog) .rwContentRow,
.RadWindow:has(.rwAlertDialog) .rwContentRow > td,
.RadWindow:has(.rwConfirmDialog) .rwContentRow > td,
.RadWindow:has(.rwPromptDialog) .rwContentRow > td {
    height: auto !important;
    vertical-align: top !important;
}

.RadWindow:has(.rwAlertDialog) div.rwExternalContent,
.RadWindow:has(.rwConfirmDialog) div.rwExternalContent,
.RadWindow:has(.rwPromptDialog) div.rwExternalContent {
    padding-bottom: 0 !important;
}

.RadWindow:has(.rwAlertDialog) .rwDialogButtons button,
.RadWindow:has(.rwConfirmDialog) .rwDialogButtons button,
.RadWindow:has(.rwPromptDialog) .rwDialogButtons button {
    border-radius: 4px !important;
    border: 1px solid #1a3355 !important;
    background: linear-gradient(180deg, var(--alta-btn-primary) 0%, #16485e 100%) !important;
    color: #fff !important;
    font-weight: 600 !important;
    padding: 0.4rem 1.15rem !important;
    cursor: pointer !important;
    min-width: 4.25rem;
    box-shadow: 0 1px 3px rgba(15, 31, 58, 0.2);
}

.RadWindow:has(.rwAlertDialog) .rwDialogButtons button:hover,
.RadWindow:has(.rwConfirmDialog) .rwDialogButtons button:hover,
.RadWindow:has(.rwPromptDialog) .rwDialogButtons button:hover {
    filter: brightness(1.06);
}

/* Confirmar: segundo botón (Cancelar) secundario */
.RadWindow:has(.rwConfirmDialog) .rwDialogButtons button + button,
.RadWindow:has(.rwPromptDialog) .rwDialogButtons button + button {
    background: #fff !important;
    color: var(--alta-btn-primary) !important;
    border: 1px solid #cfd4dc !important;
    box-shadow: none;
    font-weight: 600 !important;
}

.RadWindow:has(.rwConfirmDialog) .rwDialogButtons button + button:hover,
.RadWindow:has(.rwPromptDialog) .rwDialogButtons button + button:hover {
    filter: none;
    background: #f1f3f7 !important;
    border-color: #b8c0cc !important;
}

/* ============================
   Migrado desde Alta.aspx (inline)
   ============================ */

/* Estilos para dispositivos móviles */
@media only screen and (max-width: 800px) {
    .ocultar {
        display: none !important;
    }
}

@media screen and (max-width: 767px) {
    .botones {
        margin-bottom: .5rem !important;
        margin-right: 0rem;
        margin-top: .5rem !important;
    }

    .botones1 {
        margin-bottom: 0.5rem !important;
        margin-top: 0.5rem !important;
        margin-right: 0rem;
    }
}

@media screen and (min-width: 500px) and (max-width: 767px) {
    .botones {
        margin-bottom: .5rem !important;
        margin-right: 0.5rem;
        margin-top: .5rem !important;
    }
}

@media screen and (min-width: 768px) and (max-width: 1005px) {
    .botones {
        margin-bottom: .5rem !important;
        margin-right: 0.5rem;
        margin-top: .5rem !important;
    }
}

.botones1 {
    margin-bottom: 0.5rem !important;
    margin-top: 0.5rem !important;
    margin-right: 0.5rem !important;
}

.no-padding-col {
    padding-right: 0px;
    padding-left: 0px;
}

.row2 {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -5px;
    margin-left: -5px;
}

.k-card-body {
    padding: 2px 6px !important;
}

.no-wrap {
    white-space: nowrap;
}

.ancho {
    width: 200px !important;
}

.rgHeader .rgGroupCol .rgHeaderOver {
    background-color: brown !important;
}

.rgHeader .rgGroupCol {
    background-color: brown !important;
}

/* Nota: en `Alta.aspx` el bloque inline se ha dejado comentado (ASP.NET comment)
   para desactivar su efecto mientras migramos. Si al probar falta algún estilo,
   seguimos migrando secciones adicionales del bloque. */
