.m-portlet__head-text {
   color: #000 !important;
}

.m-portlet .m-portlet__body {
   padding: 1.2rem 2.2rem;
}

.ic-form-group {
   padding-left: 50px;
}

.ic-small {
   font-size: 0.8em;
}

.ic-step-number {
   background: #000;
   color: #ffffff;
   font-size: 13px;
   display: inline-block;
   width: 20px;
   height: 20px;
   padding: 1px 6px 3px 6px;
   text-align: center;
   margin-left: -30px;
   margin-right: 10px;
   border-radius: 50% !important;
   -webkit-border-radius: 50% !important;
   -moz-border-radius: 50% !important;
}

.ic-color-ok {
   color: #26a69a !important;
}

.ic-color-error {
   color: #cb5a5e !important;
}

.has-error .form-control,
.has-error .note-editor {
   border-color: #cb5a5e !important;
   box-shadow: none;
}

input.has-error,
.required.has-error,
span.has-error {
   border: 1px solid #cb5a5e !important;
}

.is-invalid .form-control {
   border-color: #fd397a !important;
   box-shadow: none;
}

.is-invalid .note-editor {
   border-color: #fd397a !important;
   box-shadow: none;
}

.note-editor.has-error {
   border-color: #cb5a5e !important;
}

textarea.form-control.is-invalid {
   border-color: #fd397a !important;
}

input.is-invalid,
.required.is-invalid,
span.is-invalid {
   border: 1px solid #fd397a !important;
}

.is-invalid > .dropzone {
   border-color: #fd397a !important;
}

.form-group {
   margin-bottom: 1.5rem !important;
}

.italic {
   font-style: italic;
}

.select2-container {
   width: 100% !important;
}

.optionGroup {
   font-weight: bold;
   font-style: italic;
}

.optionChild1 {
   padding-left: 15px;
}

.optionGroup2 {
   font-weight: bold;
   font-style: italic;
   padding-left: 15px;
}

.optionChild2 {
   padding-left: 30px;
}

.optionChild3 {
   padding-left: 45px;
}

.optionChild4 {
   padding-left: 60px;
}

/*Boostrap table*/
.fixed-table-container tbody td .th-inner,
.fixed-table-container thead th .th-inner,
tr.table-total > td {
   background: #ddd;
}

tr.table-total > td {
   font-weight: bold;
   color: red;
}

/*Boostrap Table Fixed*/
.fixed-table-header-columns,
.fixed-table-body-columns {
   position: absolute;
   background-color: #fff;
   display: none;
   box-sizing: border-box;
   overflow: hidden;
}

.fixed-table-header-columns .table,
.fixed-table-body-columns .table {
   border-right: 1px solid #ddd;
}

.fixed-table-header-columns .table.table-no-bordered,
.fixed-table-body-columns .table.table-no-bordered {
   border-right: 1px solid transparent;
}

.fixed-table-body-columns table {
   position: absolute;
   animation: none;
}

.bootstrap-table .table-hover > tbody > tr.hover > td {
   background-color: #f5f5f5;
}

@media (min-width: 992px) {
   .modal-lg {
      max-width: 1000px;
   }
}

.modal-full {
   max-width: 1200px;
}

.advertencia-cant {
   font-weight: bold;
   color: red;
}

