/* -------------------------------------------------------------------------- */
/*                 Theme override css rules                                   */
/* -------------------------------------------------------------------------- */
:root {
    --form-panel-header-line-color: var(--white);
    --form-fieldset-header-line-color: var(--white);
}

div.content {
    /*max-width: 1280px;*/
    margin:auto;
}
table th a {
    text-decoration: none
}
table th a:hover {
    text-decoration: none
}
select.placeholder-text,
select option[value=""] {
    color: #aaa;
}
select option {
    color: #222;
}
.help-cursor {
    cursor: help;
}
.invalid-feedback {
    font-size: 85%;
}
.bg-warning-tenuous {
    background-color: #fffaf3;
}
.bg-danger-tenuous {
    background-color: #fdeded;
}
.text-right {
    text-align: right;
}
.text-left {
    text-align: left;
}
.is-invalid .invalid-feedback {
    color: red;
    display: block;
    font-size: 85%;
    margin-top: 0px;
    padding-top: 2px;
}
.required-asterisk:after,
.required > label:after {
    content:" *";
    color: red;
}
.login .required-asterisk:after,
.login .required > label:after {
    content:none;
    color: white;
}
.image.medium {
    width: 300px;
    height: auto;
    font-size: 1rem;
}

/* Image styles - replacing legacy Semantic UI classes */
.small.image, .small.images .image, .small.images img, .small.images svg {
    width: 150px;
    height: auto;
    font-size: .92857143rem;
}

img.image {
    display: block;
}

.image {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    max-width: 100%;
    background-color: transparent;
}

/* Thumbnail image styling */
.thumbnail {
    width: 150px;
    height: auto;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 4px;
    background-color: #fff;
}

.thumbnail:hover {
    box-shadow: 0 0 8px rgba(0,0,0,0.1);
}
/* -------------------------------------------------------------------------- */
/*                 App rules                                                  */
/* -------------------------------------------------------------------------- */
.page-actions a {
    margin-left: 4px;
}
.icon-actions a.icon-link {
    margin-left: 4px;
    margin-right: 4px;
}
.icon-actions {
    text-align: right;
}
div.month-buttons a,
div.month-buttons span {
    margin-right: 2px;
    margin-bottom: 2px;
}
.table-bordered tr > td:first-child,
.table-bordered tr > td:last-child,
.table-striped tr > td:first-child,
.table-striped tr > td:last-child,
.table-bordered tr > th:first-child,
.table-bordered tr > th:last-child {
    padding-left: .25rem !important;
    padding-right: .25rem !important;
}
.borderless {
    border: none !important;
}
th.actions {
    width: 150px;
}

tr.positive td,
td.positive {
    box-shadow: 0 0 0 #a3c293 inset;
    background: #fcfff5;
    color: #2c662d;
}
tr.negative td,
td.negative {
    background: #fff6f6;
    color: #9f3a38;
}
form h5 {
    padding-bottom: 4px;
    border-bottom: 1px solid rgba(34, 36, 38, .15);
}

/* Default view page */
.crud-view .dl-horizontal dt {
    float: left;
    width: 160px;
    clear: left;
    text-align: right;
    text-overflow: ellipsis;
}
.crud-view .dl-horizontal dd {
    margin-bottom: .5rem;
    margin-left: 180px;
}
.many-to-many div.table-responsive {
    max-width: 100%;
    overflow-x: scroll;
}
.crud-view .card-header h3 {
    font-size: 16px;
}
.crud-view .card-header .btn-group-sm > .btn {
    padding: .1rem .25rem;
}
.crud-view .card-header {
    padding: .75rem 1rem;
    background-color: rgb(245, 247, 250);
}

.crud-view .field-fieldset-clean .card-header h3 {
    font-size: 14px;
}
.crud-view .field-fieldset-clean .card-header {
    padding: 0;
    background-color: transparent;
}

.crud-view .field-fieldset-clean .card-header {
    border-bottom: none;
}

.row > .form-switch {
    padding-left: 2.5em;
}

.ui.statistic > .value,
.ui.statistics .statistic > .value,
.ui.statistics .statistic > .label {
    font-family: Lato, system-ui, -apple-system, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-size: 1em;
    font-weight: 700;
    color: rgba(0, 0, 0, .87);
    text-transform: uppercase;
    text-align: center;
}

.ui.tiny.statistics .statistic > .value {
    font-size: 1.5rem;
}

.ui.statistics .olive.statistic > div.value {
    color: #b5cc18;
}
.ui.statistics .orange.statistic > .value {
    color: #f2711c;
}

