.p-inputtext {
    width: 100% !important;
    border-color: var(--secondary-color) !important;
}

.p-textarea {
    width: 100% !important;
    border-color: var(--secondary-color) !important;
    resize: none !important;
}

.p-button-outlined.p-button-success {
    border-color: rgb(124 156 0) !important;
    color: rgb(124 156 0) !important;
}

.p-inputtext:enabled:focus {
    border-color: var(--accent-color) !important;
    box-shadow: var(--p-inputtext-focus-ring-shadow);
    outline: var(--p-inputtext-focus-ring-width) var(--p-inputtext-focus-ring-style) var(--p-inputtext-focus-ring-color);
    outline-offset: var(--p-inputtext-focus-ring-offset);
}

.p-textarea:enabled:focus {
    border-color: var(--accent-color) !important;
    box-shadow: var(--p-inputtext-focus-ring-shadow) !important;
    outline: var(--p-inputtext-focus-ring-width) var(--p-inputtext-focus-ring-style) var(--p-inputtext-focus-ring-color);
    outline-offset: var(--p-inputtext-focus-ring-offset);
}

.p-floatlabel:has(input:focus) label,
.p-floatlabel:has(input:-webkit-autofill) label,
.p-floatlabel:has(textarea:focus) label,
.p-floatlabel:has(.p-inputwrapper-focus) label {
    color: var(--rojo-1) !important;
}

.p-floatlabel label {
    color: var(--rojo-principal-1) !important;
    border-radius: 13px !important;
    padding: 2px !important;
}

.p-button-link {
    color: var(--rojo-principal-1) !important;
}

.p-button,
.p-button:enabled,
.p-button:not(:disabled),
.p-button.p-dialog-close-button,
.swal2-confirm {
    background-color: var(--tertiary-color) !important;
    border-color: var(--secondary-color) !important;
    color: black !important;
}

.p-button:hover,
.p-button:enabled:hover,
.p-button:not(:disabled):hover,
.p-button.p-dialog-close-button:hover,
.swal2-confirm:hover {
    background-color: color-mix(in srgb, var(--tertiary-color) 90%, transparent) !important;
}

.p-button.button-secondary {
    background-color: white !important;
}

.p-button.button-secondary:hover {
    background-color: lightgray !important;
}

.p-button.p-dialog-close-button {
    background-color: transparent !important;
    border-color: transparent !important;
}

th[aria-sort="ascending"] {
    background: var(--gris-3) !important;
    color: black !important;
}

html.my-app-dark th[aria-sort="ascending"] {
    background: var(--negro-3) !important;
}

th[aria-sort="descending"] {
    background: var(--gris-3) !important;
    color: black !important;
}

html.my-app-dark th[aria-sort="descending"] {
    background: var(--negro-3) !important;
}

.p-datatable-thead>tr>th.p-datatable-column-sorted .p-datatable-sort-icon {
    color: black !important;
}

html.my-app-dark .p-datatable-thead>tr>th.p-datatable-column-sorted .p-datatable-sort-icon {
    color: white !important;
}

.tablaCatalogo {
    height: 340px !important;
    overflow-y: auto !important;
    width: 100% !important;
}

.p-floatlabel:has(input:focus) label,
.p-floatlabel:has(input:-webkit-autofill) label,
.p-floatlabel:has(textarea:focus) label,
.p-floatlabel:has(.p-inputwrapper-focus) label {
    color: var(--negro-3) !important;
}

.p-floatlabel label {
    color: var(--negro-3) !important;
    border-radius: 13px !important;
    font-weight: normal !important;
    font-size: small !important;
}

html.my-app-dark .p-floatlabel:has(input:focus) label,
html.my-app-dark .p-floatlabel:has(input:-webkit-autofill) label,
html.my-app-dark .p-floatlabel:has(textarea:focus) label,
html.my-app-dark .p-floatlabel:has(.p-inputwrapper-focus) label {
    color: var(--gris-1) !important;
    background-color: var(--negro-2) !important;
}

html.my-app-dark .p-floatlabel label {
    color: var(--gris-1) !important;
    border-radius: 13px !important;
    font-weight: normal !important;
    font-size: small !important;
}

.p-dialog-title {
    font-weight: normal !important;
}

.p-select {
    border-color: var(--secondary-color) !important;
}

.p-select:enabled:focus {
    border-color: var(--primaryxlight-color) !important;
    box-shadow: var(--p-inputtext-focus-ring-shadow);
    outline: var(--p-inputtext-focus-ring-width) var(--p-inputtext-focus-ring-style) var(--p-inputtext-focus-ring-color);
    outline-offset: var(--p-inputtext-focus-ring-offset);
}

.p-select-option.p-select-option-selected.p-focus {
    background: var(--primaryxlight-color) !important;
    color: var(--negro-1) !important;
}

.p-select-option.p-select-option-selected,
.p-select-option.p-select-option-selected.p-focus {
    background: var(--tertiary-color) !important;
    color: var(--negro-1) !important;
}

.p-select-option:not(.p-select-option-selected):not(.p-disabled).p-focus {
    background: var(--primaryxlight-color) !important;
    color: var(--negro-1) !important;
}

.p-button-label {
    font-weight: normal !important;
}