/***
Modify jquery-tags-input plugin css
***/
div.tagsinput {
   min-height: 35px;
   height: auto !important;
   margin: 0;
   padding: 0px;
   overflow: auto;
   border: 1px solid rgba(0, 0, 0, 0.15);
   border-radius: 0.25rem;
   transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

div.tagsinput span.tag {
   background: #aaa;
   color: #fff;
   border: 0;
}

div.tagsinput input {
   padding: 0px !important;
   width: 75px !important;
   margin: 0 !important;
}

div.tagsinput span.tag a {
   color: #fff;
}

div.tagsinput .not_valid {
   color: #fff;
   padding: 3px 6px;
   background-color: #e02222;
}

div.tagsinput.has-error {
   border-color: #e02222 !important;
}

.has-error > .m-dropzone.m-dropzone--primary {
   border-color: #e02222;
}

.my-dropzone .dz-preview .dz-image img {
   max-width: 100%;
   height: 120px;
}

.m-popover b {
   font-weight: 900;
}

.m-portlet__nav-item .select2-container {
   width: 200px !important;
}

.jstree-default .jstree-search {
   font-style: italic !important;
   color: #8b0000 !important;
   font-weight: bold !important;
}

/*social  inputs*/
.input-ican {
   background-color: #a2cc00 !important;
   border-color: #a2cc00 !important;
}

.input-ican i {
   color: #ffffff !important;
}

.input-facebook {
   background-color: #3b5998 !important;
   border-color: #3b5998 !important;
}

.input-facebook i {
   color: #ffffff !important;
}

.input-adn {
   background-color: #d87a68 !important;
   border-color: #d87a68 !important;
}

.input-adn i {
   color: #ffffff !important;
}

.input-youtube {
   background-color: #c7231a !important;
   border-color: #c7231a !important;
}

.input-youtube i {
   color: #ffffff !important;
}

.input-twitter {
   background-color: #309aea !important;
   border-color: #309aea !important;
}

.input-twitter i {
   color: #ffffff !important;
}

.input-flickr {
   background-color: #ff0084 !important;
   border-color: #ff0084 !important;
}

.input-flickr i {
   color: #ffffff !important;
}

.input-instagram {
   background-color: #335d7e !important;
   border-color: #335d7e !important;
}

.input-instagram i {
   color: #ffffff !important;
}

.input-linkedin {
   background-color: #005f8d !important;
   border-color: #005f8d !important;
}

.input-linkedin i {
   color: #ffffff !important;
}

.input-soundcloud {
   background-color: #d64700 !important;
   border-color: #d64700 !important;
}

.input-soundcloud i {
   color: #ffffff !important;
}

.input-tumblr {
   background-color: #1f3346 !important;
   border-color: #1f3346 !important;
}

.input-tumblr i {
   color: #ffffff !important;
}

.input-vimeo {
   background-color: #129cc9 !important;
   border-color: #129cc9 !important;
}

.input-vimeo i {
   color: #ffffff !important;
}

.input-google {
   background-color: #c7231a !important;
   border-color: #c7231a !important;
}

.input-google i {
   color: #ffffff !important;
}

/*recortar imagen*/
.img-container img {
   max-width: 100%;
}

.docs-preview {
   margin-right: -1rem;
}

.img-preview,
.img-preview-galeria,
.img-preview-hover,
.img-preview-editar,
.img-preview-cabecera,
.img-preview-movil {
   float: left;
   margin-bottom: 0.5rem;
   margin-right: 0.5rem;
   overflow: hidden;
}

.img-preview > img,
.img-preview-galeria > img,
.img-preview-hover > img,
.img-preview-editar > img,
.img-preview-cabecera > img,
.img-preview-movil > img {
   max-width: 100%;
}

.preview-lg {
   height: 9rem;
   width: 16rem;
}

.preview-md {
   height: 4.5rem;
   width: 8rem;
}

.preview-sm {
   height: 2.25rem;
   width: 4rem;
}

.preview-xs {
   height: 1.125rem;
   margin-right: 0;
   width: 2rem;
}

/** para imagenes transparantes*/
.croppie-container .cr-image {
   background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC') !important;
}

.fc-unthemed .fc-toolbar .fc-button {
   background: #2c3e50;
}

.fc-button-primary {
   color: #fff;
   background-color: #2c3e50;
   border-color: #2c3e50;
}

.m-datatable > .m-datatable__table > .m-datatable__head .m-datatable__row > .m-datatable__cell,
.m-datatable > .m-datatable__table > .m-datatable__foot .m-datatable__row > .m-datatable__cell {
   background: #2c3691;
}

.m-datatable > .m-datatable__table > .m-datatable__head .m-datatable__row > .m-datatable__cell > span,
.m-datatable > .m-datatable__table > .m-datatable__foot .m-datatable__row > .m-datatable__cell > span {
   color: #fff;
}

.dx-theme-generic-typography {
   background-color: #fff;
   color: #333;
   font-size: 13px;
   font-weight: 300;
   font-family: 'Poppins';
   line-height: 1.5;
}

@media (min-width: 768px) {
   .row.m-row--col-separator-dashed-md > div {
      border-bottom: 0;
      border-right: 2px dashed #ebedf2;
   }
}

.modal-footer {
   display: block;
   text-align: center;
}

/** hide calendar time */
.fc-unthemed .fc-event .fc-time,
.fc-unthemed .fc-event-dot .fc-time {
   display: none !important;
}

.m_form_search {
   background: #eaecf2;
   border-color: #eaecf2 !important;
}

.note-editor.note-frame .note-editing-area .note-editable {
   padding-top: 20px;
}

.bg-notificacioness-nuevas .m-nav__link-icon-wrapper {
   background: #dc3545;
   border: 1px solid #dc3545;
   transition: background 0.3s ease, box-shadow 0.3s ease;
}

.bg-notificacioness-nuevas .m-nav__link-icon-wrapper:hover,
.bg-notificacioness-nuevas .m-nav__link-icon-wrapper:focus,
.bg-notificacioness-nuevas .m-nav__link-icon-wrapper:active,
.bg-notificacioness-nuevas:hover .m-nav__link-icon-wrapper {
   background: #c82333 !important; /* Un tono más oscuro */
   border-color: #bd2130 !important;
   box-shadow: 0 0 10px rgba(220, 53, 69, 0.6) !important; /* Sombra sutil */
}

.bg-notificacioness-nuevas .m-nav__link-icon-wrapper > i {
   color: #ffffff !important;
}

.box-filters {
   border: 1px solid #ebedf2;
   padding: 10px;
   border-radius: 5px;
}

.box-filters label {
   font-weight: 500;
}

.hide {
   display: none !important;
}

.nav-tabs.nav-tabs-line.nav.nav-tabs .nav-link:hover,
.nav-tabs.nav-tabs-line.nav.nav-tabs .nav-link.active,
.nav-tabs.nav-tabs-line a.nav-link:hover,
.nav-tabs.nav-tabs-line a.nav-link.active {
   border-bottom: 1px solid #1b84ff;
   border-color: #ffffff;
}

.dtfc-fixed-start {
   background: #fff !important;
}

[data-bs-theme='dark'] .dtfc-fixed-start {
   background: #15171c !important;
}

.dtfc-fixed-end {
   background: #fff !important;
}

[data-bs-theme='dark'] .dtfc-fixed-end {
   background: #15171c !important;
}

.row-pending > td {
   background: #ffe1d1 !important;
}

.row-secondary > td {
   background: #e6f2ff !important;
}

.row-incorrect-vendor > td {
   background: #fffce6 !important;
}

.row-price-vendor > td {
   background: #ffe1d1 !important;
}

.row-change-order > td {
   border-left: 4px solid #ffc107 !important;
   background: #fff8e1 !important;
}

/* Asegurar que change-order tenga prioridad sobre secondary cuando ambas clases están presentes */
.row-change-order.row-secondary > td {
   border-left: 4px solid #ffc107 !important;
   background: #fff8e1 !important;
}

/* --- Dark mode: row highlights con tonos oscuros legibles --- */
[data-bs-theme='dark'] .row-group-header,
[data-bs-theme='dark'] .row-group-header > td {
   background-color: #252836 !important;
   color: #F5F5F5 !important;
}
[data-bs-theme='dark'] .row-pending > td {
   background: #4a2e1a !important;
   color: #f5d4ba !important;
}
[data-bs-theme='dark'] .row-secondary > td {
   background: #1a3050 !important;
   color: #b8d4f8 !important;
}
[data-bs-theme='dark'] .row-incorrect-vendor > td {
   background: #4a4520 !important;
   color: #f0e8a0 !important;
}
[data-bs-theme='dark'] .row-price-vendor > td {
   background: #4a2e1a !important;
   color: #f5d4ba !important;
}
[data-bs-theme='dark'] .row-change-order > td {
   border-left: 4px solid #ffc107 !important;
   background: #3d3318 !important;
   color: #ffe082 !important;
}
[data-bs-theme='dark'] .row-change-order.row-secondary > td {
   border-left: 4px solid #ffc107 !important;
   background: #3d3318 !important;
   color: #ffe082 !important;
}

table.table.dataTable.table-striped > tbody > tr:nth-of-type(2n + 1):not(.row-pending) > * {
   box-shadow: none;
}
table.table.dataTable.table-striped > tbody > tr:nth-of-type(2n + 1):not(.row-secondary) > * {
   box-shadow: none;
}
table.table.dataTable.table-striped > tbody > tr:nth-of-type(2n + 1):not(.row-change-order) > * {
   box-shadow: none;
}

.modal-content .ic-form-group {
   padding-left: 0px !important;
}
.modal-content .ic-step-number {
   margin-left: 0px !important;
}

/* Fiter menu */
#filter-menu {
   overflow: visible;
}
#filter-menu .input-group {
   position: relative;
}
.input-group .flatpickr-calendar {
   position: absolute;
   left: 0;
   z-index: 2050; /* por encima del dropdown */
   transform: none !important;
}
.input-group .flatpickr-calendar.arrowTop {
   top: 100%;
   bottom: auto;
   margin-top: 0.25rem;
}
.input-group .flatpickr-calendar.arrowBottom {
   bottom: calc(100% + 0.25rem);
   top: auto;
   margin-bottom: 0;
}
.date-picker-filter .flatpickr-wrapper {
   flex: 1 1 auto;
   width: 1%; /* mismo hack que usa bootstrap para inputs */
   min-width: 0;
   display: flex;
   align-items: center; /* alinear verticalmente el input */
   margin-bottom: 0; /* quita saltos raros */
}
.date-picker-filter .flatpickr-wrapper .form-control {
   flex: 1 1 auto;
   width: 100% !important;
   min-width: 0;
}