.ui.statistics .teal.statistic > .value, .ui.teal.statistic > .value,
.ui.teal.statistics .statistic > .value {
    color: #00b5ad;
}
.ui.statistics .grey.statistic > .value {
    color: #767676;
}

.table tr.negative {
    box-shadow: 0 0 0 #e0b4b4 inset;
    background: #fff6f6;
    color: #9f3a38;
}
@media print {
    .content {
        padding: 0 !important;
    }
}
table.table-smaller, table {
    font-size: 0.95rem;
}
body.print {
    background-color: #ffffff;
    font-size: 0.8rem;
}
hr.color-black {
    color: black;
}
.is-disabled {
    pointer-events: none;
    color: currentColor;
    cursor: not-allowed;
    opacity: 0.5;
    text-decoration: none;
}
.steps-container {
    width: 100%;
}
.steps {
    display: inline-flex;
    flex-direction: row;
    align-items: stretch;
    margin: 1em 0;
    box-shadow: none;
    line-height: 1.14285714em;
    border-radius: .28571429rem;
    border: 1px solid rgba(34, 36, 38, .15);
}
.steps .step {
    position: relative;
    display: flex;
    flex: 1 0 auto;
    flex-flow: row wrap;
    vertical-align: middle;
    align-items: center;
    justify-content: center;
    margin: 0 0;
    padding: 1.14285714em 2em;
    background: #fff;
    color: rgba(0, 0, 0, .87);
    box-shadow: none;
    border-radius: 0;
    border: none;
    border-right: 1px solid rgba(34, 36, 38, .15);
    transition: background-color .1s ease, opacity .1s ease, color .1s ease, box-shadow .1s ease;
}
.steps .step.active {
    cursor: auto;
    background: #c7ebff;
}
.steps .step:first-child {
    padding-left: 2em;
    border-radius: .28571429rem 0 0 .28571429rem;
}
.steps .step > .step-icon {
    line-height: 1;
    font-size: 2.5em;
    margin: 0 1rem 0 0;
}
.steps .step .step-title {
    font-size: 1.14285714em;
    font-weight: 700;
    margin-bottom: 4px;
}
.steps .active.step::after {
    display: block;
}
.steps .step.active::after {
    background: #c7ebff;
}
.steps .step::after {
    display: block;
}
.steps .step::after {
    display: none;
    position: absolute;
    z-index: 2;
    content: "";
    top: 50%;
    right: 0;
    background-color: #fff;
    width: 1.14285714em;
    height: 1.14285714em;
    border-style: solid;
    border-color: rgba(34, 36, 38, .15);
    border-width: 0 1px 1px 0;
    transition: background-color .1s ease, opacity .1s ease, color .1s ease, box-shadow .1s ease;
    transform: translateY(-50%) translateX(50%) rotate(-45deg);
}

.stats .count a {
    color: var(--phoenix-heading-color);
    text-decoration: underline;
}
/*input:read-only, input:read-only:focus{*/
/*    background: #f5f5f5;*/
/*    border: var(--phoenix-border-width) solid var(--phoenix-border-color);*/
/*    -webkit-box-shadow: none;*/
/*    cursor: default;*/
/*}*/

.coordinadores .coordinador-nombres a,
.simposios .simposios-nombres a.constancia-icon {
    margin-left: 20px;
}
span.certificado-identifier,
span.certificado-vigencia,
span.certificado-warning {
    margin-left: 8px;
}
.programa .icon-cell svg {
    margin-right: 12px;
}
.programa td .btn-group a.btn {
    margin-right: 4px;
    padding-right: 10px;
    padding-left: 10px;
}
table.invitaciones a.btn {
    margin: 4px 0;
}

[data-bs-toggle="tooltip"] a {
    pointer-events: initial !important;
}


.card .form-fieldset-header {
    margin-top: 20px;
}

.form-fieldset-header {
    padding-bottom: 0;
}

.form-fieldset-header .form-fieldset-title .form-fieldset-title-content,
.form-panel-header .form-panel-title .form-panel-title-content,
.form-panel-header .form-panel-title .form-panel-icon{
    color: #202b69 !important
}

.card-header {
    border-bottom: #202b69 solid;
    color: #202b69
}

.text-primary {
    color: #202b69 !important;
}

.crud-view .card-header {
    padding-bottom: 5px !important;
    margin-bottom: 15px;
}
.view-card .header-actions a {
    margin-left:6px;
}
.simple-modal h2 {
    font-size: 20px !important;
}
.simple-modal .modal-dialog {
    max-width: 760px !important;
}
svg[data-bs-toggle="modal"] {
    cursor: pointer !important;
}
div.p-styles {
    margin-top: 0;
    margin-bottom: 1rem;
}