/* Tooltips - Tema claro (negro con letras blancas) */
html:not(.my-app-dark) .p-tooltip .p-tooltip-text {
    background-color: #000000 !important;
    color: #ffffff !important;
}

html:not(.my-app-dark) .p-tooltip.p-tooltip-top .p-tooltip-arrow {
    border-top-color: #000000 !important;
}

html:not(.my-app-dark) .p-tooltip.p-tooltip-bottom .p-tooltip-arrow {
    border-bottom-color: #000000 !important;
}

html:not(.my-app-dark) .p-tooltip.p-tooltip-left .p-tooltip-arrow {
    border-left-color: #000000 !important;
}

html:not(.my-app-dark) .p-tooltip.p-tooltip-right .p-tooltip-arrow {
    border-right-color: #000000 !important;
}

/* Tooltips - Tema oscuro (blanco con letras negras) */
html.my-app-dark .p-tooltip .p-tooltip-text {
    background-color: #ffffff !important;
    color: #000000 !important;
}

html.my-app-dark .p-tooltip.p-tooltip-top .p-tooltip-arrow {
    border-top-color: #ffffff !important;
}

html.my-app-dark .p-tooltip.p-tooltip-bottom .p-tooltip-arrow {
    border-bottom-color: #ffffff !important;
}

html.my-app-dark .p-tooltip.p-tooltip-left .p-tooltip-arrow {
    border-left-color: #ffffff !important;
}

html.my-app-dark .p-tooltip.p-tooltip-right .p-tooltip-arrow {
    border-right-color: #ffffff !important;
}

.table-container {
    width: 100% !important;
    overflow-x: auto !important;
}

.toolbar-responsive {
    flex-shrink: 0 !important;
}

.toolbar-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.p-card-body {
    padding: 5px !important;

}

.p-picklist-list-container {
    height: 400px !important;
}

.p-listbox-option.p-listbox-option-selected {
    color: var(--rosa-1) !important;
}

.p-togglebutton.p-togglebutton-checked {
    background: var(--tertiary-color) !important;
    color: black !important;
    border-color: var(--secondary-color) !important;
}

.p-select:not(.p-disabled).p-focus {
    box-shadow: var(--p-inputtext-focus-ring-shadow-trk) !important;
}

.p-inputtext:enabled:focus {
    box-shadow: var(--p-inputtext-focus-ring-shadow-trk) !important;
}

.p-datepicker-today>.p-datepicker-day-selected {
    background: var(--rosa-1) !important;
}

.p-datepicker-day-selected-range {
    background: var(--rosa-3) !important;
    color: black !important;
}

.p-datepicker-month-selected {
    background: var(--rosa-1) !important;
}

.p-datepicker-day-selected {
    background: var(--rosa-1) !important;
    color: black !important;
}

.p-datepicker-year-selected {
    background: var(--rosa-1) !important;
    color: black !important;
}

.p-cascadeselect-list-container {
    max-height: 300px !important;
    overflow-y: auto !important;
}

.p-cascadeselect-option-list {
    max-height: 300px !important;
    overflow-y: auto !important;
}

.p-cascadeselect:not(.p-disabled):hover {
    border-color: var(--rosa-1) !important;
}

.p-cascadeselect:not(.p-disabled).p-focus {
    border-color: var(--rosa-2) !important;
    box-shadow: var(--rosa-3) !important;
    outline: var(--p-cascadeselect-focus-ring-width) var(--p-cascadeselect-focus-ring-style) var(--rosa-1) !important;
    outline-offset: var(--p-cascadeselect-focus-ring-offset) !important;
}


.p-button:focus-visible {
    box-shadow: var(--rojo-principal1) !important;
    outline: var(--p-button-focus-ring-width) var(--p-button-focus-ring-style) var(--rojo-principal1) !important;
    /* outline-offset: var(--p-button-focus-ring-offset); */
}

.p-cascadeselect-option-selected>.p-cascadeselect-option-content {
    background: var(--rosa-1) !important;
    color: black !important;
}

.p-cascadeselect-option:not(.p-cascadeselect-option-selected):not(.p-disabled):hover>.p-cascadeselect-option-content {
    background: var(--rosa-3) !important;
    color: black !important;
}

.p-cascadeselect-option-active>.p-cascadeselect-option-content {
    background: var(--rosa-3) !important;
    color: black !important;
}

.p-multiselect {
    border-color: var(--rosa-2) !important;
}

.p-multiselect:enabled:focus {
    border-color: var(--rosa-1) !important;
    box-shadow: var(--p-inputtext-focus-ring-shadow);
    outline: var(--p-inputtext-focus-ring-width) var(--p-inputtext-focus-ring-style) var(--p-inputtext-focus-ring-color);
    outline-offset: var(--p-inputtext-focus-ring-offset);
}

.p-multiselect-option.p-multiselect-option-selected.p-focus {
    background: var(--rosa-1) !important;
    color: var(--negro-1) !important;
}

.p-multiselect-option.p-multiselect-option-selected {
    background: var(--rosa-2) !important;
    color: var(--negro-1) !important;
}

.p-multiselect-option:not(.p-multiselect-option-selected):not(.p-disabled).p-focus {
    background: var(--rosa-3) !important;
    color: var(--negro-1) !important;
}

.speed {
    position: absolute !important;
    top: 0.3rem !important;
}