.modal-xl {
   max-width: 1500px;
}

/* =========================================
   Toggle con textos - Status (Active/Inactive)
   ========================================= */
.form-check-input.status-active-toggle {
   width: 120px !important;
   height: 30px !important;
   position: relative;
   overflow: visible !important;
}

/* Rojo / Inactive */
.form-check-input.status-active-toggle:not(:checked) {
   background-color: #f1416c !important; 
   border-color: #f1416c !important;
   background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ffffff'/%3e%3c/svg%3e") !important;
}
.form-check-input.status-active-toggle:not(:checked)::after {
   content: "Inactive";
   position: absolute;
   right: 8px;
   top: 50%;
   transform: translateY(-50%);
   color: white;
   font-weight: 700; 
   font-size: 11px;
   white-space: nowrap;
   z-index: 1;
   pointer-events: none;
}

/* Verde / Active */
.form-check-input.status-active-toggle:checked {
   background-color: #50cd89 !important; 
   border-color: #50cd89 !important;
}
.form-check-input.status-active-toggle:checked::after {
   content: "Active";
   position: absolute;
   left: 8px;
   top: 50%;
   transform: translateY(-50%);
   color: white;
   font-weight: 700; 
   font-size: 11px;
   white-space: nowrap;
   z-index: 1;
   pointer-events: none;
}