a {
    color: #001E71;
}

a:hover {
    color: #1e70bf;
    text-decoration: none;
}
.only-print {
    display: none !important;
}
@media print {
    .no-print,
    .d-print-none {
        display: none !important;
    }
    .only-print {
        display: block !important;
    }

    .card-print-break {
        page-break-inside: avoid;
        border: 0;
    }

    h4 .text-body-tertiary {
        display: none !important;
    }

    * {
        color: #000 !important;
        background: transparent !important;
        box-shadow: none !important;
    }
}

/* Toggle Switch Styles */
.form-check input[type="checkbox"].toggle-switch {
    position: relative;
    width: 50px;
    height: 26px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: #ccc;
    border-radius: 13px;
    outline: none;
    cursor: pointer;
    transition: background-color 0.3s ease;
    border: none;
    margin: 0;
}

.form-check input[type="checkbox"].toggle-switch:before {
    content: '';
    position: absolute;
    top: 2px;
    left: 2px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background-color: white;
    transition: transform 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.form-check input[type="checkbox"].toggle-switch:checked {
    background-color: #007bff;
}

.form-check input[type="checkbox"].toggle-switch:checked:before {
    transform: translateX(24px);
}

.form-check input[type="checkbox"].toggle-switch:focus {
    box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
}

.form-check input[type="checkbox"].toggle-switch:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}
.form-check input[type="checkbox"].toggle-switch:checked {
    background-image: none;
}
.form-check:has(input.toggle-switch) {
    display: flex;
    align-items: center;
    gap: 8px;
}

.form-check:has(input.toggle-switch) .form-check-label {
    margin-bottom: 0;
    line-height: 26px;
}

.view-inline-details {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
}

.view-inline-details dt {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
    padding: 0.5rem 0.75rem;
    margin: 0;
    font-weight: 600;
}

.view-inline-details dd {
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
    padding: 0.5rem 0.75rem;
    margin: 0;
}

.field-collection-delete-button {
    color: #fa3b1d !important;
}

.zpl-print-buttons div.select {
    display: inline-block;
    width: auto;
    margin-right: 10px;
}
.zpl-print-buttons #zpl-print-button {
    display: inline-block;
    width: auto;
}
#zpl-message-container,
#zpl-print-help {
    display: none;
    width: 100%;
    margin-top: 15px;
}
.especialidad-controls div.checkbox {
    width: 50%;
    display: inline-block;
}
.especialidad-controls div.checkbox .form-check-input {
    margin-top: 5px;
}
.especialidad-controls div.checkbox:nth-child(1) .form-check-label {
    color: #001E71;
    font-weight: bold;
}
.especialidad-controls div.checkbox:nth-child(1) {
    width: 70%;
}
.especialidad-controls div.checkbox:nth-child(2) {
    width: 30%;
}

.eventos-participantes .item-container td svg {
    font-size: 20px;
    margin-right: 10px;
}

@media (max-width: 575.98px) {
    .col-xs-12 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: 100% !important;
        max-width: 100% !important;
    }

    .col-xs-11 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: 91.66666667% !important;
        max-width: 91.66666667% !important;
    }

    .col-xs-10 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: 83.33333333% !important;
        max-width: 83.33333333% !important;
    }

    .col-xs-9 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: 75% !important;
        max-width: 75% !important;
    }

    .col-xs-8 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: 66.66666667% !important;
        max-width: 66.66666667% !important;
    }

    .col-xs-7 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: 58.33333333% !important;
        max-width: 58.33333333% !important;
    }

    .col-xs-6 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: 50% !important;
        max-width: 50% !important;
    }

    .col-xs-5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: 41.66666667% !important;
        max-width: 41.66666667% !important;
    }

    .col-xs-4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: 33.33333333% !important;
        max-width: 33.33333333% !important;
    }

    .col-xs-3 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: 25% !important;
        max-width: 25% !important;
    }

    .col-xs-2 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: 16.66666667% !important;
        max-width: 16.66666667% !important;
    }

    .col-xs-1 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: 8.33333333% !important;
        max-width: 8.33333333% !important;
    }

    .col-xs-auto {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: auto !important;
        max-width: none !important;
    }

    .field-row .row > [class*="col-"] {
        margin-bottom: 1rem;
    }

    .form-column {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    .col-xl-4, .col-lg-4, .col-md-6 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }
}
/* Responsive adjustments */
@media (max-width: 768px) {
    .view-inline-details dt {
        flex: 0 0 100%;
        max-width: 100%;
    }

    .view-inline-details dd {
        flex: 0 0 100%;
        max-width: 100%;
    }
}