/* =========================================
   Toggle con textos - Tasks home widget (Pending/Complete), compacto para tabla
   ========================================= */
.form-check-input.status-task-toggle {
   width: 80px !important;
   min-width: 80px !important;
   height: 22px !important;
   position: relative;
   overflow: visible !important;
}

.form-check-input.status-task-toggle:not(:checked) {
   background-color: #f1416c !important;
   border-color: #f1416c !important;
   background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ffffff'/%3e%3c/svg%3e") !important;
}
/* Knob a la izquierda: etiqueta un poco separada del thumb (no pegada al borde del track) */
.form-check-input.status-task-toggle:not(:checked)::after {
   content: "Pending";
   position: absolute;
   left: 25px;
   right: auto;
   top: 50%;
   transform: translateY(-50%);
   color: white;
   font-weight: 600;
   font-size: 9px;
   letter-spacing: -0.03em;
   white-space: nowrap;
   z-index: 2;
   pointer-events: none;
}

.form-check-input.status-task-toggle:checked {
   background-color: #50cd89 !important;
   border-color: #50cd89 !important;
}
/* Knob a la derecha: misma lógica */
.form-check-input.status-task-toggle:checked::after {
   content: "Complete";
   position: absolute;
   right: 25px;
   left: auto;
   top: 50%;
   transform: translateY(-50%);
   color: white;
   font-weight: 600;
   font-size: 9px;
   letter-spacing: -0.03em;
   white-space: nowrap;
   z-index: 2;
   pointer-events: none;
}

/* =========================================
   Toggle con textos - Yes/No
   ========================================= */
.form-check-input.yesno-toggle {
   width: 90px !important;
   height: 30px !important;
   position: relative;
   overflow: visible !important;
}

/* Rojo / No */
.form-check-input.yesno-toggle:not(:checked) {
   background-color: #f1416c !important; 
   border-color: #f1416c !important;
   background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23ffffff'/%3e%3c/svg%3e") !important;
}
.form-check-input.yesno-toggle:not(:checked)::after {
   content: "No";
   position: absolute;
   right: 10px;
   top: 50%;
   transform: translateY(-50%);
   color: white;
   font-weight: 700; 
   font-size: 11px;
   white-space: nowrap;
   z-index: 1;
   pointer-events: none;
}

/* Verde / Yes */
.form-check-input.yesno-toggle:checked {
   background-color: #50cd89 !important; 
   border-color: #50cd89 !important;
}
.form-check-input.yesno-toggle:checked::after {
   content: "Yes";
   position: absolute;
   left: 10px;
   top: 50%;
   transform: translateY(-50%);
   color: white;
   font-weight: 700; 
   font-size: 11px;
   white-space: nowrap;
   z-index: 1;
   pointer-events: none;
}

/* Asegurar que los modales no se vean afectados por los toggles */
.modal-content {
   position: relative;
   z-index: auto;
   overflow: visible;
}

.modal-footer {
   position: relative;
   z-index: auto;
   background-color: var(--bs-modal-footer-bg, #fff) !important;
   opacity: 1 !important;
   overflow: visible;
}

.modal-backdrop {
   position: fixed;
   z-index: 1050;
   background-color: #000;
   opacity: 0.4;
}

/* Asegurar que el form-check contenga el ::after */
.form-check.form-switch {
   position: relative;
   overflow: visible;
}

.form-check-input.status-active-toggle::after,
.form-check-input.status-task-toggle::after,
.form-check-input.yesno-toggle::after {
   display: block;
   position: absolute;
   z-index: 1;
   pointer-events: none;
   line-height: 1;
}

/* Google PlaceAutocompleteElement: igualar a form-control-solid */
gmp-place-autocomplete {
   display: block !important;
   width: 100% !important;
   min-height: 38px;
   background-color: var(--bs-gray-100) !important;
   border: 1px solid var(--bs-gray-100) !important;
   border-radius: 0.475rem !important;
   color: var(--bs-body-color, #181c32) !important;
   font-family: inherit !important;
   font-size: 1rem !important;
   font-weight: 400 !important;
   line-height: 1.5 !important;
   color-scheme: light;
   box-shadow: none !important;
   outline: none !important;
}

gmp-place-autocomplete:focus-within {
   background-color: var(--bs-gray-200) !important;
   border-color: var(--bs-gray-200) !important;
}

/* Dentro de input-group: mismo estilo que .form-control en input-group-solid */
.input-group.input-group-solid .place-autocomplete-wrapper gmp-place-autocomplete {
   background-color: var(--bs-gray-100) !important;
   border-color: var(--bs-gray-100) !important;
   border-left: 1px solid var(--bs-gray-300) !important; /* divisor como .form-control */
   border-radius: 0 0.475rem 0.475rem 0 !important;
}

.input-group.input-group-solid .place-autocomplete-wrapper gmp-place-autocomplete:focus-within {
   background-color: var(--bs-gray-200) !important;
   border-color: var(--bs-gray-200) !important;
   border-left-color: var(--bs-gray-300) !important;
}

/* Fallback: input-group sin -solid (mantener unido al texto) */
.input-group:not(.input-group-solid) .place-autocomplete-wrapper gmp-place-autocomplete {
   border-left: none !important;
   border-radius: 0 0.475rem 0.475rem 0 !important;
}

/* Iconos más grandes en botones de formularios (toolbar del form y pies de modal) */
.card .card-toolbar .btn-icon i,
.card.card-sticky .card-toolbar .btn-icon i,
.modal-footer .btn-icon i {
   font-size: 1.5rem !important;
}

/* Texto truncado en DataTables: popover táctil (Invoices / Payments ítems) */
.dt-longtext-cell {
   cursor: pointer;
   max-width: 100%;
}

.dt-longtext-cell.dt-longtext--truncated .dt-longtext-label {
   border-bottom: 1px dotted var(--bs-gray-500);
}

.dt-longtext-cell .dt-longtext-more-icon {
   font-size: 0.95rem;
   color: var(--bs-primary);
   pointer-events: none;
}

.popover.dt-longtext-popover {
   max-width: min(90vw, 28rem);
}

.popover.dt-longtext-popover .popover-body {
   max-height: 12rem;
   overflow-y: auto;
   word-break: break-word;
   white-space: pre-wrap;
}

/* FileUploadUtil — staged attachment preview (no empty progress bar) */
.file-upload-dropzone.dropzone {
   padding: 0.75rem;
}
.file-upload-dropzone.dropzone.dz-started {
   display: flex;
   align-items: center;
   justify-content: center;
}
.file-upload-dropzone.dropzone.dz-started .dz-message {
   display: none;
}
.file-upload-dropzone .dz-preview {
   width: 100%;
   max-width: 420px;
   margin: 0;
   min-height: auto;
}
.file-upload-dropzone .dz-preview .dz-image,
.file-upload-dropzone .dz-preview .dz-progress,
.file-upload-dropzone .dz-preview .dz-success-mark,
.file-upload-dropzone .dz-preview .dz-error-mark {
   display: none !important;
}
.file-upload-dropzone .dz-preview .dz-error-message {
   margin-top: 0.5rem;
   color: var(--bs-danger);
   font-size: 0.85rem;
}
.file-upload-dropzone .dz-preview.dz-error .d-flex {
   border-color: var(--bs-danger) !important;
}