/* /Components/Analytics/AnalyticsSectionCard.razor.rz.scp.css */
.analytics-card[b-cchcnpp9zp] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 1rem;
}

.analytics-card-header[b-cchcnpp9zp] {
    margin-bottom: .75rem;
}

.analytics-card-title[b-cchcnpp9zp] {
    margin: 0;
    font-size: .95rem;
    font-weight: 600;
    color: #0f172a;
}

.analytics-card-subtitle[b-cchcnpp9zp] {
    margin: .2rem 0 0;
    font-size: .75rem;
    color: #6b7280;
}
/* /Components/Calendar/OperationalManualEventModal.razor.rz.scp.css */
.manual-event-form[b-y9ggucjbb3] {
    display: grid;
    gap: .6rem;
}

.manual-event-form-group[b-y9ggucjbb3] {
    display: grid;
    gap: .25rem;
}

[b-y9ggucjbb3] .manual-event-form .k-datetimepicker,
[b-y9ggucjbb3] .manual-event-form .k-input,
[b-y9ggucjbb3] .manual-event-form .k-input-inner {
    width: 100%;
}

/* Asterisco de campo requerido */
.field-required-mark[b-y9ggucjbb3] {
    color: #dc2626;
    margin-left: 2px;
    font-weight: 700;
}

/* Borde rojo en inputs con error */
[b-y9ggucjbb3] .manual-event-form .input-error.k-textbox,
[b-y9ggucjbb3] .manual-event-form .input-error.k-picker,
[b-y9ggucjbb3] .manual-event-form .input-error.k-input,
[b-y9ggucjbb3] .manual-event-form .input-error.k-datetimepicker,
[b-y9ggucjbb3] .manual-event-form .input-error.k-dropdownlist {
    border-color: #dc2626 !important;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.12) !important;
}
/* /Components/Calendar/OperationalTaskDetailDrawer.razor.rz.scp.css */
.calendar-drawer-backdrop[b-qy0e8eulll] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, .34);
    backdrop-filter: blur(2px);
    z-index: 4300;
    animation: calendarDrawerBackdropIn-b-qy0e8eulll .2s ease-out both;
}

.calendar-drawer-backdrop.calendar-drawer-backdrop-closing[b-qy0e8eulll] {
    animation: calendarDrawerBackdropOut-b-qy0e8eulll .2s ease-in both;
}

.calendar-detail-drawer[b-qy0e8eulll] {
    position: fixed;
    top: 0;
    right: 0;
    width: min(392px, 100%);
    height: 100vh;
    background: #f8fafc;
    z-index: 4301;
    box-shadow: -12px 0 28px rgba(15, 23, 42, .22);
    display: flex;
    flex-direction: column;
    animation: calendarDrawerSlideIn-b-qy0e8eulll .26s cubic-bezier(.2, .85, .2, 1) both;
}

.calendar-detail-drawer.calendar-detail-drawer-closing[b-qy0e8eulll] {
    animation: calendarDrawerSlideOut-b-qy0e8eulll .22s cubic-bezier(.4, 0, .2, 1) both;
}

.drawer-top[b-qy0e8eulll] {
    display: flex;
    justify-content: space-between;
    gap: .6rem;
    background: #dbeafe;
    border-bottom: 1px solid #bfdbfe;
    padding: .9rem .9rem .7rem;
}

.drawer-top.drawer-top-status-inprogress[b-qy0e8eulll] {
    background: #dbeafe;
    border-bottom-color: #93c5fd;
}

.drawer-top.drawer-top-status-completed[b-qy0e8eulll] {
    background: #d1fae5;
    border-bottom-color: #86efac;
}

.drawer-top.drawer-top-status-delayed[b-qy0e8eulll] {
    background: #fee2e2;
    border-bottom-color: #fca5a5;
}

.drawer-top.drawer-top-status-planned[b-qy0e8eulll] {
    background: #e5e7eb;
    border-bottom-color: #cbd5e1;
}

.drawer-top-main[b-qy0e8eulll] {
    min-width: 0;
}

.drawer-order-row[b-qy0e8eulll] {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
    margin-bottom: .15rem;
}

.drawer-order-code[b-qy0e8eulll] {
    font-weight: 800;
    font-size: .98rem;
    color: #1d4ed8;
}

.drawer-top.drawer-top-status-completed .drawer-order-code[b-qy0e8eulll] {
    color: #047857;
}

.drawer-top.drawer-top-status-delayed .drawer-order-code[b-qy0e8eulll] {
    color: #b91c1c;
}

.drawer-top.drawer-top-status-planned .drawer-order-code[b-qy0e8eulll] {
    color: #374151;
}

.drawer-status-badge[b-qy0e8eulll] {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: .15rem .52rem;
    font-size: .66rem;
    font-weight: 700;
    border: 1px solid transparent;
}

.drawer-status-badge-inprogress[b-qy0e8eulll] {
    color: #1e40af;
    background: #dbeafe;
    border-color: #93c5fd;
}

.drawer-status-badge-completed[b-qy0e8eulll] {
    color: #047857;
    background: #d1fae5;
    border-color: #6ee7b7;
}

.drawer-status-badge-delayed[b-qy0e8eulll] {
    color: #b91c1c;
    background: #fee2e2;
    border-color: #fca5a5;
}

.drawer-status-badge-planned[b-qy0e8eulll] {
    color: #4b5563;
    background: #f3f4f6;
    border-color: #d1d5db;
}

.drawer-top-subtitle[b-qy0e8eulll] {
    font-size: .72rem;
    color: #64748b;
    font-weight: 600;
}

.drawer-top.drawer-top-status-completed .drawer-top-subtitle[b-qy0e8eulll] {
    color: #065f46;
}

.drawer-top.drawer-top-status-delayed .drawer-top-subtitle[b-qy0e8eulll] {
    color: #991b1b;
}

.drawer-top.drawer-top-status-planned .drawer-top-subtitle[b-qy0e8eulll] {
    color: #475569;
}

.drawer-close-button[b-qy0e8eulll] {
    align-self: flex-start;
}

[b-qy0e8eulll] .drawer-close-button .k-svg-icon {
    width: 14px;
    height: 14px;
}

.drawer-lock-note[b-qy0e8eulll] {
    margin: .6rem .9rem .75rem;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: .55rem .65rem;
    font-size: .72rem;
    color: #64748b;
}

.drawer-body[b-qy0e8eulll] {
    display: grid;
    gap: .75rem;
    padding: 0 .9rem .9rem;
    overflow-y: auto;
}

.drawer-schedule-card[b-qy0e8eulll] {
    border: 1px solid #d1d5db;
    background: #ffffff;
    border-radius: 12px;
    padding: .75rem;
}

.drawer-schedule-day[b-qy0e8eulll] {
    font-size: .84rem;
    font-weight: 700;
    color: #1f2937;
    text-transform: capitalize;
}

.drawer-schedule-time[b-qy0e8eulll] {
    display: flex;
    align-items: center;
    gap: .5rem;
    flex-wrap: wrap;
    margin-top: .15rem;
    font-size: .74rem;
    color: #6b7280;
    font-weight: 600;
}

.drawer-time-badge[b-qy0e8eulll] {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 1px 7px;
    font-size: .64rem;
    font-weight: 700;
    border: 1px solid transparent;
}

.drawer-time-badge-estimated[b-qy0e8eulll] {
    color: #1d4ed8;
    background: #eff6ff;
    border-color: #bfdbfe;
}

.drawer-time-badge-completed[b-qy0e8eulll] {
    color: #047857;
    background: #ecfdf5;
    border-color: #a7f3d0;
}

.drawer-section[b-qy0e8eulll] {
    display: grid;
    gap: .35rem;
}

.drawer-section-title[b-qy0e8eulll] {
    font-size: .78rem;
    font-weight: 700;
    color: #111827;
}

.drawer-info-card[b-qy0e8eulll] {
    display: flex;
    align-items: center;
    gap: .6rem;
    border: 1px solid #d1d5db;
    border-radius: 12px;
    background: #ffffff;
    padding: .6rem .65rem;
}

.drawer-avatar[b-qy0e8eulll] {
    width: 34px;
    height: 34px;
    border-radius: 999px;
    background: #e5e7eb;
    color: #4b5563;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .74rem;
    font-weight: 800;
}

.drawer-avatar-tech[b-qy0e8eulll] {
    background: #d1fae5;
    color: #047857;
}

.drawer-info-content[b-qy0e8eulll] {
    min-width: 0;
}

.drawer-info-title[b-qy0e8eulll] {
    font-size: .9rem;
    color: #1f2937;
    font-weight: 700;
    line-height: 1.2;
}

.drawer-info-subtitle[b-qy0e8eulll] {
    font-size: .74rem;
    color: #6b7280;
}

.drawer-service-card[b-qy0e8eulll] {
    border: 1px solid #d1d5db;
    border-radius: 12px;
    background: #ffffff;
    padding: .6rem .65rem;
}

.drawer-client-doc[b-qy0e8eulll] {
    margin-top: .2rem;
}

.badge-document[b-qy0e8eulll] {
    display: inline-block;
    background: #f1f5f9;
    color: #475569;
    font-size: .68rem;
    font-weight: 600;
    padding: 1px 6px;
    border-radius: 4px;
    border: 1px solid #e2e8f0;
}

.drawer-contact-pills[b-qy0e8eulll] {
    display: flex;
    flex-direction: column;
    gap: .3rem;
    margin-top: .2rem;
}

.drawer-contact-pill[b-qy0e8eulll] {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .35rem .65rem;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    font-size: .75rem;
    color: #334155;
    text-decoration: none;
    transition: all .15s ease;
}

.drawer-contact-pill:hover[b-qy0e8eulll] {
    background: #f8fafc;
    border-color: #cbd5e1;
    color: #1d4ed8;
}

.drawer-contact-pill[b-qy0e8eulll]  .k-svg-icon {
    width: 14px;
    height: 14px;
    color: #64748b;
}

.drawer-service-header[b-qy0e8eulll] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: .5rem;
    margin-bottom: .35rem;
}

.drawer-service-main[b-qy0e8eulll] {
    font-size: .84rem;
    color: #1f2937;
    font-weight: 700;
    min-width: 0;
}

.drawer-service-price[b-qy0e8eulll] {
    font-weight: 800;
    font-size: .78rem;
    color: #047857;
    background: #ecfdf5;
    padding: 2px 7px;
    border-radius: 6px;
    border: 1px solid #a7f3d0;
    white-space: nowrap;
}

.drawer-service-desc[b-qy0e8eulll] {
    font-size: .73rem;
    color: #64748b;
    margin-bottom: .45rem;
    line-height: 1.35;
}

.drawer-service-branch[b-qy0e8eulll] {
    border-top: 1px solid #e5e7eb;
    padding-top: .5rem;
    font-size: .74rem;
    color: #4b5563;
    display: flex;
    align-items: center;
    gap: .35rem;
}

.drawer-service-branch[b-qy0e8eulll]  .k-svg-icon {
    width: 13px;
    height: 13px;
    color: #94a3b8;
}

.drawer-order-details-card[b-qy0e8eulll] {
    border: 1px solid #d1d5db;
    border-radius: 12px;
    background: #ffffff;
    padding: .6rem .65rem;
    display: flex;
    flex-direction: column;
    gap: .45rem;
}

.drawer-order-detail-row[b-qy0e8eulll] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: .74rem;
}

.drawer-detail-label[b-qy0e8eulll] {
    color: #64748b;
    font-weight: 600;
}

.drawer-detail-value[b-qy0e8eulll] {
    color: #1e293b;
    font-weight: 700;
}

.drawer-tracking-code[b-qy0e8eulll] {
    font-family: var(--bs-font-monospace, monospace);
    color: #1d4ed8;
    background: #eff6ff;
    padding: 1px 6px;
    border-radius: 4px;
}

.drawer-order-notes[b-qy0e8eulll] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: .45rem .55rem;
    margin-top: .15rem;
}

.drawer-notes-label[b-qy0e8eulll] {
    font-weight: 700;
    font-size: .7rem;
    color: #475569;
    margin-bottom: .15rem;
}

.drawer-notes-text[b-qy0e8eulll] {
    font-size: .72rem;
    color: #334155;
    white-space: pre-wrap;
    line-height: 1.3;
}

.drawer-footer[b-qy0e8eulll] {
    margin-top: auto;
    padding: .75rem .9rem;
    border-top: 1px solid #e5e7eb;
    background: #f8fafc;
}

.drawer-open-order-button[b-qy0e8eulll] {
    width: 100%;
    border: 1px solid #d1d5db;
    background: #ffffff;
    color: #1f2937;
    border-radius: 9px;
    padding: .48rem .7rem;
    font-size: .8rem;
    font-weight: 700;
}

@keyframes calendarDrawerSlideIn-b-qy0e8eulll {
    from {
        opacity: 0;
        transform: translateX(20px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes calendarDrawerSlideOut-b-qy0e8eulll {
    from {
        opacity: 1;
        transform: translateX(0);
    }

    to {
        opacity: 0;
        transform: translateX(20px);
    }
}

@keyframes calendarDrawerBackdropIn-b-qy0e8eulll {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes calendarDrawerBackdropOut-b-qy0e8eulll {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

@media (max-width: 576px) {
    .calendar-detail-drawer[b-qy0e8eulll] {
        top: 12px;
        bottom: 12px;
        left: 12px;
        right: 12px;
        width: calc(100% - 24px);
        height: auto;
        max-height: calc(100dvh - 24px);
        border-radius: 16px;
        box-shadow: 0 16px 36px rgba(15, 23, 42, .32);
        overflow: hidden;
        animation: calendarDrawerMobileIn-b-qy0e8eulll .24s cubic-bezier(.2, .85, .2, 1) both;
    }

    .calendar-detail-drawer.calendar-detail-drawer-closing[b-qy0e8eulll] {
        animation: calendarDrawerMobileOut-b-qy0e8eulll .2s ease-in both;
    }

    .drawer-top[b-qy0e8eulll] {
        border-radius: 16px 16px 0 0;
    }

    .drawer-footer[b-qy0e8eulll] {
        border-radius: 0 0 16px 16px;
    }
}

@keyframes calendarDrawerMobileIn-b-qy0e8eulll {
    from {
        opacity: 0;
        transform: translateY(20px) scale(.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes calendarDrawerMobileOut-b-qy0e8eulll {
    from {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
    to {
        opacity: 0;
        transform: translateY(20px) scale(.98);
    }
}
/* /Components/Configuration/ConfigurationAppearanceTemp.razor.rz.scp.css */
.appearance-grid[b-9cpweis3hq] {
    display: grid;
    gap: 20px;
    margin: 20px 0;
}

.appearance-card[b-9cpweis3hq] {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 24px;
    display: flex;
    align-items: center;
    gap: 20px;
    transition: all 0.2s ease;
}

.appearance-card:hover[b-9cpweis3hq] {
    border-color: #d1d5db;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.appearance-header[b-9cpweis3hq] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex: 1;
}

.appearance-icon[b-9cpweis3hq] {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.appearance-icon.theme[b-9cpweis3hq] {
    background: linear-gradient(135deg, #6366f1 0%, #3b82f6 100%);
}

.appearance-icon.language[b-9cpweis3hq] {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
}

.appearance-icon.date[b-9cpweis3hq] {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
}

.appearance-icon.currency[b-9cpweis3hq] {
    background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%);
}

.appearance-emoji[b-9cpweis3hq] {
    font-size: 26px;
}

.appearance-info h4[b-9cpweis3hq] {
    margin: 0 0 6px 0;
    font-size: 17px;
    font-weight: 600;
    color: #111827;
}

.appearance-info p[b-9cpweis3hq] {
    margin: 0;
    color: #6b7280;
    font-size: 14px;
    line-height: 1.5;
}

.appearance-control[b-9cpweis3hq] {
    flex-shrink: 0;
    min-width: 180px;
}

.appearance-preview[b-9cpweis3hq] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 24px;
    margin-top: 32px;
}

.preview-header[b-9cpweis3hq] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    font-weight: 600;
    color: #374151;
    font-size: 16px;
}

.preview-header svg[b-9cpweis3hq] {
    width: 20px;
    height: 20px;
    color: #3b82f6;
}

.preview-content[b-9cpweis3hq] {
    padding: 20px;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.preview-content.light[b-9cpweis3hq] {
    background: white;
    color: #111827;
    border: 1px solid #e5e7eb;
}

.preview-content.dark[b-9cpweis3hq] {
    background: #1f2937;
    color: #f9fafb;
    border: 1px solid #374151;
}

.preview-content.system[b-9cpweis3hq] {
    background: linear-gradient(45deg, #f9fafb 50%, #1f2937 50%);
    color: #374151;
    border: 1px solid #9ca3af;
}

.preview-card[b-9cpweis3hq] {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    padding: 16px;
    backdrop-filter: blur(10px);
}

.preview-title[b-9cpweis3hq] {
    font-weight: 600;
    font-size: 16px;
    margin-bottom: 8px;
}

.preview-date[b-9cpweis3hq] {
    font-size: 14px;
    opacity: 0.8;
    margin-bottom: 4px;
}

.preview-amount[b-9cpweis3hq] {
    font-size: 18px;
    font-weight: 700;
    color: #10b981;
}

.appearance-summary[b-9cpweis3hq] {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 24px;
    margin-top: 24px;
}

.summary-header[b-9cpweis3hq] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    font-weight: 600;
    color: #374151;
    font-size: 16px;
}

.summary-header svg[b-9cpweis3hq] {
    width: 20px;
    height: 20px;
    color: #3b82f6;
}

.summary-grid[b-9cpweis3hq] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 16px;
}

.summary-item[b-9cpweis3hq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 16px;
    background: #f8fafc;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
}

.summary-label[b-9cpweis3hq] {
    font-weight: 500;
    color: #6b7280;
    font-size: 14px;
}

.summary-value[b-9cpweis3hq] {
    font-weight: 600;
    color: #111827;
    font-size: 14px;
}

@media (max-width: 768px) {
    .appearance-card[b-9cpweis3hq] {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }

    .appearance-control[b-9cpweis3hq] {
        align-self: stretch;
        min-width: unset;
    }

    .summary-grid[b-9cpweis3hq] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Configuration/ConfigurationNotificationsTemp.razor.rz.scp.css */
.notifications-grid[b-k9n5e8hijg] {
    display: grid;
    gap: 16px;
    margin: 20px 0;
}

.notification-card[b-k9n5e8hijg] {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 20px;
    transition: all 0.2s ease;
}

.notification-card:hover[b-k9n5e8hijg] {
    border-color: #d1d5db;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.notification-header[b-k9n5e8hijg] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex: 1;
}

.notification-icon[b-k9n5e8hijg] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.notification-icon.email[b-k9n5e8hijg] {
    background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
}

.notification-icon.push[b-k9n5e8hijg] {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
}

.notification-emoji[b-k9n5e8hijg] {
    font-size: 24px;
    color: white;
}

.notification-info h4[b-k9n5e8hijg] {
    margin: 0 0 4px 0;
    font-size: 16px;
    font-weight: 600;
    color: #111827;
}

.notification-info p[b-k9n5e8hijg] {
    margin: 0;
    color: #6b7280;
    font-size: 14px;
    line-height: 1.5;
}

.notification-control[b-k9n5e8hijg] {
    flex-shrink: 0;
}

.notification-summary[b-k9n5e8hijg] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 24px;
    margin-top: 32px;
}

.summary-header[b-k9n5e8hijg] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    font-weight: 600;
    color: #374151;
    font-size: 16px;
}

.summary-header svg[b-k9n5e8hijg] {
    width: 20px;
    height: 20px;
    color: #3b82f6;
}

.summary-stats[b-k9n5e8hijg] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 20px;
}

.stat-item[b-k9n5e8hijg] {
    text-align: center;
    padding: 16px;
    background: white;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
}

.stat-number[b-k9n5e8hijg] {
    display: block;
    font-size: 24px;
    font-weight: 700;
    color: #3b82f6;
    margin-bottom: 4px;
}

.stat-label[b-k9n5e8hijg] {
    font-size: 12px;
    color: #6b7280;
    text-transform: uppercase;
    font-weight: 500;
    letter-spacing: 0.5px;
}

@media (max-width: 768px) {
    .notification-card[b-k9n5e8hijg] {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }

    .notification-control[b-k9n5e8hijg] {
        align-self: stretch;
        display: flex;
        justify-content: center;
    }

    .summary-stats[b-k9n5e8hijg] {
        grid-template-columns: 1fr;
    }
}
/* /Components/Configuration/ConfigurationProfile.razor.rz.scp.css */
.perfil-container[b-f7d91ulgfy] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: 1000px;
    margin: 0 auto;
    padding: 8px 0;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

.perfil-card[b-f7d91ulgfy] {
    background: #fff;
    border-radius: 14px;
    border: none;
    padding: 28px 32px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    overflow: hidden;
}

.card-section-header[b-f7d91ulgfy] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 24px;
    padding-bottom: 18px;
    border-bottom: 1px solid #f3f4f6;
}

.section-icon[b-f7d91ulgfy] {
    font-size: 18px;
    margin-top: 2px;
    flex-shrink: 0;
}

.section-title[b-f7d91ulgfy] {
    font-size: 15px;
    font-weight: 600;
    color: #111827;
    line-height: 1.4;
}

.section-subtitle[b-f7d91ulgfy] {
    font-size: 13px;
    color: #6b7280;
    margin-top: 2px;
}

.avatar-row[b-f7d91ulgfy] {
    display: flex;
    align-items: center;
    gap: 20px;
}

.avatar-circle[b-f7d91ulgfy] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: #374151;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    overflow: hidden;
}

.avatar-img[b-f7d91ulgfy] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.avatar-initials[b-f7d91ulgfy] {
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.5px;
}

.avatar-actions[b-f7d91ulgfy] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.avatar-hint[b-f7d91ulgfy] {
    width: 100%;
    font-size: 12px;
    color: #9ca3af;
    margin-top: 4px;
}

.btn-cambiar-foto.k-button[b-f7d91ulgfy] {
    border: 1px solid #d1d5db !important;
    background: #fff !important;
    color: #374151 !important;
    font-size: 13px !important;
    padding: 6px 14px !important;
    border-radius: 7px !important;
    font-weight: 500 !important;
}

.btn-cambiar-foto.k-button:hover[b-f7d91ulgfy] {
    background: #f9fafb !important;
}

.btn-eliminar-foto.k-button[b-f7d91ulgfy] {
    color: #dc2626 !important;
    font-size: 13px !important;
    padding: 6px 4px !important;
    font-weight: 500 !important;
    background: transparent !important;
    border: none !important;
}

.btn-eliminar-foto.k-button:hover[b-f7d91ulgfy] {
    text-decoration: underline !important;
}


.field-label[b-f7d91ulgfy] {
    font-size: 13px;
    font-weight: 500;
    color: #374151;
    display: flex;
    align-items: center;
    gap: 5px;
}

.field-icon[b-f7d91ulgfy] {
    font-size: 14px;
}

.required[b-f7d91ulgfy] {
    color: #dc2626;
}

.field-input.k-textbox[b-f7d91ulgfy],
.field-input .k-input[b-f7d91ulgfy],
.field-input.k-dropdownlist[b-f7d91ulgfy] {
    width: 100% !important;
    border-radius: 8px !important;
    border: 1px solid #d1d5db !important;
    font-size: 14px !important;
    color: #111827 !important;
    background: #fff !important;
    height: 40px !important;
    padding: 0 12px !important;
}

.field-input.k-textbox:focus[b-f7d91ulgfy],
.field-input .k-input:focus-within[b-f7d91ulgfy] {
    border-color: #6366f1 !important;
    box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.1) !important;
    outline: none !important;
}

.field-disabled.k-textbox[b-f7d91ulgfy],
.field-disabled .k-input[b-f7d91ulgfy] {
    background: #f9fafb !important;
    color: #6b7280 !important;
    cursor: not-allowed !important;
}



.btn-cancelar.k-button[b-f7d91ulgfy] {
    border: 1px solid #d1d5db !important;
    background: #fff !important;
    color: #374151 !important;
    font-size: 14px !important;
    padding: 8px 20px !important;
    border-radius: 8px !important;
    font-weight: 500 !important;
    height: 38px !important;
}

.btn-cancelar.k-button:hover[b-f7d91ulgfy] {
    background: #f9fafb !important;
}

.btn-guardar.k-button[b-f7d91ulgfy] {
    background: #111827 !important;
    border-color: #111827 !important;
    color: #fff !important;
    font-size: 14px !important;
    padding: 8px 20px !important;
    border-radius: 8px !important;
    font-weight: 500 !important;
    height: 38px !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
}

.btn-guardar.k-button:hover[b-f7d91ulgfy] {
    background: #1f2937 !important;
    border-color: #1f2937 !important;
}

.btn-icon[b-f7d91ulgfy] {
    font-size: 14px;
}

.account-info-grid[b-f7d91ulgfy] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    border: 1px solid var(--border-linear-theme-arregly);
    border-radius: 8px;
    overflow: hidden;
}

.account-info-item[b-f7d91ulgfy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 18px;
    background: var(--surface-alt-theme-arregly);
}

.account-info-item:first-child[b-f7d91ulgfy] {
    border-right: 1px solid var(--border-linear-theme-arregly);
}

.account-info-label[b-f7d91ulgfy] {
    font-size: 13px;
    color: var(--muted-text-theme-arregly);
    font-weight: 400;
}

.account-info-value[b-f7d91ulgfy] {
    font-size: 13px;
    color: var(--text-theme-default-arregly);
    font-weight: 600;
}

.profile-form-actions[b-f7d91ulgfy] {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 8px !important;
}

@media (max-width: 640px) {
    .form-grid[b-f7d91ulgfy] {
        grid-template-columns: 1fr;
    }

    .account-info-grid[b-f7d91ulgfy] {
        grid-template-columns: 1fr;
    }

    .account-info-item:first-child[b-f7d91ulgfy] {
        border-right: none;
        border-bottom: 1px solid var(--border-linear-theme-arregly);
    }

    .perfil-card[b-f7d91ulgfy] {
        padding: 20px 18px;
    }

    .perfil-container[b-f7d91ulgfy] {
        padding-top: 0 !important;
        gap: 14px !important;
    }
}

@media (max-width: 480px) {
    .profile-form-actions[b-f7d91ulgfy] {
        width: 100% !important;
        justify-content: space-between !important;
    }

    .profile-form-actions[b-f7d91ulgfy]  .btn-arregly {
        min-width: 0 !important;
        flex: 1 1 0% !important;
        font-size: 12px !important;
        padding: 8px 6px !important;
    }
}
/* /Components/Configuration/ConfigurationSectionBase.razor.rz.scp.css */
.configuration-section[b-dbfbm7t4ew] {
    padding: 32px;
    border-bottom: 1px solid #e5e7eb;
}

.configuration-section:last-child[b-dbfbm7t4ew] {
    border-bottom: none;
}

.configuration-loading[b-dbfbm7t4ew],
.configuration-error[b-dbfbm7t4ew] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: 40px 20px;
    text-align: center;
}

.configuration-header[b-dbfbm7t4ew] {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 24px;
}

.configuration-icon[b-dbfbm7t4ew] {
    width: 48px;
    height: 48px;
    background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.configuration-icon svg[b-dbfbm7t4ew] {
    width: 24px;
    height: 24px;
    color: white;
}

.configuration-info h3[b-dbfbm7t4ew] {
    margin: 0 0 4px 0;
    font-size: 18px;
    font-weight: 600;
    color: #111827;
}

.configuration-info p[b-dbfbm7t4ew] {
    margin: 0;
    color: #6b7280;
    font-size: 14px;
    line-height: 1.5;
}

.configuration-content[b-dbfbm7t4ew] {
    margin-bottom: 24px;
}

.configuration-actions[b-dbfbm7t4ew] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding-top: 24px;
    border-top: 1px solid #e5e7eb;
}

@media (max-width: 768px) {
    .configuration-section[b-dbfbm7t4ew] {
        padding: 24px 16px;
    }

    .configuration-header[b-dbfbm7t4ew] {
        flex-direction: column;
        align-items: flex-start;
    }

    .configuration-actions[b-dbfbm7t4ew] {
        flex-direction: column-reverse;
    }
}
/* /Components/Configuration/ConfigurationSecurity.razor.rz.scp.css */
.seguridad-container[b-2sn5pzgmw1] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: 1000px;
    margin: 0 auto;
    padding: 8px 0;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

.seguridad-card[b-2sn5pzgmw1] {
    background: #fff;
    border-radius: 14px;
    border: none;
    padding: 28px 32px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    overflow: hidden;
}

.card-section-header[b-2sn5pzgmw1] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #f3f4f6;
}

.section-icon[b-2sn5pzgmw1] {
    font-size: 17px;
    margin-top: 2px;
    flex-shrink: 0;
}

.section-title[b-2sn5pzgmw1] {
    font-size: 15px;
    font-weight: 600;
    color: #111827;
}

.section-subtitle[b-2sn5pzgmw1] {
    font-size: 13px;
    color: #6b7280;
    margin-top: 2px;
}

.info-row[b-2sn5pzgmw1] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 4px 0;
}

.info-row-left[b-2sn5pzgmw1] {
    display: flex;
    align-items: center;
    gap: 14px;
}

.info-icon-wrap[b-2sn5pzgmw1] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #f3f4f6;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex-shrink: 0;
}

.info-icon-wrap.status-active[b-2sn5pzgmw1] {
    background: #dcfce7;
    color: #111827;
}

.info-icon[b-2sn5pzgmw1] {
    font-size: 15px;
}

.info-text[b-2sn5pzgmw1] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.info-main[b-2sn5pzgmw1] {
    font-size: 14px;
    font-weight: 500;
    color: #111827;
}

.info-sub[b-2sn5pzgmw1] {
    font-size: 12px;
    color: #6b7280;
}

.info-badge[b-2sn5pzgmw1] {
    font-size: 12px;
    font-weight: 500;
    padding: 2px 8px;
    border-radius: 20px;
    width: fit-content;
}

.info-badge.verified[b-2sn5pzgmw1] {
    background: #dcfce7;
    color: #111827 !important;
}

.info-badge.verified .k-svg-icon[b-2sn5pzgmw1],
.info-badge.verified .k-icon[b-2sn5pzgmw1],
.info-badge.verified svg[b-2sn5pzgmw1] {
    color: #111827 !important;
    fill: #111827 !important;
}

.info-icon-wrap.status-active .info-icon[b-2sn5pzgmw1],
.info-icon-wrap.status-active .k-svg-icon[b-2sn5pzgmw1],
.info-icon-wrap.status-active .k-icon[b-2sn5pzgmw1],
.info-icon-wrap.status-active svg[b-2sn5pzgmw1] {
    color: #111827 !important;
    fill: #111827 !important;
}

/* Badge activa */
.badge-activa[b-2sn5pzgmw1] {
    background: #111827;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    padding: 4px 12px;
    border-radius: 6px;
    letter-spacing: 0.3px;
}

.modal-desc[b-2sn5pzgmw1] {
    font-size: 13px;
    color: #6b7280;
    margin: 0;
    line-height: 1.5;
}

.modal-field[b-2sn5pzgmw1] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.modal-label[b-2sn5pzgmw1] {
    font-size: 13px;
    font-weight: 500;
    color: #374151;
}

.code-step-header[b-2sn5pzgmw1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

.code-step-icon-wrap[b-2sn5pzgmw1] {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: #eef2ff;
    border: 1px solid #c7d2fe;
    display: flex;
    align-items: center;
    justify-content: center;
}

.code-inputs[b-2sn5pzgmw1] {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 4px;
}

.code-input-box[b-2sn5pzgmw1] {
    width: 46px;
    height: 50px;
    border: 2px solid #d1d5db;
    border-radius: 12px;
    text-align: center;
    font-size: 22px;
    font-weight: 600;
    color: #1f2937;
    background: #fff;
    transition: all .2s ease;
}

.code-input-box:focus[b-2sn5pzgmw1] {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59,130,246,.15);
}

.modal-error[b-2sn5pzgmw1] {
    font-size: 13px;
    color: #dc2626;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 10px 14px;
    margin-top: 10px;
}

@media (max-width: 640px) {
    .seguridad-card[b-2sn5pzgmw1] {
        padding: 20px 18px;
    }

    .info-row[b-2sn5pzgmw1] {
        flex-direction: column;
        align-items: flex-start;
    }

    .text-center input[b-2sn5pzgmw1] {
        text-align: center;
        font-size: 1.2rem;
        letter-spacing: 2px;
    }

    .code-input-box[b-2sn5pzgmw1] {
        width: 40px;
        height: 44px;
        font-size: 18px;
        border-radius: 10px;
    }

    .modal-hint[b-2sn5pzgmw1] {
        font-size: 0.85rem;
        color: #666;
        margin-top: 5px;
    }
}

/* Nuevos estilos para State Machine Pattern */
.modal-success-state[b-2sn5pzgmw1],
.modal-processing-state[b-2sn5pzgmw1],
.modal-error-state[b-2sn5pzgmw1] {
    text-align: center;
    padding: 20px;
    min-height: 120px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.success-icon[b-2sn5pzgmw1],
.error-icon[b-2sn5pzgmw1] {
    font-size: 3rem;
    margin-bottom: 15px;
}

.loading-spinner[b-2sn5pzgmw1] {
    width: 40px;
    height: 40px;
    border: 4px solid #f3f3f3;
    border-top: 4px solid #007bff;
    border-radius: 50%;
    animation: spin-b-2sn5pzgmw1 1s linear infinite;
    margin: 15px auto;
}

@keyframes spin-b-2sn5pzgmw1 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.modal-success[b-2sn5pzgmw1] {
    background-color: #d4edda;
    color: #155724;
    padding: 12px 16px;
    border-radius: 8px;
    border: 1px solid #c3e6cb;
    margin-top: 15px;
    font-size: 14px;
}

.modal-footer-message[b-2sn5pzgmw1] {
    flex: 1;
    text-align: center;
    color: #666;
    font-style: italic;
}

.email-resend-section[b-2sn5pzgmw1] {
    margin-top: 6px;
    text-align: center;
}

.resend-link[b-2sn5pzgmw1] {
    color: #4f46e5;
    text-decoration: none;
    font-weight: 600;
}

.resend-link:hover[b-2sn5pzgmw1] {
    text-decoration: underline;
}

.resend-timer[b-2sn5pzgmw1] {
    color: #6b7280;
    font-size: 12px;
}

.text-center[b-2sn5pzgmw1] {
    text-align: center;
}

/* Spinner para botones */
.spinner-border[b-2sn5pzgmw1] {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    vertical-align: -0.125em;
    border: 0.25em solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: spinner-border-b-2sn5pzgmw1 0.75s linear infinite;
}

.spinner-border-sm[b-2sn5pzgmw1] {
    width: 0.875rem;
    height: 0.875rem;
    border-width: 0.125em;
}

@keyframes spinner-border-b-2sn5pzgmw1 {
    to {
        transform: rotate(360deg);
    }
}

.me-2[b-2sn5pzgmw1] {
    margin-right: 0.5rem;
}

.info-row[b-2sn5pzgmw1]  .btn-arregly {
    border-radius: 12px !important;
    font-weight: 500 !important;
    font-size: 0.85rem !important;
    padding: 8px 16px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    white-space: nowrap !important;
    transition: all 0.2s ease !important;
}

.info-row[b-2sn5pzgmw1]  .btn-arregly:hover:not(.k-disabled) {
    transform: translateY(-1px) !important;
}

.info-row[b-2sn5pzgmw1]  .btn-arregly .k-svg-icon {
    width: 15px !important;
    height: 15px !important;
    flex-shrink: 0 !important;
}

@media (max-width: 640px) {
    .seguridad-container[b-2sn5pzgmw1] {
        padding-top: 0 !important;
        gap: 14px !important;
    }

    .seguridad-card[b-2sn5pzgmw1] {
        padding: 20px 16px;
        border-radius: 12px;
    }

    .info-row[b-2sn5pzgmw1] {
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
    }

    .info-row-left[b-2sn5pzgmw1] {
        min-width: 0;
        gap: 12px;
    }

    .info-text[b-2sn5pzgmw1] {
        min-width: 0;
    }

    .info-main[b-2sn5pzgmw1] {
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .info-row[b-2sn5pzgmw1]  .btn-arregly,
    .info-row[b-2sn5pzgmw1]  .k-button {
        width: 100% !important;
        justify-content: center !important;
    }
}

/* /Components/Configuration/PaymentGateway/ConfigurationPaymentGateways.razor.rz.scp.css */
.seguridad-card[b-66nqw13avl] {
    background: #fff;
    border-radius: 14px;
    border: none;
    padding: 28px 32px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    overflow: hidden;
}

.card-section-header[b-66nqw13avl] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #f3f4f6;
}

.section-title[b-66nqw13avl] {
    font-size: 15px;
    font-weight: 600;
    color: #111827;
}

.section-subtitle[b-66nqw13avl] {
    font-size: 13px;
    color: #6b7280;
    margin-top: 2px;
}

.gateways-grid[b-66nqw13avl] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
    gap: 20px;
    margin-top: 12px;
}

.gateway-card[b-66nqw13avl] {
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: #ffffff;
    transition: all 0.2s ease-in-out;
}

.gateway-card:hover[b-66nqw13avl] {
    border-color: #cbd5e1;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.gateway-active[b-66nqw13avl] {
    border-color: #2563eb;
    background: #f8fafc;
}

.gateway-coming-soon[b-66nqw13avl] {
    opacity: 0.75;
    background: #f9fafb;
}

.gateway-card-top[b-66nqw13avl] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.gateway-logo-container[b-66nqw13avl] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.gateway-badge-bold[b-66nqw13avl] {
    background: linear-align(#ff385c, #e00b41);
    background-color: #e00b41;
    color: #ffffff;
    font-weight: 800;
    font-size: 13px;
    letter-spacing: 1px;
    padding: 6px 12px;
    border-radius: 8px;
    display: inline-block;
}

.gateway-badge-generic[b-66nqw13avl] {
    color: #ffffff;
    font-weight: 700;
    font-size: 11px;
    padding: 6px 10px;
    border-radius: 8px;
    display: inline-block;
}

.stripe-color[b-66nqw13avl] {
    background-color: #635bff;
}

.wompi-color[b-66nqw13avl] {
    background-color: #2b3990;
}

.mercadopago-color[b-66nqw13avl] {
    background-color: #009ee3;
}

.gateway-logo-img-wrapper[b-66nqw13avl] {
    width: 42px;
    height: 42px;
    border-radius: 8px;
    background-color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    flex-shrink: 0;
}

.gateway-logo-img[b-66nqw13avl] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.gateway-name[b-66nqw13avl] {
    font-size: 16px;
    font-weight: 600;
    color: #1e293b;
}

.gateway-region[b-66nqw13avl] {
    font-size: 12px;
    color: #64748b;
}

.gateway-card-desc[b-66nqw13avl] {
    font-size: 13px;
    color: #475569;
    line-height: 1.5;
    margin-bottom: 16px;
}

.gateway-card-actions[b-66nqw13avl] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

@media (max-width: 640px) {
    .seguridad-card[b-66nqw13avl] {
        padding: 20px 16px;
        border-radius: 12px;
    }

    .gateways-grid[b-66nqw13avl] {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .gateway-card[b-66nqw13avl] {
        padding: 16px 14px;
    }

    .gateway-card-top[b-66nqw13avl] {
        flex-wrap: wrap;
        gap: 8px;
    }

    .gateway-logo-container[b-66nqw13avl] {
        min-width: 0;
        flex: 1 1 100%;
    }

    .gateway-region[b-66nqw13avl] {
        overflow-wrap: anywhere;
        word-break: break-word;
    }
}

@media (max-width: 480px) {
    .gateway-card-actions[b-66nqw13avl] {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    .gateway-card-actions[b-66nqw13avl]  .btn-arregly,
    .gateway-card-actions .btn[b-66nqw13avl] {
        width: 100% !important;
        justify-content: center;
    }
}

/* ==========================================================================
   Badges Oficiales Arregly (badge-theme)
   ========================================================================== */
.badge-theme[b-66nqw13avl] {
    display: inline-flex;
    align-items: center;
    padding: 3px 9px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
}

.badge-theme-success[b-66nqw13avl] {
    background: #def7ec !important;
    color: #03543f !important;
}

.badge-theme-warning[b-66nqw13avl] {
    background: #ffedd5 !important;
    color: #ea580c !important;
}

.badge-theme-neutral[b-66nqw13avl] {
    background: #f3f4f6 !important;
    color: #4b5563 !important;
}
/* /Components/Configuration/PaymentGateway/PaymentGatewayConfigDialog.razor.rz.scp.css */
/* ==========================================================================
   Contenedor Principal del Diálogo
   ========================================================================== */
.config-dialog-content[b-2haae0xwnr] {
    padding: 18px 20px;
}

@media (max-width: 576px) {
    .config-dialog-content[b-2haae0xwnr] {
        padding: 12px 10px;
    }
}

/* ==========================================================================
   Alerta Informativa Superior
   ========================================================================== */
.gateway-alert-info[b-2haae0xwnr] {
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 10px;
    padding: 10px 12px;
    color: #1e40af;
    font-size: 0.825rem;
    line-height: 1.4;
}

.gateway-alert-icon[b-2haae0xwnr] {
    color: #3b82f6;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
    margin-top: 2px;
}

/* ==========================================================================
   Tarjeta Modo de Operación (Sandbox / Producción)
   ========================================================================== */
.operation-mode-card[b-2haae0xwnr] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 14px 16px;
}

.operation-mode-title[b-2haae0xwnr] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #1e293b;
    margin-bottom: 2px;
}

.operation-mode-desc[b-2haae0xwnr] {
    font-size: 0.775rem;
    color: #64748b;
    line-height: 1.35;
}

.operation-mode-actions[b-2haae0xwnr] {
    flex-shrink: 0;
}

@media (max-width: 576px) {
    .operation-mode-card[b-2haae0xwnr] {
        padding: 12px;
    }

    .operation-mode-actions[b-2haae0xwnr] {
        width: 100%;
        display: flex;
        justify-content: space-between !important;
        align-items: center;
        margin-top: 10px;
        padding-top: 10px;
        border-top: 1px dashed #e2e8f0;
    }
}

/* ==========================================================================
   Badges Oficiales Arregly (badge-theme)
   ========================================================================== */
.badge-theme[b-2haae0xwnr] {
    display: inline-flex;
    align-items: center;
    padding: 3px 9px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
}

.badge-theme-success[b-2haae0xwnr] {
    background: #def7ec !important;
    color: #03543f !important;
}

.badge-theme-warning[b-2haae0xwnr] {
    background: #ffedd5 !important;
    color: #ea580c !important;
}

.badge-theme-neutral[b-2haae0xwnr] {
    background: #f3f4f6 !important;
    color: #4b5563 !important;
}

/* ==========================================================================
   Pestañas Telerik (TabStrip)
   ========================================================================== */
[b-2haae0xwnr] .k-tabstrip-items-wrapper {
    border-bottom: 1px solid #e2e8f0 !important;
}

[b-2haae0xwnr] .k-tabstrip-items .k-item {
    font-size: 0.85rem;
}

@media (max-width: 576px) {
    [b-2haae0xwnr] .k-tabstrip-items {
        display: flex;
        width: 100%;
    }

    [b-2haae0xwnr] .k-tabstrip-items .k-item {
        flex: 1 1 50%;
        text-align: center;
    }

    [b-2haae0xwnr] .k-tabstrip-items .k-link {
        padding: 8px 6px !important;
        font-size: 0.775rem !important;
        justify-content: center;
        white-space: nowrap;
    }
}

/* ==========================================================================
   Etiquetas de Formularios y Textos de Ayuda
   ========================================================================== */
.form-field-label[b-2haae0xwnr] {
    font-size: 0.825rem;
    font-weight: 600;
    color: #1e293b;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 5px;
}

.form-helper-text[b-2haae0xwnr] {
    font-size: 0.735rem;
    color: #64748b;
    margin-top: 4px;
    line-height: 1.35;
}

/* ==========================================================================
   Tarjeta de Webhook
   ========================================================================== */
.webhook-card[b-2haae0xwnr] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 12px 14px;
}

.webhook-title[b-2haae0xwnr] {
    font-size: 0.825rem;
    font-weight: 600;
    color: #1e293b;
}

.webhook-desc[b-2haae0xwnr] {
    font-size: 0.735rem;
    color: #64748b;
    line-height: 1.35;
}

.webhook-input-group[b-2haae0xwnr] {
    display: flex;
    gap: 8px;
    align-items: center;
    width: 100%;
}

.webhook-input-group input[b-2haae0xwnr] {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 0.75rem !important;
}

@media (max-width: 576px) {
    .webhook-input-group[b-2haae0xwnr] {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
        width: 100%;
    }

    .webhook-input-group input[b-2haae0xwnr] {
        width: 100% !important;
    }

    .webhook-input-group .btn[b-2haae0xwnr],
    .webhook-input-group .btn-arregly[b-2haae0xwnr],
    .webhook-input-group button[b-2haae0xwnr] {
        width: 100% !important;
        min-width: 0 !important;
        justify-content: center !important;
        text-align: center !important;
    }
}

/* ==========================================================================
   Footer de Acciones del Diálogo
   ========================================================================== */
.dialog-footer-actions[b-2haae0xwnr] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    width: 100%;
}

@media (max-width: 576px) {
    .dialog-footer-actions[b-2haae0xwnr] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
        width: 100%;
    }

    .dialog-footer-actions[b-2haae0xwnr]  .btn-arregly,
    .dialog-footer-actions[b-2haae0xwnr]  .k-button,
    .dialog-footer-actions[b-2haae0xwnr]  button {
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        min-height: 36px !important;
        padding: 6px 8px !important;
        font-size: 0.8rem !important;
        justify-content: center !important;
        text-align: center !important;
        white-space: nowrap !important;
    }

    .save-text-desktop[b-2haae0xwnr] {
        display: none !important;
    }

    .save-text-mobile[b-2haae0xwnr] {
        display: inline !important;
    }
}

@media (min-width: 577px) {
    .save-text-mobile[b-2haae0xwnr] {
        display: none !important;
    }

    .save-text-desktop[b-2haae0xwnr] {
        display: inline !important;
    }
}
/* /Components/Configuration/PaymentGateway/PaymentTerminalDialog.razor.rz.scp.css */
.payment-terminal-container[b-kneowxhhew] {
    font-family: 'Poppins', sans-serif;
}

.section-divider[b-kneowxhhew] {
    border-top: 1px solid #f3f4f6;
    margin: 16px 0;
}

.terminal-form-section[b-kneowxhhew] {
    padding: 12px 0;
}

.terminal-form-title[b-kneowxhhew] {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 12px;
    color: #111827;
}

.terminal-table[b-kneowxhhew] {
    font-family: 'Poppins', sans-serif;
    font-size: 13px;
}

.terminal-table th[b-kneowxhhew] {
    font-size: 12px;
    font-weight: 600;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    border-bottom: 1px solid #e5e7eb;
    background: #f9fafb;
    padding: 10px 12px;
}

.terminal-table td[b-kneowxhhew] {
    padding: 12px;
    border-bottom: 1px solid #f3f4f6;
    vertical-align: middle;
}

.terminal-table tbody tr:hover[b-kneowxhhew] {
    background-color: #fcfcfd;
}

/* ── BOTONES CIRCULARES DE ACCIÓN (ESTILO COTIZACIONES) ── */
.terminal-actions[b-kneowxhhew] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
}

.terminal-action-btn[b-kneowxhhew] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    border-radius: 999px;
    border: 1px solid #e5e7eb;
    background: #ffffff;
    color: #4b5563;
    cursor: pointer;
    transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.12s ease, box-shadow 0.18s ease;
}

.terminal-action-btn:hover[b-kneowxhhew] {
    transform: translateY(-1px);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.08);
}

.terminal-action-btn:disabled[b-kneowxhhew] {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

.terminal-action-btn.is-edit[b-kneowxhhew] {
    color: #1d4ed8;
    border-color: #bfdbfe;
    background: #eff6ff;
}

.terminal-action-btn.is-edit:hover[b-kneowxhhew] {
    background: #dbeafe;
    border-color: #93c5fd;
    color: #1e40af;
}

.terminal-action-btn.is-delete[b-kneowxhhew] {
    color: #b91c1c;
    border-color: #fecaca;
    background: #fef2f2;
}

.terminal-action-btn.is-delete:hover[b-kneowxhhew] {
    background: #fee2e2;
    border-color: #fca5a5;
    color: #991b1b;
}

/* ==========================================================================
   Alerta Informativa
   ========================================================================== */
.gateway-alert-info[b-kneowxhhew] {
    background: #eff6ff;
    border: 1px solid #bfdbfe;
    border-radius: 10px;
    padding: 10px 12px;
    color: #1e40af;
    font-size: 0.825rem;
    line-height: 1.4;
}

.gateway-alert-icon[b-kneowxhhew] {
    color: #3b82f6;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    flex-shrink: 0;
    margin-top: 2px;
}

/* ==========================================================================
   Badges Oficiales Arregly (badge-theme)
   ========================================================================== */
.badge-theme[b-kneowxhhew] {
    display: inline-flex;
    align-items: center;
    padding: 3px 9px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
}

.badge-theme-success[b-kneowxhhew] {
    background: #def7ec !important;
    color: #03543f !important;
}

.badge-theme-neutral[b-kneowxhhew] {
    background: #f3f4f6 !important;
    color: #4b5563 !important;
}

/* ==========================================================================
   Footer de Acciones
   ========================================================================== */
.terminal-footer-actions[b-kneowxhhew] {
    display: flex;
    justify-content: flex-end;
    width: 100%;
}

@media (max-width: 576px) {
    .payment-terminal-container[b-kneowxhhew] {
        padding: 12px 10px !important;
    }

    .terminal-footer-actions[b-kneowxhhew]  .btn-arregly {
        width: 100% !important;
        min-width: 0 !important;
        justify-content: center !important;
    }
}

/* /Components/Error/AppError.razor.rz.scp.css */
.app-error-shell[b-2mym8y30mu] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 2rem;
    overflow: hidden;
    background: linear-gradient(180deg, #f7f5ff 0%, #eef2ff 100%);
}

.app-error-card[b-2mym8y30mu] {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(280px, 1fr) minmax(320px, 0.95fr);
    gap: 2rem;
    width: min(100%, 1120px);
    padding: 2.75rem 3rem;
    border: 1px solid rgba(255, 255, 255, 0.75);
    border-radius: 2rem;
    background:
        radial-gradient(circle at top right, rgba(102, 126, 234, 0.2), transparent 24%),
        radial-gradient(circle at bottom right, rgba(118, 75, 162, 0.18), transparent 25%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(241, 243, 255, 0.94));
    box-shadow: 0 24px 60px rgba(102, 126, 234, 0.14);
    backdrop-filter: blur(8px);
}

.app-error-illustration[b-2mym8y30mu] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 420px;
}

.app-error-code[b-2mym8y30mu] {
    position: absolute;
    top: 2rem;
    left: 1.5rem;
    z-index: 1;
    color: rgba(118, 75, 162, 0.18);
    font-size: clamp(5rem, 10vw, 8rem);
    font-weight: 900;
    line-height: 1;
    letter-spacing: -0.08em;
}

.app-error-robot[b-2mym8y30mu] {
    width: min(100%, 420px);
    height: auto;
    filter: drop-shadow(0 22px 30px rgba(102, 126, 234, 0.18));
}

.app-error-content[b-2mym8y30mu] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    max-width: 430px;
}

.app-error-badge[b-2mym8y30mu] {
    width: 120px;
    margin-bottom: 1rem;
    filter: drop-shadow(0 16px 22px rgba(102, 126, 234, 0.22));
}

.app-error-badge svg[b-2mym8y30mu] {
    display: block;
    width: 100%;
    height: auto;
}

.app-error-title[b-2mym8y30mu] {
    margin: 0 0 1rem;
    color: #1f2937;
    font-size: clamp(2.2rem, 3vw, 3.4rem);
    font-weight: 800;
    line-height: 1.04;
    letter-spacing: -0.04em;
}

.app-error-message[b-2mym8y30mu] {
    margin: 0;
    color: #32475b;
    font-size: 1.35rem;
    line-height: 1.45;
}

.app-error-detail[b-2mym8y30mu] {
    width: 100%;
    margin-top: 1.25rem;
    padding: 0.9rem 1rem;
    border: 1px solid rgba(102, 126, 234, 0.18);
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.72);
    color: #6b7280;
    font-size: 0.95rem;
    line-height: 1.5;
    word-break: break-word;
}

.app-error-actions[b-2mym8y30mu] {
    display: flex;
    /*flex-direction: column;*/
    align-items: flex-start;
    gap: 1rem;
    margin-top: 2rem;
}

.app-error-button[b-2mym8y30mu] {
    border: none;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}

.app-error-button:hover[b-2mym8y30mu] {
    transform: translateY(-2px);
}

.app-error-button:focus-visible[b-2mym8y30mu] {
    outline: 3px solid rgba(37, 99, 235, 0.28);
    outline-offset: 3px;
}

.app-error-button-primary[b-2mym8y30mu] {
    min-width: 230px;
    padding: 1rem 1.8rem;
    border-radius: 999px;
    background: var(--primary-gradient, linear-gradient(135deg, #667eea 0%, #764ba2 100%));
    box-shadow: 0 14px 28px rgba(102, 126, 234, 0.3);
    color: #ffffff;
    font-size: 1.35rem;
    font-weight: 700;
}

.app-error-button-primary:hover[b-2mym8y30mu] {
    box-shadow: 0 18px 32px rgba(102, 126, 234, 0.35);
}

.app-error-button-secondary[b-2mym8y30mu] {
    padding: 0;
    background: transparent;
    color: #546473;
    font-size: 1.2rem;
    font-weight: 500;
}

.app-error-button-secondary:hover[b-2mym8y30mu] {
    opacity: 0.82;
}

.app-error-button-primary-outline[b-2mym8y30mu] {
    min-width: 230px;
    padding: 1rem 1.8rem;
    border-radius: 999px;
    background: transparent;
    border: 1px solid var(--primary-color, #764ba2);
    color: var(--primary-color, #764ba2);
    font-size: 1.35rem;
    font-weight: 700;
}

    .app-error-button-primary-outline:hover[b-2mym8y30mu] {
        box-shadow: 0 18px 32px var(--RgbaColor02, rgba(102, 126, 234, 0.25));
    }


.app-error-shape[b-2mym8y30mu] {
    position: absolute;
    border-radius: 2rem;
    opacity: 0.94;
    filter: blur(0.2px);
}

.app-error-shape-top-left[b-2mym8y30mu] {
    top: -2.6rem;
    left: -1.4rem;
    width: 11rem;
    height: 7rem;
    border-top-left-radius: 0;
    background: var(--primary-gradient, linear-gradient(135deg, #667eea 0%, #764ba2 100%));
}

.app-error-shape-top-right[b-2mym8y30mu] {
    top: -1.5rem;
    right: -1.2rem;
    width: 14rem;
    height: 7.5rem;
    border-top-right-radius: 0;
    background: linear-gradient(135deg, rgba(102, 126, 234, 0.2) 0%, rgba(118, 75, 162, 0.24) 100%);
}

.app-error-shape-bottom-right[b-2mym8y30mu] {
    right: -1.6rem;
    bottom: -1.9rem;
    width: 13rem;
    height: 8rem;
    border-bottom-right-radius: 0;
    background: var(--primary-gradient, linear-gradient(135deg, #667eea 0%, #764ba2 100%));
}

@media (max-width: 991.98px) {
    .app-error-card[b-2mym8y30mu] {
        grid-template-columns: 1fr;
        justify-items: center;
        text-align: center;
        padding: 2.5rem 1.8rem;
    }

    .app-error-illustration[b-2mym8y30mu] {
        min-height: auto;
    }

    .app-error-code[b-2mym8y30mu] {
        left: 50%;
        transform: translateX(-50%);
        top: 1rem;
    }

    .app-error-content[b-2mym8y30mu] {
        align-items: center;
    }

    .app-error-actions[b-2mym8y30mu] {
        align-items: center;
    }
}

@media (max-width: 575.98px) {
    .app-error-shell[b-2mym8y30mu] {
        padding: 1rem;
    }

    .app-error-card[b-2mym8y30mu] {
        gap: 1.5rem;
        padding: 1.6rem 1.1rem 2rem;
        border-radius: 1.6rem;
    }

    .app-error-title[b-2mym8y30mu] {
        font-size: 1.95rem;
    }

    .app-error-message[b-2mym8y30mu] {
        font-size: 1.05rem;
    }

    .app-error-button-primary[b-2mym8y30mu] {
        width: 100%;
        min-width: 0;
        font-size: 1.12rem;
    }

    .app-error-button-secondary[b-2mym8y30mu] {
        font-size: 1rem;
    }

    .app-error-code[b-2mym8y30mu] {
        font-size: 4.6rem;
    }

    .app-error-shape-top-left[b-2mym8y30mu],
    .app-error-shape-top-right[b-2mym8y30mu],
    .app-error-shape-bottom-right[b-2mym8y30mu] {
        opacity: 0.72;
    }
}
/* /Components/Error/HasError.razor.rz.scp.css */
.has-error-shell[b-xn4t9mho00] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 360px;
}

.has-error-card[b-xn4t9mho00] {
    position: relative;
    display: grid;
    grid-template-columns: minmax(220px, 280px) minmax(280px, 520px);
    gap: 2rem;
    align-items: center;
    width: 100%;
    padding: 2rem;
    border: 1px solid color-mix(in srgb, var(--primary-color) 8%, #ffffff);
    border-radius: 1.75rem;
    background:
        radial-gradient(circle at top right, color-mix(in srgb, var(--primary-color) 18%, transparent), transparent 26%),
        radial-gradient(circle at bottom left, color-mix(in srgb, var(--primary-dark, var(--primary-color)) 16%, transparent), transparent 24%),
        linear-gradient(135deg, rgba(255, 255, 255, 0.97), rgba(243, 245, 255, 0.94));
    box-shadow: 0 24px 60px color-mix(in srgb, var(--primary-color) 12%, transparent);
    overflow: hidden;
}

.has-error-card[b-xn4t9mho00]::before,
.has-error-card[b-xn4t9mho00]::after {
    content: "";
    position: absolute;
    border-radius: 999px;
    pointer-events: none;
}

.has-error-card[b-xn4t9mho00]::before {
    top: -48px;
    right: -48px;
    width: 160px;
    height: 160px;
    background: color-mix(in srgb, var(--primary-color) 8%, transparent);
}

.has-error-card[b-xn4t9mho00]::after {
    bottom: -56px;
    left: -36px;
    width: 180px;
    height: 180px;
    background: color-mix(in srgb, var(--primary-dark, var(--primary-color)) 8%, transparent);
}

.has-error-visual[b-xn4t9mho00] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 260px;
}

.has-error-glow[b-xn4t9mho00] {
    position: absolute;
    width: 220px;
    height: 220px;
    border-radius: 50%;
    background: radial-gradient(circle, color-mix(in srgb, var(--primary-color) 20%, transparent) 0%, color-mix(in srgb, var(--primary-dark, var(--primary-color)) 8%, transparent) 55%, transparent 72%);
}

.has-error-icon-wrapper[b-xn4t9mho00] {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 150px;
    height: 150px;
    border-radius: 2rem;
    background: linear-gradient(135deg, color-mix(in srgb, var(--primary-color) 16%, #ffffff), color-mix(in srgb, var(--primary-dark, var(--primary-color)) 14%, #ffffff));
    box-shadow: 0 18px 40px color-mix(in srgb, var(--primary-color) 12%, transparent);
    backdrop-filter: blur(8px);
}

.has-error-icon[b-xn4t9mho00] {
    width: 86px;
    height: 86px;
    filter: drop-shadow(0 14px 18px color-mix(in srgb, var(--primary-color) 18%, transparent));
}

.has-error-pulse[b-xn4t9mho00] {
    position: absolute;
    border-radius: 50%;
    background: linear-gradient(135deg, color-mix(in srgb, var(--primary-color) 18%, transparent), color-mix(in srgb, var(--primary-dark, var(--primary-color)) 18%, transparent));
}

.has-error-pulse-primary[b-xn4t9mho00] {
    top: 22px;
    left: 30px;
    width: 18px;
    height: 18px;
}

.has-error-pulse-secondary[b-xn4t9mho00] {
    right: 36px;
    bottom: 28px;
    width: 24px;
    height: 24px;
}

.has-error-content[b-xn4t9mho00] {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
}

.has-error-badge[b-xn4t9mho00] {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    padding: 0.45rem 0.85rem;
    border: 1px solid color-mix(in srgb, var(--primary-color) 14%, #ffffff);
    border-radius: 999px;
    background: color-mix(in srgb, var(--primary-color) 8%, #ffffff);
    color: var(--primary-color);
    font-size: 0.9rem;
    font-weight: 700;
}

.has-error-title[b-xn4t9mho00] {
    margin: 0;
    color: #1f2937;
    font-size: clamp(1.85rem, 3vw, 2.65rem);
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -0.03em;
}

.has-error-message[b-xn4t9mho00] {
    margin: 0;
    color: #475569;
    font-size: 1.05rem;
    line-height: 1.65;
}

.has-error-detail[b-xn4t9mho00] {
    display: inline-flex;
    align-items: flex-start;
    gap: 0.65rem;
    margin-top: 0.25rem;
    padding: 0.9rem 1rem;
    border: 1px solid color-mix(in srgb, var(--primary-color) 12%, #ffffff);
    border-radius: 1rem;
    background: rgba(255, 255, 255, 0.72);
    color: #64748b;
    font-size: 0.95rem;
    line-height: 1.55;
}

.has-error-detail-dot[b-xn4t9mho00] {
    flex: 0 0 auto;
    width: 10px;
    height: 10px;
    margin-top: 0.35rem;
    border-radius: 50%;
    background: var(--primary-gradient);
}

@media (max-width: 991.98px) {
    .has-error-card[b-xn4t9mho00] {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        padding: 1.75rem;
        text-align: center;
    }

    .has-error-content[b-xn4t9mho00] {
        align-items: center;
    }

    .has-error-detail[b-xn4t9mho00] {
        text-align: left;
    }
}

@media (max-width: 575.98px) {
    .has-error-shell[b-xn4t9mho00] {
        min-height: 320px;
        padding: 1rem;
    }

    .has-error-card[b-xn4t9mho00] {
        padding: 1.35rem;
        border-radius: 1.25rem;
    }

    .has-error-visual[b-xn4t9mho00] {
        min-height: 220px;
    }

    .has-error-icon-wrapper[b-xn4t9mho00] {
        width: 124px;
        height: 124px;
        border-radius: 1.5rem;
    }

    .has-error-icon[b-xn4t9mho00] {
        width: 72px;
        height: 72px;
    }

    .has-error-message[b-xn4t9mho00] {
        font-size: 0.98rem;
    }
}
/* /Components/Forms/Clients/ClientForm.razor.rz.scp.css */
/* Estilos del formulario de cliente */
.client-form[b-1owe9zab93] {
    width: 100%;
}

.client-form .form-field[b-1owe9zab93] {
    margin-bottom: 20px;
}

.client-form .field-label[b-1owe9zab93] {
    display: block;
    font-size: 0.9rem;
    color: #555;
    margin-bottom: 8px;
    font-weight: 500;
}

/* Estilos para controles Telerik */
.client-form .textbox-arregly[b-1owe9zab93] {
    width: 100% !important;
    height: 48px !important;
    border: 2px solid #e1e1e1 !important;
    border-radius: 8px !important;
    font-size: 1rem !important;
    background: white !important;
    transition: all 0.2s ease !important;
}

.client-form .textbox-arregly:focus[b-1owe9zab93] {
    border-color: #667eea !important;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1) !important;
}

.client-form .textbox-arregly.k-invalid[b-1owe9zab93] {
    border-color: #dc3545 !important;
}

.client-form .textbox-arregly.k-invalid:focus[b-1owe9zab93] {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.1) !important;
}

.client-form .dropdown-arregly[b-1owe9zab93] {
    width: 100% !important;
    height: 48px !important;
    border: 2px solid #e1e1e1 !important;
    border-radius: 8px !important;
    font-size: 1rem !important;
    background: white !important;
    transition: all 0.2s ease !important;
}

.client-form .dropdown-arregly:focus-within[b-1owe9zab93],
.client-form .dropdown-arregly:focus[b-1owe9zab93] {
    border-color: #667eea !important;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1) !important;
}

.client-form .dropdown-arregly.k-invalid[b-1owe9zab93] {
    border-color: #dc3545 !important;
}

.client-form .dropdown-arregly.k-invalid:focus-within[b-1owe9zab93],
.client-form .dropdown-arregly.k-invalid:focus[b-1owe9zab93] {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.1) !important;
}

.client-form .textarea-arregly[b-1owe9zab93] {
    width: 100% !important;
    min-height: 80px !important;
    border: 2px solid #e1e1e1 !important;
    border-radius: 8px !important;
    font-size: 1rem !important;
    background: white !important;
    transition: all 0.2s ease !important;
    font-family: inherit !important;
}

.client-form .textarea-arregly:focus[b-1owe9zab93] {
    border-color: #667eea !important;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1) !important;
}

/* Mensajes de validaci�n */
.client-form .validation-message[b-1owe9zab93] {
    color: #dc3545;
    font-size: 0.875rem;
    margin-top: 4px;
    display: block;
}

/* CheckBox personalizado */
.client-form input[type="checkbox"] + label[b-1owe9zab93] {
    cursor: pointer;
    user-select: none;
}

/* Estilos responsive */
@media (max-width: 768px) {
    .client-form .col-md-6[b-1owe9zab93] {
        margin-bottom: 10px;
    }
}

/* Estados focus para dropdowns anidados */
.client-form .dropdown-arregly .k-input[b-1owe9zab93] {
    border: none !important;
    background: transparent !important;
    height: 44px !important;
}

.client-form .dropdown-arregly .k-dropdown-button[b-1owe9zab93] {
    border: none !important;
    background: transparent !important;
    height: 44px !important;
}

/* Placeholder styling */
.client-form .dropdown-arregly .k-input[b-1owe9zab93]::placeholder,
.client-form .textbox-arregly .k-input[b-1owe9zab93]::placeholder,
.client-form .textarea-arregly[b-1owe9zab93]::placeholder {
    color: #888 !important;
    opacity: 1 !important;
}
/* ===== Tipo de cliente: item con descuento ===== */
.typeclient-dropdown-item[b-1owe9zab93] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
}

.typeclient-dropdown-name[b-1owe9zab93] {
    font-weight: 500;
    color: inherit;
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.typeclient-dropdown-badge[b-1owe9zab93] {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
    background: #dcfce7;
    color: #15803d;
    flex-shrink: 0;
}

.typeclient-dropdown-badge-none[b-1owe9zab93] {
    background: #f3f4f6;
    color: #6b7280;
    font-weight: 500;
}

.typeclient-dropdown-selected[b-1owe9zab93] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.typeclient-selected-badge[b-1owe9zab93] {
    display: inline-flex;
    align-items: center;
    padding: 1px 7px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    background: #dcfce7;
    color: #15803d;
}
/* /Components/Forms/Employee/PersonalInfoForm.razor.rz.scp.css */
.employee-form-loading[b-cwm497302k] {
    min-height: 200px;
}

.employee-image-section[b-cwm497302k] {
    width: 100%;
}
/* /Components/Forms/Employee/RolesForm.razor.rz.scp.css */
.employee-form-loading[b-x0oh0a650t] {
    min-height: 200px;
}

/* Listado de roles con scroll para evitar que el modal cambie de tamaño al entrar a este tab. */
.roles-container[b-x0oh0a650t] {
    max-height: 320px;
    overflow-y: auto;
}

.roles-container.k-invalid[b-x0oh0a650t] {
    border: 1px solid #dc3545;
    border-radius: 0.5rem;
    padding: 0.75rem;
}
/* /Components/Forms/Employee/ScheduleForm.razor.rz.scp.css */
.schedule-form-container[b-erhxi0f7s1] {
    max-width: 100%;
}

.day-indicator[b-erhxi0f7s1] {
    min-width: 90px;
}

.working-day-content[b-erhxi0f7s1] {
    animation: fadeIn-b-erhxi0f7s1 0.2s ease-in-out;
}

.link-primary-arregly[b-erhxi0f7s1] {
    color: var(--primary-color) !important;
    font-weight: 500;
    transition: opacity 0.2s ease;
}

.link-primary-arregly:hover[b-erhxi0f7s1] {
    opacity: 0.8;
    color: var(--primary-color) !important;
}

.icon-primary-theme[b-erhxi0f7s1],
[b-erhxi0f7s1] .icon-primary-theme {
    color: var(--primary-color) !important;
    fill: var(--primary-color) !important;
}

.breaks-container[b-erhxi0f7s1] {
    background-color: #f8fafc;
    border-radius: 8px;
}

@keyframes fadeIn-b-erhxi0f7s1 {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}
/* /Components/Forms/Employee/WorkInfoForm.razor.rz.scp.css */
.employee-form-loading[b-4i7k5kbx2f] {
    min-height: 200px;
}
/* /Components/Forms/Inventory/InventoryForm.razor.rz.scp.css */
/* Estilos base para el formulario de inventario */

.inventory-form-section[b-pdfdir6yzv] {
    background: white;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 20px;
}

.section-header[b-pdfdir6yzv] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 20px;
    border-bottom: 1px solid #f3f4f6;
    padding-bottom: 12px;
}

.section-header svg[b-pdfdir6yzv] {
    width: 20px;
    height: 20px;
    color: #6b7280;
}

/* Grillas del formulario */
.inventory-form-grid[b-pdfdir6yzv] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
}

.inventory-form-grid-2[b-pdfdir6yzv] {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

.form-field[b-pdfdir6yzv] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}





.form-help-text[b-pdfdir6yzv] {
    font-size: 12px;
    color: #6b7280;
    margin-top: 4px;
}

/* Validaci�n */
.validation-message[b-pdfdir6yzv] {
    font-size: 12px;
    color: #dc2626;
    margin-top: 2px;
}

/* Alertas de error */
.error-alert[b-pdfdir6yzv] {
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 16px;
}

.error-alert-content[b-pdfdir6yzv] {
    display: flex;
    gap: 12px;
}

.error-alert-icon[b-pdfdir6yzv] {
    flex-shrink: 0;
}

.error-alert-icon svg[b-pdfdir6yzv] {
    width: 20px;
    height: 20px;
    color: #dc2626;
}

.error-alert-text[b-pdfdir6yzv] {
    flex: 1;
}

.error-alert-title[b-pdfdir6yzv] {
    font-size: 14px;
    font-weight: 600;
    color: #dc2626;
    margin: 0 0 4px 0;
}

.error-alert-message p[b-pdfdir6yzv] {
    font-size: 14px;
    color: #7f1d1d;
    margin: 0;
}

/* Caja de advertencia */
.warning-box[b-pdfdir6yzv] {
    background: #fffbeb;
    border: 1px solid #fed7aa;
    border-radius: 8px;
    padding: 12px;
    margin-top: 12px;
    margin-bottom: 12px;
}

.warning-box-content[b-pdfdir6yzv] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.warning-box-content svg[b-pdfdir6yzv] {
    width: 20px;
    height: 20px;
    color: #f59e0b;
    flex-shrink: 0;
}

.warning-box-text[b-pdfdir6yzv] {
    font-size: 14px;
    color: #92400e;
    font-weight: 500;
}

/* Switch toggle para estado activo */
.switch-container[b-pdfdir6yzv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
}

.switch-text[b-pdfdir6yzv] {
    font-weight: 500;
    color: #374151;
    margin: 0;
    font-size: 14px;
}

.switch-description[b-pdfdir6yzv] {
    font-size: 12px;
    color: #6b7280;
    margin: 2px 0 0 0;
}

.switch-toggle[b-pdfdir6yzv] {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 24px;
    cursor: pointer;
}

.switch-checkbox[b-pdfdir6yzv] {
    opacity: 0;
    width: 0;
    height: 0;
}

.switch-slider[b-pdfdir6yzv] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #d1d5db;
    border-radius: 24px;
    transition: 0.2s;
}

.switch-slider[b-pdfdir6yzv]:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    border-radius: 50%;
    transition: 0.2s;
}

.switch-checkbox:checked + .switch-slider[b-pdfdir6yzv] {
    background-color: #3b82f6;
}

.switch-checkbox:checked + .switch-slider[b-pdfdir6yzv]:before {
    transform: translateX(26px);
}

/* Responsive */
@media (max-width: 768px) {
    .inventory-form-grid[b-pdfdir6yzv] {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    .inventory-form-section[b-pdfdir6yzv] {
        padding: 16px;
    }
    
    .section-header[b-pdfdir6yzv] {
        font-size: 14px;
        margin-bottom: 16px;
    }
}
/* /Components/Forms/Order/Services/RegisterPaymentForm.razor.rz.scp.css */
.payment-section-title[b-oqcdkja1iz] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #000000;
    margin-bottom: 8px;
}

.custom-payment-input-container[b-oqcdkja1iz] {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
}

.currency-symbol[b-oqcdkja1iz] {
    position: absolute;
    left: 12px;
    z-index: 10;
    color: #64748b;
    font-weight: 600;
    font-size: 0.95rem;
}

.input-icon-right[b-oqcdkja1iz] {
    position: absolute;
    right: 12px;
    z-index: 10;
    color: #94a3b8;
    display: flex;
    align-items: center;
}

[b-oqcdkja1iz] .custom-payment-input-container .k-textbox {
    padding-left: 28px !important;
    padding-right: 12px !important;
}

.total-payment-card[b-oqcdkja1iz] {
    background-color: #f8fafc;
    border: 1px solid #d0d5dd;
    border-radius: 12px;
    padding: 12px 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    transition: all 0.2s ease;
    margin-top: 12px;
}

.total-payment-card:hover[b-oqcdkja1iz] {
    background-color: #f1f5f9;
    border-color: #d0d5dd;
}

.total-payment-card.active[b-oqcdkja1iz] {
    background-color: #eff6ff;
    border-color: #d0d5dd;
}

.total-payment-label[b-oqcdkja1iz] {
    font-weight: 600;
    color: #334155;
    font-size: 0.95rem;
}

.total-payment-value[b-oqcdkja1iz] {
    font-weight: 700;
    color: #475569;
    margin-right: 12px;
    font-size: 0.95rem;
}

.total-payment-right[b-oqcdkja1iz] {
    display: flex;
    align-items: center;
    gap: 8px;
}
/* /Components/Forms/Order/Services/ServiceTaskPhotoUpload.razor.rz.scp.css */
.custom-photo-upload-dropzone-wrapper[b-j7zhraa02a] {
    position: relative;
    border-radius: 18px;
    background: #edf4fc;
    padding: 14px;
    overflow: hidden;
}

.custom-photo-mobile-capture[b-j7zhraa02a] {
    margin-top: 10px;
}

.custom-photo-mobile-capture-btn[b-j7zhraa02a] {
    display: inline-flex;
    align-items: center;
}

[b-j7zhraa02a] .custom-photo-upload,
[b-j7zhraa02a] .custom-photo-upload.k-upload,
[b-j7zhraa02a] .custom-photo-upload .k-upload-dropzone,
[b-j7zhraa02a] .custom-photo-upload .k-dropzone {
    width: 100% !important;
    display: block !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

[b-j7zhraa02a] .custom-photo-upload .k-upload-button {
    width: 100% !important;
    min-height: 120px;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

[b-j7zhraa02a] .custom-photo-upload .k-upload-button::before,
[b-j7zhraa02a] .custom-photo-upload .k-dropzone-hint,
[b-j7zhraa02a] .custom-photo-upload .k-upload-status,
[b-j7zhraa02a] .custom-photo-upload .k-button-text,
[b-j7zhraa02a] .custom-photo-upload .k-upload-files {
    display: none !important;
}

.custom-photo-upload-overlay[b-j7zhraa02a] {
    position: absolute;
    inset: 14px;
    border: 1.5px dashed #c1d2e6;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    pointer-events: none;
}

.custom-photo-upload-overlay-icon[b-j7zhraa02a] {
    width: 46px;
    height: 46px;
    border-radius: 8px;
    margin-bottom: 10px;
    background: linear-gradient(145deg, #dbeafe, #93c5fd);
    -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 16 16"><path fill="black" d="M6.002 5.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z"/><path fill="black" d="M2.002 1a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2h-12zm12 1a1 1 0 0 1 1 1v6.5l-3.777-1.947a.5.5 0 0 0-.577.093l-3.71 3.71-2.66-1.772a.5.5 0 0 0-.63.062L1.002 12V3a1 1 0 0 1 1-1h12z"/></svg>') center / 24px 24px no-repeat;
    mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 16 16"><path fill="black" d="M6.002 5.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z"/><path fill="black" d="M2.002 1a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2h-12zm12 1a1 1 0 0 1 1 1v6.5l-3.777-1.947a.5.5 0 0 0-.577.093l-3.71 3.71-2.66-1.772a.5.5 0 0 0-.63.062L1.002 12V3a1 1 0 0 1 1-1h12z"/></svg>') center / 24px 24px no-repeat;
}

.custom-photo-upload-overlay-title[b-j7zhraa02a] {
    color: #1e3a63;
    font-size: 0.98rem;
    font-weight: 600;
}

.custom-photo-upload-overlay-title span[b-j7zhraa02a] {
    color: #1665d8;
}

.custom-photo-upload-overlay-subtitle[b-j7zhraa02a] {
    color: #9caec4;
    font-size: 0.74rem;
    font-weight: 500;
    margin-top: 0.25rem;
}

.custom-photos-grid[b-j7zhraa02a] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 10px;
}

.custom-photos-limit-badge[b-j7zhraa02a] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: #f0fdf4;
    border: 1.5px dashed #86efac;
    color: #166534;
    font-size: 0.85rem;
    font-weight: 600;
    padding: 14px;
    border-radius: 12px;
    text-align: center;
}

.custom-photo-upload-filled-layout[b-j7zhraa02a] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
    align-items: start;
}

.custom-photo-file-card[b-j7zhraa02a] {
    border: 1px solid #d7e2f0;
    border-radius: 12px;
    background: #ffffffcc;
    padding: 10px;
    height: 120px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.custom-photo-thumbnail-btn[b-j7zhraa02a] {
    border: none;
    background: transparent;
    padding: 0;
    border-radius: 8px;
    cursor: zoom-in;
    width: 86px;
    height: 86px;
    overflow: hidden;
    flex-shrink: 0;
}

.custom-photo-upload-preview-image[b-j7zhraa02a] {
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: cover;
    border-radius: 8px;
}

.custom-photo-file-info[b-j7zhraa02a] {
    min-width: 0;
    flex: 1;
}

.custom-photo-file-name[b-j7zhraa02a] {
    font-size: 1.05rem;
    color: #28456f;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.custom-photo-file-size[b-j7zhraa02a] {
    font-size: 0.95rem;
    color: #6b87ac;
}

.custom-photo-file-actions[b-j7zhraa02a] {
    display: flex;
    gap: 6px;
}

.custom-photo-action-btn[b-j7zhraa02a] {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    border: 1px solid #d7e2f0;
    background: #f8fbff;
    color: #355f93;
    align-items: center;
    justify-content: center;
    display: inline-flex;
    padding: 0;
}

.custom-photo-action-btn-danger[b-j7zhraa02a] {
    color: #b42318;
    background: #fff5f4;
    border-color: #f3c2bd;
}

.custom-photo-change-panel[b-j7zhraa02a] {
    position: relative;
    border: 1.5px dashed #c1d2e6;
    border-radius: 12px;
    height: 120px;
    background: #ffffff;
    padding: 8px;
}

[b-j7zhraa02a] .custom-photo-upload-change,
[b-j7zhraa02a] .custom-photo-upload-change.k-upload,
[b-j7zhraa02a] .custom-photo-upload-change .k-upload-dropzone,
[b-j7zhraa02a] .custom-photo-upload-change .k-dropzone,
[b-j7zhraa02a] .custom-photo-upload-change .k-upload-button {
    min-height: 102px !important;
    width: 100% !important;
}

.custom-photo-change-overlay[b-j7zhraa02a] {
    position: absolute;
    inset: 8px;
    border: 1.5px dashed #c1d2e6;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    pointer-events: none;
}

.custom-photo-preview-modal[b-j7zhraa02a] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.72);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.custom-photo-preview-modal-content[b-j7zhraa02a] {
    position: relative;
    width: min(900px, 95vw);
    max-height: 90vh;
    background: #fff;
    border-radius: 12px;
    padding: 0.75rem;
}

.custom-photo-preview-modal-image[b-j7zhraa02a] {
    width: 100%;
    max-height: calc(90vh - 2rem);
    object-fit: contain;
    border-radius: 8px;
}

.custom-photo-preview-modal-close[b-j7zhraa02a] {
    position: absolute;
    top: -12px;
    right: -12px;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 50%;
    background: #ffffff;
    color: #111827;
    font-size: 1.2rem;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25);
}

@media (max-width: 768px) {
    .custom-photo-upload-filled-layout[b-j7zhraa02a] {
        grid-template-columns: 1fr;
    }

    .custom-photo-file-card[b-j7zhraa02a],
    .custom-photo-change-panel[b-j7zhraa02a],
    [b-j7zhraa02a] .custom-photo-upload-change .k-upload-button {
        min-height: 110px;
    }
}
/* /Components/Forms/Products/BranchProductPresentationsManager.razor.rz.scp.css */
/* Estilos Scoped para BranchProductPresentationsManager */

.presentation-add-btn[b-xs9q4xpjx0] {
    width: auto !important;
    white-space: nowrap !important;
    flex-shrink: 0;
    padding: 6px 16px !important;
    min-width: 140px !important;
    border-radius: 10px !important;
}

@media (max-width: 575.98px) {
    .presentation-add-btn[b-xs9q4xpjx0] {
        width: 100% !important;
    }
}

/* Info Box */
.info-box[b-xs9q4xpjx0] {
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
    background-color: #eff6ff;
    border: 1px solid #bfdbfe;
}

.info-box-content[b-xs9q4xpjx0] {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 0.5rem;
}

.info-box-icon[b-xs9q4xpjx0] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    margin-top: 2px;
}

.info-box-icon svg[b-xs9q4xpjx0],
.info-box-icon[b-xs9q4xpjx0]  svg {
    height: 1.1rem;
    width: 1.1rem;
    color: #2563eb;
    fill: #2563eb;
}

.info-box-text[b-xs9q4xpjx0] {
    font-size: 0.85rem;
    line-height: 1.45;
    font-weight: 500;
    text-align: left;
}

.info-box-accent[b-xs9q4xpjx0] {
    color: #1e40af;
}

/* Estado Vacío Compacto y Elegante */
.empty-presentations-card[b-xs9q4xpjx0] {
    border: 1px dashed #cbd5e1 !important;
    border-radius: 12px;
    background-color: #f8fafc;
    transition: border-color 0.2s ease;
}

.empty-presentations-card:hover[b-xs9q4xpjx0] {
    border-color: #94a3b8 !important;
}

/* Tarjeta de Vista Previa de Equivalencia */
.equivalence-preview-card[b-xs9q4xpjx0] {
    background-color: #f8fafc;
    border-color: #e2e8f0;
}

/* Tabla de Presentaciones */
.presentations-table[b-xs9q4xpjx0] {
    font-size: 0.85rem;
}

.presentations-table thead th[b-xs9q4xpjx0] {
    font-weight: 600;
    color: #475569;
    border-bottom: 1px solid #e2e8f0;
}

.presentations-table tbody td[b-xs9q4xpjx0] {
    border-bottom: 1px solid #f1f5f9;
}

.presentations-table tbody tr:last-child td[b-xs9q4xpjx0] {
    border-bottom: none;
}

.text-teal-arregly[b-xs9q4xpjx0] {
    color: #034c48 !important;
}

/* Grupo de Doble Entrada (Cantidad + Selector de Unidad) */
.content-input-group[b-xs9q4xpjx0] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

@media (max-width: 575.98px) {
    .content-input-group[b-xs9q4xpjx0] {
        flex-direction: column;
        align-items: stretch;
    }
}
/* /Components/Forms/Products/ProductForm.razor.rz.scp.css */
/* ProductForm.css - Estilos para el formulario de productos */


.product-form-section[b-tycsbitbgr] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.product-form-grid[b-tycsbitbgr] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.75rem;
}

.product-tab-content[b-tycsbitbgr] {
    min-height: 430px;
}

.image-section[b-tycsbitbgr] {
    width: 100%;
}

@media (min-width: 768px) {
    .product-form-grid[b-tycsbitbgr] {
        grid-template-columns: 1fr 1fr;
    }

@media (max-width: 991.98px) {
    .product-tab-content[b-tycsbitbgr] {
        min-height: 360px;
    }
}
    
    .product-form-grid-3[b-tycsbitbgr] {
        grid-template-columns: 1fr 1fr 1fr;
    }
}

/* Error Alert */
.error-alert[b-tycsbitbgr] {
    background-color: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 0.375rem;
    padding: 0.75rem;
}

.error-alert-content[b-tycsbitbgr] {
    display: flex;
}

.error-alert-icon[b-tycsbitbgr] {
    flex-shrink: 0;
}

.error-alert-icon svg[b-tycsbitbgr] {
    height: 1rem;
    width: 1rem;
    color: #f87171;
}

.error-alert-text[b-tycsbitbgr] {
    margin-left: 0.5rem;
}

.error-alert-title[b-tycsbitbgr] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #991b1b;
}

.error-alert-message[b-tycsbitbgr] {
    margin-top: 0.25rem;
    font-size: 0.875rem;
    color: #dc2626;
}

/* Headers */
.section-header[b-tycsbitbgr] {
    font-weight: 500;
    color: #111827;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.25rem;
    line-height: 1.35;
    margin: 0;
}

.section-header svg[b-tycsbitbgr] {
    height: 1rem;
    width: 1rem;
    color: #6b7280;
}

/* Form Fields */
.form-field[b-tycsbitbgr] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}



/* Input Icons */
.input-icon[b-tycsbitbgr] {
    position: absolute;
    left: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: #6b7280;
    font-size: 0.875rem;
}

.input-icon-right[b-tycsbitbgr] {
    position: absolute;
    right: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    color: #6b7280;
    font-size: 0.875rem;
}

.input-relative[b-tycsbitbgr] {
    position: relative;
}

/* Validation Messages */
.validation-message[b-tycsbitbgr] {
    font-size: 0.75rem;
    color: #dc2626;
}

.form-help-text[b-tycsbitbgr] {
    font-size: 0.75rem;
    color: #6b7280;
}

.branch-assignment-item[b-tycsbitbgr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    padding: 0.75rem 1rem;
    background-color: #ffffff;
}

.branch-assignment-left[b-tycsbitbgr] {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
}

.branch-assignment-name[b-tycsbitbgr] {
    font-weight: 600;
    color: #111827;
}

.branch-assignment-status[b-tycsbitbgr] {
    font-size: 0.75rem;
    color: #6b7280;
    border: 1px solid #e5e7eb;
    border-radius: 999px;
    padding: 0.2rem 0.6rem;
}

.branch-assignment-status.assigned[b-tycsbitbgr] {
    color: #166534;
    border-color: #bbf7d0;
    background-color: #f0fdf4;
}

/* Info Box */
.info-box[b-tycsbitbgr] {
    padding: 0.5rem;
    border-radius: 0.375rem;
    background-color: #eff6ff;
    border: 1px solid #c3ddfd;
}

.info-box-content[b-tycsbitbgr] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 0;
}

.info-box-icon svg[b-tycsbitbgr] {
    height: 1rem;
    width: 1rem;
    color: #2563eb;
}

.info-box-text[b-tycsbitbgr] {
    font-size: 0.875rem;
    font-weight: 500;
    text-align: left;
}

.info-box-accent[b-tycsbitbgr] {
    color: #2563eb;
}

.branch-assignment-toolbar[b-tycsbitbgr] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0.65rem;
    margin-top: 0;
}

.branch-assignment-info-box[b-tycsbitbgr] {
    width: 100%;
    margin-bottom: 0;
}

.branch-full-access-toggle[b-tycsbitbgr] {
    border: 0;
    border-radius: 0;
    background: transparent;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
    color: #111827;
    font-size: 1rem;
    width: fit-content;
}

.branch-assignment-toolbar .branch-full-access-toggle[b-tycsbitbgr] {
    width: fit-content;
}

.branch-assignment-toolbar .branch-full-access-toggle span[b-tycsbitbgr] {
    color: #111827;
    font-size: 1rem;
    font-weight: 500;
}

.branch-full-access-checkbox[b-tycsbitbgr] {
    flex-shrink: 0;
    margin-left: 2px;
}

.branch-full-access-text[b-tycsbitbgr] {
    color: #111827;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1;
}

.branch-full-access-toggle[b-tycsbitbgr]  .k-checkbox-wrap {
    margin: 0 !important;
}


@media (max-width: 991.98px) {
    .branch-assignment-toolbar[b-tycsbitbgr] {
        flex-direction: column;
        align-items: stretch;
    }
}

/* Estado/Switch Container */
.switch-container[b-tycsbitbgr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.5rem;
    border-radius: 0.375rem;
    border: 1px solid #d1d5db;
    background-color: white;
}

.switch-text[b-tycsbitbgr] {
    font-weight: 500;
    font-size: 0.875rem;
}

.switch-description[b-tycsbitbgr] {
    font-size: 0.75rem;
    color: #6b7280;
}

/* Switch Toggle */
.switch-toggle[b-tycsbitbgr] {
    position: relative;
    display: inline-flex;
    align-items: center;
    cursor: pointer;
}

.switch-control[b-tycsbitbgr] {
    display: inline-flex;
    align-items: center;
}

.switch-checkbox[b-tycsbitbgr] {
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
    width: 0 !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
}

.switch-toggle input[type="checkbox"][b-tycsbitbgr] {
    opacity: 0 !important;
    appearance: none;
    -webkit-appearance: none;
}

.switch-slider[b-tycsbitbgr] {
    width: 2.25rem;
    height: 1.25rem;
    background-color: #e5e7eb;
    border-radius: 9999px;
    position: relative;
    transition: background-color 0.2s;
}

.switch-slider[b-tycsbitbgr]::after {
    content: '';
    position: absolute;
    top: 0.125rem;
    left: 0.125rem;
    width: 1rem;
    height: 1rem;
    background-color: white;
    border: 1px solid #d1d5db;
    border-radius: 50%;
    transition: transform 0.2s;
}

.switch-checkbox:checked + .switch-toggle .switch-slider[b-tycsbitbgr] {
    background-color: #2563eb;
}

.switch-checkbox:checked + .switch-toggle .switch-slider[b-tycsbitbgr]::after {
    transform: translateX(1rem);
    border-color: white;
}

.switch-checkbox:focus + .switch-toggle .switch-slider[b-tycsbitbgr] {
    ring: 4px;
    ring-color: #c3ddfd;
}

/* Footer/Buttons */
.form-footer[b-tycsbitbgr] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    padding-top: 0.75rem;
    border-top: 1px solid #e5e7eb;
    margin-top: 1rem;
}

.btn[b-tycsbitbgr] {
    display: inline-flex;
    align-items: center;
    padding: 0.5rem 0.75rem;
    border-radius: 0.375rem;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    font-size: 0.875rem;
    font-weight: 500;
    gap: 0.5rem;
    cursor: pointer;
    transition: all 0.2s;
}

.btn svg[b-tycsbitbgr] {
    height: 1rem;
    width: 1rem;
}

.btn-secondary[b-tycsbitbgr] {
    border: 1px solid #d1d5db;
    color: #374151;
    background-color: white;
}

.btn-secondary:hover[b-tycsbitbgr] {
    background-color: #f9fafb;
}

.btn-primary[b-tycsbitbgr] {
    border: 1px solid transparent;
    color: white;
    background-color: #2563eb;
}

.btn-primary:hover[b-tycsbitbgr] {
    background-color: #1d4ed8;
}

.btn-primary:focus[b-tycsbitbgr], .btn-secondary:focus[b-tycsbitbgr] {
    outline: none;
    ring: 2px;
    ring-offset: 2px;
    ring-color: #3b82f6;
}

.btn:disabled[b-tycsbitbgr] {
    opacity: 0.5;
    cursor: not-allowed;
}

/* Loading Animation */
.btn-loading svg[b-tycsbitbgr] {
    animation: spin-b-tycsbitbgr 1s linear infinite;
}

@keyframes spin-b-tycsbitbgr {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* Product Grid Styles */
.stock-indicator[b-tycsbitbgr] {
    font-weight: 600;
    padding: 0.25rem 0.5rem;
    border-radius: 0.375rem;
}

.stock-empty[b-tycsbitbgr] {
    background-color: #fef2f2;
    color: #dc2626;
}

.stock-low[b-tycsbitbgr] {
    background-color: #fef3c7;
    color: #d97706;
}

.stock-normal[b-tycsbitbgr] {
    background-color: #ecfdf5;
    color: #059669;
}

.price-display[b-tycsbitbgr] {
    font-weight: 600;
    color: #059669;
}

.profit-margin[b-tycsbitbgr] {
    font-weight: 600;
    padding: 0.25rem 0.5rem;
    border-radius: 0.375rem;
}

.profit-good[b-tycsbitbgr] {
    background-color: #ecfdf5;
    color: #059669;
}

.profit-average[b-tycsbitbgr] {
    background-color: #fef3c7;
    color: #d97706;
}

.profit-low[b-tycsbitbgr] {
    background-color: #fef2f2;
    color: #dc2626;
}

/* ==========================================================================
   Packaging Master Card (Unified Gestalt Container & Physical Nature Filter)
   ========================================================================== */
.packaging-master-card[b-tycsbitbgr] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04), 0 1px 2px rgba(15, 23, 42, 0.02);
    overflow: hidden;
    margin-top: 0.25rem;
    margin-bottom: 0.5rem;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.packaging-master-card:hover[b-tycsbitbgr] {
    border-color: #cbd5e1;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
}

/* Header */
.packaging-card-header[b-tycsbitbgr] {
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    padding: 0.85rem 1.25rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.packaging-header-icon[b-tycsbitbgr] {
    width: 34px;
    height: 34px;
    border-radius: 0.5rem;
    background: rgba(3, 76, 72, 0.08);
    color: var(--primary-color, #034C48);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.packaging-header-icon :deep(.k-svg-icon)[b-tycsbitbgr] {
    width: 18px;
    height: 18px;
    color: var(--primary-color, #034C48);
}

.packaging-header-title[b-tycsbitbgr] {
    margin: 0;
    font-size: 0.925rem;
    font-weight: 600;
    color: #0f172a;
    line-height: 1.25;
}

.packaging-header-subtitle[b-tycsbitbgr] {
    font-size: 0.775rem;
    color: #64748b;
    display: block;
    line-height: 1.2;
    margin-top: 0.15rem;
}

.packaging-category-badge[b-tycsbitbgr] {
    font-size: 0.76rem;
    font-weight: 600;
    padding: 0.3rem 0.75rem;
    border-radius: 9999px;
    letter-spacing: 0.01em;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    border: 1px solid transparent;
}

.packaging-badge-soft-liquids[b-tycsbitbgr] {
    background: #e0f2fe;
    color: #0369a1;
    border-color: #bae6fd;
}

.packaging-badge-soft-mass[b-tycsbitbgr] {
    background: #fef3c7;
    color: #92400e;
    border-color: #fde68a;
}

.packaging-badge-soft-linear[b-tycsbitbgr] {
    background: #f1f5f9;
    color: #475569;
    border-color: #cbd5e1;
}

.packaging-badge-soft-discrete[b-tycsbitbgr] {
    background: #ede9fe;
    color: #6d28d9;
    border-color: #ddd6fe;
}

.packaging-badge-soft-multipurpose[b-tycsbitbgr] {
    background: #ecfdf5;
    color: #047857;
    border-color: #a7f3d0;
}

.packaging-badge-soft-pure[b-tycsbitbgr] {
    background: #f3f4f6;
    color: #374151;
    border-color: #e5e7eb;
}

.packaging-badge-soft-neutral[b-tycsbitbgr] {
    background: #f8fafc;
    color: #64748b;
    border-color: #e2e8f0;
}

/* Toolbar (Segmented Pills Filter) */
.packaging-card-toolbar[b-tycsbitbgr] {
    background: #ffffff;
    border-bottom: 1px dashed #e2e8f0;
    padding: 0.65rem 1.25rem;
    display: flex;
    align-items: center;
    gap: 0.85rem;
    flex-wrap: wrap;
}

.packaging-toolbar-label[b-tycsbitbgr] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #475569;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    flex-shrink: 0;
}

.packaging-toolbar-label :deep(.k-svg-icon)[b-tycsbitbgr] {
    width: 13px;
    height: 13px;
    color: var(--primary-color, #034C48);
}

/* Pills Bar - wrap on desktop so no scrollbar arrow appears, scroll smoothly on narrow mobile without native scrollbar */
.packaging-pills-bar[b-tycsbitbgr] {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    flex-wrap: wrap;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.packaging-pills-bar[b-tycsbitbgr]::-webkit-scrollbar {
    display: none;
}

.packaging-pill[b-tycsbitbgr] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem 0.7rem;
    font-size: 0.8rem;
    font-weight: 500;
    color: #475569;
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 9999px;
    white-space: nowrap;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
    user-select: none;
}

.packaging-pill:hover[b-tycsbitbgr] {
    background-color: #f1f5f9;
    border-color: #cbd5e1;
    color: #0f172a;
    transform: translateY(-1px);
}

.packaging-pill.active[b-tycsbitbgr] {
    background-color: var(--primary-color, #034C48) !important;
    border-color: var(--primary-color, #034C48) !important;
    color: #ffffff !important;
    box-shadow: 0 2px 6px rgba(3, 76, 72, 0.25);
}

.pill-icon[b-tycsbitbgr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
    line-height: 1;
}

.pill-icon :deep(.k-svg-icon)[b-tycsbitbgr] {
    width: 14px;
    height: 14px;
    color: #64748b;
    transition: color 0.15s ease-in-out;
}

.packaging-pill:hover .pill-icon :deep(.k-svg-icon)[b-tycsbitbgr] {
    color: var(--primary-color, #034C48);
}

.packaging-pill.active .pill-icon :deep(.k-svg-icon)[b-tycsbitbgr] {
    color: #ffffff !important;
}

.pill-text[b-tycsbitbgr] {
    line-height: 1.2;
}

.pill-badge[b-tycsbitbgr] {
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.05rem 0.4rem;
    border-radius: 9999px;
    background-color: #e2e8f0;
    color: #475569;
    transition: all 0.15s ease-in-out;
}

.packaging-pill.active .pill-badge[b-tycsbitbgr] {
    background-color: rgba(255, 255, 255, 0.25);
    color: #ffffff;
}

.packaging-pill:hover:not(.active) .pill-badge[b-tycsbitbgr] {
    background-color: #cbd5e1;
    color: #1e293b;
}

/* Body */
.packaging-card-body[b-tycsbitbgr] {
    padding: 1.15rem 1.25rem;
    background: #ffffff;
}

.packaging-field-helper[b-tycsbitbgr] {
    font-size: 0.725rem;
    color: #64748b;
    display: block;
    margin-top: 0.25rem;
    line-height: 1.2;
}

/* Footer (Summary & Calculation) */
.packaging-card-footer[b-tycsbitbgr] {
    background: #f8fafc;
    border-top: 1px solid #e2e8f0;
    padding: 0.75rem 1.25rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.packaging-footer-badge[b-tycsbitbgr] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    background: #e6f4f2;
    color: var(--primary-color, #034C48);
    font-weight: 600;
    font-size: 0.75rem;
    padding: 0.2rem 0.6rem;
    border-radius: 9999px;
    border: 1px solid rgba(3, 76, 72, 0.15);
}

.packaging-footer-badge :deep(.k-svg-icon)[b-tycsbitbgr] {
    width: 13px;
    height: 13px;
    color: var(--primary-color, #034C48);
}

.packaging-footer-text[b-tycsbitbgr] {
    font-size: 0.84rem;
    color: #1e293b;
}

.packaging-footer-text strong[b-tycsbitbgr] {
    color: var(--primary-color, #034C48);
    font-weight: 600;
}

.packaging-footer-explanation[b-tycsbitbgr] {
    font-size: 0.775rem;
    color: #64748b;
    font-style: italic;
    margin-left: auto;
}

@media (max-width: 767.98px) {
    .packaging-pills-bar[b-tycsbitbgr] {
        overflow-x: auto;
        flex-wrap: nowrap;
        padding-bottom: 4px;
        -webkit-overflow-scrolling: touch;
    }
    
    .packaging-footer-explanation[b-tycsbitbgr] {
        margin-left: 0;
        width: 100%;
    }
}

/* ==========================================================================
   Multi-Pack / Jerarquía de Empaque y Venta Mayorista
   ========================================================================== */

.multipack-section[b-tycsbitbgr] {
    border-color: #e2e8f0 !important;
}

.multipack-icon-badge[b-tycsbitbgr] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #e6f4f2;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.multipack-icon-badge :deep(.k-svg-icon)[b-tycsbitbgr] {
    width: 16px;
    height: 16px;
    color: var(--primary-color, #034C48);
}

.multipack-card[b-tycsbitbgr] {
    background: #ffffff;
    border-color: #cbd5e1 !important;
    animation: fadeInMultiPack-b-tycsbitbgr 0.2s ease-in-out;
}

@keyframes fadeInMultiPack-b-tycsbitbgr {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.multipack-visual-pill[b-tycsbitbgr] {
    background: #f1f5f9;
    border-color: #cbd5e1 !important;
}

.multipack-visual-pill :deep(.k-svg-icon)[b-tycsbitbgr] {
    width: 16px;
    height: 16px;
}

.supplier-cost-helper-card[b-tycsbitbgr] {
    background: #f8fafc;
    border-color: #e2e8f0 !important;
}

.multipack-insumo-notice[b-tycsbitbgr] {
    background: #fffbeb !important;
    border-color: #fef3c7 !important;
}

.wholesale-toggle-card[b-tycsbitbgr] {
    background: #f8fafc;
    border-color: #e2e8f0 !important;
}

.wholesale-fields-panel[b-tycsbitbgr] {
    background: #ffffff;
    border-color: #cbd5e1 !important;
}

.multipack-toggle-strip[b-tycsbitbgr] {
    background: #f8fafc;
    border-color: #e2e8f0 !important;
    transition: all 0.2s ease-in-out;
}

.multipack-toggle-strip:hover[b-tycsbitbgr] {
    background: #f1f5f9;
    border-color: #cbd5e1 !important;
}

.multipack-active-panel[b-tycsbitbgr] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05);
    transition: all 0.2s ease-in-out;
}

.supplier-cost-inline-bar[b-tycsbitbgr] {
    background: #f8fafc;
    border-color: #e2e8f0 !important;
}

.bg-teal-subtle[b-tycsbitbgr] {
    background-color: #e6f4f2 !important;
}

.text-teal[b-tycsbitbgr] {
    color: var(--primary-color, #034C48) !important;
}

.border-teal-subtle[b-tycsbitbgr] {
    border-color: rgba(3, 76, 72, 0.2) !important;
}

.shadow-xs[b-tycsbitbgr] {
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}

.cost-calculator-card[b-tycsbitbgr] {
    background: #f8fafc;
    border-color: #e2e8f0 !important;
}

.calculator-badge-icon[b-tycsbitbgr] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #e6f4f2;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.calculator-badge-icon :deep(.k-svg-icon)[b-tycsbitbgr] {
    width: 16px;
    height: 16px;
    color: var(--primary-color, #034C48);
}

.cost-result-box[b-tycsbitbgr] {
    background: #f0fdf4 !important;
    border-color: #bbf7d0 !important;
}

.cost-hint-box[b-tycsbitbgr] {
    background: #f8fafc !important;
    border-color: #e2e8f0 !important;
}

/* Tax Summary Card Styles - SOTA Harmonious UI/UX */
.product-tax-summary-card[b-tycsbitbgr] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 1.15rem 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03), 0 4px 12px rgba(3, 76, 72, 0.03);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.tax-summary-icon-pill[b-tycsbitbgr] {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: #e6f4f2 !important;
    color: var(--primary-color, #034C48) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.tax-summary-icon-pill :deep(.k-svg-icon)[b-tycsbitbgr] {
    width: 18px;
    height: 18px;
}

.tax-summary-title[b-tycsbitbgr] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.25;
    letter-spacing: -0.01em;
}

.tax-summary-subtitle[b-tycsbitbgr] {
    font-size: 0.76rem;
    color: #64748b;
}

.tax-summary-badge[b-tycsbitbgr] {
    padding: 0.3rem 0.85rem;
    border-radius: 9999px;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

.tax-badge-active[b-tycsbitbgr] {
    background: #e6f4f2;
    color: #034c48;
    border: 1px solid #cce8e5;
}

.tax-badge-neutral[b-tycsbitbgr] {
    background: #f1f5f9;
    color: #64748b;
    border: 1px solid #e2e8f0;
}

/* Equation Container & Cards */
.tax-equation-container[b-tycsbitbgr] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    align-items: stretch;
}

@media (min-width: 768px) {
    .tax-equation-container[b-tycsbitbgr] {
        flex-direction: row;
        align-items: center;
        gap: 0.625rem;
    }
}

.tax-equation-card[b-tycsbitbgr] {
    flex: 1;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 0.85rem 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.tax-equation-card:hover[b-tycsbitbgr] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
}

.tax-equation-card-total[b-tycsbitbgr] {
    background: linear-gradient(145deg, #f0fdf9 0%, #e6f4f2 100%);
    border: 1.5px solid #a7f3d0;
    box-shadow: 0 2px 8px rgba(3, 76, 72, 0.06);
}

.tax-equation-label[b-tycsbitbgr] {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
    margin-bottom: 0.35rem;
}

.text-teal-highlight[b-tycsbitbgr] {
    color: #034c48;
}

.tax-equation-value[b-tycsbitbgr] {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2;
    font-feature-settings: "tnum";
    font-variant-numeric: tabular-nums;
    margin-bottom: 0.25rem;
}

.tax-value-accent[b-tycsbitbgr] {
    color: #0d9488;
}

.tax-value-total[b-tycsbitbgr] {
    color: #034c48;
    font-size: 1.35rem;
    font-weight: 800;
}

.tax-equation-caption[b-tycsbitbgr] {
    font-size: 0.70rem;
    color: #94a3b8;
    font-weight: 500;
}

.text-teal-caption[b-tycsbitbgr] {
    color: #0f766e;
    font-weight: 600;
}

/* Operators */
.tax-equation-operator[b-tycsbitbgr] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.tax-equation-operator span[b-tycsbitbgr] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #f1f5f9;
    color: #64748b;
    border: 1px solid #e2e8f0;
    font-size: 0.8rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
}

@media (max-width: 767.98px) {
    .tax-equation-operator[b-tycsbitbgr] {
        height: 12px;
    }
    .tax-equation-operator span[b-tycsbitbgr] {
        width: 20px;
        height: 20px;
        font-size: 0.75rem;
    }
}

/* Explainer Banner */
.tax-summary-explainer[b-tycsbitbgr] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 0.65rem 0.875rem;
    font-size: 0.77rem;
    line-height: 1.45;
    color: #334155;
}

.tax-explainer-icon[b-tycsbitbgr] {
    color: var(--primary-color, #034C48) !important;
}

.tax-summary-explainer strong[b-tycsbitbgr] {
    color: #0f172a;
    font-weight: 600;
}

/* Empty State */
.tax-summary-empty-state[b-tycsbitbgr] {
    background: #f8fafc;
    border: 1px dashed #cbd5e1;
    border-radius: 10px;
    font-size: 0.8rem;
    color: #64748b;
}



/* /Components/Forms/Quotes/Modals/QuoteDetailsModal.razor.rz.scp.css */
/* Contenedor principal del detalle de cotización (sin card gris envolvente) */
.quote-detail-modal[b-s1876ugtx3] {
    background: transparent;
    padding: 0;
    border: 0;
    position: relative;
}

/* Botón "Enviar al cliente" posicionado abajo-derecha del body, al lado
   del contenido del tab activo (solo visible en Resumen y Cliente). */
.quote-detail-inline-action[b-s1876ugtx3] {
    display: flex;
    justify-content: flex-end;
    padding: 0.75rem 0 0.25rem;
}

/* Altura mínima fija para que el modal no salte al navegar entre tabs */
.quote-detail-tab-content[b-s1876ugtx3] {
    min-height: 460px;
    padding-top: 0.25rem;
}

/* Reduce el espacio inferior de las pestañas y unifica el tamaño de fuente
   de los títulos (Resumen, Cliente, Items) solo dentro de este modal. */
.quote-detail-modal[b-s1876ugtx3]  .shared-form-tabs .k-link {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
    min-height: 36px !important;
}

/* Igualar tamaño/peso de fuente en todas las tabs y en cualquier nodo interno
   (Telerik puede envolver el título en spans). Se fuerza también en el estado
   activo/seleccionado para que la tab activa no se vea "más grande". */
.quote-detail-modal[b-s1876ugtx3]  .shared-form-tabs .k-link,
.quote-detail-modal[b-s1876ugtx3]  .shared-form-tabs .k-link *,
.quote-detail-modal[b-s1876ugtx3]  .shared-form-tabs .k-item.k-active .k-link,
.quote-detail-modal[b-s1876ugtx3]  .shared-form-tabs .k-item.k-active .k-link *,
.quote-detail-modal[b-s1876ugtx3]  .shared-form-tabs .k-item.k-selected .k-link,
.quote-detail-modal[b-s1876ugtx3]  .shared-form-tabs .k-item.k-selected .k-link *,
.quote-detail-modal[b-s1876ugtx3]  .shared-form-tabs .k-link[aria-selected='true'],
.quote-detail-modal[b-s1876ugtx3]  .shared-form-tabs .k-link[aria-selected='true'] * {
    font-size: 0.95rem !important;
    line-height: 1.2 !important;
    font-weight: 500 !important;
}

.quote-detail-modal[b-s1876ugtx3]  .shared-form-tabs .k-tabstrip-content,
.quote-detail-modal[b-s1876ugtx3]  .shared-form-tabs .k-tabstrip-content > .k-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

.quote-header-title[b-s1876ugtx3] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.quote-header-code[b-s1876ugtx3] {
    font-weight: 700;
    font-size: 1.05rem;
    color: #111827;
    letter-spacing: 0.01em;
}

.quote-header-badge[b-s1876ugtx3] {
    display: inline-flex;
    align-items: center;
    padding: 2px 10px;
    background: #f3f4f6;
    color: #374151;
    border: 1px solid #e5e7eb;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.quote-detail-content[b-s1876ugtx3] {
    padding-top: 0.5rem;
}

/* Tarjetas internas con bordes definidos.
   Se usa ::deep porque las cards viven dentro de componentes hijos
   (QuoteDetailsSummaryTab, QuoteDetailsClientTab, QuoteDetailsItemsTab)
   y la encapsulación CSS de Blazor no las alcanza directamente. */
.quote-detail-modal[b-s1876ugtx3]  .card {
    border: 1px solid #d1d5db !important;
    border-radius: 12px !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05) !important;
    background: #ffffff !important;
    overflow: hidden;
}

.quote-detail-modal[b-s1876ugtx3]  .card-header {
    background: #f8fafc !important;
    border-bottom: 1px solid #d1d5db !important;
    font-weight: 600 !important;
}

/* Tarjetas estadísticas (Resumen) */
.quote-detail-modal[b-s1876ugtx3]  .quote-stat-card {
    border: 1px solid #d1d5db !important;
    border-radius: 12px !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05) !important;
    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.quote-detail-modal[b-s1876ugtx3]  .quote-stat-card:hover {
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(15, 23, 42, 0.08) !important;
}

.stat-icon[b-s1876ugtx3] {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.stat-icon-success[b-s1876ugtx3] { background: #dcfce7; color: #16a34a; }
.stat-icon-info[b-s1876ugtx3]    { background: #dbeafe; color: #2563eb; }
.stat-icon-warning[b-s1876ugtx3] { background: #fee2e2; color: #dc2626; }
.stat-icon-dark[b-s1876ugtx3]    { background: #e5e7eb; color: #111827; }

/* Resumen financiero: filas etiqueta-valor (label izquierda, valor derecha).
   ::deep porque las filas viven dentro de QuoteDetailsSummaryTab. */
.quote-detail-modal[b-s1876ugtx3]  .financial-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 0;
}

.quote-detail-modal[b-s1876ugtx3]  .financial-row + .financial-row {
    margin-top: 4px;
}

.quote-detail-modal[b-s1876ugtx3]  .financial-total-row {
    margin-top: 10px;
    padding-top: 12px;
    border-top: 1px solid #d1d5db;
    font-size: 1.05rem;
}

/* Tab Cliente */
.client-info-card[b-s1876ugtx3],
.client-actions-card[b-s1876ugtx3] {
    border: 1px solid #d1d5db !important;
    border-radius: 14px !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05) !important;
}

.client-card-header[b-s1876ugtx3] {
    background: #f8fafc !important;
    border-bottom: 1px solid #d1d5db !important;
    padding: 14px 16px !important;
}

.client-header-icon[b-s1876ugtx3] {
    color: var(--primary-color) !important;
}

.client-field-label[b-s1876ugtx3] {
    color: #6b7280;
    font-size: 12px;
    margin-bottom: 4px;
}

.client-field-value[b-s1876ugtx3] {
    color: #111827;
    font-weight: 600;
}

.client-data-icon[b-s1876ugtx3] {
    color: #6b7280;
}

/* Tab Items */
.quote-items-card[b-s1876ugtx3] {
    border-radius: 12px;
    overflow: hidden;
}

/* Cada item como bloque con jerarquía clara.
   ::deep porque el contenido vive dentro de QuoteDetailsItemsTab. */
.quote-detail-modal[b-s1876ugtx3]  .quote-item-card {
    padding: 12px 16px;
    border-bottom: 1px solid #e5e7eb;
    transition: background-color 0.2s ease;
}

.quote-detail-modal[b-s1876ugtx3]  .quote-item-card:last-of-type {
    border-bottom: 0;
}

.quote-detail-modal[b-s1876ugtx3]  .quote-item-card:hover {
    background: #f8fafc;
}

/* 1. Encabezado del item — tipo y nombre en una sola línea */
.quote-detail-modal[b-s1876ugtx3]  .quote-item-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.quote-detail-modal[b-s1876ugtx3]  .quote-item-head-info {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    flex-wrap: wrap;
}

.quote-detail-modal[b-s1876ugtx3]  .quote-item-type-chip {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    border-radius: 999px;
    border: 1px solid transparent;
    line-height: 1.3;
    flex-shrink: 0;
}

.quote-detail-modal[b-s1876ugtx3]  .quote-item-type-chip.is-service {
    background: #dbeafe;
    color: #1d4ed8;
    border-color: #bfdbfe;
}

.quote-detail-modal[b-s1876ugtx3]  .quote-item-type-chip.is-product {
    background: #fef3c7;
    color: #b45309;
    border-color: #fde68a;
}

.quote-detail-modal[b-s1876ugtx3]  .quote-item-name {
    font-size: 0.9rem;
    font-weight: 600;
    color: #111827;
    line-height: 1.3;
}

.quote-detail-modal[b-s1876ugtx3]  .quote-item-head-total {
    font-size: 0.95rem;
    font-weight: 600;
    color: #111827;
    white-space: nowrap;
}

/* 2. Información principal — texto plano (item en negrilla, dato normal) */
.quote-detail-modal[b-s1876ugtx3]  .quote-item-chips {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 18px;
    margin-top: 8px;
}

.quote-detail-modal[b-s1876ugtx3]  .quote-fact {
    font-size: 0.85rem;
    color: #374151;
    line-height: 1.4;
}

.quote-detail-modal[b-s1876ugtx3]  .quote-fact strong {
    color: #111827;
    font-weight: 600;
    margin-right: 4px;
}

.quote-detail-modal[b-s1876ugtx3]  .quote-fact.is-discount {
    color: #dc2626;
}

.quote-detail-modal[b-s1876ugtx3]  .quote-fact.is-discount strong {
    color: #dc2626;
}

/* 3. Información económica — píldoras destacadas */
.quote-detail-modal[b-s1876ugtx3]  .quote-item-econ {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
}

.quote-detail-modal[b-s1876ugtx3]  .quote-econ-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    font-size: 0.8rem;
}

/* Espacio visual entre las chips informativas y las píldoras económicas */
.quote-detail-modal[b-s1876ugtx3]  .quote-chip + .quote-econ-pill {
    margin-left: 12px;
}

.quote-detail-modal[b-s1876ugtx3]  .quote-econ-pill.is-discount {
    background: #fef2f2;
    border-color: #fecaca;
}

.quote-detail-modal[b-s1876ugtx3]  .quote-econ-pill.is-discount .quote-chip-value {
    color: #dc2626;
}

/* 4. Información secundaria — tags muy sutiles */
.quote-detail-modal[b-s1876ugtx3]  .quote-item-secondary {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 6px;
}

.quote-detail-modal[b-s1876ugtx3]  .quote-secondary-tag {
    font-size: 0.72rem;
    color: #6b7280;
    background: transparent;
    border: 1px dashed #d1d5db;
    border-radius: 6px;
    padding: 2px 8px;
}

/* 5. Resumen de totales */
.quote-detail-modal[b-s1876ugtx3]  .quote-items-summary {
    display: flex;
    justify-content: flex-end;
    padding: 14px 18px;
    background: #f9fafb;
    border-top: 1px solid #e5e7eb;
}

.quote-detail-modal[b-s1876ugtx3]  .quote-items-summary-inner {
    min-width: 240px;
}

@media (max-width: 480px) {
    .quote-detail-modal[b-s1876ugtx3]  .quote-items-summary-inner {
        min-width: 0;
        width: 100%;
    }
}

/* Footer del modal: Anterior (izquierda) — paso/acción (centro) — Siguiente (derecha) */
.quote-detail-footer[b-s1876ugtx3] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.quote-detail-footer-center[b-s1876ugtx3] {
    display: inline-flex;
    align-items: center;
    gap: 12px;
}

.quote-detail-step[b-s1876ugtx3] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #6b7280;
    min-width: 42px;
    text-align: center;
}

@media (max-width: 768px) {
    .quote-detail-footer[b-s1876ugtx3] {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        justify-content: space-between !important;
        gap: 8px !important;
        width: 100% !important;
    }

    /* Botón izquierdo (outline: Anterior / Cerrar) */
    .quote-detail-footer[b-s1876ugtx3]  .btn-outline-primary-arregly {
        order: 1 !important;
        flex: 1 1 calc(50% - 4px) !important;
        min-width: 0 !important;
        width: auto !important;
        margin: 0 !important;
    }

    /* Botón derecho (gradient: Siguiente / Cerrar) */
    .quote-detail-footer[b-s1876ugtx3]  .btn-gradient-primary-arregly {
        order: 2 !important;
        flex: 1 1 calc(50% - 4px) !important;
        min-width: 0 !important;
        width: auto !important;
        margin: 0 !important;
    }

    /* Homologación de estilos con el sistema de botones Arregly (Imagen 3 / Mockup) */
    .quote-detail-footer[b-s1876ugtx3]  .btn-arregly,
    .quote-detail-footer[b-s1876ugtx3]  .k-button {
        min-height: 34px !important;
        height: auto !important;
        padding: 8px 10px !important;
        font-size: 0.84rem !important;
        font-weight: 500 !important;
        border-radius: 12px !important;
        justify-content: center !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 6px !important;
        white-space: nowrap !important;
    }

    .quote-detail-footer[b-s1876ugtx3]  .k-button svg,
    .quote-detail-footer[b-s1876ugtx3]  .k-button .k-svg-icon {
        width: 15px !important;
        height: 15px !important;
        flex-shrink: 0 !important;
    }

    .quote-detail-footer[b-s1876ugtx3]  .k-button .k-button-text {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    /* Indicador de paso en la fila inferior centrada */
    .quote-detail-footer-center[b-s1876ugtx3] {
        order: 3 !important;
        width: 100% !important;
        display: flex !important;
        justify-content: center !important;
        margin-top: 4px !important;
    }

    .quote-detail-tab-content[b-s1876ugtx3] {
        min-height: 420px;
    }
}

/* /Components/Forms/Quotes/Modals/QuoteItemModal.razor.rz.scp.css */
/* ==========================================================================
   QuoteItemModal.razor.css - SOTA 2026 Mobile-First Design System
   ========================================================================== */

/* Topbar & Active Item Banner */
.quote-modal-topbar[b-jtdebytnpw] {
    align-items: center;
}

.quote-field-label[b-jtdebytnpw] {
    font-size: 0.76rem;
    font-weight: 600;
    color: #475569;
    letter-spacing: 0.02em;
}

.quote-type-pill-box[b-jtdebytnpw] {
    min-width: 200px;
}

.quote-selected-banner[b-jtdebytnpw] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.625rem 1rem;
    border-radius: 12px;
    transition: all 0.25s ease-in-out;
    min-height: 48px;
    box-sizing: border-box;
}

.quote-selected-banner-active[b-jtdebytnpw] {
    background: linear-gradient(135deg, #f0fdf9 0%, #ffffff 100%);
    border: 1.5px solid #a7f3d0;
    box-shadow: 0 2px 8px rgba(3, 76, 72, 0.05);
}

.quote-selected-banner-empty[b-jtdebytnpw] {
    background: #f8fafc;
    border: 1px dashed #cbd5e1;
}

.quote-selected-icon[b-jtdebytnpw] {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: #e6f4f2;
    color: var(--primary-color, #034c48);
    display: flex;
    align-items: center;
    justify-content: center;
}

.quote-selected-icon :deep(.k-svg-icon)[b-jtdebytnpw] {
    width: 17px;
    height: 17px;
}

.quote-selected-type-label[b-jtdebytnpw] {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
    line-height: 1;
    margin-bottom: 2px;
}

.quote-selected-title[b-jtdebytnpw] {
    font-size: 0.90rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.25;
}

.quote-selected-price-tag[b-jtdebytnpw] {
    background: #e6f4f2;
    border: 1px solid #cce8e5;
    border-radius: 8px;
    padding: 0.25rem 0.625rem;
}

.quote-price-val[b-jtdebytnpw] {
    font-size: 0.92rem;
    font-weight: 800;
    color: #034c48;
    font-feature-settings: "tnum";
    font-variant-numeric: tabular-nums;
}

/* Selector & Cards Layout */
.quote-item-selector-card[b-jtdebytnpw],
.quote-item-actions-card[b-jtdebytnpw] {
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
}

.quote-item-selector-list[b-jtdebytnpw] {
    max-height: 450px;
    overflow-y: auto;
    overflow-x: hidden !important;
    display: flex;
    flex-direction: column;
    gap: 0.55rem;
    padding-right: 4px;
}

/* Custom sleek scrollbar */
.quote-item-selector-list[b-jtdebytnpw]::-webkit-scrollbar {
    width: 5px;
}
.quote-item-selector-list[b-jtdebytnpw]::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 4px;
}
.quote-item-selector-list[b-jtdebytnpw]::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}
.quote-item-selector-list[b-jtdebytnpw]::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* Catalog Card Item - SOTA 2026 Structured Vertical Card */
.quote-catalog-item[b-jtdebytnpw] {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 0.65rem 0.85rem;
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    background-color: #ffffff;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    cursor: pointer;
    box-sizing: border-box;
    width: 100%;
}

.quote-catalog-header-row[b-jtdebytnpw] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 0.5rem;
    width: 100%;
}

.quote-catalog-info[b-jtdebytnpw] {
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
    min-width: 0;
    flex: 1;
}

.quote-catalog-avatar[b-jtdebytnpw] {
    width: 34px;
    height: 34px;
    min-width: 34px;
    border-radius: 8px;
    background: #e6f4f2;
    color: #034c48;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 1px;
}

.quote-catalog-avatar :deep(.k-svg-icon)[b-jtdebytnpw] {
    width: 17px;
    height: 17px;
}

.quote-catalog-avatar-service[b-jtdebytnpw] {
    background: #f0fdf4;
    color: #166534;
}

.quote-catalog-title-group[b-jtdebytnpw] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.quote-catalog-name[b-jtdebytnpw] {
    font-weight: 700;
    font-size: 0.88rem;
    color: #0f172a;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.3;
}

.quote-catalog-submeta[b-jtdebytnpw] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: wrap;
    margin-top: 2px;
}

.quote-catalog-sku-badge[b-jtdebytnpw] {
    font-size: 0.68rem;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
    background: #f1f5f9;
    color: #475569;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    padding: 0.05rem 0.35rem;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
}

.quote-catalog-brand-label[b-jtdebytnpw] {
    font-size: 0.72rem;
    color: #64748b;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.quote-catalog-price-group[b-jtdebytnpw] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-shrink: 0;
    text-align: right;
    margin-top: 2px;
}

.quote-catalog-price[b-jtdebytnpw] {
    font-size: 0.90rem;
    font-weight: 700;
    color: #034c48;
    font-feature-settings: "tnum";
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.quote-catalog-price-range[b-jtdebytnpw] {
    font-size: 0.78rem;
    font-weight: 700;
    color: #034c48;
    white-space: nowrap;
}

.quote-selected-indicator[b-jtdebytnpw] {
    color: #034c48;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    background: #a7f3d0;
    border-radius: 50%;
}

.quote-selected-indicator :deep(.k-svg-icon)[b-jtdebytnpw] {
    width: 12px;
    height: 12px;
    color: #065f46;
}

.quote-pres-chips-row[b-jtdebytnpw] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    width: 100%;
}

.quote-pres-chip[b-jtdebytnpw] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.2rem 0.55rem;
    border-radius: 6px;
    font-size: 0.72rem;
    font-weight: 500;
    background: #f8fafc;
    color: #334155;
    border: 1px solid #e2e8f0;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
    line-height: 1.25;
    white-space: nowrap;
}

.quote-pres-chip:hover[b-jtdebytnpw] {
    background: #f1f5f9;
    border-color: #cbd5e1;
    color: #0f172a;
}

.quote-pres-chip-active[b-jtdebytnpw] {
    background: #e6f4f2 !important;
    border-color: #034c48 !important;
    color: #034c48 !important;
    font-weight: 700 !important;
    box-shadow: 0 1px 3px rgba(3, 76, 72, 0.12);
}

.quote-chip-svg[b-jtdebytnpw] {
    width: 12px !important;
    height: 12px !important;
    opacity: 0.75;
}

.quote-catalog-stock-row[b-jtdebytnpw] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
    width: 100%;
}

.quote-catalog-item-enabled:hover[b-jtdebytnpw] {
    border-color: #94a3b8;
    background-color: #f8fafc;
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
    z-index: 20;
}

.quote-product-item-disabled[b-jtdebytnpw] {
    cursor: not-allowed;
    background-color: #fafbfc;
    border-color: #e2e8f0;
}

.quote-product-item-disabled .quote-catalog-name[b-jtdebytnpw],
.quote-product-item-disabled .quote-catalog-price[b-jtdebytnpw] {
    color: #94a3b8;
}

.quote-product-item-disabled:hover[b-jtdebytnpw] {
    background-color: #fafbfc;
    border-color: #e2e8f0;
    transform: none;
    box-shadow: none;
}

.quote-catalog-item-selected[b-jtdebytnpw] {
    border: 1.5px solid #034c48 !important;
    background: linear-gradient(135deg, #f0fdf9 0%, #ffffff 100%) !important;
    box-shadow: 0 2px 8px rgba(3, 76, 72, 0.08);
}

/* Skeleton Card Items */
.quote-catalog-skeleton-item[b-jtdebytnpw] {
    cursor: default !important;
    pointer-events: none;
    border-color: #f1f5f9;
    background-color: #ffffff;
}

.quote-catalog-skeleton-item:hover[b-jtdebytnpw] {
    transform: none !important;
    box-shadow: none !important;
    border-color: #f1f5f9 !important;
    background-color: #ffffff !important;
}

/* Badges */
.quote-catalog-badge[b-jtdebytnpw] {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 0.15rem 0.55rem;
    font-size: 0.70rem;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
}

.quote-catalog-badge-associated[b-jtdebytnpw] {
    background-color: #e6f4f2;
    color: #034c48;
    border: 1px solid #cce8e5;
}

.quote-catalog-badge-unassociated[b-jtdebytnpw] {
    background-color: #f1f5f9;
    color: #64748b;
    border: 1px solid #e2e8f0;
}

.quote-catalog-badge-stock-ok[b-jtdebytnpw],
.quote-stock-pill-ok[b-jtdebytnpw] {
    background-color: #ecfdf5 !important;
    color: #065f46 !important;
    border: 1px solid #a7f3d0 !important;
}

.quote-catalog-badge-stock-missing[b-jtdebytnpw],
.quote-stock-pill-missing[b-jtdebytnpw] {
    background-color: #fef2f2 !important;
    color: #991b1b !important;
    border: 1px solid #fecaca !important;
}

.quote-catalog-badge-bottled[b-jtdebytnpw] {
    background-color: #eff6ff !important;
    color: #1d4ed8 !important;
    border: 1px solid #bfdbfe !important;
    font-size: 0.70rem;
    font-weight: 600;
}

/* Tactile Modern Stepper */
.quote-stepper[b-jtdebytnpw] {
    display: flex;
    align-items: center;
    background: #f8fafc;
    border: 1px solid #d0d5dd;
    border-radius: 12px;
    padding: 2px 4px;
    height: 38px;
    box-sizing: border-box;
}

.quote-stepper :deep(.quote-stepper-btn)[b-jtdebytnpw] {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    padding: 0 !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    color: #0f172a !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: all 0.15s ease !important;
}

.quote-stepper :deep(.quote-stepper-btn:hover:not(:disabled))[b-jtdebytnpw] {
    background: #e6f4f2 !important;
    color: #034c48 !important;
    border-color: #a7f3d0 !important;
}

.quote-stepper :deep(.quote-stepper-btn:disabled)[b-jtdebytnpw] {
    opacity: 0.45 !important;
    cursor: not-allowed !important;
}

.quote-stepper-val[b-jtdebytnpw],
.quote-stepper-input[b-jtdebytnpw] {
    flex: 1;
    width: 100%;
    min-width: 0;
    text-align: center;
    font-weight: 700;
    font-size: 0.95rem;
    color: #0f172a;
    border: none;
    background: transparent;
    outline: none;
    padding: 0;
    margin: 0;
    font-feature-settings: "tnum";
    font-variant-numeric: tabular-nums;
    -moz-appearance: textfield;
}

.quote-stepper-input[b-jtdebytnpw]::-webkit-outer-spin-button,
.quote-stepper-input[b-jtdebytnpw]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Empty Selection Card */
.quote-empty-selection-card[b-jtdebytnpw] {
    background: #f8fafc;
    border: 1.5px dashed #cbd5e1;
    border-radius: 12px;
}

.quote-empty-icon-circle[b-jtdebytnpw] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #e2e8f0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #64748b;
}

.quote-empty-icon-circle :deep(.k-svg-icon)[b-jtdebytnpw] {
    width: 18px;
    height: 18px;
}

/* ==========================================================================
   Vertical Rhythm & Space-y for Configuration & Breakdown Panel
   ========================================================================== */
.quote-actions-stack[b-jtdebytnpw] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem; /* Generous 20px vertical rhythm between sections */
    width: 100%;
}

.quote-action-section[b-jtdebytnpw] {
    width: 100%;
}

.quote-form-label[b-jtdebytnpw] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #334155;
    letter-spacing: 0.015em;
    display: block;
}

/* Financial Summary Card */
.service-tax-summary-card[b-jtdebytnpw] {
    background: #f8fafc;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px;
    padding: 1.125rem 1.25rem !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
    transition: all 0.2s ease-in-out;
}

/* Supplies Required Card */
.quote-supplies-card[b-jtdebytnpw] {
    background: #f8fafc;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px;
    padding: 1.125rem 1.25rem !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
    transition: all 0.2s ease-in-out;
}

.quote-supplies-header[b-jtdebytnpw] {
    margin-bottom: 0.75rem;
    padding-bottom: 0.65rem;
    border-bottom: 1px solid #edf2f7;
}

.quote-supplies-list[b-jtdebytnpw] {
    display: flex;
    flex-direction: column;
}

.quote-supply-row[b-jtdebytnpw] {
    padding: 0.25rem 0;
}

.quote-supply-row-divided[b-jtdebytnpw] {
    border-top: 1px solid #eef2f6;
    margin-top: 0.65rem;
    padding-top: 0.65rem;
}

.quote-supply-indicator[b-jtdebytnpw] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}

.quote-supply-indicator.indicator-ok[b-jtdebytnpw] {
    background-color: #0d9488;
}

.quote-supply-indicator.indicator-danger[b-jtdebytnpw] {
    background-color: #ef4444;
}

.quote-supply-badge[b-jtdebytnpw] {
    font-size: 0.72rem;
    font-weight: 700;
    padding: 0.2rem 0.6rem;
    border-radius: 9999px;
    white-space: nowrap;
    letter-spacing: 0.01em;
}

.quote-supply-badge.badge-req-ok[b-jtdebytnpw] {
    background: #e6f4f2;
    color: #034c48;
    border: 1px solid #cce8e5;
}

.quote-supply-badge.badge-req-danger[b-jtdebytnpw] {
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

.quote-supply-warning-banner[b-jtdebytnpw] {
    background-color: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    color: #991b1b;
    padding: 0.45rem 0.65rem;
    font-size: 0.72rem;
    line-height: 1.35;
}

.service-tax-badge-active[b-jtdebytnpw] {
    background: #e6f4f2;
    color: #034c48;
    border: 1px solid #cce8e5;
    padding: 0.2rem 0.5rem;
    border-radius: 9999px;
}

.service-tax-badge-neutral[b-jtdebytnpw] {
    background: #f1f5f9;
    color: #64748b;
    border: 1px solid #e2e8f0;
    padding: 0.2rem 0.5rem;
    border-radius: 9999px;
}

.text-teal[b-jtdebytnpw] {
    color: #034c48 !important;
}

/* Popover for Service Stock Breakdown */
.quote-stock-popover-wrapper[b-jtdebytnpw] {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    z-index: 10;
}

.quote-stock-popover-wrapper:hover[b-jtdebytnpw] {
    z-index: 10050;
}

.quote-stock-popover-card[b-jtdebytnpw] {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    z-index: 10050 !important;
    min-width: 290px;
    max-width: 360px;
    background: #ffffff !important;
    background-color: #ffffff !important;
    border: 1.5px solid #cbd5e1 !important;
    border-radius: 0.65rem;
    padding: 0.75rem;
    box-shadow: 0 16px 36px -4px rgba(15, 23, 42, 0.28), 0 4px 12px -2px rgba(15, 23, 42, 0.15) !important;
    visibility: hidden;
    opacity: 0;
    transform: translateY(-4px);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
    pointer-events: none;
}

.quote-stock-popover-wrapper:hover .quote-stock-popover-card[b-jtdebytnpw] {
    visibility: visible;
    opacity: 1 !important;
    transform: translateY(0);
    pointer-events: auto;
}

.quote-stock-popover-header[b-jtdebytnpw] {
    border-bottom: 1px solid #f0f2f5;
    padding-bottom: 0.35rem;
    margin-bottom: 0.45rem;
    font-size: 0.76rem;
    color: #475467;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.quote-stock-popover-body[b-jtdebytnpw] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    max-height: 230px;
    overflow-y: auto;
}

.quote-stock-popover-item[b-jtdebytnpw] {
    background-color: #f8fafc;
    border: 1px solid #eef2f6;
    border-radius: 0.5rem;
    padding: 0.45rem 0.55rem;
    line-height: 1.35;
}

.quote-stock-popover-item.item-missing-stock[b-jtdebytnpw] {
    background-color: #fff5f5;
    border-color: #fed7d7;
}

/* Modal Footer & Sticky Actions */
.quote-item-modal-footer[b-jtdebytnpw] {
    width: 100%;
}

.quote-footer-total-box[b-jtdebytnpw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.quote-footer-total-label[b-jtdebytnpw] {
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #64748b;
}

.quote-footer-total-amount[b-jtdebytnpw] {
    font-size: 1.25rem;
    font-weight: 800;
    color: #034c48;
    font-feature-settings: "tnum";
    font-variant-numeric: tabular-nums;
}

.quote-footer-buttons[b-jtdebytnpw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* Standardized input borders */
[b-jtdebytnpw] .k-textbox,
[b-jtdebytnpw] .k-picker,
[b-jtdebytnpw] .k-datepicker,
[b-jtdebytnpw] .k-dropdownlist,
[b-jtdebytnpw] .k-numerictextbox,
[b-jtdebytnpw] .k-textarea,
[b-jtdebytnpw] .form-select,
[b-jtdebytnpw] .form-control {
    border: 1px solid #d0d5dd !important;
    border-radius: 12px !important;
    background-color: #ffffff !important;
}

/* ==========================================================================
   Mobile-First Media Queries (SOTA 2026)
   ========================================================================== */
@media (max-width: 991.98px) {
    .quote-item-selector-list[b-jtdebytnpw] {
        max-height: 240px;
    }

    .quote-actions-stack[b-jtdebytnpw] {
        gap: 1.125rem;
    }
}

@media (max-width: 767.98px) {
    .quote-actions-stack[b-jtdebytnpw] {
        gap: 1rem;
    }

    .quote-modal-topbar[b-jtdebytnpw] {
        gap: 0.75rem !important;
    }

    .quote-type-pill-box[b-jtdebytnpw] {
        width: 100%;
    }

    .quote-stepper[b-jtdebytnpw] {
        height: 44px; /* Ergonomic touch target */
    }

    .quote-stepper :deep(.quote-stepper-btn)[b-jtdebytnpw] {
        width: 36px !important;
        height: 36px !important;
        min-width: 36px !important;
    }

    .quote-item-modal-footer[b-jtdebytnpw] {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 0.75rem !important;
    }

    .quote-footer-total-box[b-jtdebytnpw] {
        justify-content: space-between !important;
        width: 100%;
        padding-bottom: 0.5rem;
        border-bottom: 1px solid #e2e8f0;
    }

    .quote-footer-buttons[b-jtdebytnpw] {
        width: 100%;
        display: flex;
        gap: 0.5rem;
    }

    .quote-footer-buttons[b-jtdebytnpw]  .btn-arregly {
        flex: 1 1 50% !important;
        min-height: 44px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: 0.88rem !important;
        font-weight: 600 !important;
    }
}

/* Additional Taxes Styling */
.quote-taxes-list[b-jtdebytnpw] {
    display: flex;
    flex-direction: column;
    gap: 0.625rem;
}

.quote-tax-row[b-jtdebytnpw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
}

.quote-tax-select[b-jtdebytnpw] {
    flex: 1;
    min-width: 0;
    height: 42px;
    padding: 0.45rem 0.85rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #1e293b;
    background-color: #ffffff;
    border: 1px solid #d0d5dd !important;
    border-radius: 10px !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.quote-tax-select:focus[b-jtdebytnpw] {
    border-color: #034c48 !important;
    box-shadow: 0 0 0 3px rgba(3, 76, 72, 0.12) !important;
    outline: none;
}

.quote-tax-delete-btn[b-jtdebytnpw] {
    width: 42px;
    height: 42px;
    min-width: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #fef2f2;
    border: 1px solid #fee2e2;
    border-radius: 10px;
    color: #ef4444;
    cursor: pointer;
    transition: all 0.18s cubic-bezier(0.16, 1, 0.3, 1);
    flex-shrink: 0;
    padding: 0;
}

.quote-tax-delete-btn:hover[b-jtdebytnpw] {
    background-color: #fee2e2;
    border-color: #fca5a5;
    color: #dc2626;
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(239, 68, 68, 0.15);
}

.quote-tax-delete-btn:active[b-jtdebytnpw] {
    transform: translateY(0);
}

.quote-presentation-group[b-jtdebytnpw] {
    display: flex;
    flex-direction: column;
    margin-bottom: 1.35rem !important; /* Separación ergonómica y despejada hacia Cantidad y Descuento */
}

.quote-presentation-group .quote-form-label[b-jtdebytnpw] {
    margin-bottom: 0.35rem;
}

.quote-pres-info-pill[b-jtdebytnpw] {
    display: flex;
    align-items: center;
    margin-top: 0.5rem;
}
/* /Components/Forms/Quotes/Modals/QuoteItemsTable.razor.rz.scp.css */
.quote-items-empty-card[b-p6qbyw1u1o] {
    border-color: #eaecf0 !important;
    box-shadow: 0 2px 8px rgba(16, 24, 40, 0.04) !important;
}

.empty-icon-wrapper[b-p6qbyw1u1o] {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background-color: #f4ebff;
    color: #7f56d9;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    font-size: 20px;
}

/* Cards modernas de ítems */
.quote-modern-card[b-p6qbyw1u1o] {
    border: 1px solid #eaecf0 !important;
    border-left-width: 4px !important;
    box-shadow: 0 2px 6px rgba(16, 24, 40, 0.04) !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    position: relative;
    overflow: hidden;
}

.quote-modern-card:hover[b-p6qbyw1u1o] {
    border-color: #cbd5e1 !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 16px -4px rgba(16, 24, 40, 0.08) !important;
}

.border-type-service[b-p6qbyw1u1o] {
    border-left-color: #7f56d9 !important;
}

.border-type-product[b-p6qbyw1u1o] {
    border-left-color: #0284c7 !important;
}

/* Badges y Tags con Gap y Espaciado Claro */
.quote-type-tag[b-p6qbyw1u1o] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 11px;
    border-radius: 20px;
    font-size: 0.72rem;
    font-weight: 700;
    flex-shrink: 0;
}

.tag-service[b-p6qbyw1u1o] {
    background-color: #f4ebff;
    color: #6941c6;
    border: 1px solid #e9d7fe;
}

.tag-product[b-p6qbyw1u1o] {
    background-color: #f0f9ff;
    color: #026aa7;
    border: 1px solid #b9e6fe;
}

.quote-belonging-pill[b-p6qbyw1u1o] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: 20px;
    background-color: #ecfeff;
    color: #0891b2;
    border: 1px solid #c5f6fa;
    font-size: 0.72rem;
    font-weight: 600;
    max-width: 200px;
}

.quote-qty-badge[b-p6qbyw1u1o] {
    background-color: #f1f5f9 !important;
    color: #334155 !important;
    border: 1px solid #e2e8f0 !important;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 8px;
}

.quote-item-title[b-p6qbyw1u1o] {
    font-size: 0.95rem;
    line-height: 1.35;
}

/* Panel de cálculo interno con Padding Respirable */
.quote-item-calc-panel[b-p6qbyw1u1o] {
    background-color: #f8fafc !important;
    border: 1px solid #f1f5f9 !important;
    padding: 14px 16px !important;
}

.quote-items-header-bar[b-p6qbyw1u1o] {
    width: 100%;
}

@media (max-width: 576px) {
    .quote-items-header-bar[b-p6qbyw1u1o] {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
    }

    .quote-items-header-bar[b-p6qbyw1u1o]  .btn-arregly {
        width: 100% !important;
        justify-content: center !important;
        min-width: 0 !important;
        white-space: nowrap !important;
    }
}

/* /Components/Forms/Quotes/Modals/QuoteModal.razor.rz.scp.css */
.quote-single-form[b-qr00kggksw] {
    padding-top: 0.35rem;
}

.quote-terms-card[b-qr00kggksw] {
    cursor: pointer;
}

.quote-terms-chevron[b-qr00kggksw] {
    transition: transform 0.25s ease;
}

.quote-terms-chevron.expanded[b-qr00kggksw] {
    transform: rotate(180deg);
}

.quote-terms-content[b-qr00kggksw] {
    max-height: 0;
    overflow: hidden;
    opacity: 0;
    margin-top: 0;
    transition: max-height 0.3s ease, opacity 0.25s ease, margin-top 0.3s ease;
}

.quote-terms-content.expanded[b-qr00kggksw] {
    max-height: 300px;
    opacity: 1;
    margin-top: 0.75rem;
}

.quote-terms-text[b-qr00kggksw] {
    white-space: pre-line;
}

.quote-general-tab[b-qr00kggksw],
.quote-items-tab[b-qr00kggksw],
.quote-observations-section[b-qr00kggksw],
.quote-terms-section[b-qr00kggksw] {
    padding-right: 4px;
}

.quote-general-tab .card[b-qr00kggksw],
.quote-items-tab .card[b-qr00kggksw],
.quote-observations-tab .card[b-qr00kggksw] {
    border: 1px solid #e3e6f0;
    border-radius: 0.55rem;
    box-shadow: 0 0.15rem 1.2rem 0 rgba(58, 59, 69, 0.1);
}

.quote-observations-section[b-qr00kggksw],
.quote-terms-section[b-qr00kggksw] {
    background: #fff;
    border: 1px solid #e3e6f0;
    border-radius: 0.55rem;
    padding: 0.9rem;
}

[b-qr00kggksw] .k-textarea,
[b-qr00kggksw] .k-input {
    border-radius: 10px;
}

/* Footer del modal de cotización */
.quote-modal-footer[b-qr00kggksw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    width: 100%;
}

@media (max-width: 768px) {
    .quote-modal-footer[b-qr00kggksw] {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        justify-content: space-between !important;
        gap: 8px !important;
        width: 100% !important;
    }

    .quote-modal-footer[b-qr00kggksw]  .btn-arregly,
    .quote-modal-footer[b-qr00kggksw]  .k-button {
        flex: 1 1 calc(50% - 4px) !important;
        min-width: 0 !important;
        width: auto !important;
        margin: 0 !important;
        min-height: 34px !important;
        height: auto !important;
        padding: 8px 10px !important;
        font-size: 0.84rem !important;
        font-weight: 500 !important;
        border-radius: 12px !important;
        justify-content: center !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 6px !important;
        white-space: nowrap !important;
    }

    .quote-modal-footer[b-qr00kggksw]  .k-button .k-button-text {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

/* /Components/Forms/Quotes/Modals/QuoteTotals.razor.rz.scp.css */
.quote-totals-card[b-h9v9p74ghj] {
    border-color: #eaecf0 !important;
    background-color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(16, 24, 40, 0.05) !important;
}

.totals-header-icon[b-h9v9p74ghj] {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background-color: #f4ebff;
    color: #7f56d9;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
}

.totals-final-box[b-h9v9p74ghj] {
    background: linear-gradient(135deg, #f9f5ff 0%, #f4ebff 100%) !important;
    border: 1px solid #e9d7fe !important;
}

.totals-final-amount[b-h9v9p74ghj] {
    color: #7f56d9 !important;
    letter-spacing: -0.5px;
}
/* /Components/Forms/Quotes/Modals/Tabs/QuoteDetailsClientTab.razor.rz.scp.css */
.client-info-card[b-woclhpcps0] {
    border: 1px solid #d1d5db !important;
    border-radius: 14px !important;
    overflow: hidden;
    background: #ffffff;
}

.client-card-header[b-woclhpcps0] {
    background: #f8fafc !important;
    border-bottom: 1px solid #e5e7eb !important;
    padding: 12px 16px !important;
}

.client-header-icon[b-woclhpcps0] {
    color: var(--primary-color) !important;
}

.client-card-actions-footer[b-woclhpcps0] {
    background: #fbfcfd;
    border-top: 1px solid #eef2f6;
    padding: 12px 16px;
}

.client-actions-grid[b-woclhpcps0] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}

.client-contact-actions[b-woclhpcps0] {
    display: flex;
    gap: 10px;
    width: 100%;
}

.client-contact-actions[b-woclhpcps0]  .client-action-btn,
.client-contact-actions .client-action-btn[b-woclhpcps0] {
    flex: 1 1 calc(50% - 5px) !important;
    min-width: 0 !important;
    width: 100% !important;
}

.client-profile-btn[b-woclhpcps0] {
    width: 100% !important;
    min-width: 0 !important;
}

[b-woclhpcps0] .client-action-btn,
.client-action-btn[b-woclhpcps0] {
    min-width: 0 !important;
    height: 36px !important;
    min-height: 36px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    border-radius: 12px !important;
    font-size: 0.84rem !important;
    font-weight: 500 !important;
    padding: 6px 12px !important;
    white-space: nowrap !important;
    transition: all 0.2s ease !important;
}

[b-woclhpcps0] .client-action-btn:hover:not(.k-disabled),
.client-action-btn:hover:not(.k-disabled)[b-woclhpcps0] {
    transform: translateY(-1px) !important;
}

[b-woclhpcps0] .client-profile-btn,
.client-profile-btn[b-woclhpcps0] {
    box-shadow: 0 3px 10px rgba(102, 126, 234, 0.22) !important;
}

[b-woclhpcps0] .client-profile-btn:hover:not(.k-disabled),
.client-profile-btn:hover:not(.k-disabled)[b-woclhpcps0] {
    box-shadow: 0 5px 14px rgba(102, 126, 234, 0.32) !important;
}

[b-woclhpcps0] .client-action-btn .k-svg-icon,
.client-action-btn .k-svg-icon[b-woclhpcps0] {
    width: 15px !important;
    height: 15px !important;
    flex-shrink: 0 !important;
}

[b-woclhpcps0] .client-action-btn .k-button-text,
.client-action-btn .k-button-text[b-woclhpcps0] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[b-woclhpcps0] .client-action-btn.k-disabled,
.client-action-btn.k-disabled[b-woclhpcps0] {
    opacity: 0.55 !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
    transform: none !important;
}

@media (max-width: 360px) {
    .client-card-actions-footer[b-woclhpcps0] {
        padding: 10px 12px;
    }

    .client-contact-actions[b-woclhpcps0] {
        gap: 8px;
    }

    .client-contact-actions[b-woclhpcps0]  .client-action-btn,
    .client-contact-actions .client-action-btn[b-woclhpcps0] {
        flex: 1 1 calc(50% - 4px) !important;
        font-size: 0.78rem !important;
        padding: 5px 6px !important;
    }

    .client-profile-btn[b-woclhpcps0] {
        font-size: 0.80rem !important;
    }
}

/* /Components/Forms/Quotes/Shared/QuoteStatusActions.razor.rz.scp.css */
/* Acciones rápidas de transición de estado para una cotización.
   Se renderiza inline (típicamente al lado del badge de estado en la grid o
   en el header del modal de detalle). Reutiliza el tooltip global del
   MainLayout mediante la clase .custom-tooltip-btn. */

.quote-status-actions[b-qpvkjqlzzf] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: 8px;
    vertical-align: middle;
}

.quote-status-action-btn[b-qpvkjqlzzf] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    border-radius: 999px;
    border: 1px solid #e5e7eb;
    background: #ffffff;
    color: #4b5563;
    cursor: pointer;
    transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.12s ease;
}

.quote-status-action-btn:hover[b-qpvkjqlzzf] {
    transform: translateY(-1px);
    background: #f9fafb;
}

.quote-status-action-btn:disabled[b-qpvkjqlzzf] {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

/* Acciones positivas */
.quote-status-action-btn.is-send[b-qpvkjqlzzf] {
    color: #1d4ed8;
    border-color: #bfdbfe;
    background: #eff6ff;
}

.quote-status-action-btn.is-send:hover[b-qpvkjqlzzf] {
    background: #dbeafe;
    border-color: #93c5fd;
}

.quote-status-action-btn.is-accept[b-qpvkjqlzzf] {
    color: #15803d;
    border-color: #bbf7d0;
    background: #f0fdf4;
}

.quote-status-action-btn.is-accept:hover[b-qpvkjqlzzf] {
    background: #dcfce7;
    border-color: #86efac;
}

.quote-status-action-btn.is-reopen[b-qpvkjqlzzf] {
    color: #4338ca;
    border-color: #c7d2fe;
    background: #eef2ff;
}

.quote-status-action-btn.is-reopen:hover[b-qpvkjqlzzf] {
    background: #e0e7ff;
    border-color: #a5b4fc;
}

/* Acciones destructivas */
.quote-status-action-btn.is-reject[b-qpvkjqlzzf] {
    color: #b91c1c;
    border-color: #fecaca;
    background: #fef2f2;
}

.quote-status-action-btn.is-reject:hover[b-qpvkjqlzzf] {
    background: #fee2e2;
    border-color: #fca5a5;
}

.quote-status-action-btn.is-cancel[b-qpvkjqlzzf] {
    color: #6b7280;
    border-color: #e5e7eb;
    background: #f9fafb;
}

.quote-status-action-btn.is-cancel:hover[b-qpvkjqlzzf] {
    background: #f3f4f6;
    border-color: #d1d5db;
    color: #374151;
}

/* Etiqueta cuando el estado es final y no hay transiciones disponibles */
.quote-status-locked[b-qpvkjqlzzf] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 500;
    color: #6b7280;
    background: #f3f4f6;
    border: 1px dashed #d1d5db;
    cursor: help;
    user-select: none;
}

.quote-status-locked .quote-status-locked-text[b-qpvkjqlzzf] {
    line-height: 1;
}

.quote-status-locked.is-locked-accept[b-qpvkjqlzzf] {
    color: #15803d;
    background: #f0fdf4;
    border-color: #bbf7d0;
}

.quote-status-locked.is-locked-cancel[b-qpvkjqlzzf] {
    color: #6b7280;
    background: #f9fafb;
    border-color: #e5e7eb;
}

/* /Components/Forms/Register/CompanySetupLoading.razor.rz.scp.css */
.company-setup-overlay[b-5j5qwv9k05] {
    --primary-color: var(--primary-color, #093d93);
    --secondary-color: var(--brand-orange, #ed7024);
    --progress-bg: #e0e7ff;
    --text-primary: #1a1a2e;
    --text-secondary: #6b7280;
    --card-bg: rgba(255, 255, 255, 0.98);
    --shadow: 0 20px 40px rgba(9, 61, 147, 0.15);
    --error-color: #dc3545;
    --error-bg: #fdf2f2;

    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(26, 26, 46, 0.4);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    animation: fadeIn-b-5j5qwv9k05 0.4s ease-out forwards;
    padding: 16px;
    box-sizing: border-box;
}

.company-setup-card[b-5j5qwv9k05] {
    background: var(--card-bg);
    border-radius: 24px;
    box-shadow: var(--shadow);
    padding: 48px;
    width: 100%;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    animation: cardSlideUp-b-5j5qwv9k05 0.5s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    border: 1px solid rgba(255, 255, 255, 0.5);
    box-sizing: border-box;
    transition: all 0.3s ease;
}

.company-setup-card.has-error[b-5j5qwv9k05] {
    border-color: rgba(220, 53, 69, 0.3);
    box-shadow: 0 20px 40px rgba(220, 53, 69, 0.1);
}

/* Responsive constraints */
@media (min-width: 992px) {
    .company-setup-card[b-5j5qwv9k05] {
        max-width: 900px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .company-setup-card[b-5j5qwv9k05] {
        max-width: 700px;
    }
}

@media (max-width: 767px) {
    .company-setup-card[b-5j5qwv9k05] {
        width: 95%;
        padding: 32px 20px;
    }
}

/* Circular Progress Container */
.progress-circle-container[b-5j5qwv9k05] {
    position: relative;
    width: 100px;
    height: 100px;
    margin-bottom: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.progress-circle-spinner[b-5j5qwv9k05] {
    position: absolute;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 4px solid var(--progress-bg);
    border-top-color: var(--primary-color);
    border-right-color: var(--secondary-color);
    animation: rotateSlow-b-5j5qwv9k05 2s linear infinite;
    box-sizing: border-box;
}

.progress-circle-inner[b-5j5qwv9k05] {
    position: absolute;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: #ffffff;
    box-shadow: 0 4px 10px rgba(9, 61, 147, 0.08);
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
}

[b-5j5qwv9k05] .company-setup-icon {
    color: var(--primary-color) !important;
}

/* Title and Subtitle */
.company-setup-title[b-5j5qwv9k05] {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--text-primary);
    margin: 0 0 12px 0;
    line-height: 1.3;
}

.company-setup-subtitle[b-5j5qwv9k05] {
    font-size: 1rem;
    color: var(--text-secondary);
    margin: 0 0 32px 0;
    line-height: 1.5;
}

/* Horizontal Progress Bar */
.company-setup-progress-wrapper[b-5j5qwv9k05] {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 36px;
    box-sizing: border-box;
}

.company-setup-progress-track[b-5j5qwv9k05] {
    flex-grow: 1;
    height: 12px;
    background-color: var(--progress-bg);
    border-radius: 6px;
    overflow: hidden;
    position: relative;
}

.company-setup-progress-fill[b-5j5qwv9k05] {
    height: 100%;
    background: linear-gradient(90deg, var(--primary-color) 0%, var(--secondary-color) 100%);
    border-radius: 6px;
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Indeterminate progress bar styling */
.company-setup-progress-fill.indeterminate-bar[b-5j5qwv9k05] {
    width: 100%;
    background: linear-gradient(90deg, var(--primary-color) 25%, var(--secondary-color) 50%, var(--primary-color) 75%);
    background-size: 200% 100%;
    animation: loadingBarShimmer-b-5j5qwv9k05 1.5s infinite linear;
}

.company-setup-progress-percent[b-5j5qwv9k05] {
    font-size: 1.1rem;
    font-weight: 700;
    color: var(--primary-color);
    min-width: 48px;
    text-align: right;
}

.company-setup-progress-percent.indeterminate-text[b-5j5qwv9k05] {
    font-size: 0.95rem;
    font-weight: 600;
    min-width: 90px;
}

/* Info Box */
.company-setup-info-box[b-5j5qwv9k05] {
    display: flex;
    align-items: center;
    gap: 14px;
    background-color: var(--progress-bg);
    border-radius: 16px;
    padding: 16px 20px;
    width: 100%;
    box-sizing: border-box;
}

[b-5j5qwv9k05] .company-setup-info-icon {
    color: var(--primary-color) !important;
    flex-shrink: 0;
}

.company-setup-info-text[b-5j5qwv9k05] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
    font-size: 0.9rem;
    color: var(--primary-color);
    font-weight: 600;
    line-height: 1.4;
}

/* Error State UI */
.error-icon-container[b-5j5qwv9k05] {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background-color: var(--error-bg);
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 24px;
}

[b-5j5qwv9k05] .company-setup-error-icon {
    color: var(--error-color) !important;
}

.error-title[b-5j5qwv9k05] {
    color: var(--error-color) !important;
    margin-bottom: 16px !important;
}

.company-setup-error-message[b-5j5qwv9k05] {
    font-size: 1.05rem;
    color: var(--text-primary);
    margin-bottom: 36px;
    line-height: 1.6;
    max-width: 600px;
    white-space: pre-line;
}

.company-setup-error-footer[b-5j5qwv9k05] {
    display: flex;
    justify-content: center;
    width: 100%;
}

[b-5j5qwv9k05] .btn-outline-danger-arregly {
    color: var(--error-color) !important;
    border-color: var(--error-color) !important;
    background-color: transparent !important;
    border-radius: 8px !important;
    padding: 10px 24px !important;
    font-weight: 600 !important;
    transition: all 0.2s ease !important;
}

[b-5j5qwv9k05] .btn-outline-danger-arregly:hover {
    background-color: var(--error-color) !important;
    color: #ffffff !important;
}

/* Animations */
@keyframes fadeIn-b-5j5qwv9k05 {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes cardSlideUp-b-5j5qwv9k05 {
    from {
        transform: translateY(30px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes rotateSlow-b-5j5qwv9k05 {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

@keyframes loadingBarShimmer-b-5j5qwv9k05 {
    from {
        background-position: 200% 0;
    }
    to {
        background-position: -200% 0;
    }
}
/* /Components/Forms/Register/RegisterCompanyForm.razor.rz.scp.css */
/* Estructura vertical del contenido del paso empresa */
.step-panel[b-rdd498lkgh] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 12px;
    min-height: 100%;
}

@media (max-width: 991.98px) {
    .color-preview-circle[b-rdd498lkgh] {
        width: 100% !important;
        min-width: 0 !important;
    }
}

/* Centra y ordena el título y subtítulo del paso */
[b-rdd498lkgh] .step-title-section {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 0 !important;
}

/* Mantiene el título como bloque para mejor lectura */
.step-title[b-rdd498lkgh] {
    display: block;
}

/* Mantiene la descripción como bloque separado */
.step-description[b-rdd498lkgh] {
    display: block;
}

/* Separador visual entre contenido y acciones */
.separator-line[b-rdd498lkgh] {
    width: 100%;
    height: 0;
    border-top: 2px solid #cfd8e3;
    background: transparent;
    margin: 14px 0 10px 0;
}

/* Distribuye los botones Anterior/Siguiente */
[b-rdd498lkgh] .register-actions {
    width: 100% !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 12px !important;
}

/* Evita que los items de Telerik se estiren */
[b-rdd498lkgh] .register-actions > .k-stacklayout-item {
    flex: 0 0 auto !important;
    width: auto !important;
}

/* Conserva ancho natural de botones en acciones */
[b-rdd498lkgh] .register-actions .k-button,
[b-rdd498lkgh] .register-actions .btn-arregly {
    width: auto !important;
    max-width: max-content !important;
}

/* Uniforma tamaño de botones de navegación */
[b-rdd498lkgh] .register-step-btn {
    min-width: 110px !important;
    width: auto !important;
    padding: 6px 14px !important;
    font-size: 13px !important;
}

/* Fuerza ancho completo del input de teléfono internacional */
[b-rdd498lkgh] .phone-input-arregly .iti,
[b-rdd498lkgh] .phone-input-arregly .iti input,
[b-rdd498lkgh] .phone-input-arregly .iti input[type="text"],
[b-rdd498lkgh] .phone-input-arregly .iti input[type="tel"] {
    width: 100% !important;
    max-width: 100% !important;
}

/* Ajusta altura/ancho mínimo del botón de color personalizado */
[b-rdd498lkgh] .register-color-modal-btn {
    min-width: 0 !important;
    width: auto !important;
    min-width: 170px !important;
    height: 30px !important;
    padding: 0 10px !important;
    font-size: 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Alinea controles del selector de color */
[b-rdd498lkgh] .color-selector-row {
    align-items: stretch !important;
}

.register-color-section[b-rdd498lkgh] {
    margin-top: 0.65rem;
}

.register-color-section-title[b-rdd498lkgh] {
    margin-top: 0.4rem;
    margin-bottom: 0.55rem;
    padding-bottom: 0.45rem;
}

.register-color-section-title .section-title-text[b-rdd498lkgh] {
    font-size: 1.02rem;
    font-weight: 700;
    color: #111827;
    line-height: 1.2;
}

.register-color-palette-wrap[b-rdd498lkgh] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    flex: 1 1 0;
    min-width: 0;
}

.register-color-palette-row[b-rdd498lkgh] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 6px;
    width: 100%;
}

[b-rdd498lkgh] .color-selector-row > [class*="col-"] {
    display: flex !important;
}

/* Paleta de colores base visible en una sola fila con wrap. */

/* Cada color muestra círculo + nombre. */
.register-color-palette-item[b-rdd498lkgh] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

/* Swatch circular basado en TelerikButton. */
[b-rdd498lkgh] .register-color-swatch-btn.k-button {
    width: 30px;
    min-width: 30px;
    height: 30px;
    border-radius: 999px;
    background-color: var(--swatch-color) !important;
    border: 2px solid #cbd5e1;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: none;
}

/* Estado seleccionado del swatch. */
[b-rdd498lkgh] .register-color-swatch-btn.k-button.is-selected {
    border-color: #0f172a;
    box-shadow: 0 0 0 2px rgba(15, 23, 42, 0.15);
}

/* Icono de check legible en cualquier color. */
[b-rdd498lkgh] .register-color-swatch-btn.k-button svg {
    color: #ffffff;
    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.35));
}

/* Nombre compacto para identificar color. */
.register-color-name[b-rdd498lkgh] {
    font-size: 10px;
    font-weight: 600;
    color: #64748b;
    text-align: center;
    line-height: 1;
}

/* Tarjeta de vista previa de color personalizado */
[b-rdd498lkgh] .selected-custom-color-card {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 12px !important;
}

[b-rdd498lkgh] .register-color-preview-card {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 10px 12px;
    background: #ffffff;
}

.color-card-content[b-rdd498lkgh] {
    display: grid !important;
    grid-template-columns: minmax(0, 8fr) auto;
    align-items: center !important;
    gap: 6px !important;
    width: 100% !important;
}

.color-preview-circle[b-rdd498lkgh] {
    width: 100% !important;
    min-width: 0 !important;
    height: 72px !important;
    border-radius: 10px !important;
    border: 1px solid #dbe3f0 !important;
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.12) !important;
    flex: 1 1 auto !important;
}

[b-rdd498lkgh] .btn-remove-color {
    min-height: 32px !important;
    min-width: 32px !important;
    width: 32px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
}

@media (max-width: 991.98px) {
    .register-color-palette-row[b-rdd498lkgh] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-rdd498lkgh] .register-color-modal-btn {
        margin-left: 0 !important;
        width: 100% !important;
    }

    .color-preview-circle[b-rdd498lkgh] {
        width: 100% !important;
        min-width: 0 !important;
    }
}

.color-preview-title[b-rdd498lkgh] {
    font-size: 0.78rem;
    font-weight: 700;
    color: #475569;
}

.color-hex[b-rdd498lkgh] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #0f172a;
    font-family: Consolas, 'Courier New', monospace;
}

[b-rdd498lkgh] .color-info {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 4px !important;
}
/* /Components/Forms/Register/RegisterPaymentForm.razor.rz.scp.css */
.register-payment-container[b-itrzjm0aee] {
    padding: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 24px;
    animation: fadeIn-b-itrzjm0aee 0.4s ease-in-out;
}

.payment-header[b-itrzjm0aee] {
    text-align: center;
}

.payment-icon-wrapper[b-itrzjm0aee] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.1) 0%, rgba(37, 99, 235, 0.1) 100%);
    color: var(--arregly-primary);
    border-radius: 50%;
    margin-bottom: 16px;
}

.payment-icon-wrapper[b-itrzjm0aee]  svg {
    width: 32px;
    height: 32px;
}

.payment-title[b-itrzjm0aee] {
    font-size: 24px;
    font-weight: 700;
    color: var(--arregly-dark-blue);
    margin: 0 0 8px 0;
}

.payment-subtitle[b-itrzjm0aee] {
    font-size: 14px;
    color: var(--arregly-text-gray);
    margin: 0;
    max-width: 400px;
}

.payment-summary-card[b-itrzjm0aee] {
    width: 100%;
    max-width: 450px;
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
}

.summary-header[b-itrzjm0aee] {
    background-color: #f1f5f9;
    padding: 16px 20px;
    border-bottom: 1px solid #e2e8f0;
}

.summary-header h3[b-itrzjm0aee] {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: var(--arregly-dark-blue);
}

.summary-details[b-itrzjm0aee] {
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.summary-item[b-itrzjm0aee] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 14px;
}

.item-label[b-itrzjm0aee] {
    color: var(--arregly-text-gray);
}

.item-value[b-itrzjm0aee] {
    font-weight: 600;
    color: var(--arregly-dark-blue);
}

.total-item[b-itrzjm0aee] {
    margin-top: 8px;
    padding-top: 16px;
    border-top: 1px dashed #cbd5e1;
    font-size: 16px;
}

.total-item .item-label[b-itrzjm0aee] {
    color: var(--arregly-dark-blue);
    font-weight: 600;
}

.total-item .item-value[b-itrzjm0aee] {
    color: var(--arregly-primary);
    font-weight: 700;
}

.payment-actions[b-itrzjm0aee] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    max-width: 450px;
    margin-top: 16px;
}

.pay-btn[b-itrzjm0aee] {
    height: 48px;
    font-size: 16px;
    font-weight: 600;
}

.cancel-btn[b-itrzjm0aee] {
    height: 44px;
    font-size: 14px;
    font-weight: 500;
}

@keyframes fadeIn-b-itrzjm0aee {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* /Components/Forms/Register/RegisterTemplateForm.razor.rz.scp.css */
/* Estructura vertical general del paso plantilla */
.step-panel[b-xdchhrw3zh] {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 12px;
    min-height: 100%;
}

/* Centra título y descripción del paso */
[b-xdchhrw3zh] .step-title-section {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 0 !important;
}

/* Título principal en formato bloque */
.step-title[b-xdchhrw3zh] {
    display: block;
}

/* Texto descriptivo en bloque independiente */
.step-description[b-xdchhrw3zh] {
    display: block;
}

/* Espaciado interno del contenido de selección */
[b-xdchhrw3zh] .template-step-content {
    gap: 12px !important;
}

/* Grilla tipo columnas para tarjetas de plantillas */
[b-xdchhrw3zh] .template-cards-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    align-items: start !important;
    gap: 12px !important;
    width: 100% !important;
}

/* Evita que las tarjetas se corten entre columnas */
.template-card-wrapper[b-xdchhrw3zh] {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    margin: 0 !important;
    gap: 8px !important;
}

/* Estilo base de cada tarjeta de plantilla */
[b-xdchhrw3zh] .template-card {
    width: 100% !important;
    min-height: 118px !important;
    height: auto !important;
    border: 1px solid #d9e3f0 !important;
    border-radius: 14px !important;
    background: #ffffff !important;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.06) !important;
    padding: 14px 16px !important;
    text-align: left !important;
}

/* Permite que el texto del botón ocupe varias líneas */
[b-xdchhrw3zh] .template-card .k-button-text {
    width: 100% !important;
    display: block !important;
    white-space: normal !important;
}

/* Feedback visual al pasar el cursor por una tarjeta */
[b-xdchhrw3zh] .template-card:hover {
    border-color: #b7c6db !important;
    transform: translateY(-1px) !important;
}

/* Estado visual de tarjeta seleccionada */
[b-xdchhrw3zh] .template-card.selected {
    border-color: var(--primary-color, #093d93) !important;
    background: #f0f4fc !important;
    box-shadow: 0 0 0 2px rgba(9, 61, 147, 0.14) !important;
}

/* Distribuye icono, texto y check en la tarjeta */
[b-xdchhrw3zh] .template-card-body {
    display: flex !important;
    align-items: flex-start !important;
    gap: 12px !important;
    width: 100% !important;
}

/* Caja visual del icono de la plantilla */
.template-card-icon[b-xdchhrw3zh] {
    width: 42px !important;
    height: 42px !important;
    border-radius: 12px !important;
    background: #eef2ff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 1.15rem !important;
    flex: 0 0 auto !important;
}

/* Contenedor vertical del contenido textual */
[b-xdchhrw3zh] .template-card-content {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    flex: 1 !important;
    min-width: 0 !important;
}

/* Estilo del título de la tarjeta */
.template-card-title[b-xdchhrw3zh] {
    font-size: .95rem !important;
    font-weight: 700 !important;
    color: #334155 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
}

/* Estilo de la descripción de la tarjeta */
.template-card-description[b-xdchhrw3zh] {
    font-size: .8rem !important;
    color: #64748b !important;
    line-height: 1.2 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
}

/* Indicador visual de selección */
.template-card-check[b-xdchhrw3zh] {
    width: 14px !important;
    height: 14px !important;
    border-radius: 999px !important;
    background: #10b981 !important;
    box-shadow: 0 0 0 3px rgba(16, 185, 129, .2) !important;
    flex: 0 0 auto !important;
}

/* Contenedor del selector de detalle de plantilla */
.template-detail-selector-wrap[b-xdchhrw3zh] {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    padding: 0 2px !important;
}

/* Lista vertical de detalles disponibles */
[b-xdchhrw3zh] .template-detail-list {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
}

/* Estilo base de cada detalle seleccionable */
[b-xdchhrw3zh] .template-detail-item {
    width: 100% !important;
    min-height: 34px !important;
    height: auto !important;
    text-align: left !important;
    border: 1px solid #d9e3f0 !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    color: #334155 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
}

/* Alinea texto interno de detalles a la izquierda */
[b-xdchhrw3zh] .template-detail-item .k-button-text {
    width: 100% !important;
    justify-content: flex-start !important;
    white-space: normal !important;
}

/* Estado seleccionado para detalle de plantilla */
[b-xdchhrw3zh] .template-detail-item.selected {
    border-color: var(--primary-color, #093d93) !important;
    background: #eef4ff !important;
    color: var(--primary-color, #093d93) !important;
    font-weight: 600 !important;
}

/* Separador entre contenido y botones del paso */
.separator-line[b-xdchhrw3zh] {
    width: 100%;
    height: 0;
    border-top: 2px solid #cfd8e3;
    background: transparent;
    margin: 14px 0 10px 0;
}

/* Distribuye botones de navegación del wizard */
[b-xdchhrw3zh] .register-actions {
    width: 100% !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    gap: 12px !important;
}

/* Evita expansión de items internos de Telerik */
[b-xdchhrw3zh] .register-actions > .k-stacklayout-item {
    flex: 0 0 auto !important;
    width: auto !important;
}

/* Mantiene tamaño natural de botones */
[b-xdchhrw3zh] .register-actions .k-button,
[b-xdchhrw3zh] .register-actions .btn-arregly {
    width: auto !important;
    max-width: max-content !important;
}

/* Homologa tamaño de botones entre pasos */
[b-xdchhrw3zh] .register-step-btn {
    min-width: 110px !important;
    width: auto !important;
    padding: 6px 14px !important;
    font-size: 13px !important;
}

@media (max-width: 768px) {
    /* En móvil se usa una sola columna */
    [b-xdchhrw3zh] .template-cards-grid {
        grid-template-columns: 1fr !important;
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    /* En tablet se usan dos columnas */
    [b-xdchhrw3zh] .template-cards-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* Se añade espacio debajo a los botones de registro */
.register-footer[b-xdchhrw3zh] {
    padding-bottom: 40px;
}
/* /Components/Forms/Register/RegisterUnifiedForm.razor.rz.scp.css */
/* Distribuye contraseña y confirmación en una fila flexible */
[b-p43q3keu0g] .register-password-inline .password-input-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: .75rem !important;
}

/* Asigna 2 columnas cuando hay espacio disponible */
[b-p43q3keu0g] .register-password-inline .password-input-container > .col-md-6 {
    flex: 1 1 calc(50% - .375rem) !important;
    max-width: calc(50% - .375rem) !important;
}

/* Mantiene el bloque de validaciones ocupando toda la fila */
[b-p43q3keu0g] .register-password-inline .password-feedback-box {
    flex: 1 1 100% !important;
    max-width: 100% !important;
}

@media (max-width: 768px) {
    [b-p43q3keu0g] .register-password-inline .password-input-container > .col-md-6 {
        flex: 1 1 100% !important;
        max-width: 100% !important;
    }
}

/* Ajusta altura/ancho mínimo del botón de color personalizado */
[b-p43q3keu0g] .register-color-modal-btn {
    min-width: 0 !important;
    width: auto !important;
    min-width: 170px !important;
    height: 30px !important;
    padding: 0 10px !important;
    font-size: 12px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Alinea controles del selector de color */
[b-p43q3keu0g] .color-selector-row {
    align-items: stretch !important;
}

.register-color-section[b-p43q3keu0g] {
    margin-top: 0.65rem;
}

.register-color-section-title[b-p43q3keu0g] {
    margin-top: 0.4rem;
    margin-bottom: 0.55rem;
    padding-bottom: 0.45rem;
}

.register-color-section-title .section-title-text[b-p43q3keu0g] {
    font-size: 1.02rem;
    font-weight: 700;
    color: #111827;
    line-height: 1.2;
}

.register-color-palette-wrap[b-p43q3keu0g] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    flex: 1 1 0;
    min-width: 0;
}

.register-color-palette-row[b-p43q3keu0g] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    width: 100%;
}

[b-p43q3keu0g] .color-selector-row > [class*="col-"] {
    display: flex !important;
}

/* Cada color muestra círculo + nombre */
.register-color-palette-item[b-p43q3keu0g] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

/* Swatch circular basado en TelerikButton */
[b-p43q3keu0g] .register-color-swatch-btn,
[b-p43q3keu0g] .register-color-swatch-btn.k-button {
    width: 30px !important;
    min-width: 30px !important;
    max-width: 30px !important;
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    border-radius: 999px !important;
    background-color: var(--swatch-color) !important;
    border: 2px solid #cbd5e1 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: none !important;
    cursor: pointer !important;
}

/* Estado seleccionado del swatch */
[b-p43q3keu0g] .register-color-swatch-btn.is-selected,
[b-p43q3keu0g] .register-color-swatch-btn.k-button.is-selected {
    border-color: #0f172a !important;
    box-shadow: 0 0 0 2px rgba(15, 23, 42, 0.15) !important;
}

/* Icono de check legible en cualquier color */
[b-p43q3keu0g] .register-color-swatch-btn svg,
[b-p43q3keu0g] .register-color-swatch-btn.k-button svg {
    color: #ffffff !important;
    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.35)) !important;
}

/* Nombre compacto para identificar color */
.register-color-name[b-p43q3keu0g] {
    font-size: 10px;
    font-weight: 600;
    color: #64748b;
    text-align: center;
    line-height: 1;
}

/* Tarjeta de vista previa de color personalizado */
[b-p43q3keu0g] .selected-custom-color-card {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 12px !important;
}

[b-p43q3keu0g] .register-color-preview-card {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 10px 12px;
    background: #ffffff;
}

.color-card-content[b-p43q3keu0g] {
    display: grid !important;
    grid-template-columns: minmax(0, 8fr) auto;
    align-items: center !important;
    gap: 6px !important;
    width: 100% !important;
}

.color-preview-circle[b-p43q3keu0g] {
    width: 100% !important;
    min-width: 0 !important;
    height: 72px !important;
    border-radius: 10px !important;
    border: 1px solid #dbe3f0 !important;
    box-shadow: 0 4px 10px rgba(15, 23, 42, 0.12) !important;
    flex: 1 1 auto !important;
}

[b-p43q3keu0g] .btn-remove-color {
    min-height: 32px !important;
    min-width: 32px !important;
    width: 32px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
}

@media (max-width: 991.98px) {
    .register-color-palette-row[b-p43q3keu0g] {
        flex-direction: column;
        align-items: stretch;
    }

    [b-p43q3keu0g] .register-color-modal-btn {
        margin-left: 0 !important;
        width: 100% !important;
    }

    .color-preview-circle[b-p43q3keu0g] {
        width: 100% !important;
        min-width: 0 !important;
    }
}

.color-preview-title[b-p43q3keu0g] {
    font-size: 0.78rem;
    font-weight: 700;
    color: #475569;
}

.color-hex[b-p43q3keu0g] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #0f172a;
    font-family: Consolas, 'Courier New', monospace;
}

[b-p43q3keu0g] .color-info {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 4px !important;
}
/* /Components/Forms/Register/RegisterUserForm.razor.rz.scp.css */
/* Distribuye contraseña y confirmación en una fila flexible */
[b-bnhmw2wf6n] .register-password-inline .password-input-container {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    gap: .75rem !important;
}

/* Asigna 2 columnas cuando hay espacio disponible */
[b-bnhmw2wf6n] .register-password-inline .password-input-container > .col-md-6 {
    flex: 1 1 calc(50% - .375rem) !important;
    max-width: calc(50% - .375rem) !important;
}

/* Mantiene el bloque de validaciones ocupando toda la fila */
[b-bnhmw2wf6n] .register-password-inline .password-feedback-box {
    flex: 1 1 100% !important;
    max-width: 100% !important;
}

/* Ajusta el tamaño de botones de navegación del paso */
[b-bnhmw2wf6n] .register-step-btn {
    min-width: 110px !important;
    width: auto !important;
    padding: 6px 14px !important;
    font-size: 13px !important;
}

@media (max-width: 768px) {
    /* En móvil apila los campos de contraseña en una sola columna */
    [b-bnhmw2wf6n] .register-password-inline .password-input-container > .col-md-6 {
        flex: 1 1 100% !important;
        max-width: 100% !important;
    }
}
/* /Components/Forms/Service/ServiceForm.razor.rz.scp.css */
.field-counter[b-1pozdpvsbe] {
    color: #6b7280;
    font-size: 0.75rem;
    display: block;
    margin-top: 0.25rem;
}

.service-tab-content[b-1pozdpvsbe] {
    min-height: 420px;
    padding-top: 16px;
}

.branch-assignment-item[b-1pozdpvsbe] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    padding: 0.75rem 1rem;
    background-color: #ffffff;
}

.branch-assignment-left[b-1pozdpvsbe] {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
}

.branch-assignment-name[b-1pozdpvsbe] {
    font-weight: 600;
    color: #111827;
}

.branch-assignment-status[b-1pozdpvsbe] {
    font-size: 0.75rem;
    color: #6b7280;
    border: 1px solid #e5e7eb;
    border-radius: 999px;
    padding: 0.2rem 0.6rem;
}

.branch-assignment-status.assigned[b-1pozdpvsbe] {
    color: #166534;
    border-color: #bbf7d0;
    background-color: #f0fdf4;
}

.info-box[b-1pozdpvsbe] {
    padding: 0.5rem;
    border-radius: 0.375rem;
    background-color: #eff6ff;
    border: 1px solid #c3ddfd;
}

.info-box-content[b-1pozdpvsbe] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.info-box-icon svg[b-1pozdpvsbe] {
    height: 1rem;
    width: 1rem;
    color: #2563eb;
}

.info-box-text[b-1pozdpvsbe] {
    font-size: 0.875rem;
    font-weight: 500;
    text-align: left;
}

.info-box-accent[b-1pozdpvsbe] {
    color: #2563eb;
}

.branch-assignment-toolbar[b-1pozdpvsbe] {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0.65rem;
    margin-top: 0;
}

.branch-assignment-info-box[b-1pozdpvsbe] {
    width: 100%;
    margin-bottom: 0;
}

.select-all-branches-button[b-1pozdpvsbe] {
    white-space: nowrap;
    min-width: 220px;
}

.branch-full-access-toggle[b-1pozdpvsbe] {
    border: 0;
    border-radius: 0;
    background: transparent;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 4px;
    color: #111827;
    font-size: 1rem;
    width: fit-content;
}

.branch-assignment-toolbar .branch-full-access-toggle[b-1pozdpvsbe] {
    width: fit-content;
}

.branch-assignment-toolbar .branch-full-access-toggle span[b-1pozdpvsbe] {
    color: #111827;
    font-size: 1rem;
    font-weight: 500;
}

.branch-full-access-toggle:hover[b-1pozdpvsbe] {
    border-color: transparent;
    background: transparent;
    box-shadow: none;
}

.branch-full-access-checkbox[b-1pozdpvsbe] {
    flex-shrink: 0;
    margin-left: 2px;
}

.branch-full-access-text[b-1pozdpvsbe] {
    color: #111827;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1;
}



.branch-full-access-toggle[b-1pozdpvsbe]  .k-checkbox-wrap {
    margin: 0 !important;
}

.branch-full-access-toggle[b-1pozdpvsbe]  .k-checkbox {
    margin: 0 !important;
}

@media (max-width: 991.98px) {
    .branch-assignment-toolbar[b-1pozdpvsbe] {
        flex-direction: column;
        align-items: stretch;
    }

    .select-all-branches-button[b-1pozdpvsbe] {
        width: 100%;
        min-width: 0;
    }
}

.association-box[b-1pozdpvsbe] {
    border: none;
    background: transparent;
    padding: 0;
}

.summary-table-container[b-1pozdpvsbe] {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #ffffff;
    overflow-x: auto;
    overflow-y: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
}

.summary-table[b-1pozdpvsbe] {
    width: 100%;
    margin-bottom: 0;
    border-collapse: collapse;
    background: #ffffff;
}

.summary-table thead th[b-1pozdpvsbe] {
    background: #f8fafc;
    color: #475569;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border-bottom: 1px solid #e2e8f0 !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
    padding: 0.55rem 0.65rem !important;
}

.summary-table tbody td[b-1pozdpvsbe] {
    border-top: 1px solid #f1f5f9 !important;
    border-bottom: none !important;
    border-left: none !important;
    border-right: none !important;
    color: #1e293b;
    vertical-align: middle;
    padding: 0.55rem 0.65rem !important;
}

.summary-table tbody tr:hover[b-1pozdpvsbe] {
    background-color: #f8fafc;
}

.quantity-input-group[b-1pozdpvsbe] {
    display: flex;
    align-items: center;
    gap: 6px;
    width: 100%;
    max-width: 220px;
}

.summary-table[b-1pozdpvsbe]  .quantity-numeric-input {
    width: 80px !important;
    min-width: 70px !important;
    flex-shrink: 0 !important;
}

.summary-table[b-1pozdpvsbe]  .quantity-numeric-input .k-input-inner {
    padding: 0.35rem 0.4rem !important;
    min-height: 32px !important;
    font-size: 0.85rem !important;
    font-weight: 500 !important;
    text-align: center !important;
}

.summary-table[b-1pozdpvsbe]  .quantity-unit-dropdown {
    width: 125px !important;
    min-width: 110px !important;
    flex-grow: 1 !important;
}

.summary-table[b-1pozdpvsbe]  .quantity-unit-dropdown .k-input-inner {
    padding: 0.35rem 0.45rem !important;
    min-height: 32px !important;
    font-size: 0.82rem !important;
}

.action-delete-btn[b-1pozdpvsbe] {
    opacity: 0.75;
    transition: opacity 0.15s ease, transform 0.15s ease;
}

.action-delete-btn:hover[b-1pozdpvsbe] {
    opacity: 1;
    transform: scale(1.1);
}

@media (max-width: 576px) {
    .quantity-input-group[b-1pozdpvsbe] {
        flex-direction: column;
        align-items: stretch;
        max-width: 100%;
    }

    .summary-table[b-1pozdpvsbe]  .quantity-numeric-input,
    .summary-table[b-1pozdpvsbe]  .quantity-unit-dropdown {
        width: 100% !important;
    }
}

.selector-action-row[b-1pozdpvsbe] {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 10px;
}

.service-add-button[b-1pozdpvsbe] {
    height: 38px;
    min-width: 130px;
    padding: 0 16px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.88rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    transition: transform 0.15s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}

.service-add-button:hover:not(:disabled)[b-1pozdpvsbe] {
    transform: translateY(-1px);
}

.service-add-button:disabled[b-1pozdpvsbe] {
    opacity: 0.55;
    cursor: not-allowed;
    box-shadow: none;
}

.service-add-button[b-1pozdpvsbe],
.optional-toggle-box span[b-1pozdpvsbe] {
    font-size: 0.88rem;
}

/* Custom commission configuration card and layout */
.commission-config-card[b-1pozdpvsbe] {
    background-color: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    padding: 20px !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.02) !important;
}

.commission-checkbox-box[b-1pozdpvsbe] {
    border: 1px solid #e5e7eb !important;
    background-color: #f9fafb !important;
    border-radius: 12px !important;
    padding: 14px 18px !important;
    margin-bottom: 20px !important;
}

.prefix-input-container[b-1pozdpvsbe] {
    display: inline-flex;
    align-items: center;
    background-color: #ffffff !important;
    border: 1px solid #d0d5dd !important;
    border-radius: 12px !important;
    padding: 0 12px !important;
    width: 100% !important;
    height: 30px !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease !important;
}

.prefix-input-container:hover[b-1pozdpvsbe] {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 3px var(--primary-rgba-color) !important;
}

.prefix-input-container:focus-within[b-1pozdpvsbe] {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 3px var(--primary-rgba-color) !important;
}

.prefix-input-container .prefix-symbol[b-1pozdpvsbe] {
    color: #4b5563 !important;
    font-weight: 500 !important;
    margin-right: 8px !important;
    user-select: none !important;
}

.prefix-input-container[b-1pozdpvsbe]  .k-textbox,
.prefix-input-container[b-1pozdpvsbe]  .k-numerictextbox,
.prefix-input-container[b-1pozdpvsbe]  .k-input {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    width: 100% !important;
}

.prefix-input-container[b-1pozdpvsbe]  .k-input-inner {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    height: 30px !important;
    line-height: 30px !important;
    font-size: 0.9rem !important;
    color: #101828 !important;
}

/* Custom DropDownList styling inside the tab */
[b-1pozdpvsbe] .dropdownlist-arregly-custom.k-dropdownlist {
    background-color: #ffffff !important;
    border: 1px solid #d0d5dd !important;
    border-radius: 12px !important;
    height: 30px !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease !important;
}

[b-1pozdpvsbe] .dropdownlist-arregly-custom.k-dropdownlist:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 3px var(--primary-rgba-color) !important;
}

[b-1pozdpvsbe] .dropdownlist-arregly-custom.k-dropdownlist.k-focus,
[b-1pozdpvsbe] .dropdownlist-arregly-custom.k-dropdownlist:focus-within {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 3px var(--primary-rgba-color) !important;
}

[b-1pozdpvsbe] .dropdownlist-arregly-custom.k-dropdownlist .k-input-inner {
    padding: 0 12px !important;
    height: 30px !important;
    line-height: 30px !important;
    font-size: 0.9rem !important;
    color: #101828 !important;
}

[b-1pozdpvsbe] .dropdownlist-arregly-custom.k-dropdownlist .k-select {
    background: transparent !important;
    border-left: none !important;
}

/* Custom commission table layout */
.custom-commission-table[b-1pozdpvsbe] {
    border-collapse: separate;
    border-spacing: 0;
}

.custom-commission-table tbody tr[b-1pozdpvsbe] {
    border-bottom: 1px solid #f3f4f6;
}

.custom-commission-table tbody tr:last-child[b-1pozdpvsbe] {
    border-bottom: none;
}

.custom-commission-table td[b-1pozdpvsbe], 
.custom-commission-table th[b-1pozdpvsbe] {
    border: none !important;
}

.custom-commission-table thead th[b-1pozdpvsbe] {
    background-color: #f9fafb !important;
    color: #4b5563 !important;
    font-weight: 600 !important;
    border-bottom: 1px solid #e5e7eb !important;
}

/* Styling for Association Section Cards */
.associations-section-card[b-1pozdpvsbe] {
    background-color: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    padding: 20px !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.04), 0 2px 4px -1px rgba(0, 0, 0, 0.02) !important;
}

.associations-section-card .section-icon[b-1pozdpvsbe] {
    width: 1.2rem;
    height: 1.2rem;
    color: #111827;
}

.switch-box[b-1pozdpvsbe] {
    border: 1px solid #e5e7eb !important;
    background-color: #f9fafb !important;
}

.empty-specialized-box[b-1pozdpvsbe] {
    border-style: dashed !important;
    border-color: #d1d5db !important;
    background-color: #fafafa !important;
}

.employee-chip[b-1pozdpvsbe] {
    background-color: #f3f4f6 !important;
    border-color: #e5e7eb !important;
    color: #1f2937 !important;
    transition: background-color 0.15s ease;
}

.employee-chip:hover[b-1pozdpvsbe] {
    background-color: #e5e7eb !important;
}

.btn-close-chip[b-1pozdpvsbe] {
    font-size: 0.8rem;
    line-height: 1;
    cursor: pointer;
    opacity: 0.6;
    transition: opacity 0.15s ease;
}

.btn-close-chip:hover[b-1pozdpvsbe] {
    opacity: 1;
    color: #ef4444 !important;
}

.last-border-0:last-child[b-1pozdpvsbe] {
    border-bottom: none !important;
}

/* ==========================================================================
   DISEÑO FIRST-MOBILE: TARJETAS RESPONSIVAS DE PRODUCTOS E INSUMOS ASOCIADOS
   ========================================================================== */
.mobile-service-product-card[b-1pozdpvsbe] {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    padding: 14px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.03);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.mobile-service-product-card:hover[b-1pozdpvsbe] {
    border-color: #cbd5e1;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.06);
}

.mobile-product-header[b-1pozdpvsbe] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    padding-bottom: 10px;
    border-bottom: 1px solid #f1f5f9;
}

.mobile-product-title[b-1pozdpvsbe] {
    font-weight: 600;
    font-size: 0.92rem;
    color: #0f172a;
    line-height: 1.25;
}

.mobile-product-sku[b-1pozdpvsbe] {
    font-size: 0.75rem;
    color: #64748b;
}

.mobile-product-body[b-1pozdpvsbe] {
    padding-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.mobile-field-group[b-1pozdpvsbe] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.mobile-field-label[b-1pozdpvsbe] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #475569;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.mobile-quantity-row[b-1pozdpvsbe] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
}

.mobile-service-product-card[b-1pozdpvsbe]  .k-numerictextbox .k-input-inner,
.mobile-service-product-card[b-1pozdpvsbe]  .k-dropdownlist .k-input-inner {
    min-height: 38px !important;
    font-size: 0.9rem !important;
}

.mobile-delete-btn[b-1pozdpvsbe] {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* ==========================================================================
   ESTILOS PESTAÑA RESUMEN (UX EJECUTIVA & DESGLOSE FINANCIERO)
   ========================================================================== */

.summary-kpi-card[b-1pozdpvsbe] {
    background: #ffffff;
    border: 1px solid #e8ecf2;
    border-radius: 12px;
    padding: 12px 14px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03), 0 1px 2px rgba(0, 0, 0, 0.02);
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.summary-kpi-card:hover[b-1pozdpvsbe] {
    transform: translateY(-2px);
    box-shadow: 0 6px 14px -3px rgba(0, 0, 0, 0.07), 0 2px 4px -2px rgba(0, 0, 0, 0.03);
    border-color: #cbd5e1;
}

.summary-kpi-header[b-1pozdpvsbe] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
    margin-bottom: 6px;
}

.summary-kpi-label[b-1pozdpvsbe] {
    font-size: 0.72rem;
    font-weight: 700;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    line-height: 1.2;
}

.summary-kpi-icon[b-1pozdpvsbe] {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: transform 0.2s ease;
}

.summary-kpi-card:hover .summary-kpi-icon[b-1pozdpvsbe] {
    transform: scale(1.06);
}

.summary-kpi-value[b-1pozdpvsbe] {
    font-size: 1.28rem;
    font-weight: 800;
    color: #0f172a;
    line-height: 1.2;
    margin: 2px 0 4px 0;
    letter-spacing: -0.02em;
}

.summary-kpi-value--total[b-1pozdpvsbe] {
    color: #059669 !important;
}

.summary-kpi-subtext[b-1pozdpvsbe] {
    font-size: 0.70rem;
    color: #94a3b8;
    line-height: 1.3;
}

/* Iconos y acentos limpios sin bordes laterales */
.summary-kpi-card--primary .summary-kpi-icon[b-1pozdpvsbe] {
    background: #eff6ff;
    color: #2563eb;
}

.summary-kpi-card--info .summary-kpi-icon[b-1pozdpvsbe] {
    background: #f0fdfa;
    color: #0d9488;
}

.summary-kpi-card--warning .summary-kpi-icon[b-1pozdpvsbe] {
    background: #fffbeb;
    color: #d97706;
}

.summary-kpi-card--muted .summary-kpi-icon[b-1pozdpvsbe] {
    background: #f8fafc;
    color: #94a3b8;
}

.summary-kpi-card--success[b-1pozdpvsbe] {
    background: linear-gradient(180deg, #ffffff 0%, #f7fdf9 100%);
    border-color: #d1fae5;
    box-shadow: 0 1px 3px rgba(16, 185, 129, 0.06), 0 2px 6px rgba(0, 0, 0, 0.02);
}

.summary-kpi-card--success:hover[b-1pozdpvsbe] {
    border-color: #a7f3d0;
    box-shadow: 0 8px 18px -4px rgba(16, 185, 129, 0.12);
}

.summary-kpi-card--success .summary-kpi-icon[b-1pozdpvsbe] {
    background: #ecfdf5;
    color: #059669;
}

/* Barra de Composición */
.summary-composition-card[b-1pozdpvsbe] {
    background: #ffffff;
    border: 1px solid #e8ecf2;
    border-radius: 14px;
    padding: 16px 20px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
}

.summary-progress-bar[b-1pozdpvsbe] {
    height: 9px;
    border-radius: 999px;
    overflow: hidden;
    background: #f1f5f9;
    display: flex;
    width: 100%;
    gap: 2px;
}

.summary-progress-segment[b-1pozdpvsbe] {
    height: 100%;
    transition: width 0.3s ease;
    border-radius: 2px;
}

.summary-progress-segment--base[b-1pozdpvsbe] {
    background: #3b82f6;
}

.summary-progress-segment--insumos[b-1pozdpvsbe] {
    background: #10b981;
}

.summary-progress-segment--merma[b-1pozdpvsbe] {
    background: #f59e0b;
}

.summary-legend-pill[b-1pozdpvsbe] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    background: #f8fafc;
    border: 1px solid #eef2f6;
    border-radius: 999px;
    font-size: 0.74rem;
}

.summary-dot[b-1pozdpvsbe] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
}

.summary-dot--base[b-1pozdpvsbe] {
    background: #3b82f6;
}

.summary-dot--insumos[b-1pozdpvsbe] {
    background: #10b981;
}

.summary-dot--merma[b-1pozdpvsbe] {
    background: #f59e0b;
}

/* Tarjetas móviles de insumos para el resumen */
.mobile-summary-product-card[b-1pozdpvsbe] {
    background: #ffffff;
    border: 1px solid #e8ecf2;
    border-radius: 12px;
    padding: 14px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}

.mobile-summary-grid[b-1pozdpvsbe] {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.mobile-summary-row[b-1pozdpvsbe] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.empty-state-summary-box[b-1pozdpvsbe] {
    background: #fafafa;
}


/* /Components/Forms/TenantBranch/Forms/BranchForm.razor.rz.scp.css */
.branch-feature-toggle-card[b-t9o3fmbejg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 0.9rem 1.15rem;
    background: linear-gradient(135deg, #f8fafc 0%, #f0fdf9 100%);
    border: 1px solid rgba(3, 76, 72, 0.18);
    border-radius: 12px;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.branch-feature-toggle-card:hover[b-t9o3fmbejg] {
    border-color: rgba(3, 76, 72, 0.35);
    box-shadow: 0 2px 10px rgba(3, 76, 72, 0.06);
}

.branch-feature-toggle-content[b-t9o3fmbejg] {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    flex: 1;
    min-width: 0;
}

.branch-feature-toggle-icon-wrap[b-t9o3fmbejg] {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background-color: rgba(3, 76, 72, 0.1);
    color: #034c48;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.branch-feature-toggle-icon-wrap :deep(.k-svg-icon)[b-t9o3fmbejg] {
    width: 18px;
    height: 18px;
}

.branch-feature-toggle-text[b-t9o3fmbejg] {
    flex: 1;
    min-width: 0;
}

.branch-feature-toggle-title[b-t9o3fmbejg] {
    font-size: 0.88rem;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 0.15rem;
}

.branch-feature-toggle-desc[b-t9o3fmbejg] {
    font-size: 0.78rem;
    color: #64748b;
    line-height: 1.35;
}

.branch-feature-toggle-action[b-t9o3fmbejg] {
    flex-shrink: 0;
}

/* TelerikSwitch personalizado en color institucional Arregly (Teal #034c48 / #115e59) */
[b-t9o3fmbejg] .switch-arregly.k-switch-on .k-switch-track,
[b-t9o3fmbejg] .k-switch-on .k-switch-track {
    background-color: #034c48 !important;
    border-color: #034c48 !important;
}

[b-t9o3fmbejg] .switch-arregly.k-switch-on:hover .k-switch-track,
[b-t9o3fmbejg] .k-switch-on:hover .k-switch-track {
    background-color: #04635e !important;
    border-color: #04635e !important;
}

[b-t9o3fmbejg] .switch-arregly.k-switch-off .k-switch-track,
[b-t9o3fmbejg] .k-switch-off .k-switch-track {
    background-color: #e2e8f0 !important;
    border-color: #cbd5e1 !important;
}

[b-t9o3fmbejg] .switch-arregly .k-switch-thumb {
    background-color: #ffffff !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) !important;
}

@media (max-width: 575.98px) {
    .branch-feature-toggle-card[b-t9o3fmbejg] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }

    .branch-feature-toggle-action[b-t9o3fmbejg] {
        align-self: flex-end;
    }
}
/* /Components/Forms/TenantBranch/Forms/TenantForm.razor.rz.scp.css */
/* /Components/Forms/TenantBranch/TenantBranchForm.razor.rz.scp.css */
/* /Components/Global/EmptyState.razor.rz.scp.css */
.base-grid-empty-state.empty-state-card[b-n64gkwhwab] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    min-height: 420px;
    padding: 72px 20px;
    /* Fondo celeste sutil según requerimiento */
    background: #fff;
    border: 1px solid #fff;
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
    width: 100%;
    box-sizing: border-box;
}

.base-grid-empty-icon[b-n64gkwhwab] {
    width: 220px;
    max-width: 100%;
    height: auto;
    margin: 0 auto 20px;
    display: block;
}

.base-grid-empty-state h3[b-n64gkwhwab] {
    font-size: 44px;
    font-weight: 800;
    line-height: 1.15;
    color: #0f172a;
    margin-bottom: 12px;
}

.base-grid-empty-state p[b-n64gkwhwab] {
    font-size: 20px;
    font-weight: 400;
    color: #475569;
    max-width: 960px;
    line-height: 1.45;
    margin: 0 auto 24px;
}

.base-grid-empty-state[b-n64gkwhwab]  .k-button {
    padding: 10px 20px;
    font-size: 14px;
    border-radius: 8px;
}

@media (max-width: 992px) {
    .base-grid-empty-icon[b-n64gkwhwab] {
        width: 180px;
    }

    .base-grid-empty-state h3[b-n64gkwhwab] {
        font-size: 28px;
    }

    .base-grid-empty-state p[b-n64gkwhwab] {
        font-size: 16px;
        max-width: 560px;
    }
}
/* /Components/Global/GlobalDialog.razor.rz.scp.css */
/****************************************************************CSS PARA DIALOG ****************************************************/
.arregly-overlay[b-6qqpg52iav] {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(16, 24, 40, 0.55) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 12000 !important;
    backdrop-filter: blur(4px) !important;
}

.arregly-dialog.dialog-wide[b-6qqpg52iav] {
    width: min(92vw, 1200px) !important;
    max-width: 1200px !important;
}

.arregly-dialog[b-6qqpg52iav] {
    width: 90% !important;
    max-width: 420px !important;
    background: white !important;
    border-radius: 16px !important;
    box-shadow: 0 20px 60px rgba(0,0,0,.2) !important;
    overflow: hidden !important;
    transform: scale(.95) !important;
    opacity: 0 !important;
    transition: all .2s ease !important;
}

.dialog-enter[b-6qqpg52iav] {
    transform: scale(1) !important;
    opacity: 1 !important;
}

.dialog-exit[b-6qqpg52iav] {
    transform: scale(.9) !important;
    opacity: 0 !important;
}

.dialog-header[b-6qqpg52iav] {
    padding: 16px 20px !important;
    font-weight: 600 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px !important;
}

.btn-close-dialog-x[b-6qqpg52iav] {
    background: transparent !important;
    border: none !important;
    color: inherit !important;
    padding: 4px !important;
    border-radius: 50% !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    opacity: 0.7 !important;
    transition: opacity 0.2s ease, background-color 0.2s ease !important;
}

.btn-close-dialog-x:hover[b-6qqpg52iav] {
    opacity: 1 !important;
    background-color: rgba(0, 0, 0, 0.08) !important;
}

.dialog-body[b-6qqpg52iav] {
    padding: 20px !important;
    color: #475467 !important;
    font-size: 0.95rem !important;
    line-height: 1.5 !important;
}

.dialog-footer[b-6qqpg52iav] {
    padding: 16px 20px !important;
    display: flex !important;
    justify-content: flex-end !important;
    gap: 12px !important;
}

/* ── MOBILE OPTIMIZATIONS (<= 480px) ── */
@media (max-width: 480px) {
    .dialog-header[b-6qqpg52iav], .dialog-body[b-6qqpg52iav], .dialog-footer[b-6qqpg52iav] {
        padding: 14px 16px !important;
    }

    .dialog-footer[b-6qqpg52iav] {
        flex-direction: column-reverse !important;
        gap: 8px !important;
    }

    .dialog-footer[b-6qqpg52iav]  .btn-arregly {
        width: 100% !important;
        margin: 0 !important;
        min-width: 100% !important;
    }

    .arregly-dialog.dialog-wide[b-6qqpg52iav] {
        width: 90% !important;
        max-width: 420px !important;
    }
}

/* Colores */
.dialog-success[b-6qqpg52iav] {
    background: #ecfdf3 !important;
    color: #027a48 !important;
}

.dialog-error[b-6qqpg52iav] {
    background: #fef3f2 !important;
    color: #b42318 !important;
}

.dialog-warning[b-6qqpg52iav] {
    background: #fffaeb !important;
    color: #b54708 !important;
}

.dialog-info[b-6qqpg52iav] {
    background: #eff8ff !important;
    color: #175cd3 !important;
}

.dialog-question[b-6qqpg52iav] {
    background: #f2f4f7 !important;
    color: #344054 !important;
}
/************************************************************** FIN DE CSS PARA DIALOG *************************************************/
/* /Components/Grid/BaseAccordionGrid.razor.rz.scp.css */
/* ══════════════════════════════════════════
   BaseAccordionGrid — Scoped Styles (Mobile First)
   ══════════════════════════════════════════ */

.accordion-grid-container[b-fxwodu2w3h] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

/* ── TOOLBAR (Mobile Base) ── */
.accordion-toolbar[b-fxwodu2w3h] {
    display: flex;
    flex-direction: row; /* Horizontal by default */
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 12px;
    background-color: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
}

.toolbar-left[b-fxwodu2w3h] {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    flex: 1;
    min-width: 0;
}

    .toolbar-left[b-fxwodu2w3h]  .search-input-container {
        flex: 1;
        min-width: 0;
    }

/* El buscador ocupa el espacio flexible dentro del toolbar */
[b-fxwodu2w3h] .toolbar-left .search-input-container {
    flex: 1 1 auto;
    min-width: 150px;
}

/* Botón circular de utilidad (mismo patrón que BaseGrid) */
.toolbar-utility-btn[b-fxwodu2w3h] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border-radius: 999px;
    border: 1.5px solid #e5e7eb;
    background: #ffffff;
    color: #4b5563;
    cursor: pointer;
    flex-shrink: 0;
    transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.12s ease, box-shadow 0.18s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

.toolbar-utility-btn:hover[b-fxwodu2w3h] {
    transform: translateY(-1px);
    background: #f3f4f6;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
}

.toolbar-utility-btn--refresh[b-fxwodu2w3h] {
    color: #4b5563;
    border-color: #e5e7eb;
}

.toolbar-utility-btn--refresh:hover[b-fxwodu2w3h] {
    color: #1d4ed8;
    border-color: #bfdbfe;
    background: #eff6ff;
}

.toolbar-info[b-fxwodu2w3h] {
    display: flex;
    align-items: center;
    margin-left: auto; /* Push to right on desktop */
}

.toolbar-extra[b-fxwodu2w3h] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

/* ── BADGES ── */
.accordion-badges[b-fxwodu2w3h] {
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
}

.records-badge[b-fxwodu2w3h] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    background-color: #f3f4f6;
    color: #374151;
    white-space: nowrap;
}

/* ── MOBILE OPTIMIZATIONS (<= 576px) ── */
@media (max-width: 576px) {
    .accordion-toolbar[b-fxwodu2w3h] {
        padding: 8px 12px;
        gap: 8px;
    }

    .toolbar-left[b-fxwodu2w3h] {
        gap: 4px;
        flex: 1;
    }

    .toolbar-info[b-fxwodu2w3h] {
        margin-left: 0; /* Group on mobile */
    }

        .toolbar-left[b-fxwodu2w3h]  .k-button {
            width: 32px !important;
            min-width: 32px !important;
            height: 32px !important;
        }

    .records-badge[b-fxwodu2w3h] {
        font-size: 11px;
        padding: 4px 8px;
    }
}

.total-badge[b-fxwodu2w3h] {
    background-color: #e5e7eb;
    color: #1f2937;
}

.filtered-badge[b-fxwodu2w3h] {
    background-color: #e0f2fe;
    color: #0369a1;
}

.no-data-message[b-fxwodu2w3h] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 40px;
    color: #6b7280;
    font-size: 16px;
    background-color: #f9fafb;
    border-radius: 8px;
    border: 1px dashed #d1d5db;
}

/* ── PAGER (Mobile Base) ── */
.accordion-pager[b-fxwodu2w3h] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    padding: 12px 16px;
    background-color: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    margin-top: 0.5rem;
}

.pager-left[b-fxwodu2w3h],
.pager-center[b-fxwodu2w3h],
.pager-right[b-fxwodu2w3h] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.pager-info[b-fxwodu2w3h] {
    font-size: 14px;
    color: #4b5563;
    text-align: center;
}

.pager-controls[b-fxwodu2w3h] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    flex-wrap: wrap;
}

.pager-btn[b-fxwodu2w3h] {
    min-width: 32px;
    height: 32px;
    padding: 0;
    border: 1px solid #d1d5db;
    background-color: #ffffff;
    color: #374151;
    border-radius: 6px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.pager-btn:not(:disabled):hover[b-fxwodu2w3h] {
    background-color: #f3f4f6;
    border-color: #9ca3af;
}

.pager-btn:disabled[b-fxwodu2w3h] {
    opacity: 0.5;
    cursor: not-allowed;
}

.pager-current[b-fxwodu2w3h] {
    margin: 0 8px;
    font-size: 14px;
    color: #1f2937;
}

.pager-pagesize[b-fxwodu2w3h] {
    width: 80px;
    margin-right: 8px;
}

.pager-pagesize-label[b-fxwodu2w3h] {
    font-size: 14px;
    color: #6b7280;
}

.pager-right[b-fxwodu2w3h] {
    gap: 8px;
}

/* ══════════════════════════════════════════
   BREAKPOINTS
   ══════════════════════════════════════════ */

/* MD: Tablets (768px and up) */
@media (min-width: 768px) {
    /* Restore Toolbar to horizontal row */
    .accordion-toolbar[b-fxwodu2w3h] {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding: 8px 16px;
    }

    .toolbar-left[b-fxwodu2w3h] {
        flex-direction: row;
        align-items: center;
        width: auto;
        flex: 1;
    }

    .toolbar-right[b-fxwodu2w3h] {
        flex-direction: row;
        align-items: center;
        width: auto;
    }

    .search-box[b-fxwodu2w3h] {
        max-width: 400px;
    }

    /* Restore Pager to horizontal row */
    .accordion-pager[b-fxwodu2w3h] {
        flex-wrap: nowrap;
        justify-content: space-between;
        padding: 8px 16px;
    }

    .pager-left[b-fxwodu2w3h],
    .pager-center[b-fxwodu2w3h],
    .pager-right[b-fxwodu2w3h] {
        width: auto;
        justify-content: flex-start;
    }
}
/* /Components/Grid/BaseGrid.razor.rz.scp.css */
/* Integración visual mejorada del toolbar con el grid */
.base-grid-container[b-rbkob7y4uz] {
    --base-grid-primary-color: var(--grid-primary-color, var(--primary-color, #0d6efd));
    --base-grid-hover-bg: var(--grid-hover-bg, color-mix(in srgb, var(--base-grid-primary-color) 6%, #ffffff));
    --base-grid-selected-bg: var(--grid-selected-bg, color-mix(in srgb, var(--base-grid-primary-color) 6%, #ffffff));
    --base-grid-selected-hover-bg: var(--grid-selected-hover-bg, color-mix(in srgb, var(--base-grid-primary-color) 10%, #ffffff));
    --base-grid-selected-text: var(--grid-selected-text, #1f2937);
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.01);
    border: none !important;
    outline: 1px solid transparent;
    background-clip: padding-box;
    height: 100% !important;
    position: relative;
    width: 100%;
    max-width: 100%;
}

.base-grid-initial-loading-overlay[b-rbkob7y4uz] {
    position: absolute;
    inset: 0;
    z-index: 30;
    background: #ffffff;
    padding: 0;
    border-radius: 15px;
}

.base-grid-loading-state[b-rbkob7y4uz] {
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}

.base-grid-loading-state .base-grid-toolbar-wrapper[b-rbkob7y4uz] {
    visibility: hidden !important;
}

.base-grid-loading-state .table-skeleton-container[b-rbkob7y4uz] {
    border-radius: 12px;
}

[b-rbkob7y4uz] .base-grid-preload-hidden .k-grid-toolbar,
[b-rbkob7y4uz] .base-grid-preload-hidden .k-grid-header,
[b-rbkob7y4uz] .base-grid-preload-hidden .k-grid-content,
[b-rbkob7y4uz] .base-grid-preload-hidden .k-grid-pager,
[b-rbkob7y4uz] .base-grid-preload-hidden .k-grid-footer {
    visibility: hidden !important;
}

.base-grid-table-shell[b-rbkob7y4uz] {
    position: relative;
    width: 100%;
}

.base-grid-mobile-cards[b-rbkob7y4uz] {
    position: relative;
}

.base-grid-reload-loading-overlay[b-rbkob7y4uz] {
    position: absolute;
    top: 54px;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 20;
    background: #ffffff;
    padding: 0;
    overflow: hidden;
    border-radius: 0 0 15px 15px;
}

.base-grid-reload-loading-overlay--cards[b-rbkob7y4uz] {
    top: 0;
    border-radius: 12px;
}

.base-grid-reload-loading-overlay .table-skeleton-container[b-rbkob7y4uz] {
    border-radius: 0 0 12px 12px;
    border: none;
    box-shadow: none;
}

[b-rbkob7y4uz] .base-grid-reloading .k-grid-toolbar {
    visibility: visible !important;
}

[b-rbkob7y4uz] .base-grid-reloading .k-grid-header {
    visibility: visible !important;
    position: relative !important;
    z-index: 25 !important;
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%) !important;
}

[b-rbkob7y4uz] .base-grid-reloading .k-grid-content,
[b-rbkob7y4uz] .base-grid-reloading .k-grid-pager,
[b-rbkob7y4uz] .base-grid-reloading .k-grid-footer {
    visibility: hidden !important;
}

@media (max-width: 992px) {
    .toolbar-buttons[b-rbkob7y4uz] {
        width: 100%;
        flex-wrap: wrap;
    }

    .toolbar-search-expanded[b-rbkob7y4uz] {
        flex: 1 1 100%;
        min-width: 0;
        width: 100%;
    }

    .toolbar-right[b-rbkob7y4uz] {
        width: 100%;
        justify-content: flex-start;
    }
}

.base-grid-toolbar-wrapper[b-rbkob7y4uz] {
    background-color: #ffffff;
    border-radius: 15px 15px 0 0;
    padding: 10px 16px;
    border-bottom: 1px solid #eef2f7;
    width: 100%;
    box-sizing: border-box;
}

.grid-toolbar[b-rbkob7y4uz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 0;
    background: transparent;
    gap: 12px;
    flex-wrap: wrap;
}

.toolbar-search-group[b-rbkob7y4uz] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1 1 auto;
    min-width: 220px;
}

@media (max-width: 768px) {
    .base-grid-toolbar-wrapper[b-rbkob7y4uz] {
        border-radius: 12px;
        padding: 12px;
        margin-bottom: 12px;
        background-color: #ffffff;
        box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
        border: 1px solid #cbd5e1;
        width: 100%;
        box-sizing: border-box;
    }

    .grid-toolbar[b-rbkob7y4uz] {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
        padding: 0 !important;
        width: 100% !important;
        box-sizing: border-box !important;
        margin-top: 0 !important;
    }

    .toolbar-left[b-rbkob7y4uz] {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
        flex: 1 1 100% !important;
    }

    /* Unificación en un solo div/fila horizontal cuando hay filtro único de sedes */
    .toolbar-left:has(.inventory-toolbar-branch-filter > *:only-child)[b-rbkob7y4uz],
    .toolbar-left:has(.pos-toolbar-branch-filter)[b-rbkob7y4uz] {
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: 4px !important;
        width: 100% !important;
    }

    .toolbar-left:has(.inventory-toolbar-branch-filter > *:only-child) .toolbar-extra[b-rbkob7y4uz],
    .toolbar-left:has(.pos-toolbar-branch-filter) .toolbar-extra[b-rbkob7y4uz] {
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: 80px !important;
    }

    .toolbar-left:has(.inventory-toolbar-branch-filter > *:only-child) .inventory-toolbar-branch-filter[b-rbkob7y4uz],
    .toolbar-left:has(.pos-toolbar-branch-filter) .pos-toolbar-branch-filter[b-rbkob7y4uz] {
        display: block !important;
        width: 80px !important;
    }

    .toolbar-left:has(.inventory-toolbar-branch-filter > *:only-child) .dropdownlist-arregly[b-rbkob7y4uz],
    .toolbar-left:has(.inventory-toolbar-branch-filter > *:only-child) .k-dropdownlist[b-rbkob7y4uz],
    .toolbar-left:has(.inventory-toolbar-branch-filter > *:only-child) .k-picker[b-rbkob7y4uz],
    .toolbar-left:has(.pos-toolbar-branch-filter) .dropdownlist-arregly[b-rbkob7y4uz],
    .toolbar-left:has(.pos-toolbar-branch-filter) .k-dropdownlist[b-rbkob7y4uz],
    .toolbar-left:has(.pos-toolbar-branch-filter) .k-picker[b-rbkob7y4uz] {
        width: 80px !important;
        max-width: 80px !important;
        min-width: 80px !important;
    }

    .toolbar-left:has(.inventory-toolbar-branch-filter > *:only-child) .k-input-inner[b-rbkob7y4uz],
    .toolbar-left:has(.pos-toolbar-branch-filter) .k-input-inner[b-rbkob7y4uz] {
        padding: 2px 4px 2px 6px !important;
        font-size: 0.8rem !important;
    }

    .toolbar-left:has(.inventory-toolbar-branch-filter > *:only-child) .k-input-button[b-rbkob7y4uz],
    .toolbar-left:has(.pos-toolbar-branch-filter) .k-input-button[b-rbkob7y4uz] {
        padding: 0 4px !important;
    }

    .toolbar-left:has(.inventory-toolbar-branch-filter > *:only-child) .toolbar-search-group[b-rbkob7y4uz],
    .toolbar-left:has(.pos-toolbar-branch-filter) .toolbar-search-group[b-rbkob7y4uz] {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        width: auto !important;
        display: flex !important;
        align-items: center !important;
        gap: 4px !important;
    }

    .toolbar-left:has(.inventory-toolbar-branch-filter > *:only-child) .toolbar-utility-btn[b-rbkob7y4uz],
    .toolbar-left:has(.pos-toolbar-branch-filter) .toolbar-utility-btn[b-rbkob7y4uz] {
        flex: 0 0 28px !important;
        width: 28px !important;
        height: 28px !important;
        min-width: 28px !important;
        padding: 0 !important;
    }

    .toolbar-extra[b-rbkob7y4uz] {
        width: 100% !important;
        flex: 1 1 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    /* Contenedores de filtros dentro de toolbar-extra: cuadrícula equitativa de 2 columnas */
    .toolbar-extra[b-rbkob7y4uz]  .inventory-toolbar-branch-filter,
    .toolbar-extra[b-rbkob7y4uz]  .orders-toolbar-filters,
    .toolbar-extra[b-rbkob7y4uz]  .d-flex {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
        width: 100% !important;
    }

    /* El último elemento impar abarca el ancho completo solo cuando hay múltiples filtros (3 o más) */
    .toolbar-extra[b-rbkob7y4uz]  .inventory-toolbar-branch-filter > *:last-child:nth-child(odd):not(:only-child),
    .toolbar-extra[b-rbkob7y4uz]  .orders-toolbar-filters > *:last-child:nth-child(odd):not(:only-child),
    .toolbar-extra[b-rbkob7y4uz]  .d-flex > *:last-child:nth-child(odd):not(:only-child) {
        grid-column: 1 / -1 !important;
    }

    /* Módulo de Cotizaciones: filtros en una sola fila compacta equitativa */
    .toolbar-extra[b-rbkob7y4uz]  .quotes-toolbar-filters,
    .toolbar-extra[b-rbkob7y4uz]  .quotes-toolbar-filters.d-flex {
        display: grid !important;
        grid-auto-flow: column !important;
        grid-auto-columns: 1fr !important;
        grid-template-columns: none !important;
        gap: 4px !important;
        width: 100% !important;
    }

    .toolbar-extra[b-rbkob7y4uz]  .quotes-toolbar-filters > *,
    .toolbar-extra[b-rbkob7y4uz]  .quotes-toolbar-filters.d-flex > * {
        grid-column: auto !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    /* Controles de contexto de Productos (radio pills + selector de sede) */
    .toolbar-extra[b-rbkob7y4uz]  .products-toolbar-context-controls {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 8px !important;
        width: 100% !important;
    }

    /* Asegurar que todos los dropdowns de Arregly y Telerik ocupen el 100% de su columna en responsive */
    .toolbar-extra[b-rbkob7y4uz]  .dropdownlist-arregly,
    .toolbar-extra[b-rbkob7y4uz]  .k-dropdownlist,
    .toolbar-extra[b-rbkob7y4uz]  .k-picker,
    .toolbar-filters[b-rbkob7y4uz]  .dropdownlist-arregly,
    .toolbar-filters[b-rbkob7y4uz]  .k-dropdownlist,
    .toolbar-filters[b-rbkob7y4uz]  .k-picker {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Filtros adicionales (FilterContent) organizados en 2 columnas */
    .toolbar-filters[b-rbkob7y4uz],
    .toolbar-filters[b-rbkob7y4uz]  > div {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
        width: 100% !important;
    }

    .toolbar-filters > *:last-child:nth-child(odd):not(:only-child)[b-rbkob7y4uz],
    .toolbar-filters[b-rbkob7y4uz]  > div > *:last-child:nth-child(odd):not(:only-child),
    .toolbar-filters[b-rbkob7y4uz]  > *:last-child:nth-child(odd):not(:only-child) {
        grid-column: 1 / -1 !important;
    }

    .toolbar-search-group[b-rbkob7y4uz] {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    .toolbar-search-group[b-rbkob7y4uz] >  .search-input-container {
        flex: 1 1 auto !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    .toolbar-search-group[b-rbkob7y4uz] >  .textbox-arregly {
        width: 100% !important;
    }

    .toolbar-right[b-rbkob7y4uz] {
        display: none !important; /* Ocultar totales para salvar espacio en mobile */
    }

    .grid-footer[b-rbkob7y4uz] {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        padding: 12px 16px !important;
        background: #ffffff !important;
        border-radius: 12px !important;
        border-top: 1px solid #eef2f7 !important;
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
        margin-top: 12px !important;
        box-sizing: border-box !important;
    }

    .grid-footer-info[b-rbkob7y4uz] {
        width: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin-top: 4px !important;
    }

    .base-grid-mobile-pager[b-rbkob7y4uz] {
        padding: 0 0 8px 0 !important;
        width: 100% !important;
        border-bottom: 1px solid #f1f5f9 !important;
        margin-bottom: 8px !important;
    }

    [b-rbkob7y4uz] .mobile-pager-btn {
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 8px !important;
    }

    .mobile-pager-info[b-rbkob7y4uz] {
        font-size: 0.85rem;
        white-space: nowrap;
    }
}

[b-rbkob7y4uz] .custom-base-grid .k-grid-toolbar,
[b-rbkob7y4uz] .custom-base-grid .k-toolbar,
[b-rbkob7y4uz] .custom-base-grid .k-toolbar .k-toolbar-items {
    display: flex;
    align-items: center;
    width: 100%;
    background: #fff;
    border: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

.toolbar-left[b-rbkob7y4uz] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1 1 auto;
    min-width: 0;
}

/* El buscador ocupa el espacio flexible; los botones de utilidad quedan al final.
   Se usa ::deep porque SearchInput es un componente hijo de Blazor. */
[b-rbkob7y4uz] .toolbar-left .search-input-container {
    flex: 1 1 auto;
    min-width: 150px;
}

.toolbar-utility-btn[b-rbkob7y4uz] {
    flex-shrink: 0;
}

.toolbar-buttons[b-rbkob7y4uz] {
    display: flex;
    gap: 8px;
    align-items: center;
    flex: 1 1 auto;
    min-width: 0;
}

.toolbar-buttons > .search-input-container[b-rbkob7y4uz] {
    flex: 1 1 auto;
    min-width: 250px;
}

[b-rbkob7y4uz] button.toolbar-btn {
    border-radius: 8px !important;
    font-weight: 600 !important;
    padding: 10px 16px !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-shrink: 0 !important;
}

[b-rbkob7y4uz] button.toolbar-btn:hover {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

/* Jerarquía visual de botones del toolbar */
[b-rbkob7y4uz] button.toolbar-btn-primary {
    background: linear-gradient(135deg, #0d6efd 0%, #0056b3 100%) !important;
    border: none !important;
    color: white !important;
    font-weight: 700 !important;
}

[b-rbkob7y4uz] button.toolbar-btn-primary:hover {
    background: linear-gradient(135deg, #0056b3 0%, #004085 100%) !important;
    box-shadow: 0 6px 16px rgba(13, 110, 253, 0.4) !important;
}

/* Botones de utilidad circulares del toolbar (recargar, columnas, PDF) */
.toolbar-utility-btn[b-rbkob7y4uz],
[b-rbkob7y4uz] .toolbar-utility-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border-radius: 999px;
    border: 1.5px solid #e5e7eb;
    background: #ffffff;
    color: #4b5563;
    cursor: pointer;
    flex-shrink: 0;
    transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.12s ease, box-shadow 0.18s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

.toolbar-utility-btn:hover[b-rbkob7y4uz],
[b-rbkob7y4uz] .toolbar-utility-btn:hover {
    transform: translateY(-1px);
    background: #f3f4f6;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
}

/* Botón recargar — neutro con tinte azul al hover */
.toolbar-utility-btn--refresh[b-rbkob7y4uz],
[b-rbkob7y4uz] .toolbar-utility-btn--refresh {
    color: #4b5563;
    border-color: #e5e7eb;
}

.toolbar-utility-btn--refresh:hover[b-rbkob7y4uz],
[b-rbkob7y4uz] .toolbar-utility-btn--refresh:hover {
    color: #1d4ed8;
    border-color: #bfdbfe;
    background: #eff6ff;
}

/* Botón columnas — neutro con tinte indigo al hover */
.toolbar-utility-btn--settings[b-rbkob7y4uz],
[b-rbkob7y4uz] .toolbar-utility-btn--settings {
    color: #4b5563;
    border-color: #e5e7eb;
}

.toolbar-utility-btn--settings:hover[b-rbkob7y4uz],
[b-rbkob7y4uz] .toolbar-utility-btn--settings:hover {
    color: #4338ca;
    border-color: #c7d2fe;
    background: #eef2ff;
}

/* Botón PDF — neutro sobrio con acento suave carmesí al hover */
.toolbar-utility-btn--pdf[b-rbkob7y4uz],
[b-rbkob7y4uz] .toolbar-utility-btn--pdf {
    color: #475569;
    border-color: #cbd5e1;
    background: #ffffff;
}

.toolbar-utility-btn--pdf:hover[b-rbkob7y4uz],
[b-rbkob7y4uz] .toolbar-utility-btn--pdf:hover {
    color: #b91c1c;
    border-color: #fca5a5;
    background: #fef2f2;
    box-shadow: 0 2px 6px rgba(185, 28, 28, 0.08);
}

/* Botón Excel — tinte verde coincidiendo con detalles de orden */
.toolbar-utility-btn--excel[b-rbkob7y4uz],
[b-rbkob7y4uz] .toolbar-utility-btn--excel {
    color: #166534;
    border-color: #bbf7d0;
    background: #f0fdf4;
}

.toolbar-utility-btn--excel:hover[b-rbkob7y4uz],
[b-rbkob7y4uz] .toolbar-utility-btn--excel:hover {
    color: #14532d;
    border-color: #86efac;
    background: #dcfce7;
    box-shadow: 0 3px 8px rgba(22, 101, 52, 0.15);
}

/* Buscador expandido y dominante */
.toolbar-search-expanded[b-rbkob7y4uz] {
    flex: 1 1 auto;
    width: auto;
    min-width: 260px;
    max-width: none;
}

.toolbar-right[b-rbkob7y4uz] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 0 0 auto;
    min-width: 0;
    flex-shrink: 0;
    margin-left: auto;
    justify-content: flex-end;
}

.toolbar-info[b-rbkob7y4uz] {
    display: flex;
    align-items: center;
    gap: 15px;
    justify-content: flex-end;
}

/* Badges estilizados para el total de registros */
.records-badge[b-rbkob7y4uz] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
    white-space: nowrap;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.total-badge[b-rbkob7y4uz] {
    background: #f3f4f6 !important; /* Fondo gris claro, neutral */
    color: #222 !important; /* Texto oscuro para contraste */
    border: none !important;
    border-radius: 999px !important; /* Píldora */
    box-shadow: none !important;
    font-weight: 600 !important;
    font-size: 0.95rem !important;
    padding: 7px 18px !important;
    min-width: 0 !important;
    transition: none !important;
    cursor: default !important;
}

/* Eliminar efecto hover para el badge pasivo */
.total-badge:hover[b-rbkob7y4uz] {
    background: #f3f4f6 !important;
    color: #222 !important;
    box-shadow: none !important;
    transform: none !important;
}

.filtered-badge[b-rbkob7y4uz] {
    background: linear-gradient(135deg, #ffc107 0%, #fd7e14 100%);
    color: #212529;
    border: 2px solid rgba(255, 193, 7, 0.3);
    font-weight: 700;
}

.pdf-generate-btn[b-rbkob7y4uz] {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 8px 14px !important;
    background: var(--primary-gradient) !important;
    color: var(--primary-text-color) !important;
    border: none !important;
    border-radius: 20px !important;
    font-size: 0.875rem !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important;
    white-space: nowrap !important;
    font-family: inherit !important;
    min-height: 38px !important;
    white-space: nowrap !important;
}

.grid-footer[b-rbkob7y4uz] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: 100%;
    padding: 10px 16px 16px;
    background: #ffffff;
    border-top: 1px solid #eef2f7;
}

.grid-footer-info[b-rbkob7y4uz] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.filtered-badge:hover[b-rbkob7y4uz] {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(255, 193, 7, 0.4);
}

.records-badge .k-svg-icon[b-rbkob7y4uz] {
    width: 16px;
    height: 16px;
    opacity: 0.9;
}

/* Estilos mejorados para la ventana del selector de columnas */
.column-chooser-window[b-rbkob7y4uz] {
    border-radius: 16px !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15) !important;
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    z-index: 10000 !important;
}

.window-title-content[b-rbkob7y4uz] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 700;
    font-size: 1.15rem;
    color: #343a40;
}

.column-chooser-content[b-rbkob7y4uz] {
    padding: 24px;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.column-chooser-header[b-rbkob7y4uz] {
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 2px solid #f1f3f4;
}

.chooser-description[b-rbkob7y4uz] {
    margin: 0;
    color: #495057;
    font-size: 0.95rem;
    line-height: 1.6;
}

.column-list[b-rbkob7y4uz] {
    flex: 1;
    overflow-y: auto;
    margin-bottom: 24px;
    padding-right: 8px;
    max-height: 320px;
}

/* Estilos mejorados para los items de columnas */
.column-item[b-rbkob7y4uz] {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 18px;
    margin-bottom: 10px;
    background: #f8f9fa;
    border-radius: 10px;
    border: 2px solid #e9ecef;
    transition: all 0.3s ease;
    cursor: pointer;
}

.column-item:hover[b-rbkob7y4uz] {
    background: #e3f2fd;
    border-color: #2196f3;
    transform: translateX(6px);
    box-shadow: 0 4px 12px rgba(33, 150, 243, 0.15);
}

.column-item.column-visible[b-rbkob7y4uz] {
    background: #d4edda;
    border-color: #28a745;
}

.column-item.column-visible:hover[b-rbkob7y4uz] {
    background: #c3e6cb;
    border-color: #1e7e34;
}

.column-item.column-hidden[b-rbkob7y4uz] {
    background: #f8d7da;
    border-color: #dc3545;
    opacity: 0.7;
}

.column-item.column-hidden:hover[b-rbkob7y4uz] {
    background: #f5c6cb;
    border-color: #bd2130;
    opacity: 1;
}

.column-label[b-rbkob7y4uz] {
    flex: 1;
    margin: 0;
    cursor: pointer;
    user-select: none;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.column-title[b-rbkob7y4uz] {
    font-weight: 600;
    color: #343a40;
    font-size: 0.95rem;
}

.column-field[b-rbkob7y4uz] {
    font-size: 0.8rem;
    color: #6c757d;
    font-style: italic;
}

.column-chooser-actions[b-rbkob7y4uz] {
    display: flex;
    gap: 12px;
    justify-content: center;
    padding: 20px 0;
    border-top: 2px solid #f1f3f4;
    margin-bottom: 16px;
}

.column-chooser-actions .k-button[b-rbkob7y4uz] {
    border-radius: 10px !important;
    font-weight: 600 !important;
    padding: 12px 20px !important;
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    transition: all 0.2s ease !important;
}

.column-chooser-actions .k-button:hover[b-rbkob7y4uz] {
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

.column-chooser-footer[b-rbkob7y4uz] {
    text-align: center;
    padding-top: 16px;
    border-top: 1px solid #e9ecef;
}

/* Estado sin datos ahora manejado por EmptyState.razor.css */

[b-rbkob7y4uz] .custom-base-grid .k-grid {
    height: 100% !important;
}

[b-rbkob7y4uz] .custom-base-grid .k-grid-content {
    height: 100% !important;
}

[b-rbkob7y4uz] .custom-base-grid .k-grid-content table {
    height: auto;
}

[b-rbkob7y4uz] .custom-base-grid .k-grid-content:has(.product-empty-state) table,
[b-rbkob7y4uz] .custom-base-grid .k-grid-content:has(.k-grid-norecords) table {
    height: 100%;
}

    [b-rbkob7y4uz] .custom-base-grid .k-grid-content td {
        padding: 4px !important;
        border-bottom: 1px solid rgba(203, 213, 225, 0.8)  !important;
        cursor: pointer !important;
    }

/* Estado sin datos ahora manejado por EmptyState.razor.css */

/* =================== FIX: MENÚ DE ACCIONES (DropDownButton en Grid) =================== */

[b-rbkob7y4uz] .action-menu-container {
    display: flex;
    justify-content: center;
    align-items: center;
    position: static;
}

[b-rbkob7y4uz] .action-menu-button {
    border-radius: 12px !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    color: var(--primary-color) !important;
    transition: all 0.25s ease !important;
    position: relative !important;
}

[b-rbkob7y4uz] .action-menu-button:hover {
    background: var(--RgbaColor03) !important;
    color: var(--primary-color) !important;
    transform: none !important;
    box-shadow: none !important;
}

[b-rbkob7y4uz] .action-menu-button:focus {
    box-shadow: none !important;
}

[b-rbkob7y4uz] .action-menu-button:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35) !important;
}

[b-rbkob7y4uz] .action-menu-button .k-svg-icon {
    width: 16px !important;
    height: 16px !important;
}

[b-rbkob7y4uz] .action-menu-button,
[b-rbkob7y4uz] .action-menu-button:hover,
[b-rbkob7y4uz] .action-menu-button:focus,
[b-rbkob7y4uz] .action-menu-button:active {
    transform: none !important;
}

.three-dots-icon[b-rbkob7y4uz] {
    font-size: 18px !important;
    font-weight: bold !important;
    line-height: 1 !important;
    color: inherit !important;
}

/* =================== PERSONALIZACIÓN DEL GRID =================== */

.custom-base-grid[b-rbkob7y4uz] {
    border: none;
    border-radius: 0 0 12px 12px;
    overflow: visible !important; /* FIX: visible para no cortar popups */
    box-shadow: none;
    width: 100%;
    max-width: 100%;
}

[b-rbkob7y4uz] .custom-base-grid .k-grid {
    width: 100% !important;
    max-width: 100% !important;
}

[b-rbkob7y4uz] .custom-base-grid .k-grid-table,
[b-rbkob7y4uz] .custom-base-grid .k-table {
    table-layout: fixed;
    width: 100% !important;
    background: #fff;
}

[b-rbkob7y4uz] .custom-base-grid .k-grid-header-wrap .k-table,
[b-rbkob7y4uz] .custom-base-grid .k-grid-content .k-table,
[b-rbkob7y4uz] .custom-base-grid .k-grid-header-wrap th,
[b-rbkob7y4uz] .custom-base-grid .k-grid-content td {
    box-sizing: border-box;
}

[b-rbkob7y4uz] .custom-base-grid .k-grid-header-wrap th,
[b-rbkob7y4uz] .custom-base-grid .k-grid-content td {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

[b-rbkob7y4uz] .custom-base-grid .k-pager-info,
[b-rbkob7y4uz] .custom-base-grid .k-pager-sizes .k-label {
    display: none !important;
}

[b-rbkob7y4uz] .custom-base-grid .k-filter-row,
[b-rbkob7y4uz] .custom-base-grid .k-grid-filter,
[b-rbkob7y4uz] .custom-base-grid .k-grid-filter-menu {
    display: none !important;
}

[b-rbkob7y4uz] .custom-base-grid .k-grid-content {
    overflow-x: auto !important;
    overflow-y: auto !important;
}

.custom-base-grid .k-grid-header[b-rbkob7y4uz] {
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    border-bottom: 2px solid #e0e6ed;
}

.custom-base-grid .k-grid-header .k-header[b-rbkob7y4uz] {
    font-weight: 700;
    color: #343a40;
    padding: 16px 12px;
    text-align: left;
    border-right: 1px solid #e0e6ed;
    font-size: 0.875rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Estilos para FilterRow */
.custom-base-grid .k-filter-row[b-rbkob7y4uz] {
    background: linear-gradient(135deg, #fafbfc 0%, #ffffff 100%);
    border-bottom: 1px solid #e0e6ed;
}

.custom-base-grid .k-filter-row .k-textbox[b-rbkob7y4uz],
.custom-base-grid .k-filter-row .k-dropdown[b-rbkob7y4uz],
.custom-base-grid .k-filter-row .k-numerictextbox[b-rbkob7y4uz] {
    font-size: 0.875rem;
    border: 1px solid #dee2e6;
    border-radius: 6px;
}

.custom-base-grid .k-filter-row .k-textbox:focus[b-rbkob7y4uz],
.custom-base-grid .k-filter-row .k-dropdown:focus[b-rbkob7y4uz],
.custom-base-grid .k-filter-row .k-numerictextbox:focus[b-rbkob7y4uz] {
    border-color: #0d6efd;
    box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.25);
}

.custom-base-grid .k-grid-content[b-rbkob7y4uz] {
    background-color: #fff;
}

.custom-base-grid tbody tr[b-rbkob7y4uz] {
    transition: all 0.15s ease;
}

.custom-base-grid tbody tr:hover[b-rbkob7y4uz] {
    background: var(--base-grid-hover-bg);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.custom-base-grid tbody tr:nth-child(even)[b-rbkob7y4uz] {
    background-color: #fafbfc;
}

.custom-base-grid tbody tr:nth-child(even):hover[b-rbkob7y4uz] {
    background: linear-gradient(135deg, #f1f3f4 0%, #fafbfc 100%);
}

.custom-base-grid tbody td[b-rbkob7y4uz] {
    padding: 14px 12px;
    border-right: 1px solid #f0f2f5;
    vertical-align: middle;
    font-size: 0.875rem;
    font-weight: 500;
}

[b-rbkob7y4uz] .custom-base-grid .k-grid-content .k-table-row.k-selected > td,
[b-rbkob7y4uz] .custom-base-grid .k-grid-content tr.k-selected > td,
[b-rbkob7y4uz] .custom-base-grid .k-grid-content td.k-selected {
    background-color: var(--base-grid-selected-bg) !important;
    color: var(--base-grid-selected-text) !important;
}

[b-rbkob7y4uz] .custom-base-grid .k-grid-content .k-table-row.k-selected:hover > td,
[b-rbkob7y4uz] .custom-base-grid .k-grid-content tr.k-selected:hover > td,
[b-rbkob7y4uz] .custom-base-grid .k-grid-content td.k-selected:hover {
    background-color: var(--base-grid-selected-hover-bg) !important;
    color: var(--base-grid-selected-text) !important;
}

[b-rbkob7y4uz] .custom-base-grid .k-grid-content .k-table-row.k-selected .status-badge,
[b-rbkob7y4uz] .custom-base-grid .k-grid-content tr.k-selected .status-badge {
    box-shadow: none;
}

[b-rbkob7y4uz] .custom-base-grid .k-grid-content td {
    transition: background-color 0.2s ease, color 0.2s ease;
}

.custom-base-grid tbody td:last-child[b-rbkob7y4uz] {
    border-right: none;
}

/* Paginación nativa mejorada */
.custom-base-grid .k-pager[b-rbkob7y4uz] {
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%);
    border-top: 2px solid #e0e6ed;
    padding: 16px 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.custom-base-grid .k-pager .k-pager-info[b-rbkob7y4uz] {
    color: #495057;
    font-size: 0.875rem;
    font-weight: 600;
}

.custom-base-grid .k-pager .k-pager-nav[b-rbkob7y4uz] {
    display: flex;
    gap: 6px;
}

.custom-base-grid .k-pager .k-button[b-rbkob7y4uz] {
    border-radius: 8px !important;
    transition: all 0.15s ease !important;
    font-weight: 600 !important;
}

.custom-base-grid .k-pager .k-button:hover[b-rbkob7y4uz] {
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15) !important;
}

/* Estados de badge mejorados */
.badge[b-rbkob7y4uz] {
    font-size: 0.75rem;
    padding: 6px 12px;
    border-radius: 20px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.bg-success[b-rbkob7y4uz] {
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%) !important;
    color: white;
    box-shadow: 0 2px 4px rgba(40, 167, 69, 0.3);
}

.bg-secondary[b-rbkob7y4uz] {
    background: linear-gradient(135deg, #6c757d 0%, #868e96 100%) !important;
    color: white;
    box-shadow: 0 2px 4px rgba(108, 117, 125, 0.3);
}

.text-muted[b-rbkob7y4uz] {
    color: #6c757d !important;
}

/* Estilos para ordenamiento múltiple */
.custom-base-grid .k-header.k-sorted[b-rbkob7y4uz] {
    background: linear-gradient(135deg, #e3f2fd 0%, #f3e5f5 100%);
    position: relative;
}

.custom-base-grid .k-header .k-sort-order[b-rbkob7y4uz] {
    position: absolute;
    top: 4px;
    right: 4px;
    background: linear-gradient(135deg, #1976d2 0%, #7b1fa2 100%);
    color: white;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    font-size: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    box-shadow: 0 2px 4px rgba(25, 118, 210, 0.3);
}

/* =================== ESTILOS PARA COLUMNAS ESTÁNDAR =================== */

.status-badge[b-rbkob7y4uz] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 5px;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: capitalize;
    letter-spacing: 0.3px;
    transition: all 0.2s ease;
    white-space: nowrap;
    /*box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);*/
}

.status-active[b-rbkob7y4uz] {
    background: linear-gradient(135deg, #d4edda 0%, #c3e6cb 100%);
    color: #155724;
   /* border: 1px solid rgba(40, 167, 69, 0.3);*/
}

.status-inactive[b-rbkob7y4uz] {
    background: linear-gradient(135deg, #f8d7da 0%, #f5c6cb 100%);
    color: #721c24;
    /*border: 1px solid rgba(220, 53, 69, 0.3);*/
}

.status-dot[b-rbkob7y4uz] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.3);
}

.status-active .status-dot[b-rbkob7y4uz] {
    background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
}

.status-inactive .status-dot[b-rbkob7y4uz] {
    background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);
}

.status-active:hover[b-rbkob7y4uz] {
    background: linear-gradient(135deg, #c3e6cb 0%, #b8dabd 100%);
    border-color: rgba(40, 167, 69, 0.5);
}

.status-inactive:hover[b-rbkob7y4uz] {
    background: linear-gradient(135deg, #f5c6cb 0%, #f1b0b7 100%);
    border-color: rgba(220, 53, 69, 0.5);
}

/* =================== ESTILOS PARA COLUMN CHOOSER MEJORADO =================== */

.column-section[b-rbkob7y4uz] {
    margin-bottom: 24px;
}

.section-title[b-rbkob7y4uz] {
    font-size: 0.875rem;
    font-weight: 700;
    color: #495057;
    margin: 0 0 12px 0;
    padding: 8px 12px;
    background: linear-gradient(135deg, #f1f3f4 0%, #e9ecef 100%);
    border-radius: 8px;
    border-left: 4px solid #0d6efd;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.column-item.standard-column[b-rbkob7y4uz] {
    background: linear-gradient(135deg, #e3f2fd 0%, #f3e5f5 100%);
    border-color: #2196f3;
    position: relative;
}

    .column-item.standard-column[b-rbkob7y4uz]::before {
        content: "AUTO";
        position: absolute;
        top: 4px;
        right: 8px;
        background: linear-gradient(135deg, #2196f3 0%, #1976d2 100%);
        color: white;
        font-size: 0.6rem;
        font-weight: 700;
        padding: 2px 6px;
        border-radius: 10px;
        letter-spacing: 0.2px;
    }

    .column-item.standard-column:hover[b-rbkob7y4uz] {
        background: linear-gradient(135deg, #d1ecf1 0%, #e8d5e8 100%);
        border-color: #1976d2;
    }

    .column-item.standard-column.column-visible[b-rbkob7y4uz] {
        background: linear-gradient(135deg, #c8e6c9 0%, #dcedc8 100%);
        border-color: #4caf50;
    }

        .column-item.standard-column.column-visible:hover[b-rbkob7y4uz] {
            background: linear-gradient(135deg, #a5d6a7 0%, #c5e1a5 100%);
            border-color: #388e3c;
        }

.column-standard[b-rbkob7y4uz] {
    color: #2196f3 !important;
    font-weight: 600 !important;
    font-style: normal !important;
}

/* =================== ESTADOS DE CARGA Y VACÍO =================== */

.custom-base-grid .k-grid-norecords[b-rbkob7y4uz] {
    text-align: center;
    padding: 60px 20px;
    color: #6c757d;
    font-style: normal;
    background: transparent;
    border-radius: 0;
    margin: 0;
    box-shadow: none;
}

[b-rbkob7y4uz] .custom-base-grid .k-grid-content tr.k-grid-norecords td,
[b-rbkob7y4uz] .custom-base-grid .k-grid-content .k-grid-norecords td {
    border: none !important;
    padding: 0 !important;
}

[b-rbkob7y4uz] .custom-base-grid.k-loading::after,
[b-rbkob7y4uz] .custom-base-grid .k-loading-mask,
[b-rbkob7y4uz] .custom-base-grid .k-loader-container,
[b-rbkob7y4uz] .custom-base-grid .k-loader,
[b-rbkob7y4uz] .custom-base-grid .k-loader-spinner-3,
.base-grid-container[b-rbkob7y4uz]  .k-loading-mask,
.base-grid-container[b-rbkob7y4uz]  .k-loader-container,
.base-grid-container[b-rbkob7y4uz]  .k-loader,
.base-grid-container[b-rbkob7y4uz]  .k-loader-spinner-3 {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

/* =================== ANIMACIONES Y TRANSICIONES =================== */

.custom-base-grid .k-grid-content tbody tr[b-rbkob7y4uz] {
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.column-item[b-rbkob7y4uz] {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

[b-rbkob7y4uz] button.toolbar-btn {
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* =================== RESPONSIVE DESIGN =================== */

@media (max-width: 1200px) {
    .grid-toolbar[b-rbkob7y4uz] {
        padding: 14px 16px;
        gap: 12px;
    }

    .toolbar-left[b-rbkob7y4uz] {
        gap: 12px;
    }

    .toolbar-right[b-rbkob7y4uz] {
        gap: 12px;
    }
}

@media (max-width: 992px) {
    .toolbar-buttons[b-rbkob7y4uz] {
        flex-wrap: wrap;
    }
}

@media (max-width: 768px) {
    .grid-toolbar[b-rbkob7y4uz] {
        padding: 12px;
    }

    .toolbar-btn[b-rbkob7y4uz] {
        padding: 8px 12px !important;
        font-size: 0.8125rem !important;
    }

    .toolbar-info[b-rbkob7y4uz] {
        justify-content: center;
        text-align: center;
    }

    .action-buttons[b-rbkob7y4uz] {
        flex-direction: column;
        gap: 4px;
    }

        .action-buttons .k-button[b-rbkob7y4uz] {
            width: 100%;
            justify-content: center;
        }

    .column-chooser-window[b-rbkob7y4uz] {
        width: 90% !important;
        height: 80% !important;
    }

    .status-badge[b-rbkob7y4uz] {
        font-size: 0.6875rem;
        padding: 4px 8px;
        gap: 4px;
    }

    .status-dot[b-rbkob7y4uz] {
        width: 6px;
        height: 6px;
    }

    .section-title[b-rbkob7y4uz] {
        font-size: 0.8125rem;
        padding: 6px 10px;
    }

    .column-item.standard-column[b-rbkob7y4uz]::before {
        font-size: 0.5rem;
        padding: 1px 4px;
    }
}

@media (max-width: 480px) {
    .custom-base-grid tbody td[b-rbkob7y4uz] {
        padding: 10px 6px;
        font-size: 0.8125rem;
    }

    .action-buttons .k-button[b-rbkob7y4uz] {
        font-size: 0.6875rem !important;

        padding: 4px 8px !important;
    }

    .column-chooser-content[b-rbkob7y4uz] {
        padding: 16px;
    }

    .column-item[b-rbkob7y4uz] {
        padding: 10px 12px;
    }
}

/* Ocultar cabeceras de columnas cuando no hay datos */
.base-grid-empty[b-rbkob7y4uz]  .k-grid-header,
.base-grid-empty[b-rbkob7y4uz]  .k-grid-header-wrap,
.base-grid-empty[b-rbkob7y4uz]  .k-grid-header-table {
    display: none !important;
}

/* Ocultar bordes y sombras de la tabla cuando está vacía */
.base-grid-empty[b-rbkob7y4uz]  .k-grid {
    border-bottom: none !important;
    box-shadow: none !important;
}

.base-grid-empty[b-rbkob7y4uz]  .k-grid-content {
    border: none !important;
}

[b-rbkob7y4uz] .k-grid .k-table-th {
    background: #F8FAFC;
    color: #344054;
    font-weight: 600;
    text-align: center !important;
    justify-content: center !important;
}


[b-rbkob7y4uz] .custom-base-grid {
    overflow: hidden;
    border: 1px solid #e6e8eb;
    background: white;
}

    [b-rbkob7y4uz] .custom-base-grid .k-grid-header {
        background: #f8f9fb;
        border-bottom: 1px solid #e6e8eb;
    }

        [b-rbkob7y4uz] .custom-base-grid .k-grid-header th {
            font-weight: 600;
            color: #344054;
            padding: 12px 14px;
        }

    [b-rbkob7y4uz] .custom-base-grid .k-grid-header th:first-child,
    [b-rbkob7y4uz] .custom-base-grid .k-table-th:first-child,
    [b-rbkob7y4uz] .custom-base-grid td:first-child,
    [b-rbkob7y4uz] .custom-base-grid .k-table-td:first-child,
    [b-rbkob7y4uz] .custom-base-grid .k-grid-content td:first-child {
        padding-left: 20px !important;
    }

    [b-rbkob7y4uz] .custom-base-grid tbody tr {
        border-bottom: 1px solid #f1f2f4;
        transition: all 0.15s ease;
    }

        [b-rbkob7y4uz] .custom-base-grid tbody tr:hover {
            background: #f9fafb;
        }

    [b-rbkob7y4uz] .custom-base-grid td {
        padding: 12px 14px;
        color: #344054;
    }

    [b-rbkob7y4uz] .custom-base-grid.k-grid-toolbar {
        padding: 14px;
        border-bottom: 1px solid #e6e8eb;
        background: white;
    }

    [b-rbkob7y4uz] .custom-base-grid .k-pager-wrap {
        border-top: 1px solid #e6e8eb;
        background: #fafafa;
    }

    [b-rbkob7y4uz] .custom-base-grid .k-pager-nav {
        border-radius: 8px;
    }


    [b-rbkob7y4uz] .custom-base-grid ::-webkit-scrollbar {
        height: 8px;
    }

    [b-rbkob7y4uz] .custom-base-grid ::-webkit-scrollbar-thumb {
        background: #d0d5dd;
        border-radius: 10px;
    }

    [b-rbkob7y4uz] .custom-base-grid .k-grid-content {
        padding-bottom: 5px;
    }

    [b-rbkob7y4uz] .custom-base-grid td,
    [b-rbkob7y4uz] .custom-base-grid th {
        border-right: none !important;
        border-left: none !important;
    }

    [b-rbkob7y4uz] .custom-base-grid .k-grid-content,
    [b-rbkob7y4uz] .custom-base-grid .k-table-tbody,
    [b-rbkob7y4uz] .custom-base-grid .k-table-td,
    [b-rbkob7y4uz] .custom-base-grid .k-master-row,
    [b-rbkob7y4uz] .custom-base-grid .k-alt {
        background: transparent !important;
        color: #101828 !important;
        /*border-bottom: 1px solid rgba(203, 213, 225, 0.8);*/
    }

    [b-rbkob7y4uz] .custom-base-grid tbody tr:hover,
    [b-rbkob7y4uz] .k-grid tbody tr:hover,
    [b-rbkob7y4uz] .k-grid tbody tr.k-table-row:hover {
        background: var(--RgbaColor01) !important;
    }

[b-rbkob7y4uz] .custom-base-grid .k-pager {
    background-color: #F8FAFC;
    border: 0px solid #E4E7EC;
}


    [b-rbkob7y4uz] .custom-base-grid .k-grid-pager,
    [b-rbkob7y4uz] .custom-base-grid .k-pager-wrap {
        background: #fff !important;
        /*color: red !important;*/
        border-top: 0 solid transparent !important;
    }

        [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-pager-info,
        [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-label,
        [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-link,
        [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-button,
        [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-icon-button,
        [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-input-inner,
        [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-select,
        [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-icon,
        [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-svg-icon {
            /*color: var(--primary-color) !important;*/
        }

    [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-button,
    [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-icon-button,
    [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-picker,
    [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-dropdownlist,
    [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-input,
    [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-textbox {
        background: transparent !important;
        border-color: transparent !important;
        box-shadow: none !important;
    }

        [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-button:hover,
        [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-icon-button:hover,
        [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-link:hover,
        [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-pager-nav:hover,
        [b-rbkob7y4uz] .custom-base-grid .k-grid-pager .k-pager-numbers .k-button:hover {
            background: var(--RgbaColor03) !important;
        }

.toolbar-filters[b-rbkob7y4uz] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* =================== BASE GRID MOBILE CARDS =================== */
.base-grid-mobile-cards[b-rbkob7y4uz] {
    padding: 0;
    background-color: transparent;
    width: 100%;
}

/* ==========================================================================
   Alineación de Encabezados de Columna (Headers Flexbox)
   ========================================================================== */
[b-rbkob7y4uz] .k-grid-header th.text-start .k-cell-inner,
[b-rbkob7y4uz] .k-grid-header th.text-start .k-link {
    justify-content: flex-start !important;
    text-align: left !important;
}

[b-rbkob7y4uz] .k-grid-header th.text-end .k-cell-inner,
[b-rbkob7y4uz] .k-grid-header th.text-end .k-link {
    justify-content: flex-end !important;
    text-align: right !important;
}

[b-rbkob7y4uz] .k-grid-header th.text-center .k-cell-inner,
[b-rbkob7y4uz] .k-grid-header th.text-center .k-link {
    justify-content: center !important;
    text-align: center !important;
}

/* ==========================================================================
   Zebra Striping Sutil (Facilita escaneo horizontal de filas anchas)
   ========================================================================== */
[b-rbkob7y4uz] .custom-base-grid .k-grid-table tbody tr:nth-child(even),
[b-rbkob7y4uz] .custom-base-grid tbody tr:nth-child(even) {
    background-color: #fafbfc !important;
}

[b-rbkob7y4uz] .custom-base-grid .k-grid-table tbody tr:hover,
[b-rbkob7y4uz] .custom-base-grid tbody tr:hover {
    background-color: #f1f5f9 !important;
}

/* ==========================================================================
   Contenedor de Botones de Acción en Fila (Inline Quick Action + Kebab)
   ========================================================================== */
.action-menu-container[b-rbkob7y4uz],
[b-rbkob7y4uz] .action-menu-container {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    width: 100%;
}



/* /Components/Grid/MobileCard.razor.rz.scp.css */
/* ============================
   MobileCard - Tarjeta móvil reutilizable
   Centraliza estilos del contenedor y separadores
   para todas las vistas móviles del sistema.
   ============================ */

.mobile-card[b-wejqja8fxb] {
    margin-bottom: 0.75rem;
    padding: 1rem;
    background-color: #fff;
    border-radius: 12px;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    border: 1px solid #cbd5e1;
    position: relative;
}

@media (max-width: 576px) {
    .mobile-card[b-wejqja8fxb] {
        padding: 12px;
    }
}

.mobile-card-header[b-wejqja8fxb] {
    margin-bottom: 0.25rem;
}

.mobile-card-header.has-details[b-wejqja8fxb] {
    margin-bottom: 0.5rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e2e8f0;
}

.mobile-card-details[b-wejqja8fxb] {
    margin-top: 0;
    padding-top: 0;
}
/* /Components/Header/Banner.razor.rz.scp.css */
/*********************************************************************************************************
    CSS PARA EL BANNER DE BIENVENIDA
***********************************************************************************************************/
.welcome-banner[b-2eezno1133] {
    background: var(--primary-gradient) !important;
    border-radius: 16px;
    padding: 32px;
    margin-bottom: 32px;
    color: var(--primary-text-color);
    box-shadow: 0 8px 32px rgba(102, 126, 234, 0.2);
    position: relative;
    overflow: hidden;
}

/* ==========================================================================
   Header Compacto (~72px) para Recuperación de Espacio Vertical (Inventario/Catálogo)
   ========================================================================== */
.welcome-banner.welcome-banner--compact[b-2eezno1133],
.welcome-banner--compact[b-2eezno1133] {
    padding: 12px 20px !important;
    margin-bottom: 12px !important;
    min-height: unset !important;
    border-radius: 12px !important;
}

.welcome-banner.welcome-banner--compact[b-2eezno1133]::before,
.welcome-banner--compact[b-2eezno1133]::before {
    width: 120px !important;
    height: 120px !important;
    transform: translate(30px, -30px) !important;
}

.welcome-banner.welcome-banner--compact[b-2eezno1133]::after,
.welcome-banner--compact[b-2eezno1133]::after {
    display: none !important;
}

.welcome-banner.welcome-banner--compact .title-icon[b-2eezno1133],
.welcome-banner--compact .title-icon[b-2eezno1133] {
    width: 38px !important;
    height: 38px !important;
    border-radius: 10px !important;
}

.welcome-banner.welcome-banner--compact[b-2eezno1133]  .icon-main,
.welcome-banner.welcome-banner--compact .title-icon .icon-main[b-2eezno1133],
.welcome-banner.welcome-banner--compact .title-icon svg[b-2eezno1133],
.welcome-banner--compact .title-icon svg[b-2eezno1133] {
    width: 20px !important;
    height: 20px !important;
}

.welcome-banner.welcome-banner--compact .banner-title[b-2eezno1133],
.welcome-banner--compact .banner-title[b-2eezno1133] {
    font-size: 1.25rem !important;
    margin-bottom: 2px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
}

.welcome-banner.welcome-banner--compact .banner-subtitle[b-2eezno1133],
.welcome-banner--compact .banner-subtitle[b-2eezno1133] {
    font-size: 0.8125rem !important;
    color: rgba(255, 255, 255, 0.95) !important;
    opacity: 1 !important;
    margin-bottom: 0 !important;
    line-height: 1.35 !important;
    font-weight: 400 !important;
}

.welcome-banner.welcome-banner--compact .title-container[b-2eezno1133],
.welcome-banner--compact .title-container[b-2eezno1133] {
    gap: 12px !important;
}

.welcome-banner.welcome-banner--compact .banner-content[b-2eezno1133],
.welcome-banner--compact .banner-content[b-2eezno1133] {
    align-items: center !important;
}

.welcome-banner[b-2eezno1133]::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 200px;
    height: 200px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    transform: translate(50px, -50px);
}

.welcome-banner[b-2eezno1133]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 150px;
    height: 150px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 50%;
    transform: translate(-50px, 50px);
}

.banner-content[b-2eezno1133] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    z-index: 1;
}

.banner-info[b-2eezno1133] {
    flex: 1;
}

.title-container[b-2eezno1133] {
    display: flex;
    align-items: center;
    gap: 20px;
}

.title-icon[b-2eezno1133] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    background: rgba(255, 255, 255, 0.15);
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(10px);
}

[b-2eezno1133] .icon-main {
    width: 32px;
    height: 32px;
    color: var(--primary-text-color);
}

.title-text[b-2eezno1133] {
    flex: 1;
}

.banner-title[b-2eezno1133] {
    font-size: 2.25rem;
    font-weight: 700;
    margin: 0 0 8px 0;
    color: var(--primary-text-color);
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.banner-subtitle[b-2eezno1133] {
    font-size: 1.125rem;
    margin: 0;
    color: var(--primary-text-color, 0.9);
    font-weight: 400;
}

.banner-actions[b-2eezno1133] {
    flex-shrink: 0;
    margin-left: 24px;
}

.btn-new-order[b-2eezno1133],
[b-2eezno1133] .btn-new-order {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 24px;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 12px;
    color: var(--primary-text-color, #ffffff);
    font-size: 0.9375rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    text-decoration: none;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.btn-new-order:hover[b-2eezno1133],
[b-2eezno1133] .btn-new-order:hover {
    background: rgba(255, 255, 255, 0.25);
    border-color: rgba(255, 255, 255, 0.4);
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.16);
    color: var(--primary-text-color, #ffffff);
}

.btn-new-order:active[b-2eezno1133],
[b-2eezno1133] .btn-new-order:active {
    transform: translateY(0);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

[b-2eezno1133] .btn-icon {
    width: 18px;
    height: 18px;
}

/* Responsive */
@media (max-width: 768px) {
    .welcome-banner[b-2eezno1133] {
        padding: 24px;
        margin-bottom: 24px;
    }

    .banner-content[b-2eezno1133] {
        flex-direction: column;
        text-align: center;
        gap: 24px;
    }

    .title-container[b-2eezno1133] {
        flex-direction: column;
        gap: 16px;
        text-align: center;
    }

    .title-icon[b-2eezno1133] {
        width: 56px;
        height: 56px;
        margin: 0 auto;
    }

    [b-2eezno1133] .icon-main {
        width: 28px;
        height: 28px;
    }

    .banner-actions[b-2eezno1133] {
        margin-left: 0;
    }

    .banner-title[b-2eezno1133] {
        font-size: 1.875rem;
    }

    .banner-subtitle[b-2eezno1133] {
        font-size: 1rem;
    }
}

@media (max-width: 480px) {
    .welcome-banner[b-2eezno1133] {
        padding: 16px;
        margin-bottom: 16px;
    }

    .title-container[b-2eezno1133] {
        gap: 12px;
    }

    .title-icon[b-2eezno1133] {
        width: 48px;
        height: 48px;
    }

    [b-2eezno1133] .icon-main {
        width: 24px;
        height: 24px;
    }

    .banner-title[b-2eezno1133] {
        font-size: 1.5rem;
    }

    .btn-new-order[b-2eezno1133],
    [b-2eezno1133] .btn-new-order {
        padding: 10px 18px;
        font-size: 0.875rem;
    }
}
/********************************* FIN DEL CSS DEL BANNER BIENVENIDA **************************************/

.title-logo-container[b-2eezno1133] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 16px;
    border: 3px solid rgba(255, 255, 255, 0.4);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(20px);
    position: relative;
    overflow: hidden;
}

.banner-logo[b-2eezno1133] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.banner-logo-placeholder[b-2eezno1133] {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, 0.15);
    color: var(--primary-text-color);
}

.title-logo-container .logo-hover-overlay[b-2eezno1133] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(15, 23, 42, 0.45);
    color: #fff;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
}

.title-logo-container:hover .logo-hover-overlay[b-2eezno1133] {
    opacity: 1;
}

@media (max-width: 768px) {
    .title-logo-container[b-2eezno1133] {
        width: 56px;
        height: 56px;
        margin: 0 auto;
    }
}

@media (max-width: 480px) {
    .title-logo-container[b-2eezno1133] {
        width: 48px;
        height: 48px;
    }
}

/* Badge de estado en el Banner (visible únicamente en móvil) */
.banner-status-badge[b-2eezno1133] {
    position: absolute;
    top: 14px;
    right: 14px;
    display: none;
    align-items: center;
    gap: 7px;
    padding: 5px 12px;
    background: rgba(0, 0, 0, 0.28);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 9999px;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 4;
}

.banner-status-badge .status-dot[b-2eezno1133] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
}

.banner-status-badge.status-active .status-dot[b-2eezno1133] {
    background-color: #4ade80;
    box-shadow: 0 0 6px rgba(74, 222, 128, 0.7);
}

.banner-status-badge.status-inactive .status-dot[b-2eezno1133] {
    background-color: #f87171;
    box-shadow: 0 0 6px rgba(248, 113, 113, 0.7);
}

.banner-status-badge .status-text[b-2eezno1133] {
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    letter-spacing: 0.01em;
}

@media (max-width: 768px) {
    .banner-status-badge[b-2eezno1133] {
        display: inline-flex;
    }
}

/* /Components/Header/CashSessionHeaderIndicator.razor.rz.scp.css */
.cash-session-indicator-wrapper[b-c6jmcbwk3t] {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.cash-indicator-loading[b-c6jmcbwk3t] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    font-size: 0.82rem;
    color: rgba(255, 255, 255, 0.85);
}

.cash-indicator-pill[b-c6jmcbwk3t] {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.28);
    border-radius: 20px;
    padding: 4px 6px 4px 12px;
    transition: all 0.2s ease;
}

.cash-indicator-pill:hover[b-c6jmcbwk3t] {
    background: rgba(255, 255, 255, 0.18);
    border-color: rgba(255, 255, 255, 0.38);
}

.cash-indicator-badge[b-c6jmcbwk3t] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #ffffff;
    font-size: 0.82rem;
    font-weight: 500;
    line-height: 1.2;
    cursor: default;
    user-select: none;
}

[b-c6jmcbwk3t] .cash-indicator-icon {
    color: #34d399; /* emerald-400 */
}

.cash-indicator-menu-btn[b-c6jmcbwk3t] {
    border: none;
    background: rgba(255, 255, 255, 0.15);
    color: #ffffff;
    border-radius: 50%;
    width: 26px;
    height: 26px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
    padding: 0;
}

.cash-indicator-menu-btn:hover[b-c6jmcbwk3t] {
    background: rgba(255, 255, 255, 0.3);
    transform: scale(1.05);
}

.cash-open-btn[b-c6jmcbwk3t] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    border: 1px solid rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
    border-radius: 20px;
    padding: 6px 14px;
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
}

.cash-open-btn:hover[b-c6jmcbwk3t] {
    background: rgba(255, 255, 255, 0.22);
    border-color: rgba(255, 255, 255, 0.4);
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
}

.cash-indicator-backdrop[b-c6jmcbwk3t] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 2040;
}

.cash-indicator-dropdown[b-c6jmcbwk3t] {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 190px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.18);
    padding: 6px;
    z-index: 2050;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.cash-dropdown-item[b-c6jmcbwk3t] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 8px 12px;
    font-size: 0.875rem;
    font-weight: 500;
    color: #374151;
    background: transparent;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    text-align: left;
    transition: all 0.15s ease;
}

.cash-dropdown-item:hover[b-c6jmcbwk3t] {
    background: #f3f4f6;
    color: #111827;
}

.cash-dropdown-divider[b-c6jmcbwk3t] {
    height: 1px;
    background: #e5e7eb;
    margin: 4px 0;
}
/* /Components/Inputs/ColorPicker/RgbColorPicker.razor.rz.scp.css */
.rgb-picker-root[b-tjxvzgcjh9] {
    width: 100%;
}

/* El picker ocupa todo el ancho disponible del modal. */
[b-tjxvzgcjh9] .rgb-picker-control,
[b-tjxvzgcjh9] .rgb-picker-control .k-flatcolorpicker {
    width: 100% !important;
}

/* Aplicamos el borde al único cuadro original del picker (sin contenedores extra). */
[b-tjxvzgcjh9] .rgb-picker-control .k-flatcolorpicker {
    border: 1px solid #e2e8f0 !important;
    border-radius: 8px !important;
    background: #fff !important;
    padding: 10px 12px !important;
}

/* Quitamos borde/sombra internos para evitar doble recuadro en el gradiente. */
[b-tjxvzgcjh9] .rgb-picker-control .k-colorgradient {
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* Ocultamos únicamente la previsualización superior (los dos recuadros pequeños). */
[b-tjxvzgcjh9] .rgb-picker-control .k-coloreditor-preview {
    display: none !important;
}

/* Quitamos la parte de opacidad/transparencia (incluye slider e íconos relacionados). */
[b-tjxvzgcjh9] .rgb-picker-control .k-alpha-slider,
[b-tjxvzgcjh9] .rgb-picker-control .k-colorgradient-color-contrast,
[b-tjxvzgcjh9] .rgb-picker-control .k-color-transparent,
[b-tjxvzgcjh9] .rgb-picker-control [class*='transparent'],
[b-tjxvzgcjh9] .rgb-picker-control .k-i-droplet,
[b-tjxvzgcjh9] .rgb-picker-control .k-i-droplet-slash,
[b-tjxvzgcjh9] .rgb-picker-control .k-i-droplet-slider,
[b-tjxvzgcjh9] .rgb-picker-control .k-i-opacity,
[b-tjxvzgcjh9] .rgb-picker-control .k-svg-i-droplet,
[b-tjxvzgcjh9] .rgb-picker-control .k-svg-i-droplet-slash,
[b-tjxvzgcjh9] .rgb-picker-control .k-svg-i-droplet-slider,
[b-tjxvzgcjh9] .rgb-picker-control .k-svg-i-opacity,
[b-tjxvzgcjh9] .rgb-picker-control [class*='droplet'] {
    display: none !important;
}

/* Ocultamos los inputs nativos del gradiente y dejamos el RGB en la tarjeta inferior. */
[b-tjxvzgcjh9] .rgb-picker-control .k-colorgradient-inputs,
[b-tjxvzgcjh9] .rgb-picker-control .k-colorgradient-input-label {
    display: none !important;
}

/* Esta es la tarjeta inferior donde se muestra la previsualización principal del color. */
.rgb-picker-preview-card[b-tjxvzgcjh9] {
    margin-top: 10px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #fff;
    padding: 10px 12px;
}

/* Primera fila con RGB y Hexadecimal al lado. */
.rgb-picker-controls-row[b-tjxvzgcjh9] {
    display: flex;
    align-items: end;
    gap: 12px;
}

/* Bloque de entradas RGB en tamaño compacto. */
.rgb-picker-rgb-block[b-tjxvzgcjh9] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* Bloque de entrada Hexadecimal con el mismo estilo visual del RGB. */
.rgb-picker-hex-block[b-tjxvzgcjh9] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

/* Segunda fila con la vista previa de color de borde a borde. */
.rgb-picker-preview-swatch-wrap[b-tjxvzgcjh9] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%;
}

/* Este rectángulo muestra la previsualización en tiempo real del color. */
.rgb-picker-preview-swatch[b-tjxvzgcjh9] {
    width: 100%;
    height: 56px;
    border-radius: 6px;
    border: 1px solid #cbd5e1;
    display: inline-block;
}

/* Texto de apoyo para dejar claro que este recuadro es el color elegido. */
.rgb-picker-selected-label[b-tjxvzgcjh9] {
    color: #475569;
    font-size: 12px;
    font-weight: 600;
}

/* Título visual del bloque editable RGB. */
.rgb-picker-values-title[b-tjxvzgcjh9] {
    color: #334155;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* Aquí alineamos los campos R, G y B en una sola fila. */
.rgb-picker-values-inputs[b-tjxvzgcjh9] {
    display: grid;
    grid-template-columns: repeat(3, 56px);
    gap: 8px;
}

/* Este estilo deja cada input numérico compacto y legible. */
[b-tjxvzgcjh9] .rgb-picker-channel-input.k-numerictextbox {
    width: 56px;
    min-height: 30px;
    border-radius: 8px;
}

/* Ocultamos las flechas internas del numérico para dejar solo escritura manual. */
[b-tjxvzgcjh9] .rgb-picker-channel-input .k-input-spinner,
[b-tjxvzgcjh9] .rgb-picker-channel-input .k-spinner-increase,
[b-tjxvzgcjh9] .rgb-picker-channel-input .k-spinner-decrease {
    display: none !important;
}

/* Ajustamos el padding del input cuando no hay spinner visible. */
[b-tjxvzgcjh9] .rgb-picker-channel-input .k-input-inner {
    text-align: center;
    padding-right: 10px !important;
}

/* El campo hexadecimal queda alineado visualmente con los inputs del RGB. */
[b-tjxvzgcjh9] .rgb-picker-hex-input.k-input,
[b-tjxvzgcjh9] .rgb-picker-hex-input.k-textbox {
    min-height: 30px;
    border-radius: 8px;
}

[b-tjxvzgcjh9] .rgb-picker-hex-input .k-input-inner {
    text-transform: uppercase;
    font-family: Consolas, 'Courier New', monospace;
}

@media (max-width: 480px) {
    .rgb-picker-controls-row[b-tjxvzgcjh9] {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 16px !important;
    }

    .rgb-picker-rgb-block[b-tjxvzgcjh9] {
        width: 100% !important;
    }

    .rgb-picker-values-inputs[b-tjxvzgcjh9] {
        grid-template-columns: repeat(3, 1fr) !important;
        max-width: 240px;
    }

    [b-tjxvzgcjh9] .rgb-picker-channel-input.k-numerictextbox {
        width: 100% !important;
    }

    .rgb-picker-hex-block[b-tjxvzgcjh9] {
        width: 100% !important;
    }

    [b-tjxvzgcjh9] .rgb-picker-control .k-colorgradient {
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
}
/* /Components/Inputs/DropDownList/DropDownListSearch.razor.rz.scp.css */

/* /Components/Inputs/SearchInput.razor.rz.scp.css */
/*********************************** SEARCH INPUT REUTILIZABLE ************************************/
.search-input-container[b-q7r1m4fu9h],
[b-q7r1m4fu9h] .toolbar-search-expanded {
    position: relative;
    width: 100%;
    min-width: 0;
    display: flex;
    align-items: center;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

[b-q7r1m4fu9h] .search-input-arregly-icon {
    position: absolute;
    top: 50%;
    left: 12px;
    transform: translateY(-50%);
    z-index: 2;
    pointer-events: none;
    color: #98a2b3;
    width: 16px;
    height: 16px;
}

[b-q7r1m4fu9h] .k-input-inner {
    padding-left: 36px !important;
    padding-right: 10px !important;
}
/******************************************************************************************************************/
/* /Components/Inputs/TextBox/PasswordInput.razor.rz.scp.css */
/* Ancla de scope CSS para componentes Telerik hijos */
.password-scope[b-38q8plan1n] {
    display: contents;
}

[b-38q8plan1n] .form-label,
[b-38q8plan1n] .field-label {
    font-size: 0.875rem !important;
    font-weight: 600 !important;
    color: #334155 !important;
    text-align: left !important;
    display: block !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-bottom: 0.35rem !important;
}

[b-38q8plan1n] .password-input-container {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 1.25rem !important;
}

[b-38q8plan1n] .password-field {
    position: relative !important;
    display: flex !important;
    flex-direction: row !important;
    gap: 0 !important;
    width: 100% !important;
}

[b-38q8plan1n] .password-toggle-btn {
    position: absolute !important;
    top: 50% !important;
    right: 0 !important;
    transform: translateY(-50%) !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 48px !important;
    min-height: 48px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    color: #6b7280 !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: none !important;
    z-index: 2 !important;
}

[b-38q8plan1n] .password-toggle-btn:hover {
    color: #1e293b !important;
    background: transparent !important;
}

[b-38q8plan1n] .password-toggle-icon {
    width: 1.15rem !important;
    height: 1.15rem !important;
}

[b-38q8plan1n] .password-field .k-input-inner {
    padding-right: 48px !important;
}

[b-38q8plan1n] .password-feedback-box {
    margin-top: .65rem !important;
    margin-bottom: .95rem !important;
    padding: .65rem .8rem !important;
    border: 1px solid #edf0f6 !important;
    border-radius: 12px !important;
    background: linear-gradient(180deg, #ffffff 0%, #fafbff 100%) !important;
    flex: none !important;
    text-align: left !important;
}

[b-38q8plan1n] .strength-indicators {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: .45rem !important;
    margin-bottom: .65rem !important;
}

[b-38q8plan1n] .strength-bar {
    height: 7px !important;
    border-radius: 999px !important;
    background: #e8ecf3 !important;
    flex: none !important;
}

[b-38q8plan1n] .strength-bar.level-1 {
    background: #ef4444 !important;
}

[b-38q8plan1n] .strength-bar.level-2 {
    background: #f97316 !important;
}

[b-38q8plan1n] .strength-bar.level-3 {
    background: #f59e0b !important;
}

[b-38q8plan1n] .strength-bar.level-4 {
    background: #84cc16 !important;
}

[b-38q8plan1n] .strength-bar.level-5 {
    background: #16a34a !important;
}

[b-38q8plan1n] .requirements-pending-list {
    display: flex !important;
    flex-direction: column !important;
    gap: .25rem !important;
    margin-top: .15rem !important;
    text-align: left !important;
}

[b-38q8plan1n] .requirement-item {
    color: #dc2626 !important;
    font-size: .86rem !important;
    line-height: 1.25 !important;
    font-weight: 600 !important;
    text-align: left !important;
}

[b-38q8plan1n] .password-field.level-1 .k-input,
[b-38q8plan1n] .password-field.level-1 .k-input-inner,
[b-38q8plan1n] .password-field.level-2 .k-input,
[b-38q8plan1n] .password-field.level-2 .k-input-inner,
[b-38q8plan1n] .password-field.level-3 .k-input,
[b-38q8plan1n] .password-field.level-3 .k-input-inner,
[b-38q8plan1n] .password-field.level-4 .k-input,
[b-38q8plan1n] .password-field.level-4 .k-input-inner,
[b-38q8plan1n] .password-field.level-5 .k-input,
[b-38q8plan1n] .password-field.level-5 .k-input-inner {
    border-color: #d0d5dd !important;
}

[b-38q8plan1n] .password-match,
[b-38q8plan1n] .password-mismatch {
    display: flex !important;
    align-items: center !important;
    gap: .35rem !important;
    margin-top: .5rem !important;
    font-size: .85rem !important;
    flex: none !important;
}

[b-38q8plan1n] .password-match {
    color: #16a34a !important;
}

[b-38q8plan1n] .password-mismatch {
    color: #dc2626 !important;
}
/* /Components/Inputs/ThemeSwitch.razor.rz.scp.css */
[b-07rfmoy2kp] .switch-arregly.k-switch,
[b-07rfmoy2kp] .switch-arregly.k-switch.k-switch-on {
    outline: none !important;
    box-shadow: none !important;
}

[b-07rfmoy2kp] .switch-arregly.k-switch .k-switch-track {
    box-shadow: none !important;
}

[b-07rfmoy2kp] .switch-arregly.k-switch.k-switch-on .k-switch-track {
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
    box-shadow: none !important;
}

[b-07rfmoy2kp] .switch-arregly .k-switch-thumb {
    background-color: var(--RgbaColor05) !important;
}

[b-07rfmoy2kp] .switch-arregly.k-switch.k-switch-on:hover .k-switch-track,
[b-07rfmoy2kp] .switch-arregly.k-switch.k-switch-on.k-hover .k-switch-track {
    background: var(--RgbaColor04) !important;
    border-color: var(--RgbaColor04) !important;
    box-shadow: none !important;
}

[b-07rfmoy2kp] .switch-arregly.k-switch:focus-within .k-switch-track,
[b-07rfmoy2kp] .switch-arregly.k-switch.k-focus .k-switch-track,
[b-07rfmoy2kp] .switch-arregly.k-switch:focus .k-switch-track {
    box-shadow: 0 0 0 0 var(--RgbaColor03) !important;
    border: 0 !important;
}
/* /Components/Inventory/InventoryBulkDock.razor.rz.scp.css */
/* ==========================================================================
   Barra Flotante Contextual de Acciones en Lote (Bulk Action Dock)
   Mobile-First & Modern Dark Glassmorphism (Linear / Shopify Style)
   ========================================================================== */

/* Contenedor Fijo: Mobile First (pantalla completa abajo con safe-area) */
.inventory-bulk-dock-container[b-kfqabfcy11] {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1050;
    display: flex;
    justify-content: center;
    padding: 0 0 env(safe-area-inset-bottom, 8px) 0;
    pointer-events: none; /* Permite clicks en el fondo alrededor */
    animation: bulkDockSlideUp-b-kfqabfcy11 0.28s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes bulkDockSlideUp-b-kfqabfcy11 {
    from {
        transform: translateY(100%);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.inventory-bulk-dock[b-kfqabfcy11] {
    pointer-events: auto;
    width: 100%;
    background: #0f172a;
    background: rgba(15, 23, 42, 0.94);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    padding: 10px 14px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    box-sizing: border-box;
    box-shadow: 0 -8px 25px rgba(0, 0, 0, 0.25);
}

.bulk-dock-info[b-kfqabfcy11] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.bulk-counter-pill[b-kfqabfcy11] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(16, 185, 129, 0.18);
    color: #34d399;
    border: 1px solid rgba(16, 185, 129, 0.35);
    padding: 6px 12px;
    border-radius: 9999px;
    font-size: 0.82rem;
    font-weight: 500;
    white-space: nowrap;
}

.bulk-counter-pill strong[b-kfqabfcy11] {
    font-weight: 700;
    font-size: 0.88rem;
    color: #ffffff;
}

.bulk-counter-pill[b-kfqabfcy11]  .counter-icon,
.bulk-counter-pill .counter-icon[b-kfqabfcy11] {
    width: 14px;
    height: 14px;
    color: #34d399;
}

.btn-bulk-clear[b-kfqabfcy11] {
    background: transparent;
    border: none;
    color: #94a3b8;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.78rem;
    cursor: pointer;
    padding: 6px 8px;
    border-radius: 6px;
    transition: all 0.18s ease;
    min-height: 44px; /* Touch target */
}

.btn-bulk-clear:hover[b-kfqabfcy11] {
    color: #ffffff;
    background: rgba(255, 255, 255, 0.08);
}

.btn-bulk-clear[b-kfqabfcy11]  .k-svg-icon {
    width: 13px;
    height: 13px;
}

.bulk-dock-divider[b-kfqabfcy11] {
    width: 1px;
    height: 24px;
    background: rgba(255, 255, 255, 0.15);
    flex-shrink: 0;
}

.bulk-dock-actions[b-kfqabfcy11] {
    display: flex;
    align-items: center;
    gap: 6px;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
    padding: 2px 0;
}

.bulk-dock-actions[b-kfqabfcy11]::-webkit-scrollbar {
    display: none;
}

.btn-bulk-action[b-kfqabfcy11] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border-radius: 9px;
    font-size: 0.82rem;
    font-weight: 500;
    color: #f1f5f9;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.08);
    cursor: pointer;
    transition: all 0.18s cubic-bezier(0.16, 1, 0.3, 1);
    min-height: 44px; /* Cumplimiento WCAG AAA Mobile-First */
    flex-shrink: 0;
    user-select: none;
}

.btn-bulk-action:hover[b-kfqabfcy11] {
    background: rgba(255, 255, 255, 0.16);
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.25);
    transform: translateY(-1px);
}

.btn-bulk-action:active[b-kfqabfcy11] {
    transform: scale(0.97);
}

.btn-bulk-action[b-kfqabfcy11]  .k-svg-icon {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
}

/* Variantes de Acción en Lote */
.btn-bulk-action--inflow[b-kfqabfcy11] {
    background: #10b981;
    color: #ffffff;
    border-color: #059669;
    font-weight: 600;
    box-shadow: 0 2px 8px rgba(16, 185, 129, 0.25);
}

.btn-bulk-action--inflow:hover[b-kfqabfcy11] {
    background: #059669;
    border-color: #047857;
    color: #ffffff;
}

.btn-bulk-action--transfer[b-kfqabfcy11] {
    background: rgba(6, 182, 212, 0.18);
    color: #67e8f9;
    border-color: rgba(6, 182, 212, 0.35);
}

.btn-bulk-action--transfer:hover[b-kfqabfcy11] {
    background: rgba(6, 182, 212, 0.28);
    color: #ffffff;
}

.btn-bulk-action--export[b-kfqabfcy11] {
    background: rgba(255, 255, 255, 0.08);
    color: #e2e8f0;
}

.btn-bulk-action--toggle[b-kfqabfcy11] {
    background: rgba(239, 68, 68, 0.12);
    color: #fca5a5;
    border-color: rgba(239, 68, 68, 0.25);
}

.btn-bulk-action--toggle:hover[b-kfqabfcy11] {
    background: rgba(239, 68, 68, 0.22);
    color: #ffffff;
}

/* ==========================================================================
   Modo Desktop (>= 769px): Flotante centrado con bordes redondeados completos
   ========================================================================== */
@media (min-width: 769px) {
    .inventory-bulk-dock-container[b-kfqabfcy11] {
        bottom: 24px;
        padding: 0 16px;
    }

    .inventory-bulk-dock[b-kfqabfcy11] {
        width: auto;
        max-width: 900px;
        border-radius: 16px;
        border: 1px solid rgba(255, 255, 255, 0.16);
        padding: 10px 18px;
        gap: 14px;
        box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(255, 255, 255, 0.06);
    }

    .btn-bulk-action[b-kfqabfcy11] {
        min-height: 40px;
        padding: 8px 16px;
    }
}
/* /Components/Inventory/InventoryNavTabs.razor.rz.scp.css */
/* ==========================================================================
   Barra de Pestañas de Inventario - Estándar Unificado POS (Aurocore Calm UX)
   ========================================================================== */
.inventory-tabs-nav-container[b-pjk3cc57bb] {
    width: 100%;
}

.pos-tabs-nav[b-pjk3cc57bb] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.pos-nav-tab[b-pjk3cc57bb],
a.pos-nav-tab[b-pjk3cc57bb] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 12px;
    padding: 8px 18px;
    font-size: 0.875rem;
    font-weight: 600;
    color: #6b7280;
    cursor: pointer;
    transition: all 0.15s ease;
    box-shadow: rgba(0, 0, 0, 0.04) 0px 1px 2px;
    text-decoration: none !important;
}

.pos-nav-tab .tab-icon[b-pjk3cc57bb],
.pos-nav-tab[b-pjk3cc57bb]  .tab-icon,
.pos-nav-tab[b-pjk3cc57bb]  .k-svg-icon {
    font-size: 1rem;
    color: #6b7280;
    transition: color 0.15s ease;
}

.pos-nav-tab:hover[b-pjk3cc57bb],
a.pos-nav-tab:hover[b-pjk3cc57bb] {
    color: var(--primary-color);
    border-color: var(--primary-color);
    background: #ffffff;
    text-decoration: none !important;
}

.pos-nav-tab:hover .tab-icon[b-pjk3cc57bb],
.pos-nav-tab:hover[b-pjk3cc57bb]  .tab-icon,
.pos-nav-tab:hover[b-pjk3cc57bb]  .k-svg-icon {
    color: var(--primary-color);
}

.pos-nav-tab.active[b-pjk3cc57bb],
a.pos-nav-tab.active[b-pjk3cc57bb] {
    background: #ffffff;
    color: #111827;
    border: 1.5px solid #111827;
    box-shadow: none;
    text-decoration: none !important;
}

.pos-nav-tab.active .tab-icon[b-pjk3cc57bb],
.pos-nav-tab.active[b-pjk3cc57bb]  .tab-icon,
.pos-nav-tab.active[b-pjk3cc57bb]  .k-svg-icon {
    color: #111827;
}

.pos-nav-tab--config[b-pjk3cc57bb] {
    margin-left: auto;
}

/* Sub-navegación interna integrada para submódulos */
.inventory-subnav-pills[b-pjk3cc57bb] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-left: 4px;
    flex-wrap: wrap;
}

.inventory-subnav-pill[b-pjk3cc57bb],
a.inventory-subnav-pill[b-pjk3cc57bb] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 0.80rem;
    font-weight: 500;
    color: #64748b;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    text-decoration: none !important;
    transition: all 0.15s ease;
}

.inventory-subnav-pill:hover[b-pjk3cc57bb],
a.inventory-subnav-pill:hover[b-pjk3cc57bb] {
    color: var(--primary-color);
    border-color: var(--primary-color);
    background: #ffffff;
}

.inventory-subnav-pill.active[b-pjk3cc57bb],
a.inventory-subnav-pill.active[b-pjk3cc57bb] {
    background: #0f172a;
    color: #ffffff;
    font-weight: 600;
    border-color: #0f172a;
}

.inventory-subnav-pill .subnav-icon[b-pjk3cc57bb],
.inventory-subnav-pill[b-pjk3cc57bb]  .subnav-icon,
.inventory-subnav-pill[b-pjk3cc57bb]  .k-svg-icon {
    font-size: 0.85rem;
}

@media (max-width: 768px) {
    .pos-tabs-nav[b-pjk3cc57bb] {
        gap: 6px;
    }

    .pos-nav-tab[b-pjk3cc57bb],
    a.pos-nav-tab[b-pjk3cc57bb] {
        padding: 8px 12px;
        font-size: 0.8125rem;
        border-radius: 10px;
        min-height: 40px;
    }

    .pos-nav-tab--config[b-pjk3cc57bb] {
        margin-left: 0;
    }
}
/* /Components/Inventory/InventoryOnboardingWizard.razor.rz.scp.css */
.wizard-container[b-nhtzkapeo9] {
    padding: 0.5rem;
}

.wizard-stepper[b-nhtzkapeo9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    max-width: 600px;
    margin: 0 auto;
}

.step-item[b-nhtzkapeo9] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.4rem;
    z-index: 2;
}

.step-circle[b-nhtzkapeo9] {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #f1f5f9;
    color: #64748b;
    border: 2px solid #cbd5e1;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.step-label[b-nhtzkapeo9] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #64748b;
    transition: color 0.3s ease;
}

.step-item.active .step-circle[b-nhtzkapeo9] {
    background: #667eea;
    color: white;
    border-color: #667eea;
    box-shadow: 0 0 0 4px rgba(102, 126, 234, 0.2);
}

.step-item.active .step-label[b-nhtzkapeo9] {
    color: #667eea;
}

.step-item.completed .step-circle[b-nhtzkapeo9] {
    background: #10b981;
    color: white;
    border-color: #10b981;
}

.step-item.completed .step-label[b-nhtzkapeo9] {
    color: #10b981;
}

.step-line[b-nhtzkapeo9] {
    flex: 1;
    height: 3px;
    background: #e2e8f0;
    margin: 0 -8px;
    position: relative;
    top: -12px;
    z-index: 1;
    transition: background 0.3s ease;
}

.step-line.completed[b-nhtzkapeo9] {
    background: #10b981;
}

/* Business Model Cards */
.business-card[b-nhtzkapeo9] {
    background: white;
    border: 2px solid #e2e8f0;
    border-radius: 14px;
    padding: 1.25rem;
    display: flex;
    gap: 1rem;
    cursor: pointer;
    transition: all 0.2s ease;
    height: 100%;
}

.business-card:hover[b-nhtzkapeo9] {
    border-color: #93c5fd;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.05);
}

.business-card.selected[b-nhtzkapeo9] {
    border-color: #667eea;
    background: #f8fafc;
    box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.25);
}

.business-icon[b-nhtzkapeo9] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* Tier Cards */
.tier-card[b-nhtzkapeo9] {
    background: white;
    border: 2px solid #e2e8f0;
    border-radius: 14px;
    padding: 1.25rem;
    cursor: pointer;
    transition: all 0.2s ease;
    height: 100%;
}

.tier-card:hover[b-nhtzkapeo9] {
    border-color: #cbd5e1;
    transform: translateY(-2px);
}

.tier-card.selected[b-nhtzkapeo9] {
    border-color: #667eea;
    background: #f8fafc;
    box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.25);
}

.tier-features li[b-nhtzkapeo9] {
    padding: 0.2rem 0;
}
/* /Components/Inventory/StockReplenishmentBadge.razor.rz.scp.css */
.replenishment-badge[b-p5v3wuq9wc] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 0.68rem;
    font-weight: 600;
    line-height: 1.25;
    user-select: none;
    cursor: default;
    border: 1px solid transparent;
}

.badge-dot[b-p5v3wuq9wc] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
}

.badge-text[b-p5v3wuq9wc] {
    white-space: nowrap;
}

.badge-qty[b-p5v3wuq9wc] {
    display: inline-block;
    padding: 0 4px;
    border-radius: 3px;
    font-size: 0.65rem;
    font-weight: 700;
}

/* 🚨 Estado Crítico: Rojizo sobrio */
.badge-critical[b-p5v3wuq9wc] {
    background-color: #fef2f2;
    color: #991b1b;
    border-color: #fecaca;
}
.badge-critical .badge-dot[b-p5v3wuq9wc] {
    background-color: #dc2626;
}
.badge-critical .badge-qty[b-p5v3wuq9wc] {
    background-color: #fee2e2;
    color: #7f1d1d;
}

/* ⚠️ Estado Advertencia: Ámbar sobrio */
.badge-warning[b-p5v3wuq9wc] {
    background-color: #fffbeb;
    color: #92400e;
    border-color: #fde68a;
}
.badge-warning .badge-dot[b-p5v3wuq9wc] {
    background-color: #d97706;
}
.badge-warning .badge-qty[b-p5v3wuq9wc] {
    background-color: #fef3c7;
    color: #78350f;
}

/* Estado Sobrestock / Excedente: Neutral suave */
.badge-overstock[b-p5v3wuq9wc] {
    background-color: #f8fafc;
    color: #475569;
    border-color: #e2e8f0;
}
.badge-overstock .badge-dot[b-p5v3wuq9wc] {
    background-color: #94a3b8;
}

/* Estado Óptimo: Neutral menta muy suave */
.badge-adequate[b-p5v3wuq9wc] {
    background-color: #f0fdf4;
    color: #166534;
    border-color: #dcfce7;
}
.badge-adequate .badge-dot[b-p5v3wuq9wc] {
    background-color: #16a34a;
}
/* /Components/Invoice/CierreCajaModal.razor.rz.scp.css */
.cierre-subtitle[b-fbz7rbicfl] {
    font-size: 0.82rem;
    color: #6b7280;
    font-weight: 400;
}

.cierre-content[b-fbz7rbicfl] {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
}

.cierre-field[b-fbz7rbicfl] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.cierre-label[b-fbz7rbicfl] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #374151;
}

.cierre-resumen-card[b-fbz7rbicfl] {
    background-color: #f8fafb;
    border: 1px solid #e8ecef;
    border-radius: 10px;
    padding: 1rem 1.15rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.cierre-resumen-row[b-fbz7rbicfl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e5e7eb;
}

.cierre-resumen-label[b-fbz7rbicfl] {
    font-size: 0.85rem;
    color: #6b7280;
}

.cierre-resumen-value[b-fbz7rbicfl] {
    font-weight: 600;
    color: #1f2937;
}

.cierre-metodos[b-fbz7rbicfl] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.cierre-metodo-row[b-fbz7rbicfl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.85rem;
    color: #4b5563;
}

.cierre-metodo-dot[b-fbz7rbicfl] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
}

.cierre-dot-efectivo[b-fbz7rbicfl] {
    background-color: #10b981;
}

.cierre-dot-transferencia[b-fbz7rbicfl] {
    background-color: #3b82f6;
}

.cierre-dot-tarjeta[b-fbz7rbicfl] {
    background-color: #f59e0b;
}

.cierre-total-row[b-fbz7rbicfl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #e5e7eb;
    padding-top: 0.65rem;
}

.cierre-total-label[b-fbz7rbicfl] {
    font-weight: 600;
    color: #1f2937;
    font-size: 0.9rem;
}

.cierre-total-value[b-fbz7rbicfl] {
    font-weight: 700;
    color: #059669;
    font-size: 1.1rem;
}
/* /Components/Invoice/ConfiguracionFacturacionModal.razor.rz.scp.css */
.config-subtitle[b-b70gflyffj] {
    font-size: 0.82rem;
    color: #6b7280;
    font-weight: 400;
}

.config-content[b-b70gflyffj] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    max-height: 65vh;
    overflow-y: auto;
    padding-right: 0.25rem;
}

/* Estado Facturación */
.config-conexion-card[b-b70gflyffj] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #ecfdf5;
    border: 1px solid #a7f3d0;
    border-radius: 10px;
    padding: 0.85rem 1.1rem;
}

.config-check-icon[b-b70gflyffj] {
    color: #059669;
    width: 24px;
    height: 24px;
}

.config-conexion-title[b-b70gflyffj] {
    font-weight: 600;
    color: #065f46;
    font-size: 0.9rem;
    display: block;
}

.config-conexion-desc[b-b70gflyffj] {
    font-size: 0.8rem;
    color: #6b7280;
}

.config-badge-activo[b-b70gflyffj] {
    background-color: #d1fae5;
    color: #059669;
    font-size: 0.78rem;
    font-weight: 600;
    padding: 0.2rem 0.65rem;
    border-radius: 20px;
}

/* Secciones */
.config-section[b-b70gflyffj] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.config-section-title[b-b70gflyffj] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #1f2937;
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin: 0;
    padding-bottom: 0.35rem;
    border-bottom: 1px solid #f3f4f6;
}

.config-grid-2[b-b70gflyffj] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
}

@media (max-width: 576px) {
    .config-grid-2[b-b70gflyffj] {
        grid-template-columns: 1fr;
    }
}

.config-field[b-b70gflyffj] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.config-label[b-b70gflyffj] {
    font-size: 0.8rem;
    font-weight: 500;
    color: #6b7280;
}

/* Alert info */
.config-alert-info[b-b70gflyffj] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    background-color: #fef3c7;
    border: 1px solid #fde68a;
    border-radius: 8px;
    padding: 0.6rem 0.85rem;
    color: #92400e;
    font-size: 0.8rem;
    font-weight: 500;
}

/* Toggles */
.config-toggle-list[b-b70gflyffj] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.config-toggle-row[b-b70gflyffj] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 0;
    border-bottom: 1px solid #f9fafb;
}

.config-toggle-title[b-b70gflyffj] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #1f2937;
    display: block;
}

.config-toggle-desc[b-b70gflyffj] {
    font-size: 0.78rem;
    color: #9ca3af;
}

/* Switch personalización */
[b-b70gflyffj] .switch-arregly.k-switch {
    width: 68px !important;
}

[b-b70gflyffj] .switch-arregly .k-switch-label-on,
[b-b70gflyffj] .switch-arregly .k-switch-label-off {
    font-size: 0.7rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    padding: 0 6px !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

[b-b70gflyffj] .switch-arregly.k-switch-on .k-switch-track {
    background-color: var(--primary-color, #093d93) !important;
    border-color: var(--primary-color, #093d93) !important;
}
/* /Components/Invoice/CreditNoteApplicationForm.razor.rz.scp.css */
/* Layout & Grid Configuration */
.invoice-form-grid[b-8hufkwlkra] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 20px;
}

.invoice-info-span-2[b-8hufkwlkra] {
    grid-column: span 2;
}

.form-group-arregly[b-8hufkwlkra] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

/* Fields Styling - Clean inputs without nested card background and borders */
.invoice-form-field-label[b-8hufkwlkra] {
    display: block;
    font-size: 0.72rem !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #4b5563 !important;
    margin-bottom: 2px !important;
}

.font-size-lg[b-8hufkwlkra] {
    font-size: 1.25rem !important;
}

.font-size-sm[b-8hufkwlkra] {
    font-size: 0.85rem !important;
}

/* Refinance Preview Table Styles */
.refinance-preview-container[b-8hufkwlkra] {
    border: 1px solid #e6eef8;
    border-radius: 12px;
    background: #f8fbff;
    padding: 12px;
}

.refinance-summary-row[b-8hufkwlkra] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.refinance-summary-item[b-8hufkwlkra] {
    border-radius: 10px;
    padding: 8px 10px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.refinance-summary-item--current[b-8hufkwlkra] {
    background: #fff5f5;
    border: 1px solid #ffd7d7;
}

.refinance-summary-item--new[b-8hufkwlkra] {
    background: #f2fff7;
    border: 1px solid #c8f0d8;
}

.refinance-summary-label[b-8hufkwlkra] {
    font-size: 0.75rem;
    color: #5d728e;
    font-weight: 600;
}

.refinance-summary-value[b-8hufkwlkra] {
    font-size: 0.9rem;
    color: #253f63;
    font-weight: 700;
}

.refinance-preview-table th[b-8hufkwlkra] {
    padding: 12px !important;
    background-color: #f8fafc !important;
    color: #475569 !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

.refinance-preview-table td[b-8hufkwlkra] {
    padding: 12px !important;
    vertical-align: middle !important;
    font-size: 0.85rem !important;
    line-height: 1.5 !important;
    border-bottom: 1px solid #f1f5f9 !important;
    color: #334f74;
}

/* Advance Payment Timeline Styles */
.advance-timeline[b-8hufkwlkra] {
    display: flex;
    flex-direction: column;
    position: relative;
    padding-left: 10px;
}

.advance-timeline[b-8hufkwlkra]::before {
    content: "";
    position: absolute;
    left: 20px;
    top: 15px;
    bottom: 15px;
    width: 2px;
    background: #e2e8f0;
}

.advance-timeline-item[b-8hufkwlkra] {
    display: flex;
    gap: 16px;
    align-items: flex-start;
    position: relative;
    padding-bottom: 16px;
}

.advance-timeline-item:last-child[b-8hufkwlkra] {
    padding-bottom: 0;
}

.advance-timeline-indicator[b-8hufkwlkra] {
    z-index: 2;
}

.advance-dot[b-8hufkwlkra] {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.72rem;
    font-weight: bold;
    color: #ffffff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.advance-timeline-item.covered .advance-dot[b-8hufkwlkra] {
    background-color: #10b981; /* bg-success */
}

.advance-timeline-item.partial .advance-dot[b-8hufkwlkra] {
    background-color: #f59e0b; /* bg-warning */
}

.advance-timeline-item.uncovered .advance-dot[b-8hufkwlkra] {
    background-color: #ef4444; /* bg-danger */
}

.advance-timeline-content[b-8hufkwlkra] {
    flex-grow: 1;
    background: #ffffff;
    border: 1px solid #edf2f7;
    border-radius: 8px;
    padding: 8px 12px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.02);
}

.advance-timeline-item.covered .advance-timeline-content[b-8hufkwlkra] {
    border-color: #a7f3d0;
    background-color: #f0fdf4;
}

.advance-timeline-item.partial .advance-timeline-content[b-8hufkwlkra] {
    border-color: #fde68a;
    background-color: #fffbeb;
}
/* /Components/Invoice/ExtendInvoiceDueDateModal.razor.rz.scp.css */
.extend-modal-icon-badge[b-0hjolkg02t] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: var(--primary-rgba-color, rgba(80, 21, 10, 0.1));
    color: var(--primary-color, #50150a);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.extend-modal-subtitle[b-0hjolkg02t] {
    font-size: 0.8rem;
    color: #64748b;
    display: block;
}

.extend-info-card[b-0hjolkg02t] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
}

.extend-info-label[b-0hjolkg02t] {
    font-size: 0.78rem;
    color: #64748b;
    display: block;
}

.extend-info-value[b-0hjolkg02t] {
    font-size: 0.9rem;
}

.extend-form-field[b-0hjolkg02t] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.extend-form-label[b-0hjolkg02t] {
    font-size: 0.85rem;
    color: #334155;
}

.extend-field-hint[b-0hjolkg02t] {
    font-size: 0.75rem;
    color: #94a3b8;
    margin-top: 2px;
}
/* /Components/Landing/Cookies/CookieConsentBanner.razor.rz.scp.css */
/* ==========================================================================
   Aurocore — Cookie Consent Banner: Liquid Glass & Calm UX
   ========================================================================== */

.cookie-banner-host[b-pfuh5ziamm] {
    position: fixed;
    bottom: clamp(1rem, 2.5vw, 1.75rem);
    left: 50%;
    transform: translateX(-50%);
    width: calc(100% - clamp(1.5rem, 4vw, 3rem));
    max-width: 1060px;
    z-index: 9999;
    font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    animation: cookieSlideUp-b-pfuh5ziamm 0.45s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes cookieSlideUp-b-pfuh5ziamm {
    from {
        opacity: 0;
        transform: translate(-50%, 30px);
    }
    to {
        opacity: 1;
        transform: translate(-50%, 0);
    }
}

.cookie-banner-card[b-pfuh5ziamm] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.15rem 1.6rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.94);
    border: 1px solid rgba(226, 232, 240, 0.9);
    box-shadow: 0 20px 50px -10px rgba(9, 61, 147, 0.18), 0 0 0 1px rgba(255, 255, 255, 0.8) inset;
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
}

.cookie-banner-left[b-pfuh5ziamm] {
    display: flex;
    align-items: center;
    gap: 1.1rem;
    flex: 1 1 auto;
}

.cookie-icon-wrapper[b-pfuh5ziamm] {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(237, 112, 36, 0.15), rgba(9, 61, 147, 0.1));
    color: #ed7024;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    flex-shrink: 0;
    box-shadow: 0 4px 12px -2px rgba(237, 112, 36, 0.2);
}

.cookie-text-content[b-pfuh5ziamm] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.cookie-banner-title[b-pfuh5ziamm] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.cookie-banner-title strong[b-pfuh5ziamm] {
    font-size: 0.95rem;
    color: #0f172a;
    font-weight: 700;
}

.cookie-badge-colombia[b-pfuh5ziamm] {
    font-size: 0.68rem;
    font-weight: 700;
    padding: 0.15rem 0.5rem;
    border-radius: 100px;
    background: rgba(9, 61, 147, 0.08);
    color: #093d93;
    letter-spacing: 0.03em;
}

.cookie-banner-desc[b-pfuh5ziamm] {
    font-size: 0.84rem;
    color: #475569;
    line-height: 1.45;
    margin: 0;
}

.cookie-link[b-pfuh5ziamm] {
    color: #093d93;
    font-weight: 600;
    text-decoration: underline;
    margin-left: 0.35rem;
    cursor: pointer;
}

.cookie-banner-actions[b-pfuh5ziamm] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-shrink: 0;
}

.btn-cookie-config[b-pfuh5ziamm] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.65rem 1.1rem;
    border-radius: 10px;
    background: #f1f5f9;
    color: #334155;
    font-size: 0.85rem;
    font-weight: 600;
    border: 1px solid #e2e8f0;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    font-family: inherit;
    min-height: 40px;
}

.btn-cookie-config:hover[b-pfuh5ziamm] {
    background: #e2e8f0;
    color: #0f172a;
}

.btn-cookie-necessary[b-pfuh5ziamm] {
    display: inline-flex;
    align-items: center;
    padding: 0.65rem 1.1rem;
    border-radius: 10px;
    background: transparent;
    color: #475569;
    font-size: 0.85rem;
    font-weight: 600;
    border: 1.5px solid #cbd5e1;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    font-family: inherit;
    min-height: 40px;
}

.btn-cookie-necessary:hover[b-pfuh5ziamm] {
    background: #f8fafc;
    border-color: #093d93;
    color: #093d93;
}

.btn-cookie-accept[b-pfuh5ziamm] {
    display: inline-flex;
    align-items: center;
    padding: 0.65rem 1.35rem;
    border-radius: 10px;
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    color: white;
    font-size: 0.85rem;
    font-weight: 600;
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 14px -2px rgba(237, 112, 36, 0.35);
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    font-family: inherit;
    min-height: 40px;
}

.btn-cookie-accept:hover[b-pfuh5ziamm] {
    transform: translateY(-1px);
    box-shadow: 0 8px 20px -2px rgba(237, 112, 36, 0.45);
}

@media (max-width: 860px) {
    .cookie-banner-card[b-pfuh5ziamm] {
        flex-direction: column;
        align-items: flex-start;
        padding: 1.25rem;
        gap: 1rem;
    }

    .cookie-banner-actions[b-pfuh5ziamm] {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.5rem;
    }

    .btn-cookie-accept[b-pfuh5ziamm] {
        grid-column: 1 / -1;
        justify-content: center;
    }

    .btn-cookie-config[b-pfuh5ziamm],
    .btn-cookie-necessary[b-pfuh5ziamm] {
        justify-content: center;
    }
}
/* /Components/Landing/Cookies/CookiePreferencesModal.razor.rz.scp.css */
/* ==========================================================================
   Aurocore — Cookie Preferences Modal: Calm UX & Refined Controls
   ========================================================================== */

.cookie-prefs-body[b-ocnfhar11r] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

.prefs-intro[b-ocnfhar11r] {
    font-size: 0.88rem;
    color: #475569;
    line-height: 1.6;
    margin: 0;
    padding: 0 0.25rem;
}

.prefs-categories-list[b-ocnfhar11r] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.pref-item[b-ocnfhar11r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 1rem 1.2rem;
    border-radius: 16px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 2px 8px -2px rgba(9, 61, 147, 0.04);
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

.pref-item:hover[b-ocnfhar11r] {
    border-color: #cbd5e1;
    box-shadow: 0 6px 18px -4px rgba(9, 61, 147, 0.08);
}

.pref-item.is-mandatory[b-ocnfhar11r] {
    background: #f8fafc;
    border-color: #e2e8f0;
}

.pref-item-main[b-ocnfhar11r] {
    display: flex;
    align-items: flex-start;
    gap: 0.9rem;
    flex: 1;
}

.pref-icon-box[b-ocnfhar11r] {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
    margin-top: 0.1rem;
    background: #f1f5f9;
    color: #093d93;
}

.pref-info[b-ocnfhar11r] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1;
}

.pref-title-row[b-ocnfhar11r] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    flex-wrap: wrap;
}

.pref-name[b-ocnfhar11r] {
    font-size: 0.93rem;
    font-weight: 600;
    color: #0f172a;
}

.pref-badge-obligatorio[b-ocnfhar11r] {
    font-size: 0.65rem;
    font-weight: 700;
    padding: 0.15rem 0.5rem;
    border-radius: 100px;
    background: #e0f2fe;
    color: #0369a1;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.pref-badge-opcional[b-ocnfhar11r] {
    font-size: 0.65rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 100px;
    background: #f1f5f9;
    color: #64748b;
    border: 1px solid #e2e8f0;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.pref-desc[b-ocnfhar11r] {
    font-size: 0.82rem;
    color: #64748b;
    line-height: 1.45;
    margin: 0;
}

.pref-control[b-ocnfhar11r] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
}

/* ==========================================================================
   Native Switch Clean Styling (Orange Active & Clean Thumb)
   ========================================================================== */
.native-cookie-switch[b-ocnfhar11r] {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    margin: 0;
    cursor: pointer;
}

.native-cookie-switch input[b-ocnfhar11r] {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
}

.native-switch-slider[b-ocnfhar11r] {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #cbd5e1;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: 9999px;
}

.native-switch-slider[b-ocnfhar11r]:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background-color: #ffffff;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: 50%;
}

.native-cookie-switch input:checked + .native-switch-slider[b-ocnfhar11r] {
    background-color: #ed7024;
}

.native-cookie-switch input:checked + .native-switch-slider[b-ocnfhar11r]:before {
    transform: translateX(20px);
}

.native-cookie-switch.is-locked .native-switch-slider[b-ocnfhar11r] {
    background-color: #ed7024;
    opacity: 0.85;
    cursor: not-allowed;
}

.native-cookie-switch.is-locked input[b-ocnfhar11r] {
    cursor: not-allowed;
}

.prefs-legal-link[b-ocnfhar11r] {
    font-size: 0.83rem;
    color: #64748b;
    text-align: center;
    padding-top: 0.25rem;
}

.prefs-legal-link a[b-ocnfhar11r] {
    color: #093d93;
    font-weight: 600;
    text-decoration: underline;
    cursor: pointer;
}

/* ==========================================================================
   Modal Footer Buttons (Brand Blue & Subtle Slate)
   ========================================================================== */
.cookie-prefs-footer[b-ocnfhar11r] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    width: 100%;
    flex-wrap: wrap;
}

.footer-primary-actions[b-ocnfhar11r] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
}

.btn-pref-reject[b-ocnfhar11r] {
    padding: 0.65rem 1.15rem;
    border-radius: 12px;
    background: transparent;
    color: #64748b;
    font-size: 0.85rem;
    font-weight: 600;
    border: 1.5px solid #cbd5e1;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    min-height: 40px;
}

.btn-pref-reject:hover[b-ocnfhar11r] {
    background: #f1f5f9;
    color: #0f172a;
    border-color: #94a3b8;
}

.btn-pref-accept[b-ocnfhar11r] {
    padding: 0.65rem 1.25rem;
    border-radius: 12px;
    background: #f0f7ff;
    color: #093d93;
    font-size: 0.85rem;
    font-weight: 600;
    border: 1px solid #bfdbfe;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    min-height: 40px;
}

.btn-pref-accept:hover[b-ocnfhar11r] {
    background: #e0f2fe;
    border-color: #93c5fd;
    transform: translateY(-1px);
}

.btn-pref-save[b-ocnfhar11r] {
    padding: 0.65rem 1.45rem;
    border-radius: 12px;
    background: linear-gradient(135deg, #093d93 0%, #1a5bc4 100%);
    color: #ffffff;
    font-size: 0.85rem;
    font-weight: 600;
    border: none;
    cursor: pointer;
    font-family: inherit;
    box-shadow: 0 4px 14px -2px rgba(9, 61, 147, 0.35);
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    min-height: 40px;
}

.btn-pref-save:hover[b-ocnfhar11r] {
    transform: translateY(-1px);
    box-shadow: 0 8px 20px -2px rgba(9, 61, 147, 0.45);
}

@media (max-width: 600px) {
    .pref-item[b-ocnfhar11r] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.75rem;
    }

    .pref-control[b-ocnfhar11r] {
        align-self: flex-end;
    }

    .cookie-prefs-footer[b-ocnfhar11r] {
        flex-direction: column;
        align-items: stretch;
    }

    .footer-primary-actions[b-ocnfhar11r] {
        flex-direction: column;
    }

    .btn-pref-reject[b-ocnfhar11r],
    .btn-pref-accept[b-ocnfhar11r],
    .btn-pref-save[b-ocnfhar11r] {
        width: 100%;
        justify-content: center;
    }
}

/* Modal Close Button Modernization */
[b-ocnfhar11r] .modal-close-btn {
    border: 1px solid #e2e8f0 !important;
    background: #f8fafc !important;
    border-radius: 50% !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    padding: 0 !important;
    min-width: auto !important;
    width: 32px !important;
    height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #64748b !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
    cursor: pointer !important;
}

[b-ocnfhar11r] .modal-close-btn .k-button-icon,
[b-ocnfhar11r] .modal-close-btn .k-svg-icon {
    color: #64748b !important;
    font-size: 0.95rem !important;
    width: 14px !important;
    height: 14px !important;
    transition: all 0.2s ease !important;
}

[b-ocnfhar11r] .modal-close-btn:hover {
    background: #f1f5f9 !important;
    border-color: #cbd5e1 !important;
    color: #0f172a !important;
    transform: rotate(90deg) scale(1.08) !important;
    box-shadow: 0 4px 12px -2px rgba(0, 0, 0, 0.08) !important;
}

[b-ocnfhar11r] .modal-close-btn:hover .k-button-icon,
[b-ocnfhar11r] .modal-close-btn:hover .k-svg-icon {
    color: #0f172a !important;
}

[b-ocnfhar11r] .modal-close-btn:active {
    transform: scale(0.92) !important;
}
/* /Components/Landing/CTASection.razor.rz.scp.css */
/* ================================================
   CTA SECTION - RESPONSIVE DESIGN WITH BRAND GRADIENT & BG IMAGE
   ================================================ */
.cta-section[b-e07l7l8qnd] {
    position: relative;
    overflow: hidden;
    padding: 3rem 1rem;
    /* Fondo con imagen de img/login y overlay azul corporativo #093d93 */
    background-image: 
        linear-gradient(135deg, rgba(15, 23, 42, 0.88) 0%, rgba(9, 61, 147, 0.80) 100%),
        url('/img/login/cta-bg.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-attachment: scroll;
}

/* Patrón decorativo de fondo */
.cta-section[b-e07l7l8qnd]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: radial-gradient(circle at 25% 25%, rgba(255, 255, 255, 0.1) 0%, transparent 50%), 
                      radial-gradient(circle at 75% 75%, rgba(255, 255, 255, 0.05) 0%, transparent 50%);
    pointer-events: none;
}

/* ================================================
   CONTAINER LAYOUT
   ================================================ */
.cta-container[b-e07l7l8qnd] {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 1rem;
    position: relative;
    z-index: 1;
}

.cta-content[b-e07l7l8qnd] {
    max-width: 42rem;
    margin: 0 auto;
    text-align: center;
}

.cta-actions[b-e07l7l8qnd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    margin-top: 1.75rem;
}

/* ================================================
   TYPOGRAPHY
   ================================================ */
.cta-title[b-e07l7l8qnd] {
    font-size: clamp(1.75rem, 3.5vw + 0.5rem, 2.5rem);
    font-weight: 800;
    line-height: 1.22;
    color: #ffffff;
    margin: 0 0 1rem 0;
    text-align: center;
    letter-spacing: -0.025em;
    text-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
}

.cta-subtitle[b-e07l7l8qnd] {
    font-size: clamp(0.95rem, 1.2vw + 0.2rem, 1.15rem);
    color: #e2e8f0;
    line-height: 1.6;
    margin: 0 0 2rem 0;
    text-align: center;
    max-width: 100%;
    text-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}

/* ================================================
   CTA BUTTONS - STYLING
   ================================================ */
.btn-primary-cta[b-e07l7l8qnd],
.btn-primary-cta.k-button[b-e07l7l8qnd] {
    background: #ffffff !important;
    color: #093d93 !important;
    border: none !important;
    font-weight: 700 !important;
    padding: 0.85rem 2rem !important;
    border-radius: 9999px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    width: 100% !important;
    justify-content: center !important;
    min-height: 48px !important;
    touch-action: manipulation !important;
    cursor: pointer !important;
}

.btn-primary-cta:hover[b-e07l7l8qnd],
.btn-primary-cta.k-button:hover[b-e07l7l8qnd] {
    background: #ffffff !important;
    color: #ed7024 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 25px rgba(237, 112, 36, 0.4) !important;
}

.btn-secondary-cta[b-e07l7l8qnd],
.btn-secondary-cta.k-button[b-e07l7l8qnd] {
    background: rgba(255, 255, 255, 0.12) !important;
    color: #ffffff !important;
    border: 1px solid rgba(255, 255, 255, 0.4) !important;
    font-weight: 600 !important;
    padding: 0.85rem 2rem !important;
    border-radius: 9999px !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    width: 100% !important;
    justify-content: center !important;
    cursor: pointer !important;
}

.btn-secondary-cta:hover[b-e07l7l8qnd],
.btn-secondary-cta.k-button:hover[b-e07l7l8qnd] {
    background: rgba(255, 255, 255, 0.25) !important;
    border-color: rgba(255, 255, 255, 0.7) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 18px rgba(255, 255, 255, 0.2) !important;
}

.btn-icon[b-e07l7l8qnd] {
    font-size: 0.875rem;
    line-height: 1;
    margin-left: 0.25rem;
}

/* ================================================
   RESPONSIVE BREAKPOINTS
   ================================================ */

/* Mobile (up to 640px) */
@media (max-width: 640px) {
    .cta-section[b-e07l7l8qnd] {
        padding: 3rem 1rem !important;
    }

    .cta-title[b-e07l7l8qnd] {
        font-size: 1.5rem;
    }

    .cta-subtitle[b-e07l7l8qnd] {
        font-size: 1rem;
    }

    .cta-actions[b-e07l7l8qnd] {
        flex-direction: column;
        align-items: stretch;
    }

    .btn-primary-cta[b-e07l7l8qnd],
    .btn-primary-cta.k-button[b-e07l7l8qnd],
    .btn-secondary-cta[b-e07l7l8qnd],
    .btn-secondary-cta.k-button[b-e07l7l8qnd] {
        width: 100% !important;
    }
}

/* Tablet (641px and up) */
@media (min-width: 641px) {
    .cta-section[b-e07l7l8qnd] {
        padding: 5rem 1.5rem !important;
    }

    .cta-title[b-e07l7l8qnd] {
        font-size: 2.125rem;
    }

    .cta-subtitle[b-e07l7l8qnd] {
        font-size: 1.125rem;
    }

    .cta-actions[b-e07l7l8qnd] {
        flex-direction: row;
        justify-content: center;
        align-items: center;
    }

    .btn-primary-cta[b-e07l7l8qnd],
    .btn-primary-cta.k-button[b-e07l7l8qnd],
    .btn-secondary-cta[b-e07l7l8qnd],
    .btn-secondary-cta.k-button[b-e07l7l8qnd] {
        width: auto !important;
        min-width: 170px;
    }
}

/* Desktop (1024px and up) */
@media (min-width: 1024px) {
    .cta-section[b-e07l7l8qnd] {
        padding: 6.5rem 2rem !important;
    }

    .cta-title[b-e07l7l8qnd] {
        font-size: 2.35rem;
    }

    .cta-subtitle[b-e07l7l8qnd] {
        font-size: 1.15rem;
    }
}

/* ================================================
   ACCESSIBILITY
   ================================================ */
.btn-primary-cta:focus[b-e07l7l8qnd],
.btn-primary-cta.k-button:focus[b-e07l7l8qnd],
.btn-secondary-cta:focus[b-e07l7l8qnd],
.btn-secondary-cta.k-button:focus[b-e07l7l8qnd] {
    outline: 2px solid rgba(255, 255, 255, 0.8);
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    .btn-primary-cta[b-e07l7l8qnd],
    .btn-primary-cta.k-button[b-e07l7l8qnd],
    .btn-secondary-cta[b-e07l7l8qnd],
    .btn-secondary-cta.k-button[b-e07l7l8qnd] {
        transition: none !important;
    }

    .btn-primary-cta:hover[b-e07l7l8qnd],
    .btn-primary-cta.k-button:hover[b-e07l7l8qnd],
    .btn-secondary-cta:hover[b-e07l7l8qnd],
    .btn-secondary-cta.k-button:hover[b-e07l7l8qnd] {
        transform: none !important;
    }
}
/* /Components/Landing/FeatureCard.razor.rz.scp.css */
/* Animaciones CSS para reemplazar JavaScript */
.feature-card-wrapper[b-0bwe9p9xye] {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.feature-card[b-0bwe9p9xye] {
    height: 100% !important;
}

.feature-card-body[b-0bwe9p9xye] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 1.25rem !important;
    height: 100%;
}

.feature-card-header[b-0bwe9p9xye] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.feature-icon-wrapper[b-0bwe9p9xye] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    min-width: 40px; 
    border-radius: 10px;
    background: #eef2ff;
}

.feature-card-header h5[b-0bwe9p9xye] {
    margin: 0;
    font-weight: 700;
    line-height: 1.2;
    color: var(--text-heading-secondary, #13376b);
}

.feature-card-description[b-0bwe9p9xye] {
    margin: 0;
    margin-top: 0.5rem;
    line-height: 1.45;
    color: var(--text-body-muted, #476487);
}

/* Features Section Advanced Styles */
.features-section .section-title[b-0bwe9p9xye] {
    color: var(--text-heading-primary, #09224f);
}

/* Fallback for browsers that don't support background-clip: text */
@supports not (background-clip: text) {
    .features-section .section-title[b-0bwe9p9xye] {
        color: #1a1a1a;
        background: none;
    }
}

/* Pulse animation for loading skeletons */
@keyframes pulse-b-0bwe9p9xye {
    0%, 100% {
        opacity: 0.4;
    }

    50% {
        opacity: 0.8;
    }
}

.loading-skeleton .skeleton-card[b-0bwe9p9xye] {
    animation: pulse-b-0bwe9p9xye 2s infinite;
}

/* Responsive Feature Cards */
@media (min-width: 576px) {
    .feature-card-body[b-0bwe9p9xye] {
        padding: 1.5rem !important;
    }
}

/* Accessibility: Respect user motion preferences */
@media (prefers-reduced-motion: reduce) {
    .feature-card-wrapper[b-0bwe9p9xye],
    .feature-card.k-card[b-0bwe9p9xye],
    .loading-skeleton .skeleton-card[b-0bwe9p9xye] {
        animation: none !important;
        transition: none !important;
    }

        .feature-card-wrapper.animate-enter[b-0bwe9p9xye] {
            opacity: 1;
            transform: translateY(0);
        }
}

/* Loading states */
.loading-skeleton[b-0bwe9p9xye] {
    animation: pulse-b-0bwe9p9xye 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
/* /Components/Landing/FeaturesSection.razor.rz.scp.css */
/* ================================================
   ULTRA-MODERN FEATURES SECTION (SLIDER & CARDS)
   ================================================ */
.features-section[b-8pzizo0pp8] {
    padding: clamp(3.5rem, 6vw, 6rem) clamp(1rem, 3vw, 1.5rem);
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
    position: relative;
    overflow: hidden;
    width: 100%;
}

/* Patrón sutil de fondo */
.features-section[b-8pzizo0pp8]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100%;
    background-image: radial-gradient(circle at 15% 20%, rgba(9, 61, 147, 0.03) 0%, transparent 40%),
                      radial-gradient(circle at 85% 80%, rgba(237, 112, 36, 0.04) 0%, transparent 40%);
    pointer-events: none;
}

.features-container[b-8pzizo0pp8] {
    max-width: 1280px !important;
    margin: 0 auto;
    position: relative;
    z-index: 1;
    width: 100%;
}

/* ================================================
   SECTION HEADER
   ================================================ */
.section-header[b-8pzizo0pp8] {
    max-width: 46rem;
    margin: 0 auto 2.5rem;
    text-align: center;
}

.features-badge[b-8pzizo0pp8] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 1.1rem;
    background: rgba(9, 61, 147, 0.07);
    border: 1px solid rgba(9, 61, 147, 0.18);
    border-radius: 9999px;
    font-size: 0.85rem;
    font-weight: 600;
    color: #093d93;
    margin-bottom: 1.25rem;
    box-shadow: 0 2px 10px rgba(9, 61, 147, 0.05);
}

.badge-dot-orange[b-8pzizo0pp8] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #ed7024;
    box-shadow: 0 0 8px #ed7024;
}

.section-title[b-8pzizo0pp8] {
    font-size: clamp(1.75rem, 4vw + 0.4rem, 2.75rem);
    font-weight: 800;
    line-height: 1.22;
    color: var(--text-heading-primary, #09224f) !important;
    margin-bottom: 1rem;
    letter-spacing: -0.02em;
}

.highlight-orange[b-8pzizo0pp8] {
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.section-subtitle[b-8pzizo0pp8] {
    font-size: clamp(0.95rem, 1.2vw + 0.2rem, 1.15rem);
    color: var(--text-body-lead, #2c4d75) !important;
    line-height: 1.65;
    margin: 0;
}

/* ================================================
   CATEGORY FILTER TABS (TOUCH-FRIENDLY & SCROLLABLE)
   ================================================ */
.features-filter-tabs[b-8pzizo0pp8] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 0.35rem 0.25rem 0.75rem;
    gap: 0.6rem;
    margin-bottom: 2.25rem;
    width: 100%;
}

.features-filter-tabs[b-8pzizo0pp8]::-webkit-scrollbar {
    display: none;
}

.filter-tab[b-8pzizo0pp8] {
    min-height: 44px;
    padding: 0.55rem 1.25rem;
    border-radius: 9999px;
    background: #ffffff;
    border: 1px solid rgba(9, 61, 147, 0.12);
    color: var(--text-body-lead, #2c4d75);
    font-size: 0.9rem;
    font-weight: 600;
    white-space: nowrap;
    flex-shrink: 0;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02);
    touch-action: manipulation;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}

.filter-tab:hover[b-8pzizo0pp8] {
    background: rgba(9, 61, 147, 0.05);
    border-color: rgba(9, 61, 147, 0.25);
    color: #093d93;
}

.filter-tab.active[b-8pzizo0pp8] {
    background: linear-gradient(135deg, #093d93 0%, #0c4cb5 100%) !important;
    color: #ffffff !important;
    border-color: transparent !important;
    box-shadow: 0 4px 15px rgba(9, 61, 147, 0.35) !important;
}

@media (min-width: 768px) {
    .features-filter-tabs[b-8pzizo0pp8] {
        justify-content: center;
        flex-wrap: wrap;
        overflow-x: visible;
        padding-bottom: 0.35rem;
        margin-bottom: 3rem;
    }
}

/* ================================================
   CAROUSEL OUTER CONTROLS
   ================================================ */
.carousel-container-outer[b-8pzizo0pp8] {
    width: 100%;
}

.carousel-top-controls[b-8pzizo0pp8] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.5rem;
    padding: 0 0.25rem;
}

.carousel-count-indicator[b-8pzizo0pp8] {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text-caption, #5a7599);
}

.carousel-controls-group[b-8pzizo0pp8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.carousel-nav-btn[b-8pzizo0pp8] {
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 9999px;
    background: #ffffff;
    border: 1px solid rgba(9, 61, 147, 0.15);
    color: #093d93;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(9, 61, 147, 0.06);
}

.carousel-nav-btn:hover[b-8pzizo0pp8] {
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    color: #ffffff;
    border-color: transparent;
    transform: scale(1.06);
    box-shadow: 0 6px 18px rgba(237, 112, 36, 0.4);
}

/* ================================================
   FEATURES GRID & MODERN CARDS
   ================================================ */
.features-grid[b-8pzizo0pp8] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}

.feature-card-modern[b-8pzizo0pp8] {
    background: #ffffff;
    border: 1px solid rgba(9, 61, 147, 0.08);
    border-radius: 1.25rem;
    padding: 2rem 1.6rem;
    display: flex;
    flex-direction: column;
    height: 100%;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    position: relative;
    box-shadow: 0 10px 25px rgba(9, 61, 147, 0.04);
}

.feature-card-modern:hover[b-8pzizo0pp8] {
    transform: translateY(-8px);
    border-color: rgba(237, 112, 36, 0.45);
    box-shadow: 0 18px 40px rgba(9, 61, 147, 0.1), 0 0 20px rgba(237, 112, 36, 0.12);
}

/* Icon Container */
.card-icon-container[b-8pzizo0pp8] {
    width: 3.5rem;
    height: 3.5rem;
    min-width: 3.5rem;
    border-radius: 1rem;
    background: linear-gradient(135deg, #093d93 0%, #0c4cb5 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.5rem;
    transition: all 0.3s ease;
    box-shadow: 0 6px 18px rgba(9, 61, 147, 0.3);
}

[b-8pzizo0pp8] .card-icon-svg {
    width: 1.75rem;
    height: 1.75rem;
}

[b-8pzizo0pp8] .card-icon-svg * {
    color: #ffffff !important;
    fill: #ffffff !important;
}

.feature-card-modern:hover .card-icon-container[b-8pzizo0pp8] {
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    transform: scale(1.08);
    box-shadow: 0 8px 22px rgba(237, 112, 36, 0.45);
}

/* Body Content */
.card-body-content[b-8pzizo0pp8] {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.card-feature-title[b-8pzizo0pp8] {
    font-size: 1.2rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 0.65rem 0;
    line-height: 1.3;
    transition: color 0.3s ease;
}

.feature-card-modern:hover .card-feature-title[b-8pzizo0pp8] {
    color: #093d93;
}

.card-feature-description[b-8pzizo0pp8] {
    font-size: 0.95rem;
    color: #64748b;
    line-height: 1.6;
    margin: 0;
}

/* Footer Action */
.card-footer-action[b-8pzizo0pp8] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 1.75rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: #093d93;
    transition: all 0.3s ease;
}

.action-arrow[b-8pzizo0pp8] {
    transition: transform 0.3s ease;
}

.feature-card-modern:hover .card-footer-action[b-8pzizo0pp8] {
    color: #ed7024;
}

.feature-card-modern:hover .action-arrow[b-8pzizo0pp8] {
    transform: translateX(6px);
}

/* ================================================
   LOADING SKELETON
   ================================================ */
.features-loading[b-8pzizo0pp8] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 350px;
}

.loading-skeleton[b-8pzizo0pp8] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1.5rem;
    width: 100%;
}

.skeleton-card[b-8pzizo0pp8] {
    padding: 2rem;
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 1.25rem;
    background: #ffffff;
    min-height: 250px;
    animation: pulse-b-8pzizo0pp8 2s infinite;
}

.skeleton-icon[b-8pzizo0pp8] {
    height: 3.5rem;
    width: 3.5rem;
    border-radius: 1rem;
    background: rgba(0, 0, 0, 0.08);
    margin-bottom: 1.5rem;
}

.skeleton-title[b-8pzizo0pp8] {
    height: 1.5rem;
    width: 75%;
    background: rgba(0, 0, 0, 0.08);
    border-radius: 0.35rem;
    margin-bottom: 0.75rem;
}

.skeleton-description[b-8pzizo0pp8] {
    height: 1rem;
    width: 100%;
    background: rgba(0, 0, 0, 0.06);
    border-radius: 0.35rem;
}

@keyframes pulse-b-8pzizo0pp8 {
    0%, 100% { opacity: 0.4; }
    50% { opacity: 0.8; }
}

/* ================================================
   RESPONSIVE BREAKPOINTS
   ================================================ */
@media (min-width: 576px) {
    .features-grid[b-8pzizo0pp8] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 992px) {
    .features-grid[b-8pzizo0pp8] {
        grid-template-columns: repeat(4, 1fr);
    }

    .section-title[b-8pzizo0pp8] {
        font-size: 2.5rem;
    }
}

@media (min-width: 1200px) {
    .features-section[b-8pzizo0pp8] {
        padding: 6.5rem 1.5rem;
    }

    .section-title[b-8pzizo0pp8] {
        font-size: 2.75rem;
    }
}
/* /Components/Landing/Footer.razor.rz.scp.css */
/* /Components/Landing/HeroSection.razor.rz.scp.css */
.hero-section[b-p8b55vgna3] {
    position: relative;
    overflow: hidden;
    padding: 2.5rem 1rem 2rem;
}

.hero-container[b-p8b55vgna3] {
    max-width: 1280px;
    margin: 0 auto;
}

.hero-content[b-p8b55vgna3] {
    max-width: 48rem;
    margin: 0 auto;
    text-align: center;
}

.hero-badge[b-p8b55vgna3] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
    padding: 0.375rem 1rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 9999px;
    background-color: white;
    font-size: 0.875rem;
}

.badge-dot[b-p8b55vgna3] {
    height: 0.5rem;
    width: 0.5rem;
    border-radius: 9999px;
    background-color: #667eea;
}

.badge-text[b-p8b55vgna3] {
    color: var(--text-body-muted, #476487);
}

.badge-arrow[b-p8b55vgna3] {
    font-size: 0.75rem;
    color: var(--text-body-muted, #476487);
}

.hero-title[b-p8b55vgna3] {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.2;
    color: var(--text-heading-primary, #09224f);
    margin-bottom: 1.5rem;
}

.hero-subtitle[b-p8b55vgna3] {
    max-width: 42rem;
    margin: 0 auto 2rem;
    font-size: 1rem;
    color: var(--text-body-lead, #2c4d75);
    line-height: 1.6;
}

.hero-cta[b-p8b55vgna3] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 1rem;
    margin-bottom: 3rem;
}

/* Estilos para los botones del Hero */
.btn-primary-landing[b-p8b55vgna3],
.btn-primary-landing.k-button[b-p8b55vgna3] {
    background-color: #667eea;
    border: 1px solid #667eea;
    color: white;
    padding: 0.75rem 1.5rem;
    font-size: 1.125rem;
    border-radius: 0.5rem;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .btn-primary-landing:hover[b-p8b55vgna3],
    .btn-primary-landing.k-button:hover[b-p8b55vgna3] {
        background-color: #5a6fd8;
        border-color: #5a6fd8;
    }

.btn-primary-outline-landing[b-p8b55vgna3],
.btn-primary-outline-landing.k-button[b-p8b55vgna3] {
    background-color: transparent;
    border: 1px solid #667eea;
    color: #667eea;
    padding: 0.75rem 1.5rem;
    font-size: 1.125rem;
    border-radius: 0.5rem;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
}

    .btn-primary-outline-landing:hover[b-p8b55vgna3],
    .btn-primary-outline-landing.k-button:hover[b-p8b55vgna3] {
        background-color: #667eea;
        color: white;
    }

.btn-lg[b-p8b55vgna3],
.btn-lg.k-button[b-p8b55vgna3] {
    padding: 0.625rem 1rem;
    font-size: 0.95rem;
}

.hero-stats[b-p8b55vgna3] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem;
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    padding-top: 2rem;
}

/* Estilos para las tarjetas de estadísticas */



.stat-item[b-p8b55vgna3] {
    text-align: center;
}

.stat-value[b-p8b55vgna3] {
    font-size: 1.625rem;
    font-weight: 700;
    color: #667eea;
}

.stat-label[b-p8b55vgna3] {
    margin-top: 0.25rem;
    font-size: 0.875rem;
    color: #6c757d;
}

/* Animaciones para contadores */
.stat-value .animated-counter[b-p8b55vgna3] {
    display: inline-block;
    font-variant-numeric: tabular-nums;
    color: #667eea;
    transition: none;
}

    .stat-value .animated-counter.animating[b-p8b55vgna3] {
        color: #667eea;
    }

    .stat-value .animated-counter.completed[b-p8b55vgna3] {
        color: #667eea;
    }

.stat-item[b-p8b55vgna3] {
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInUp-b-p8b55vgna3 0.6s ease forwards;
}

    .stat-item:nth-child(1)[b-p8b55vgna3] {
        animation-delay: 0.1s;
    }

    .stat-item:nth-child(2)[b-p8b55vgna3] {
        animation-delay: 0.2s;
    }

    .stat-item:nth-child(3)[b-p8b55vgna3] {
        animation-delay: 0.3s;
    }

    .stat-item:nth-child(4)[b-p8b55vgna3] {
        animation-delay: 0.4s;
    }

@keyframes fadeInUp-b-p8b55vgna3 {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (min-width: 576px) {
    .hero-section[b-p8b55vgna3] {
        padding: 4rem 1.5rem 3rem;
    }

    .hero-title[b-p8b55vgna3] {
        font-size: 2.5rem;
    }

    .hero-subtitle[b-p8b55vgna3] {
        font-size: 1.25rem;
    }

    .hero-stats[b-p8b55vgna3] {
        grid-template-columns: repeat(4, 1fr);
    }

    .stat-value[b-p8b55vgna3] {
        font-size: 2.25rem;
    }

    .btn-lg.k-button[b-p8b55vgna3] {
        padding: 0.75rem 1.5rem;
        font-size: 1rem;
    }
}

@media (min-width: 992px) {
    .hero-title[b-p8b55vgna3] {
        font-size: 3.75rem;
    }
}


[b-p8b55vgna3] .btn-hero-outline {
    border-radius: 0px !important;
    padding: 0.55rem 1.5rem !important;
    font-size: 0.95rem !important;
    font-weight: 600 !important;
    transition: all 0.25s ease-in-out !important;
    cursor: pointer !important;
    box-shadow: none !important;
}

[b-p8b55vgna3] .btn-hero-outline,
[b-p8b55vgna3] .btn-hero-outline.k-button {
    border: 1.5px solid #ffffff !important;
    background-color: transparent !important;
    background: transparent !important;
    color: #ffffff !important;
}

[b-p8b55vgna3] .btn-hero-outline *,
[b-p8b55vgna3] .btn-hero-outline.k-button * {
    color: #ffffff !important;
}

[b-p8b55vgna3] .btn-hero-outline:hover,
[b-p8b55vgna3] .btn-hero-outline.k-button:hover {
    background-color: rgba(255, 255, 255, 0.18) !important;
    border-color: #ffffff !important;
    color: #ffffff !important;
}

[b-p8b55vgna3] .btn-hero-outline:hover *,
[b-p8b55vgna3] .btn-hero-outline.k-button:hover * {
    color: #ffffff !important;
}

/* /Components/Landing/HeroVideo.razor.rz.scp.css */
.hero-video-section[b-zdrbu4h33l] {
    position: relative;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    padding: clamp(6rem, 10vw, 8.5rem) clamp(1rem, 3vw, 2rem) clamp(3rem, 6vw, 5rem);
    width: 100%;
}

/* Fondo degradado con curva tipo S (Onda) */
.hero-video-section[b-zdrbu4h33l]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, #ffffff 15%, rgba(9, 61, 147, 0.14) 65%);
    -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M0,100 L25,100 C45,70 75,30 60,0 L0,0 Z' fill='black'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M0,100 L25,100 C45,70 75,30 60,0 L0,0 Z' fill='black'/%3E%3C/svg%3E");
    -webkit-mask-size: 100% 100%;
    mask-size: 100% 100%;
    z-index: 0;
}

@media (max-width: 991px) {
    .hero-video-section[b-zdrbu4h33l]::before {
        /* En móviles la onda es más amplia para que cubra los textos */
        -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M0,100 L100,100 C100,75 20,40 100,0 L0,0 Z' fill='black'/%3E%3C/svg%3E");
        mask-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M0,100 L100,100 C100,75 20,40 100,0 L0,0 Z' fill='black'/%3E%3C/svg%3E");
        background: linear-gradient(to bottom, #ffffff 15%, rgba(9, 61, 147, 0.14) 85%);
    }
}


/* Video de fondo y overlay */
.video-wrapper[b-zdrbu4h33l] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    overflow: hidden;
}

.hero-bg-video[b-zdrbu4h33l] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-mobile-poster[b-zdrbu4h33l] {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    background-image: url('/img/hero-poster.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 1;
}

.hero-overlay[b-zdrbu4h33l] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(15, 23, 42, 0.78) 0%, rgba(9, 61, 147, 0.65) 100%);
    z-index: 2;
}

/* Contenedor del contenido */
.hero-container[b-zdrbu4h33l] {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
}

.hero-content[b-zdrbu4h33l] {
    max-width: 48rem;
    margin: 0 auto;
    text-align: center;
}

/* Badge estilizado */
.hero-badge[b-zdrbu4h33l] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 1.5rem;
    padding: 0.375rem 1rem;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 9999px;
    background-color: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    font-size: 0.875rem;
    max-width: 100%;
}

.badge-dot[b-zdrbu4h33l] {
    height: 0.5rem;
    width: 0.5rem;
    min-width: 0.5rem;
    border-radius: 9999px;
    background-color: #ed7024;
}

.badge-text[b-zdrbu4h33l] {
    color: #f1f5f9;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.badge-arrow[b-zdrbu4h33l] {
    font-size: 0.75rem;
    color: #cbd5e1;
}

/* Títulos y Subtítulos Fluidos */
.hero-title[b-zdrbu4h33l] {
    font-size: clamp(1.75rem, 4vw + 0.5rem, 3rem);
    font-weight: 800;
    line-height: 1.18;
    color: #ffffff;
    margin-bottom: 1.25rem;
    text-shadow: 0 4px 14px rgba(0, 0, 0, 0.5);
    letter-spacing: -0.02em;
}

.hero-subtitle[b-zdrbu4h33l] {
    max-width: 42rem;
    margin: 0 auto 2.25rem;
    font-size: clamp(1rem, 1.4vw + 0.25rem, 1.25rem);
    color: #e2e8f0;
    line-height: 1.6;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

/* CTAs Section */
.hero-cta[b-zdrbu4h33l] {
    width: 100%;
    max-width: 100%;
    margin-bottom: 2rem;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

/* Botón Sólido Principal (Prueba Aurocore gratis) */
.btn-hero-solid[b-zdrbu4h33l] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #093d93 !important;
    border: 1.5px solid #093d93 !important;
    color: #ffffff !important;
    border-radius: 9999px !important;
    padding: 0.85rem 2.25rem !important;
    font-size: 1.05rem !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    text-decoration: none !important;
    box-shadow: 0 4px 14px rgba(9, 61, 147, 0.28) !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    white-space: nowrap !important;
    min-height: 52px !important;
    box-sizing: border-box !important;
}

.btn-hero-solid *[b-zdrbu4h33l] {
    color: #ffffff !important;
}

.btn-hero-solid:hover[b-zdrbu4h33l] {
    background-color: #ed7024 !important;
    border-color: #ed7024 !important;
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(237, 112, 36, 0.35) !important;
}

.btn-hero-solid:active[b-zdrbu4h33l] {
    transform: translateY(0);
}

/* Botón Outline Secundario (Conoce cómo funciona) */
.btn-hero-demo[b-zdrbu4h33l] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: transparent !important;
    border: 1.5px solid #093d93 !important;
    color: #093d93 !important;
    border-radius: 9999px !important;
    padding: 0.85rem 2.25rem !important;
    font-size: 1.05rem !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    text-decoration: none !important;
    box-shadow: none !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    white-space: nowrap !important;
    min-height: 52px !important;
    box-sizing: border-box !important;
}

.btn-hero-demo *[b-zdrbu4h33l] {
    color: #093d93 !important;
}

.btn-arrow-icon[b-zdrbu4h33l] {
    display: inline-block;
    transition: transform 0.25s ease;
    vertical-align: middle;
    color: #093d93 !important;
}

.btn-hero-demo:hover[b-zdrbu4h33l] {
    background-color: rgba(9, 61, 147, 0.06) !important;
    border-color: #093d93 !important;
    color: #093d93 !important;
    transform: translateY(-2px);
}

.btn-hero-demo:hover *[b-zdrbu4h33l] {
    color: #093d93 !important;
}

.btn-hero-demo:hover .btn-arrow-icon[b-zdrbu4h33l] {
    transform: translateX(4px);
    color: #093d93 !important;
}

.btn-hero-demo:active[b-zdrbu4h33l] {
    transform: translateY(0);
}

@media (max-width: 575.98px) {
    .hero-cta[b-zdrbu4h33l] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .btn-hero-solid[b-zdrbu4h33l],
    .btn-hero-demo[b-zdrbu4h33l] {
        width: 100%;
        text-align: center;
    }
}

/* Estadísticas Limpias */
.hero-stats[b-zdrbu4h33l] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem 1.5rem;
    padding-top: 1.5rem;
    width: 100%;
}

.stat-item[b-zdrbu4h33l] {
    text-align: left;
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInUp-b-zdrbu4h33l 0.6s ease forwards;
    padding: 0;
}

.stat-value[b-zdrbu4h33l] {
    font-size: clamp(1.4rem, 2.4vw, 2.2rem);
    font-weight: 800;
    color: #093d93;
    line-height: 1.15;
    letter-spacing: -0.02em;
}

.stat-label[b-zdrbu4h33l] {
    margin-top: 0.35rem;
    font-size: clamp(0.75rem, 1vw, 0.875rem);
    color: #64748b;
    line-height: 1.35;
    font-weight: 400;
}

/* Animaciones para contadores */
.stat-value .animated-counter[b-zdrbu4h33l] {
    display: inline-block;
    font-variant-numeric: tabular-nums;
    color: #093d93;
}

.stat-item:nth-child(1)[b-zdrbu4h33l] {
    animation-delay: 0.1s;
}

.stat-item:nth-child(2)[b-zdrbu4h33l] {
    animation-delay: 0.2s;
}

.stat-item:nth-child(3)[b-zdrbu4h33l] {
    animation-delay: 0.3s;
}

.stat-item:nth-child(4)[b-zdrbu4h33l] {
    animation-delay: 0.4s;
}

@keyframes fadeInUp-b-zdrbu4h33l {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Breakpoints Responsivos */
@media (min-width: 768px) {
    .hero-stats[b-zdrbu4h33l] {
        grid-template-columns: repeat(4, 1fr);
        gap: 1.5rem;
        padding-top: 2rem;
    }
}
/* /Components/Landing/Navbar.razor.rz.scp.css */
/* ==========================================================================
   NAVBAR COMPONENT - ULTRA-PREMIUM LIQUID GLASS & CLEAN TYPOGRAPHY
   ========================================================================== */

.navbar-header[b-u7201g5f13] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1040;
    width: 100%;
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    background-color: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.navbar-header.scrolled[b-u7201g5f13] {
    background-color: rgba(255, 255, 255, 0.96);
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    box-shadow: 0 10px 30px -8px rgba(0, 0, 0, 0.07), 0 0 0 1px rgba(0, 0, 0, 0.02);
    backdrop-filter: blur(28px) saturate(180%);
    -webkit-backdrop-filter: blur(28px) saturate(180%);
}

.navbar-wrapper[b-u7201g5f13] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 4.75rem;
    max-width: 1360px;
    margin: 0 auto;
    padding: 0.75rem 2rem;
}

@media (min-width: 992px) {
    .navbar-wrapper[b-u7201g5f13] {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 3rem;
    }
}

/* ==========================================================================
   BRAND / LOGO
   ========================================================================== */
.navbar-brand[b-u7201g5f13] {
    display: flex;
    align-items: center;
    text-decoration: none;
    cursor: pointer;
    outline: none;
    flex-shrink: 0;
}

.navbar-logo[b-u7201g5f13] {
    height: 2.65rem;
    width: auto;
    max-width: 180px;
    object-fit: contain;
    transition: transform 0.25s ease;
}

.navbar-brand:hover .navbar-logo[b-u7201g5f13] {
    transform: scale(1.02);
}

.navbar-header:not(.scrolled) .logo-white[b-u7201g5f13] {
    display: block !important;
}

.navbar-header:not(.scrolled) .logo-colored[b-u7201g5f13] {
    display: none !important;
}

.navbar-header.scrolled .logo-white[b-u7201g5f13] {
    display: none !important;
}

.navbar-header.scrolled .logo-colored[b-u7201g5f13] {
    display: block !important;
}

/* ==========================================================================
   DESKTOP NAVIGATION (LEFT-ALIGNED NEXT TO LOGO, AIRY LINKS)
   ========================================================================== */
.desktop-nav[b-u7201g5f13] {
    display: none;
    align-items: center;
    gap: 1.85rem;
}

@media (min-width: 992px) {
    .desktop-nav[b-u7201g5f13] {
        display: inline-flex;
        align-items: center;
        gap: 1.85rem;
    }
}

.nav-link-item[b-u7201g5f13] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    background: transparent;
    border: none;
    outline: none;
    cursor: pointer;
    font-size: 1.02rem;
    font-weight: 500;
    letter-spacing: -0.01em;
    color: rgba(255, 255, 255, 0.88);
    padding: 0.2rem 0.2rem;
    position: relative;
    user-select: none;
    white-space: nowrap;
    text-decoration: none;
    transition: color 0.22s ease;
}

/* Bottom Glowing Line Indicator */
.nav-link-item[b-u7201g5f13]::after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 50%;
    width: 0;
    height: 3px;
    background: #ed7024;
    border-radius: 9999px;
    transform: translateX(-50%);
    transition: width 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.25s ease;
}

.navbar-header.scrolled .nav-link-item[b-u7201g5f13] {
    color: #495e7f;
}

.nav-trigger .chevron-icon[b-u7201g5f13] {
    font-size: 0.75rem;
    transition: transform 0.25s ease, opacity 0.2s ease;
    opacity: 0.7;
}

.nav-dropdown-wrapper.is-open .chevron-icon[b-u7201g5f13],
.nav-dropdown-wrapper:hover .chevron-icon[b-u7201g5f13] {
    transform: rotate(180deg);
    opacity: 1;
}

/* Hover States */
.navbar-header:not(.scrolled) .nav-link-item:hover[b-u7201g5f13] {
    color: #ffffff;
}

.navbar-header:not(.scrolled) .nav-link-item:hover[b-u7201g5f13]::after {
    width: 60%;
    background: rgba(237, 112, 36, 0.85);
}

.navbar-header.scrolled .nav-link-item:hover[b-u7201g5f13] {
    color: #093d93;
}

.navbar-header.scrolled .nav-link-item:hover[b-u7201g5f13]::after {
    width: 60%;
    background: rgba(237, 112, 36, 0.85);
}

/* Active State (Bold Text + Vibrant Glowing Line) */
.navbar-header:not(.scrolled) .nav-link-item.active[b-u7201g5f13] {
    color: #ffffff;
    font-weight: 700;
}

.navbar-header:not(.scrolled) .nav-link-item.active[b-u7201g5f13]::after {
    width: 100%;
    background: #ed7024;
    box-shadow: 0 2px 10px rgba(237, 112, 36, 0.75);
}

.navbar-header.scrolled .nav-link-item.active[b-u7201g5f13] {
    color: #093d93;
    font-weight: 700;
}

.navbar-header.scrolled .nav-link-item.active[b-u7201g5f13]::after {
    width: 100%;
    background: #ed7024;
    box-shadow: 0 2px 8px rgba(237, 112, 36, 0.5);
}

/* ==========================================================================
   LIQUID GLASS DROPDOWN MENU - BULLETPROOF SOLID STRUCTURE
   ========================================================================== */
.nav-dropdown-wrapper[b-u7201g5f13] {
    position: relative;
}

/* Dropdown Flyout with Zero-Gap Bridge */
.liquid-dropdown-menu[b-u7201g5f13] {
    position: absolute;
    top: 100%;
    left: 50%;
    padding-top: 14px; /* Seamless invisible bridge */
    transform: translateX(-50%) translateY(4px);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.22s cubic-bezier(0.16, 1, 0.3, 1), transform 0.22s cubic-bezier(0.16, 1, 0.3, 1);
    z-index: 1050;
}

/* Invisible Bridge Pseudo-Element */
.liquid-dropdown-menu[b-u7201g5f13]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 16px;
    background: transparent;
}

.nav-dropdown-wrapper:hover .liquid-dropdown-menu[b-u7201g5f13],
.nav-dropdown-wrapper.is-open .liquid-dropdown-menu[b-u7201g5f13] {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
}

/* Base Surface (Universal Dimensions) */
.liquid-menu-surface[b-u7201g5f13] {
    min-width: 320px;
    width: max-content;
    max-width: 380px;
    border-radius: 18px;
    padding: 0.6rem;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    box-sizing: border-box;
}

/* Menu Items (Universal Flexbox Row) */
.menu-item[b-u7201g5f13] {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 0.9rem !important;
    padding: 0.65rem 0.85rem !important;
    border-radius: 12px !important;
    text-decoration: none !important;
    border: 1px solid transparent !important;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
}

.menu-item-icon[b-u7201g5f13] {
    width: 36px;
    height: 36px;
    min-width: 36px;
    border-radius: 10px;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    font-size: 1.05rem;
    transition: all 0.2s ease;
}

.menu-item-text[b-u7201g5f13] {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.15rem !important;
    flex: 1 1 auto !important;
    text-align: left !important;
}

.item-headline[b-u7201g5f13] {
    font-size: 0.94rem !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    line-height: 1.25 !important;
    display: block !important;
    transition: color 0.18s ease;
}

.item-subtext[b-u7201g5f13] {
    font-size: 0.77rem !important;
    line-height: 1.35 !important;
    text-decoration: none !important;
    display: block !important;
}

/* --------------------------------------------------------------------------
   1. TRANSPARENT HEADER: DEEP NAVY BLUE (#0b1a33) SOLID GLASS
   -------------------------------------------------------------------------- */
.navbar-header:not(.scrolled) .liquid-menu-surface[b-u7201g5f13] {
    background: #0b1a33 !important;
    border: 1px solid rgba(255, 255, 255, 0.16) !important;
    box-shadow: 0 25px 50px -12px rgba(2, 6, 23, 0.8), 0 0 0 1px rgba(255, 255, 255, 0.08), inset 0 1px 1px 0 rgba(255, 255, 255, 0.2) !important;
}

.navbar-header:not(.scrolled) .menu-item[b-u7201g5f13] {
    background: transparent !important;
}

.navbar-header:not(.scrolled) .menu-item:hover[b-u7201g5f13] {
    background: rgba(255, 255, 255, 0.07) !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
    transform: translateY(-1px);
}

.navbar-header:not(.scrolled) .menu-item.active[b-u7201g5f13] {
    background: rgba(237, 112, 36, 0.14) !important;
    border-color: rgba(237, 112, 36, 0.35) !important;
}

.navbar-header:not(.scrolled) .menu-item-icon[b-u7201g5f13] {
    background: rgba(255, 255, 255, 0.08) !important;
    color: #93c5fd !important;
    border: 1px solid rgba(255, 255, 255, 0.14) !important;
}

.navbar-header:not(.scrolled) .menu-item:hover .menu-item-icon[b-u7201g5f13] {
    background: rgba(237, 112, 36, 0.22) !important;
    color: #f97316 !important;
    border-color: rgba(237, 112, 36, 0.55) !important;
    box-shadow: 0 0 14px rgba(237, 112, 36, 0.4) !important;
    transform: scale(1.08);
}

.navbar-header:not(.scrolled) .menu-item.active .menu-item-icon[b-u7201g5f13] {
    background: rgba(237, 112, 36, 0.25) !important;
    color: #f97316 !important;
    border-color: rgba(237, 112, 36, 0.5);
}

.navbar-header:not(.scrolled) .item-headline[b-u7201g5f13] {
    color: #ffffff !important;
}

.navbar-header:not(.scrolled) .menu-item:hover .item-headline[b-u7201g5f13] {
    color: #ffffff !important;
    text-shadow: 0 0 12px rgba(255, 255, 255, 0.4);
}

.navbar-header:not(.scrolled) .menu-item.active .item-headline[b-u7201g5f13] {
    color: #f97316 !important;
}

.navbar-header:not(.scrolled) .item-subtext[b-u7201g5f13] {
    color: #94a3b8 !important;
}

.navbar-header:not(.scrolled) .menu-item:hover .item-subtext[b-u7201g5f13] {
    color: #cbd5e1 !important;
}

/* --------------------------------------------------------------------------
   2. SCROLLED / SUBPAGE HEADER: HARMONIOUS LUXURY NAVY & WARM ACCENTS
   -------------------------------------------------------------------------- */
.navbar-header.scrolled .liquid-menu-surface[b-u7201g5f13] {
    background: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: blur(28px) saturate(190%) !important;
    -webkit-backdrop-filter: blur(28px) saturate(190%) !important;
    border: 1px solid rgba(9, 61, 147, 0.08) !important;
    box-shadow: 0 20px 45px -10px rgba(9, 61, 147, 0.12), 0 4px 16px -2px rgba(15, 23, 42, 0.04), inset 0 1px 1px 0 #ffffff !important;
}

.navbar-header.scrolled .menu-item[b-u7201g5f13] {
    background: transparent !important;
}

.navbar-header.scrolled .menu-item:hover[b-u7201g5f13] {
    background: linear-gradient(90deg, rgba(237, 112, 36, 0.04) 0%, rgba(9, 61, 147, 0.02) 100%) !important;
    border-color: rgba(237, 112, 36, 0.16) !important;
    transform: translateY(-1px);
}

.navbar-header.scrolled .menu-item.active[b-u7201g5f13] {
    background: rgba(237, 112, 36, 0.06) !important;
    border-color: rgba(237, 112, 36, 0.2) !important;
}

.navbar-header.scrolled .menu-item-icon[b-u7201g5f13] {
    background: linear-gradient(135deg, #f0f4f8 0%, #e2e8f0 100%) !important;
    color: #093d93 !important;
    border: 1px solid rgba(9, 61, 147, 0.1) !important;
}

.navbar-header.scrolled .menu-item:hover .menu-item-icon[b-u7201g5f13] {
    background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%) !important;
    color: #ed7024 !important;
    border-color: rgba(237, 112, 36, 0.35) !important;
    box-shadow: 0 4px 12px rgba(237, 112, 36, 0.2) !important;
    transform: scale(1.06);
}

.navbar-header.scrolled .menu-item.active .menu-item-icon[b-u7201g5f13] {
    background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%) !important;
    color: #ed7024 !important;
    border-color: rgba(237, 112, 36, 0.3) !important;
}

.navbar-header.scrolled .item-headline[b-u7201g5f13] {
    color: #0f2b5c !important; /* Azul marino profundo de lujo (cero negro duro) */
}

.navbar-header.scrolled .menu-item:hover .item-headline[b-u7201g5f13] {
    color: #ed7024 !important;
}

.navbar-header.scrolled .menu-item.active .item-headline[b-u7201g5f13] {
    color: #ed7024 !important;
}

.navbar-header.scrolled .item-subtext[b-u7201g5f13] {
    color: #627d98 !important; /* Azul pizarra suave */
}

.navbar-header.scrolled .menu-item:hover .item-subtext[b-u7201g5f13] {
    color: #486581 !important;
}

/* ==========================================================================
   DESKTOP ACTION BUTTONS
   ========================================================================== */
.desktop-actions[b-u7201g5f13] {
    display: none;
    align-items: center;
    gap: 0.85rem;
    margin-left: auto;
    flex-shrink: 0;
}

@media (min-width: 992px) {
    .desktop-actions[b-u7201g5f13] {
        display: inline-flex;
    }
}

[b-u7201g5f13] .btn-nav-outline,
[b-u7201g5f13] .btn-nav-solid,
[b-u7201g5f13] .btn-nav-outline.k-button,
[b-u7201g5f13] .btn-nav-solid.k-button {
    border-radius: 9999px !important;
    padding: 0.55rem 1.45rem !important;
    font-size: 0.94rem !important;
    font-weight: 600 !important;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    cursor: pointer !important;
    box-shadow: none !important;
}

/* Transparent Header Actions */
.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-nav-outline,
.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-nav-outline.k-button {
    border: 1.5px solid rgba(255, 255, 255, 0.8) !important;
    background-color: transparent !important;
    color: #ffffff !important;
    backdrop-filter: blur(8px) !important;
}

.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-nav-outline:hover,
.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-nav-outline.k-button:hover {
    background-color: rgba(255, 255, 255, 0.18) !important;
    border-color: #ffffff !important;
}

.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-nav-solid,
.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-nav-solid.k-button {
    background-color: #ffffff !important;
    border: 1.5px solid #ffffff !important;
    color: #0f172a !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12) !important;
}

.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-nav-solid:hover,
.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-nav-solid.k-button:hover {
    background-color: #f1f5f9 !important;
    border-color: #f1f5f9 !important;
    transform: translateY(-1px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.16) !important;
}

/* Scrolled Header Actions */
.navbar-header.scrolled[b-u7201g5f13]  .btn-nav-outline,
.navbar-header.scrolled[b-u7201g5f13]  .btn-nav-outline.k-button {
    border: 1.5px solid #093d93 !important;
    background-color: transparent !important;
    color: #093d93 !important;
}

.navbar-header.scrolled[b-u7201g5f13]  .btn-nav-outline:hover,
.navbar-header.scrolled[b-u7201g5f13]  .btn-nav-outline.k-button:hover {
    background-color: rgba(9, 61, 147, 0.06) !important;
    border-color: #093d93 !important;
}

.navbar-header.scrolled[b-u7201g5f13]  .btn-nav-solid,
.navbar-header.scrolled[b-u7201g5f13]  .btn-nav-solid.k-button {
    background-color: #093d93 !important;
    border: 1.5px solid #093d93 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(9, 61, 147, 0.25) !important;
}

.navbar-header.scrolled[b-u7201g5f13]  .btn-nav-solid:hover,
.navbar-header.scrolled[b-u7201g5f13]  .btn-nav-solid.k-button:hover {
    background-color: #ed7024 !important;
    border-color: #ed7024 !important;
    color: #ffffff !important;
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(237, 112, 36, 0.3) !important;
}

/* ==========================================================================
   MOBILE TOGGLE BUTTON (< 992px) - BORDERLESS MINIMALIST HAMBURGER
   ========================================================================== */
.mobile-toggle-btn[b-u7201g5f13] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    min-width: 40px;
    padding: 0;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
    cursor: pointer;
    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    outline: none;
    margin-left: auto;
}

.mobile-toggle-btn:hover[b-u7201g5f13] {
    background: transparent !important;
    border: none !important;
    transform: scale(1.06);
}

/* 3-Span Hamburger Box with Exact Symmetry */
.hamburger-box[b-u7201g5f13] {
    width: 22px;
    height: 14px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}

.hamburger-line[b-u7201g5f13] {
    width: 22px;
    height: 2.5px;
    border-radius: 9999px;
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.25s ease, background-color 0.25s ease;
    transform-origin: center;
}

.navbar-header:not(.scrolled) .hamburger-line[b-u7201g5f13] {
    background-color: #ffffff;
}

.navbar-header.scrolled .hamburger-line[b-u7201g5f13] {
    background-color: #093d93;
}

/* Morph to X on Active State */
.mobile-toggle-btn.is-active .top-line[b-u7201g5f13] {
    transform: translateY(5.75px) rotate(45deg);
    background-color: #093d93 !important;
}

.mobile-toggle-btn.is-active .mid-line[b-u7201g5f13] {
    opacity: 0;
    transform: scaleX(0);
}

.mobile-toggle-btn.is-active .bot-line[b-u7201g5f13] {
    transform: translateY(-5.75px) rotate(-45deg);
    background-color: #093d93 !important;
}

/* ==========================================================================
   MOBILE BACKDROP & LIQUID GLASS DRAWER
   ========================================================================== */
.mobile-backdrop[b-u7201g5f13] {
    position: fixed;
    inset: 0;
    z-index: 1060;
    background-color: rgba(15, 23, 42, 0.45);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.mobile-backdrop.is-visible[b-u7201g5f13] {
    opacity: 1;
    pointer-events: auto;
}

.mobile-drawer[b-u7201g5f13] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    max-width: 100%;
    height: 100vh;
    height: 100dvh;
    z-index: 1070;
    background: rgba(255, 255, 255, 0.98);
    backdrop-filter: blur(40px) saturate(190%);
    -webkit-backdrop-filter: blur(40px) saturate(190%);
    border-left: none;
    box-shadow: none;
    transform: translateX(100%);
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.mobile-drawer.is-open[b-u7201g5f13] {
    transform: translateX(0);
}

.mobile-drawer-inner[b-u7201g5f13] {
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
}

.mobile-drawer-header[b-u7201g5f13] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1.25rem;
    height: 70px;
    min-height: 70px;
    border-bottom: 1px solid #f1f5f9;
    background: rgba(255, 255, 255, 0.95);
}

.mobile-logo-img[b-u7201g5f13] {
    height: 2.2rem;
    max-height: 2.2rem;
    width: auto;
    aspect-ratio: 200 / 62;
    object-fit: contain;
}

/* Borderless Minimalist 'X' Close Button */
.drawer-close-btn[b-u7201g5f13] {
    width: 40px;
    height: 40px;
    padding: 0;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    position: relative;
    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    outline: none;
}

.drawer-close-btn:hover[b-u7201g5f13] {
    transform: rotate(90deg) scale(1.1);
    background: transparent !important;
}

.close-icon-bar[b-u7201g5f13] {
    width: 22px;
    height: 2.5px;
    background-color: #093d93;
    border-radius: 9999px;
    position: absolute;
    transition: background-color 0.2s ease;
}

.drawer-close-btn:hover .close-icon-bar[b-u7201g5f13] {
    background-color: #ed7024;
}

.close-bar-1[b-u7201g5f13] {
    transform: rotate(45deg);
}

.close-bar-2[b-u7201g5f13] {
    transform: rotate(-45deg);
}

/* ==========================================================================
   VERCEL-INSPIRED CALM TYPOGRAPHICAL CONTENT (SCALED READABILITY)
   ========================================================================== */
.mobile-drawer-content[b-u7201g5f13] {
    flex: 1;
    overflow-y: auto;
    padding: 1.5rem 1.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.mobile-nav-row[b-u7201g5f13],
.accordion-header[b-u7201g5f13] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 56px;
    padding: 0.85rem 0.5rem;
    border-radius: 8px;
    background: transparent;
    border: none;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    text-align: left;
}

.row-label[b-u7201g5f13] {
    font-size: 1.32rem;
    font-weight: 550;
    color: #0f172a;
    letter-spacing: -0.025em;
    transition: color 0.2s ease;
}

.mobile-nav-row:hover .row-label[b-u7201g5f13],
.accordion-header:hover .row-label[b-u7201g5f13] {
    color: #ed7024;
}

/* Subtle Active Parent Highlighting */
.mobile-nav-row.active .row-label[b-u7201g5f13],
.accordion-header.active .row-label[b-u7201g5f13] {
    color: #ed7024;
    font-weight: 650;
}

.accordion-chevron[b-u7201g5f13] {
    font-size: 1.1rem;
    color: #64748b;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), color 0.2s ease;
}

.accordion-header.active .accordion-chevron[b-u7201g5f13] {
    color: #ed7024;
}

.mobile-accordion.is-open .accordion-chevron[b-u7201g5f13] {
    transform: rotate(180deg);
}

/* Mobile Accordions & Clean Indented Sublinks */
.mobile-accordion[b-u7201g5f13] {
    background: transparent;
    border: none;
    border-radius: 8px;
    overflow: hidden;
    transition: all 0.25s ease;
}

.accordion-body[b-u7201g5f13] {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s cubic-bezier(0.16, 1, 0.3, 1), padding 0.3s ease;
    padding-left: 0.85rem;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.mobile-accordion.is-open .accordion-body[b-u7201g5f13] {
    max-height: 400px;
    padding-top: 0.35rem;
    padding-bottom: 0.85rem;
}

.mobile-sublink[b-u7201g5f13] {
    display: flex;
    align-items: center;
    min-height: 46px;
    padding: 0.55rem 0.95rem;
    border-radius: 8px;
    text-decoration: none;
    color: #64748b;
    font-size: 1.12rem;
    font-weight: 450;
    transition: all 0.18s ease;
    background: transparent;
    border-left: 2.5px solid transparent;
}

.mobile-sublink:hover[b-u7201g5f13] {
    color: #0f172a;
    background-color: rgba(9, 61, 147, 0.03);
}

.mobile-sublink.active[b-u7201g5f13] {
    color: #ed7024;
    font-weight: 600;
    background-color: rgba(237, 112, 36, 0.05);
    border-left: 2.5px solid #ed7024;
}

/* Mobile Drawer Footer */
.mobile-drawer-footer[b-u7201g5f13] {
    padding: 1.5rem 1.75rem;
    border-top: 1px solid #f1f5f9;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

.btn-mobile-outline[b-u7201g5f13],
.btn-mobile-solid[b-u7201g5f13] {
    width: 100%;
    min-height: 52px;
    border-radius: 9999px;
    font-size: 1.05rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    text-decoration: none;
    transition: all 0.22s ease;
    outline: none;
}

.btn-mobile-outline[b-u7201g5f13] {
    background-color: transparent;
    border: 1.5px solid #093d93;
    color: #093d93;
}

.btn-mobile-outline:hover[b-u7201g5f13] {
    background-color: rgba(9, 61, 147, 0.06);
}

.btn-mobile-solid[b-u7201g5f13] {
    background-color: #093d93;
    border: 1.5px solid #093d93;
    color: #ffffff;
    box-shadow: 0 4px 14px rgba(9, 61, 147, 0.22);
}

.btn-mobile-solid:hover[b-u7201g5f13] {
    background-color: #ed7024;
    border-color: #ed7024;
    box-shadow: 0 4px 14px rgba(237, 112, 36, 0.3);
}

/* ==========================================================================
   RESPONSIVE BREAKPOINTS (MOBILE-FIRST)
   ========================================================================== */
@media (min-width: 992px) {
    .desktop-nav[b-u7201g5f13] {
        display: flex;
    }

    .desktop-actions[b-u7201g5f13] {
        display: flex;
    }

    .mobile-toggle-btn[b-u7201g5f13] {
        display: none;
    }

    .mobile-backdrop[b-u7201g5f13],
    .mobile-drawer[b-u7201g5f13] {
        display: none !important;
    }
}
/* /Components/Landing/PricingPlanComparison.razor.rz.scp.css */
/* ========================================================
   PRICING PLAN COMPARISON (GRILLA COMPARATIVA CONDENSADA)
   ======================================================== */
.plan-comparison-section[b-e00o668kh8] {
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
    padding: clamp(1.75rem, 3vw, 2.75rem) clamp(0.75rem, 2vw, 1.5rem);
    position: relative;
    width: 100%;
    color: #0f172a;
}

.comparison-container[b-e00o668kh8] {
    max-width: 1280px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
    width: 100%;
}

/* ========================================================
   SECTION HEADER (COMPACTO)
   ======================================================== */
.comparison-header[b-e00o668kh8] {
    max-width: 46rem;
    margin: 0 auto 1.5rem;
    text-align: center;
}

.comparison-badge[b-e00o668kh8] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.25rem 0.85rem;
    background: rgba(9, 61, 147, 0.07);
    border: 1px solid rgba(9, 61, 147, 0.18);
    border-radius: 9999px;
    font-size: 0.78rem;
    font-weight: 600;
    color: #093d93;
    margin-bottom: 0.75rem;
    box-shadow: 0 2px 8px rgba(9, 61, 147, 0.04);
}

.badge-dot-orange[b-e00o668kh8] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background-color: #ed7024;
    box-shadow: 0 0 6px #ed7024;
}

.comparison-title[b-e00o668kh8] {
    font-size: clamp(1.5rem, 3vw + 0.3rem, 2.25rem);
    font-weight: 800;
    line-height: 1.2;
    color: #09224f;
    margin: 0 0 0.5rem 0;
    letter-spacing: -0.025em;
}

.highlight-orange[b-e00o668kh8] {
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.comparison-subtitle[b-e00o668kh8] {
    font-size: clamp(0.85rem, 1vw + 0.2rem, 1rem);
    color: #2c4d75;
    line-height: 1.45;
    margin: 0;
}

/* ========================================================
   TABLE WRAPPER & SCROLL
   ======================================================== */
.comparison-table-wrapper[b-e00o668kh8] {
    background: #ffffff;
    border-radius: 1rem;
    border: 1px solid rgba(9, 61, 147, 0.12);
    box-shadow: 0 8px 25px rgba(9, 61, 147, 0.05);
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 1.75rem;
}

.comparison-table[b-e00o668kh8] {
    width: 100%;
    min-width: 820px;
    border-collapse: separate;
    border-spacing: 0;
    text-align: left;
}

/* ========================================================
   TABLE HEADER (CONDENSADO & STICKY)
   ======================================================== */
.table-header-row th[b-e00o668kh8] {
    background: #ffffff;
    padding: 1.15rem 1rem 0.85rem;
    vertical-align: top;
    position: sticky;
    top: 0;
    z-index: 10;
    border-bottom: 2px solid rgba(9, 61, 147, 0.12);
}

.col-feature-header[b-e00o668kh8] {
    width: 37%;
    border-right: 1px solid rgba(9, 61, 147, 0.08);
}

.header-feature-title[b-e00o668kh8] {
    font-size: 1.05rem;
    font-weight: 800;
    color: #09224f;
    margin-bottom: 0.15rem;
}

.header-feature-sub[b-e00o668kh8] {
    font-size: 0.76rem;
    color: #64748b;
    font-weight: 500;
}

.col-plan-header[b-e00o668kh8] {
    width: 21%;
    text-align: center;
    position: relative;
    border-right: 1px solid rgba(9, 61, 147, 0.08);
    transition: background-color 0.2s ease;
}

.col-plan-header:last-child[b-e00o668kh8] {
    border-right: none;
}

/* Plan Pro Highlight Column */
.col-plan-header.popular-plan[b-e00o668kh8] {
    background: linear-gradient(180deg, rgba(237, 112, 36, 0.05) 0%, rgba(237, 112, 36, 0.015) 100%);
    border-top: 3px solid #ed7024;
}

.popular-ribbon[b-e00o668kh8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    color: #ffffff;
    padding: 0.15rem 0.6rem;
    border-radius: 9999px;
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    margin-bottom: 0.4rem;
    box-shadow: 0 3px 8px rgba(237, 112, 36, 0.3);
}

.popular-ribbon-icon[b-e00o668kh8]  svg {
    fill: #ffffff !important;
    color: #ffffff !important;
    width: 11px;
    height: 11px;
}

.plan-header-content[b-e00o668kh8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.2rem;
}

.plan-name-row[b-e00o668kh8] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    flex-wrap: wrap;
    justify-content: center;
}

.plan-header-name[b-e00o668kh8] {
    font-size: 1.1rem;
    font-weight: 800;
    color: #09224f;
}

.plan-tag-rec[b-e00o668kh8] {
    font-size: 0.65rem;
    font-weight: 700;
    color: #ed7024;
    background: rgba(237, 112, 36, 0.12);
    padding: 0.1rem 0.35rem;
    border-radius: 0.3rem;
}

.plan-price-row[b-e00o668kh8] {
    display: flex;
    align-items: baseline;
    gap: 0.2rem;
    margin: 0.1rem 0;
}

.plan-price-val[b-e00o668kh8] {
    font-size: 1.45rem;
    font-weight: 800;
    color: #093d93;
    line-height: 1;
}

.col-plan-header.popular-plan .plan-price-val[b-e00o668kh8] {
    color: #ed7024;
}

.plan-price-per[b-e00o668kh8] {
    font-size: 0.78rem;
    color: #64748b;
    font-weight: 600;
}

.plan-tagline-text[b-e00o668kh8] {
    font-size: 0.74rem;
    color: #64748b;
    margin: 0 0 0.5rem 0;
    line-height: 1.25;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.btn-plan-cta[b-e00o668kh8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 145px;
    padding: 0.38rem 0.75rem;
    border-radius: 9999px;
    font-size: 0.78rem;
    font-weight: 700;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
}

.btn-standard[b-e00o668kh8] {
    background: #093d93;
    color: #ffffff;
}

.btn-standard:hover[b-e00o668kh8] {
    background: #072a66;
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(9, 61, 147, 0.2);
}

.btn-popular[b-e00o668kh8] {
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    color: #ffffff;
    box-shadow: 0 3px 10px rgba(237, 112, 36, 0.35);
}

.btn-popular:hover[b-e00o668kh8] {
    transform: translateY(-1px);
    box-shadow: 0 5px 14px rgba(237, 112, 36, 0.45);
}

/* ========================================================
   CATEGORY BANNER ROWS (COMPACTO)
   ======================================================== */
.category-header-row td[b-e00o668kh8] {
    padding: 0.65rem 0.85rem 0.25rem !important;
    background: #ffffff;
}

.category-banner-cell[b-e00o668kh8] {
    padding: 0.65rem 0.85rem 0.25rem !important;
}

.category-banner-content[b-e00o668kh8] {
    background: #09224f;
    color: #ffffff;
    padding: 0.45rem 1rem;
    border-radius: 0.5rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    box-shadow: 0 2px 8px rgba(9, 34, 79, 0.15);
}

.category-title[b-e00o668kh8] {
    font-size: 0.95rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    color: #ffffff;
}

.category-desc[b-e00o668kh8] {
    font-size: 0.76rem;
    color: #cbd5e1;
    font-weight: 500;
    opacity: 0.9;
}

/* ========================================================
   FEATURE ROWS & CELLS (CONDENSADO / ULTRA-COMPACTO)
   ======================================================== */
.feature-data-row[b-e00o668kh8] {
    transition: background-color 0.15s ease;
}

.feature-data-row:hover[b-e00o668kh8] {
    background-color: rgba(9, 61, 147, 0.025);
}

.feature-data-row td[b-e00o668kh8] {
    padding: 0.42rem 0.85rem !important;
    border-bottom: 1px solid rgba(9, 61, 147, 0.06);
    vertical-align: middle;
}

.feature-label-cell[b-e00o668kh8] {
    border-right: 1px solid rgba(9, 61, 147, 0.08);
}

.feature-info-box[b-e00o668kh8] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.feature-name[b-e00o668kh8] {
    font-size: 0.86rem;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.25;
}

.feature-explanation[b-e00o668kh8] {
    font-size: 0.71rem;
    color: #64748b;
    line-height: 1.2;
}

.feature-cell[b-e00o668kh8] {
    text-align: center;
    border-right: 1px solid rgba(9, 61, 147, 0.08);
}

.feature-cell:last-child[b-e00o668kh8] {
    border-right: none;
}

.feature-cell.popular-col[b-e00o668kh8] {
    background-color: rgba(237, 112, 36, 0.02);
}

/* ========================================================
   CELL VALUES & INDICATORS (COMPACTOS)
   ======================================================== */
.check-wrapper[b-e00o668kh8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.cell-icon-check[b-e00o668kh8]  svg,
.cell-icon-check-inline[b-e00o668kh8]  svg {
    color: #10b981 !important;
    fill: #10b981 !important;
    width: 17px;
    height: 17px;
}

.cell-dash[b-e00o668kh8] {
    color: #94a3b8;
    font-size: 1.15rem;
    font-weight: 400;
    line-height: 1;
}

.cell-text-badge[b-e00o668kh8] {
    display: inline-block;
    font-size: 0.77rem;
    font-weight: 700;
    color: #09224f;
    background: #f1f5f9;
    padding: 0.18rem 0.5rem;
    border-radius: 0.35rem;
    border: 1px solid rgba(9, 61, 147, 0.1);
    white-space: nowrap;
    line-height: 1.2;
}

.popular-col .cell-text-badge[b-e00o668kh8] {
    background: rgba(237, 112, 36, 0.08);
    color: #c25211;
    border-color: rgba(237, 112, 36, 0.22);
}

.cell-check-text-box[b-e00o668kh8] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.78rem;
    font-weight: 700;
    color: #09224f;
}

.cell-highlight-text[b-e00o668kh8] {
    color: #093d93;
}

/* ========================================================
   BOTTOM CONTACT CARD (COMPACTO)
   ======================================================== */
.comparison-bottom-card[b-e00o668kh8] {
    background: #ffffff;
    border: 1px solid rgba(9, 61, 147, 0.12);
    border-radius: 0.75rem;
    padding: 0.9rem 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    box-shadow: 0 4px 12px rgba(9, 61, 147, 0.04);
}

.bottom-card-info[b-e00o668kh8] {
    display: flex;
    align-items: center;
    font-size: 0.88rem;
    font-weight: 600;
    color: #09224f;
}

.sparkles-icon[b-e00o668kh8]  svg {
    color: #ed7024 !important;
    fill: #ed7024 !important;
    width: 17px;
    height: 17px;
}

.btn-bottom-contact[b-e00o668kh8] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    color: #093d93 !important;
    border: 1.5px solid #093d93;
    padding: 0.45rem 1.15rem;
    border-radius: 9999px;
    font-weight: 700;
    font-size: 0.82rem;
    text-decoration: none !important;
    transition: all 0.2s ease;
}

.btn-bottom-contact[b-e00o668kh8]  svg {
    color: #093d93 !important;
    fill: #093d93 !important;
}

.btn-bottom-contact:hover[b-e00o668kh8] {
    background: #093d93;
    color: #ffffff !important;
    transform: translateY(-1px);
    box-shadow: 0 3px 10px rgba(9, 61, 147, 0.18);
}

.btn-bottom-contact:hover[b-e00o668kh8]  svg {
    color: #ffffff !important;
    fill: #ffffff !important;
}

/* ========================================================
   RESPONSIVE DESIGN BREAKPOINTS
   ======================================================== */
@media (max-width: 991px) {
    .category-banner-content[b-e00o668kh8] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.15rem;
    }
    
    .comparison-bottom-card[b-e00o668kh8] {
        flex-direction: column;
        text-align: center;
        justify-content: center;
    }
}
/* /Components/Landing/PricingSection.razor.rz.scp.css */
.plan-price-yearly[b-zrf95m60cg] {
    font-size: 0.875rem;
    color: #64748b;
    margin-top: 0.25rem;
    font-weight: 500;
}

.savings-badge[b-zrf95m60cg] {
    display: inline-flex;
    align-items: center;
    background: #ecfdf5;
    color: #047857;
    border: 1px solid #a7f3d0;
    font-size: 0.78rem;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 9999px;
}
/* /Components/Landing/ProblemSection.razor.rz.scp.css */
/* ================================================
   PROBLEM AGITATION SECTION - ASYMMETRIC 2-COLUMN LAYOUT
   ================================================ */
.problem-section[b-63nq3nbwsw] {
    background-color: rgba(248, 250, 252, 0.85);
    border-top: 1px solid #f1f5f9;
    border-bottom: 1px solid #f1f5f9;
    padding: clamp(3.5rem, 6vw, 5.5rem) 1rem;
    position: relative;
    width: 100%;
}

.problem-container[b-63nq3nbwsw] {
    max-width: 1280px;
    margin: 0 auto;
    width: 100%;
    padding: 0 1rem;
}

.problem-grid[b-63nq3nbwsw] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2.5rem;
    align-items: center;
}

/* ================================================
   LEFT COLUMN: HEADLINE & CONTEXT
   ================================================ */
.problem-intro[b-63nq3nbwsw] {
    text-align: left;
}

.problem-badge[b-63nq3nbwsw] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.85rem;
    border-radius: 9999px;
    font-size: 0.775rem;
    font-weight: 600;
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    color: #334155;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    margin-bottom: 1.25rem;
}

.badge-dot-orange[b-63nq3nbwsw] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #ed7024;
    box-shadow: 0 0 6px #ed7024;
}

.problem-title[b-63nq3nbwsw] {
    font-size: clamp(1.85rem, 3.5vw + 0.3rem, 2.65rem);
    font-weight: 800;
    color: #0f172a;
    line-height: 1.18;
    letter-spacing: -0.025em;
    margin-bottom: 1rem;
}

.highlight-orange[b-63nq3nbwsw] {
    color: #ed7024;
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.problem-subtitle[b-63nq3nbwsw] {
    font-size: clamp(1rem, 1.2vw + 0.1rem, 1.125rem);
    color: #475569;
    line-height: 1.65;
    margin: 0;
}

/* ================================================
   RIGHT COLUMN: HORIZONTAL PROBLEM CARDS (STACKED)
   ================================================ */
.problem-cards-list[b-63nq3nbwsw] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.problem-card[b-63nq3nbwsw] {
    display: flex;
    align-items: flex-start;
    gap: 1.25rem;
    padding: 1.25rem 1.5rem;
    background-color: #ffffff;
    border-radius: 1rem;
    border: 1px solid rgba(226, 232, 240, 0.85);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

.problem-card:hover[b-63nq3nbwsw] {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.08), 0 8px 10px -6px rgba(0, 0, 0, 0.04);
    border-color: #cbd5e1;
}

.problem-icon-box[b-63nq3nbwsw] {
    width: 3rem;
    height: 3rem;
    min-width: 3rem;
    border-radius: 0.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.problem-svg-icon[b-63nq3nbwsw] {
    width: 1.45rem;
    height: 1.45rem;
    stroke: currentColor;
    stroke-width: 2.1;
    display: inline-block;
}

.icon-red[b-63nq3nbwsw] {
    background-color: #fef2f2;
    color: #ef4444;
    border: 1px solid rgba(239, 68, 68, 0.15);
}

.icon-blue[b-63nq3nbwsw] {
    background-color: #eff6ff;
    color: #2563eb;
    border: 1px solid rgba(37, 99, 235, 0.15);
}

.icon-amber[b-63nq3nbwsw] {
    background-color: #fffbeb;
    color: #d97706;
    border: 1px solid rgba(217, 119, 6, 0.15);
}

.problem-card-content[b-63nq3nbwsw] {
    flex: 1;
}

.problem-card-title[b-63nq3nbwsw] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 0.3rem 0;
    line-height: 1.3;
}

.problem-card-desc[b-63nq3nbwsw] {
    font-size: 0.885rem;
    color: #475569;
    line-height: 1.55;
    margin: 0;
}

/* ================================================
   RESPONSIVE LAYOUT (DESKTOP ASYMMETRIC GRID)
   ================================================ */
@media (min-width: 992px) {
    .problem-grid[b-63nq3nbwsw] {
        grid-template-columns: repeat(12, 1fr);
        gap: 3.5rem;
    }

    .problem-intro[b-63nq3nbwsw] {
        grid-column: span 5;
    }

    .problem-cards-list[b-63nq3nbwsw] {
        grid-column: span 7;
    }

    .problem-container[b-63nq3nbwsw] {
        padding: 0 2rem;
    }
}
/* /Components/Landing/ProductShowcase.razor.rz.scp.css */
/* ================================================
   ULTRA-MODERN PRODUCT SHOWCASE (3D ROTATION + CAROUSEL + GLOW BUBBLE)
   ================================================ */
.product-section[b-1zs8m8c6c4] {
    padding: clamp(3.5rem, 6vw, 6.5rem) clamp(1rem, 3vw, 1.5rem);
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    position: relative;
    overflow: hidden;
    width: 100%;
}

.product-container[b-1zs8m8c6c4] {
    max-width: 1280px;
    margin: 0 auto;
    width: 100%;
}

.product-grid[b-1zs8m8c6c4] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 3rem;
    align-items: center;
}

/* ================================================
   LEFT SIDE CONTENT
   ================================================ */
.product-content[b-1zs8m8c6c4] {
    display: flex;
    flex-direction: column;
    text-align: left;
}

.product-badge[b-1zs8m8c6c4] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 1.1rem;
    background: rgba(9, 61, 147, 0.07);
    border: 1px solid rgba(9, 61, 147, 0.18);
    border-radius: 9999px;
    font-size: 0.85rem;
    font-weight: 600;
    color: #093d93;
    margin-bottom: 1.25rem;
    width: fit-content;
}

.badge-dot-orange[b-1zs8m8c6c4] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #ed7024;
    box-shadow: 0 0 8px #ed7024;
}

.product-title[b-1zs8m8c6c4] {
    font-size: clamp(1.75rem, 4vw + 0.4rem, 2.75rem);
    font-weight: 800;
    line-height: 1.22;
    color: var(--text-heading-primary, #09224f);
    margin-bottom: 1rem;
    letter-spacing: -0.02em;
}

.highlight-orange[b-1zs8m8c6c4] {
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.product-description[b-1zs8m8c6c4] {
    font-size: clamp(0.95rem, 1.2vw + 0.2rem, 1.15rem);
    color: var(--text-body-lead, #2c4d75);
    line-height: 1.65;
    margin-bottom: 1.75rem;
}

/* Expanded List of Features */
.product-features[b-1zs8m8c6c4] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.product-feature-item[b-1zs8m8c6c4] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.85rem 1.1rem;
    border-radius: 1rem;
    background: #ffffff;
    border: 1px solid rgba(9, 61, 147, 0.08);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02);
    touch-action: manipulation;
    min-height: 48px;
}

.product-feature-item:hover[b-1zs8m8c6c4],
.product-feature-item.active-feature[b-1zs8m8c6c4] {
    background: rgba(9, 61, 147, 0.04);
    border-color: rgba(237, 112, 36, 0.5);
    transform: translateX(6px);
    box-shadow: 0 6px 20px rgba(9, 61, 147, 0.08);
}

.product-feature-item.active-feature[b-1zs8m8c6c4] {
    background: linear-gradient(90deg, rgba(9, 61, 147, 0.08) 0%, rgba(237, 112, 36, 0.04) 100%);
    border-color: #ed7024;
}

.feature-icon-box[b-1zs8m8c6c4] {
    width: 2.5rem;
    height: 2.5rem;
    min-width: 2.5rem;
    border-radius: 0.75rem;
    background: linear-gradient(135deg, #093d93 0%, #0c4cb5 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.feature-icon-box *[b-1zs8m8c6c4] {
    color: #ffffff !important;
    fill: #ffffff !important;
}

.product-feature-item:hover .feature-icon-box[b-1zs8m8c6c4],
.product-feature-item.active-feature .feature-icon-box[b-1zs8m8c6c4] {
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    transform: scale(1.08);
    box-shadow: 0 4px 14px rgba(237, 112, 36, 0.4);
}

.feature-text[b-1zs8m8c6c4] {
    font-size: 0.95rem;
    color: var(--text-body-muted, #476487);
    line-height: 1.45;
}

.feature-text strong[b-1zs8m8c6c4] {
    color: var(--text-heading-secondary, #13376b);
}

/* ================================================
   RIGHT SIDE VISUAL (GLOW BUBBLE + 3D ROTATION)
   ================================================ */
.product-visual-container[b-1zs8m8c6c4] {
    position: relative;
    padding: 2.5rem 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Burbuja de Fondo Glow Decorativa */
.product-bubble-bg[b-1zs8m8c6c4] {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 440px;
    height: 440px;
    transform: translate(-50%, -50%);
    background: radial-gradient(circle, rgba(9, 61, 147, 0.35) 0%, rgba(237, 112, 36, 0.25) 55%, transparent 75%);
    filter: blur(50px);
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;
}

/* Contenedor 3D */
.showcase-3d-wrapper[b-1zs8m8c6c4] {
    perspective: 1200px;
    z-index: 1;
    position: relative;
    width: 100%;
}

/* Tarjeta Principal con Rotación 3D (25º isometric offset) */
.showcase-board-card[b-1zs8m8c6c4] {
    transform: rotateY(-18deg) rotateX(10deg) rotateZ(2deg);
    transform-style: preserve-3d;
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.6s ease;
    border-radius: 1.25rem;
    border: 1px solid rgba(255, 255, 255, 0.7);
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    box-shadow: -25px 30px 60px rgba(9, 61, 147, 0.22), 0 10px 30px rgba(237, 112, 36, 0.15);
    padding: 1.5rem;
}

.showcase-board-card:hover[b-1zs8m8c6c4] {
    transform: rotateY(-8deg) rotateX(4deg) rotateZ(0deg) scale(1.02);
    box-shadow: -15px 20px 45px rgba(9, 61, 147, 0.28), 0 15px 35px rgba(237, 112, 36, 0.22);
}

/* Header de la tarjeta */
.showcase-card-header[b-1zs8m8c6c4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.25rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid rgba(9, 61, 147, 0.08);
}

.header-title-group[b-1zs8m8c6c4] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.slide-header-icon[b-1zs8m8c6c4] {
    width: 1.4rem;
    height: 1.4rem;
    color: #093d93 !important;
}

.showcase-card-title[b-1zs8m8c6c4] {
    font-size: 1rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
}

.showcase-dots[b-1zs8m8c6c4] {
    display: flex;
    gap: 0.4rem;
}

.dot[b-1zs8m8c6c4] {
    height: 0.65rem;
    width: 0.65rem;
    border-radius: 9999px;
}

.dot.red[b-1zs8m8c6c4] { background-color: #ef4444; }
.dot.yellow[b-1zs8m8c6c4] { background-color: #f59e0b; }
.dot.green[b-1zs8m8c6c4] { background-color: #10b981; }

/* Transición suave entre slides */
.showcase-slide-view[b-1zs8m8c6c4] {
    min-height: 280px;
}

.fade-in-slide[b-1zs8m8c6c4] {
    animation: fadeInSlide-b-1zs8m8c6c4 0.45s ease-out forwards;
}

@keyframes fadeInSlide-b-1zs8m8c6c4 {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}



.invoice-mockup-body[b-1zs8m8c6c4] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    background: #f8fafc;
    padding: 1.25rem;
    border-radius: 0.75rem;
}

.invoice-header-row[b-1zs8m8c6c4] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding-bottom: 0.75rem;
    border-bottom: 1px dashed #cbd5e1;
}

.invoice-number[b-1zs8m8c6c4] {
    font-size: 0.9rem;
    font-weight: 700;
    color: #0f172a;
}

.invoice-client[b-1zs8m8c6c4] {
    font-size: 0.8rem;
    color: #334155;
}

.invoice-amount[b-1zs8m8c6c4] {
    font-size: 1.15rem;
    font-weight: 800;
    color: #093d93;
}

.invoice-items-list[b-1zs8m8c6c4] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.invoice-item[b-1zs8m8c6c4] {
    display: flex;
    justify-content: space-between;
    font-size: 0.8rem;
    color: #334155;
}

.invoice-footer-signature[b-1zs8m8c6c4] {
    margin-top: 0.5rem;
    padding-top: 0.5rem;
    border-top: 1px solid #e2e8f0;
    font-size: 0.75rem;
}

.signature-label[b-1zs8m8c6c4] {
    color: #334155;
    font-weight: 600;
}

.signature-hash[b-1zs8m8c6c4] {
    color: #166534;
    font-weight: 700;
    font-size: 0.7rem;
}

/* SLIDE 2: INVENTORY MOCKUP */
.inventory-badge[b-1zs8m8c6c4] {
    background: rgba(9, 61, 147, 0.1);
    color: #093d93;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.25rem 0.65rem;
    border-radius: 9999px;
}

.inventory-mockup-grid[b-1zs8m8c6c4] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.inventory-row[b-1zs8m8c6c4] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.85rem;
    background: #ffffff;
    border-radius: 0.6rem;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.03);
}

.item-info strong[b-1zs8m8c6c4] {
    display: block;
    font-size: 0.85rem;
    color: #0f172a;
}

.item-info small[b-1zs8m8c6c4] {
    font-size: 0.75rem;
    color: #334155;
}

.item-stock[b-1zs8m8c6c4] {
    font-size: 0.8rem;
    font-weight: 700;
    padding: 0.25rem 0.6rem;
    border-radius: 0.4rem;
}

.item-stock.warning[b-1zs8m8c6c4] { background: #fef3c7; color: #92400e; }
.item-stock.success[b-1zs8m8c6c4] { background: #dcfce7; color: #14532d; }

/* SLIDE 3: ANALYTICS MOCKUP */
.live-badge[b-1zs8m8c6c4] {
    background: #fff7ed;
    color: #9a3412;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.25rem 0.65rem;
    border-radius: 9999px;
}

.analytics-mockup-grid[b-1zs8m8c6c4] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
}

.metric-card[b-1zs8m8c6c4] {
    background: #ffffff;
    padding: 0.85rem;
    border-radius: 0.6rem;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.03);
    text-align: center;
}

.metric-value[b-1zs8m8c6c4] {
    font-size: 1.15rem;
    font-weight: 800;
    color: #093d93;
}

.metric-label[b-1zs8m8c6c4] {
    font-size: 0.75rem;
    color: #334155;
    margin: 0.2rem 0;
}

.metric-trend.positive[b-1zs8m8c6c4] {
    font-size: 0.68rem;
    font-weight: 700;
    color: #166534;
}

/* Carousel Indicators Bar */
.showcase-carousel-nav[b-1zs8m8c6c4] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
    margin-top: 1.25rem;
    padding: 0.25rem 0;
}

.showcase-dot[b-1zs8m8c6c4] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 48px;
    min-height: 48px;
    width: 48px;
    height: 48px;
    padding: 0;
    margin: 0;
    background: transparent;
    border: none;
    cursor: pointer;
    position: relative;
    outline: none;
}

.showcase-dot[b-1zs8m8c6c4]::after {
    content: '';
    display: block;
    width: 0.65rem;
    height: 0.65rem;
    border-radius: 9999px;
    background: #cbd5e1;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.showcase-dot:hover[b-1zs8m8c6c4]::after {
    background: #94a3b8;
    transform: scale(1.15);
}

.showcase-dot.active[b-1zs8m8c6c4]::after {
    width: 1.75rem;
    background: linear-gradient(135deg, #093d93 0%, #ed7024 100%);
    box-shadow: 0 2px 6px rgba(9, 61, 147, 0.35);
}

.showcase-dot:focus-visible[b-1zs8m8c6c4]::after {
    box-shadow: 0 0 0 2px #ffffff, 0 0 0 4px #093d93;
}

/* ================================================
   RESPONSIVE BREAKPOINTS
   ================================================ */
@media (max-width: 991px) {
    .product-grid[b-1zs8m8c6c4] {
        grid-template-columns: 1fr;
        gap: 3rem;
    }

    .showcase-board-card[b-1zs8m8c6c4] {
        transform: rotateY(0deg) rotateX(0deg) rotateZ(0deg);
    }

    .analytics-mockup-grid[b-1zs8m8c6c4] {
        grid-template-columns: 1fr;
    }
}

@media (min-width: 992px) {
    .product-grid[b-1zs8m8c6c4] {
        grid-template-columns: 1fr 1fr;
        gap: 4rem;
    }

    .product-title[b-1zs8m8c6c4] {
        font-size: 2.5rem;
    }
}
/* /Components/Modals/Inventory/CreateTransferModal.razor.rz.scp.css */
.transfer-arrow-badge[b-d8h1zg9d5s] {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: linear-gradient(135deg, rgba(102, 126, 234, 0.15) 0%, rgba(118, 75, 162, 0.15) 100%);
    color: #667eea;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
}

.table th[b-d8h1zg9d5s] {
    font-weight: 600;
    color: #6c757d;
}

.table td[b-d8h1zg9d5s] {
    vertical-align: middle;
}
/* /Components/Modals/Inventory/InventoryAuditModal.razor.rz.scp.css */
/* ═══════════════════════════════════════════════
   Modal de Auditoría y Conteo Físico
   Colores corporativos Aurocore / Arregly
   ═══════════════════════════════════════════════ */

/* Contenedor principal */
.audit-modal-container[b-c1pogd3l3o] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* ── Barra Superior ── */
.audit-header-bar[b-c1pogd3l3o] {
    background: linear-gradient(135deg,
        rgba(var(--arregly-primary-rgb, 15, 83, 68), 0.05) 0%,
        rgba(var(--arregly-primary-rgb, 15, 83, 68), 0.02) 100%);
    border-bottom: 1px solid rgba(var(--arregly-primary-rgb, 15, 83, 68), 0.1);
    padding: 16px 20px;
}

.audit-header-bar h5[b-c1pogd3l3o] {
    color: var(--arregly-primary, #0f5344);
}

/* Toggle de conteo ciego */
.blind-toggle-label[b-c1pogd3l3o] {
    background: #ffffff;
    border: 1.5px solid #e2e8f0;
    padding: 7px 14px;
    border-radius: 8px;
    transition: all 0.18s ease;
    gap: 8px;
}

.blind-toggle-label:hover[b-c1pogd3l3o] {
    background: rgba(var(--arregly-primary-rgb, 15, 83, 68), 0.04);
    border-color: rgba(var(--arregly-primary-rgb, 15, 83, 68), 0.3);
}

[b-c1pogd3l3o] .audit-search-input .k-textbox {
    border-radius: 8px;
    min-height: 40px;
    border-color: #e2e8f0;
}

[b-c1pogd3l3o] .audit-search-input .k-textbox:focus-within {
    border-color: var(--arregly-primary, #0f5344);
    box-shadow: 0 0 0 3px rgba(var(--arregly-primary-rgb, 15, 83, 68), 0.1);
}

/* ── Tabla de Conteo ── */
.audit-table-wrapper[b-c1pogd3l3o] {
    max-height: 360px;
    overflow-y: auto;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #ffffff;
    margin: 0 20px;
}

.audit-table[b-c1pogd3l3o] {
    border-collapse: collapse;
    width: 100%;
}

.audit-table thead[b-c1pogd3l3o] {
    position: sticky;
    top: 0;
    z-index: 2;
}

.audit-table th[b-c1pogd3l3o] {
    background: linear-gradient(180deg,
        rgba(var(--arregly-primary-rgb, 15, 83, 68), 0.06) 0%,
        rgba(var(--arregly-primary-rgb, 15, 83, 68), 0.03) 100%);
    color: var(--arregly-primary, #0f5344);
    font-size: 0.73rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 11px 14px;
    border-bottom: 2px solid rgba(var(--arregly-primary-rgb, 15, 83, 68), 0.15);
}

.audit-table td[b-c1pogd3l3o] {
    padding: 10px 14px;
    border-bottom: 1px solid #f1f5f9;
    vertical-align: middle;
}

.audit-table-row:last-child td[b-c1pogd3l3o] {
    border-bottom: none;
}

.audit-table-row:hover td[b-c1pogd3l3o] {
    background: rgba(var(--arregly-primary-rgb, 15, 83, 68), 0.02);
}

.font-title[b-c1pogd3l3o] {
    font-size: 0.9rem;
    font-weight: 600;
    line-height: 1.25;
    color: #1e293b;
}

.badge-sku[b-c1pogd3l3o] {
    display: inline-flex;
    align-items: center;
    padding: 1px 7px;
    background: rgba(var(--arregly-primary-rgb, 15, 83, 68), 0.07);
    border: 1px solid rgba(var(--arregly-primary-rgb, 15, 83, 68), 0.18);
    border-radius: 4px;
    font-size: 0.69rem;
    color: var(--arregly-primary, #0f5344);
}

[b-c1pogd3l3o] .audit-numeric-input .k-numerictextbox {
    border-radius: 8px;
    font-size: 0.9rem;
    min-height: 38px;
    border-color: #e2e8f0;
}

[b-c1pogd3l3o] .audit-numeric-input .k-numerictextbox:focus-within {
    border-color: var(--arregly-primary, #0f5344);
    box-shadow: 0 0 0 3px rgba(var(--arregly-primary-rgb, 15, 83, 68), 0.12);
}

/* ── Badges de Discrepancia ── */
.audit-diff-badge[b-c1pogd3l3o] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 600;
}

.audit-diff-badge--match[b-c1pogd3l3o] {
    background: #dcfce7;
    color: #15803d;
    border: 1px solid #bbf7d0;
}

.audit-diff-badge--missing[b-c1pogd3l3o] {
    background: #fee2e2;
    color: #b91c1c;
    border: 1px solid #fecaca;
}

.audit-diff-badge--surplus[b-c1pogd3l3o] {
    background: #dbeafe;
    color: #1d4ed8;
    border: 1px solid #bfdbfe;
}

/* ── Sección de Resumen de Discrepancias ── */
.audit-kpi-summary[b-c1pogd3l3o] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    margin: 0 20px;
}

/* ── Observaciones ── */
.audit-notes-section[b-c1pogd3l3o] {
    padding: 0 20px 4px;
}

.audit-notes-label[b-c1pogd3l3o] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #334155;
    margin-bottom: 6px;
    display: block;
}

[b-c1pogd3l3o] .audit-notes-input .k-textbox {
    border-radius: 8px;
    border-color: #e2e8f0;
    font-size: 0.88rem;
}

/* ── Footer con botones corporativos ── */
.audit-footer[b-c1pogd3l3o] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    width: 100%;
    padding: 0 2px;
}

/* Botones corporativos (mismo sistema que wastage) */
.btn-arregly[b-c1pogd3l3o] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 20px;
    border-radius: 8px;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.18s ease;
    border: 1.5px solid transparent;
    white-space: nowrap;
}

.btn-arregly:disabled[b-c1pogd3l3o] {
    opacity: 0.55;
    cursor: not-allowed;
}

.btn-outline-arregly[b-c1pogd3l3o] {
    background: transparent;
    border-color: #cbd5e1;
    color: #475569;
}

.btn-outline-arregly:hover:not(:disabled)[b-c1pogd3l3o] {
    background: #f8fafc;
    border-color: #94a3b8;
    color: #1e293b;
}

.btn-primary-arregly[b-c1pogd3l3o] {
    background: linear-gradient(135deg,
        var(--arregly-primary, #0f5344),
        color-mix(in srgb, var(--arregly-primary, #0f5344) 80%, black));
    border-color: var(--arregly-primary, #0f5344);
    color: #ffffff;
    box-shadow: 0 2px 8px rgba(var(--arregly-primary-rgb, 15, 83, 68), 0.3);
}

.btn-primary-arregly:hover:not(:disabled)[b-c1pogd3l3o] {
    filter: brightness(1.1);
    box-shadow: 0 4px 14px rgba(var(--arregly-primary-rgb, 15, 83, 68), 0.4);
    transform: translateY(-1px);
}

.btn-primary-arregly:active:not(:disabled)[b-c1pogd3l3o] {
    transform: translateY(0);
    box-shadow: 0 1px 4px rgba(var(--arregly-primary-rgb, 15, 83, 68), 0.3);
}

@media (max-width: 576px) {
    .audit-table th[b-c1pogd3l3o],
    .audit-table td[b-c1pogd3l3o] {
        padding: 8px 10px;
    }

    [b-c1pogd3l3o] .audit-numeric-input .k-numerictextbox {
        font-size: 16px;
        min-height: 44px;
    }
}
/* /Components/Modals/Inventory/InventoryBatchesModal.razor.rz.scp.css */
/* Estado vacío */
.batches-empty-state[b-9dbmy9itr0] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 40px 20px;
    color: #64748b;
    font-size: 0.9rem;
    text-align: center;
}

/* Contenedor principal */
.batches-modal-container[b-9dbmy9itr0] {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 0;
}

/* ── Cabecera del producto ── */
.batches-product-header[b-9dbmy9itr0] {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 16px 20px;
    background: linear-gradient(135deg, rgba(15, 118, 110, 0.08) 0%, rgba(15, 118, 110, 0.02) 100%);
    border-bottom: 1px solid rgba(15, 118, 110, 0.15);
}

.batches-product-icon[b-9dbmy9itr0] {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: rgba(15, 118, 110, 0.12);
    color: #0f766e;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1.2rem;
}

.batches-product-name[b-9dbmy9itr0] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.3;
}

.batches-sku-badge[b-9dbmy9itr0] {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    background: rgba(15, 118, 110, 0.08);
    color: #0f766e;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 600;
}

.batches-product-meta[b-9dbmy9itr0] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
    font-size: 0.8rem;
    color: #64748b;
}

.batches-meta-sep[b-9dbmy9itr0] {
    color: #cbd5e1;
}

/* Glass Card */
.card-glass[b-9dbmy9itr0] {
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(226, 232, 240, 0.8);
    border-radius: 12px;
}

/* Empty State Card */
.empty-state-card[b-9dbmy9itr0] {
    border-color: #e2e8f0 !important;
}
/* /Components/Modals/Inventory/InventoryMovementsModal.razor.rz.scp.css */
/* Contenedor de movimientos */
.movements-container[b-p82iy8zde5] {
    padding: 0;
}

.movements-header-card[b-p82iy8zde5] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px;
    margin-bottom: 16px;
}

.movement-product-icon[b-p82iy8zde5] {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background: rgba(0, 131, 143, 0.1);
    color: #00838f;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    flex-shrink: 0;
}

.movements-kpi-row[b-p82iy8zde5] {
    margin-top: 4px;
}

.movement-kpi-card[b-p82iy8zde5] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 10px 14px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.movement-kpi-label[b-p82iy8zde5] {
    font-size: 0.72rem;
    text-transform: uppercase;
    font-weight: 600;
    color: #64748b;
    letter-spacing: 0.025em;
}

.movement-kpi-value[b-p82iy8zde5] {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2;
}

.movement-kpi-unit[b-p82iy8zde5] {
    font-size: 0.75rem;
    color: #64748b;
    font-weight: 500;
}

.movement-kpi-subtext[b-p82iy8zde5] {
    font-size: 0.7rem;
    color: #94a3b8;
    margin-top: 2px;
    display: block;
}

.movement-kpi-presentation[b-p82iy8zde5] {
    font-size: 0.68rem;
    color: #6366f1;
    font-weight: 600;
    margin-top: 3px;
    display: block;
    background: #f0f0ff;
    border: 1px solid #c7d2fe;
    border-radius: 4px;
    padding: 1px 5px;
    width: fit-content;
}

[b-p82iy8zde5] .movement-date-icon {
    font-size: 0.8rem !important;
    width: 14px !important;
    height: 14px !important;
}

.movement-qty-badge[b-p82iy8zde5] {
    display: inline-flex;
    align-items: center;
    font-weight: 700;
    font-size: 0.82rem;
    padding: 2px 8px;
    border-radius: 6px;
}

.movement-qty-badge--positive[b-p82iy8zde5] {
    background-color: #ecfdf5;
    color: #059669;
    border: 1px solid #a7f3d0;
}

.movement-qty-badge--negative[b-p82iy8zde5] {
    background-color: #fef2f2;
    color: #dc2626;
    border: 1px solid #fecaca;
}

.user-avatar-circle[b-p82iy8zde5] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #e0f2fe;
    color: #0369a1;
    font-weight: 700;
    font-size: 0.7rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid #bae6fd;
}

.user-avatar-circle--system[b-p82iy8zde5] {
    background: #f1f5f9;
    color: #64748b;
    border-color: #cbd5e1;
}

.movement-reason-cell[b-p82iy8zde5] {
    max-width: 280px;
    white-space: normal;
    line-height: 1.35;
}

.movement-reason-text[b-p82iy8zde5] {
    font-size: 0.82rem;
    color: #334155;
    word-break: break-word;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Celda de detalle enriquecida */
.movement-detail-cell[b-p82iy8zde5] {
    max-width: 330px;
    white-space: normal;
    line-height: 1.35;
    padding: 2px 0;
}

.movement-service-pill[b-p82iy8zde5] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: #f0fdf4;
    color: #166534;
    border: 1px solid #bbf7d0;
    border-radius: 9999px;
    padding: 1px 8px;
    font-size: 0.72rem;
    font-weight: 600;
    max-width: 100%;
}

[b-p82iy8zde5] .movement-service-icon {
    font-size: 0.72rem !important;
    width: 12px !important;
    height: 12px !important;
    color: #16a34a !important;
    flex-shrink: 0;
}

.movement-order-tag[b-p82iy8zde5] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    background: #f8fafc;
    color: #475569;
    border: 1px solid #cbd5e1;
    border-radius: 9999px;
    padding: 1px 7px;
    font-size: 0.7rem;
    font-weight: 600;
}

[b-p82iy8zde5] .movement-order-icon {
    font-size: 0.7rem !important;
    width: 11px !important;
    height: 11px !important;
    color: #64748b !important;
    flex-shrink: 0;
}

.movement-action-text[b-p82iy8zde5] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.3;
}

.movement-product-subtext[b-p82iy8zde5] {
    font-size: 0.75rem;
    color: #64748b;
    margin-top: 2px;
}

.movement-product-name[b-p82iy8zde5] {
    font-weight: 500;
    color: #334155;
}

.no-movements[b-p82iy8zde5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    text-align: center;
    color: #64748b;
}

.no-movements svg[b-p82iy8zde5] {
    width: 56px;
    height: 56px;
    margin-bottom: 16px;
    color: #cbd5e1;
}

.no-movements h3[b-p82iy8zde5] {
    font-size: 1.1rem;
    font-weight: 600;
    margin: 0 0 8px 0;
    color: #1e293b;
}

.no-movements p[b-p82iy8zde5] {
    font-size: 0.875rem;
    margin: 0;
    max-width: 420px;
}

@media (max-width: 768px) {
    .movements-header-card[b-p82iy8zde5] {
        padding: 12px;
        margin-bottom: 12px;
    }

    .movement-kpi-card[b-p82iy8zde5] {
        padding: 8px 10px;
    }

    .movement-kpi-value[b-p82iy8zde5] {
        font-size: 1.1rem;
    }
}

/* Badges de Estado y Flujo de Reenvase */
.status-badge--orange[b-p82iy8zde5] {
    background-color: #fff7ed;
    color: #c2410c;
    border: 1px solid #fed7aa;
}

.movement-trf-tag[b-p82iy8zde5] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: #f5f3ff;
    color: #6d28d9;
    border: 1px solid #ddd6fe;
    border-radius: 9999px;
    padding: 1px 7px;
    font-size: 0.7rem;
    font-weight: 600;
}

[b-p82iy8zde5] .movement-trf-icon {
    font-size: 0.7rem !important;
    width: 11px !important;
    height: 11px !important;
    color: #7c3aed !important;
    flex-shrink: 0;
}

.movement-reenvase-box[b-p82iy8zde5] {
    margin-top: 4px;
    padding: 6px 10px;
    border-radius: 6px;
    font-size: 0.8rem;
    line-height: 1.35;
}

.movement-reenvase-box--out[b-p82iy8zde5] {
    background: #fff7ed;
    border: 1px solid #ffedd5;
    border-left: 3px solid #ea580c;
}

.movement-reenvase-box--in[b-p82iy8zde5] {
    background: #f0fdf4;
    border: 1px solid #dcfce7;
    border-left: 3px solid #16a34a;
}

.movement-reenvase-dest[b-p82iy8zde5] {
    margin-top: 3px;
    font-size: 0.75rem;
    color: #475569;
}

.reenvase-arrow[b-p82iy8zde5] {
    color: #ea580c;
    font-weight: 700;
    margin-right: 2px;
}
/* /Components/Modals/Inventory/InventoryPresentationsStockModal.razor.rz.scp.css */
.presentations-stock-container[b-u5xvihmzz4] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

/* ==========================================================================
   Product Summary Card
   ========================================================================== */
.product-summary-card[b-u5xvihmzz4] {
    background: linear-gradient(135deg, #f8fafc 0%, #f0fdf9 100%);
    border: 1px solid rgba(3, 76, 72, 0.18);
    border-radius: 12px;
    padding: 1rem 1.15rem;
    box-shadow: 0 2px 8px rgba(3, 76, 72, 0.04);
}

.product-summary-icon[b-u5xvihmzz4] {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background: rgba(3, 76, 72, 0.12);
    color: #034c48;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    flex-shrink: 0;
}

.product-title[b-u5xvihmzz4] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #0f172a;
}

.product-meta[b-u5xvihmzz4] {
    font-size: 0.8rem;
    color: #64748b;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

/* ==========================================================================
   KPI Mini Cards
   ========================================================================== */
.kpi-mini-card[b-u5xvihmzz4] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.5rem 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.kpi-mini-card.kpi-highlight-teal[b-u5xvihmzz4] {
    background: #f0fdf9;
    border-color: #99f6e4;
}

.kpi-label[b-u5xvihmzz4] {
    font-size: 0.7rem;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    font-weight: 600;
}

.kpi-val[b-u5xvihmzz4] {
    font-size: 0.95rem;
    font-weight: 800;
    font-feature-settings: "tnum";
    font-variant-numeric: tabular-nums;
}

.text-teal-arregly[b-u5xvihmzz4] {
    color: #034c48 !important;
}

/* ==========================================================================
   Grid & Presentations Elements
   ========================================================================== */
.presentations-table-card[b-u5xvihmzz4] {
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #e2e8f0;
}

.presentation-avatar[b-u5xvihmzz4] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: rgba(3, 76, 72, 0.08);
    color: #034c48;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.stock-badge-envasado[b-u5xvihmzz4] {
    display: inline-flex;
    align-items: center;
    background: #f0fdf9;
    color: #042f2e;
    border: 1px solid #5eead4;
    padding: 0.25rem 0.65rem;
    border-radius: 9999px;
    font-size: 0.8rem;
    font-weight: 600;
}

.stock-badge-envasado strong[b-u5xvihmzz4] {
    color: #034c48;
    margin-right: 0.25rem;
}

.stock-badge-envasado :deep(.k-svg-icon)[b-u5xvihmzz4] {
    color: #0d9488;
    width: 14px;
    height: 14px;
}

/* ==========================================================================
   Empty State
   ========================================================================== */
.empty-presentations-card[b-u5xvihmzz4] {
    background: #f8fafc;
    border: 1px dashed #cbd5e1;
    border-radius: 12px;
}

.empty-icon[b-u5xvihmzz4] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #f1f5f9;
    color: #94a3b8;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
}

/* ==========================================================================
   Responsiveness
   ========================================================================== */
@media (max-width: 575.98px) {
    .product-summary-card[b-u5xvihmzz4] {
        padding: 0.75rem;
    }
}
/* /Components/Modals/Inventory/InventoryTransformationModal.razor.rz.scp.css */
/* ==========================================================================
   Modal Header & Container - Calm UX & Zero Horizontal Scroll
   ========================================================================== */
.modal-header-calm[b-ewvw5qavnw] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.modal-title-calm[b-ewvw5qavnw] {
    font-size: 1.15rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.25;
    margin: 0;
}

.modal-subtitle-calm[b-ewvw5qavnw] {
    font-size: 0.8rem;
    color: #64748b;
    font-weight: 400;
}

.transformation-modal-container[b-ewvw5qavnw] {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
}

/* ==========================================================================
   Custom Tailored Skeleton (Wireframe First-Mobile & Identical Height)
   ========================================================================== */
.custom-transformation-skeleton[b-ewvw5qavnw] {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    width: 100%;
    min-height: 440px;
    box-sizing: border-box;
    overflow-x: hidden;
}

.skeleton-selection-grid[b-ewvw5qavnw] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    width: 100%;
}

.skeleton-mode-bar[b-ewvw5qavnw] {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: -0.15rem;
    margin-bottom: 0.15rem;
}

.skeleton-flow[b-ewvw5qavnw] {
    display: flex;
    align-items: stretch;
    gap: 0.5rem;
    width: 100%;
    box-sizing: border-box;
}

.skeleton-card[b-ewvw5qavnw] {
    flex: 1;
    min-width: 0;
    border-radius: 12px;
    padding: 0.9rem 1rem;
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
}

.skeleton-card-source[b-ewvw5qavnw] {
    border: 1px solid #e2e8f0;
    border-left: 3px solid #0f766e;
    background: linear-gradient(180deg, #ffffff 0%, rgba(15, 118, 110, 0.04) 100%);
}

.skeleton-card-target[b-ewvw5qavnw] {
    border: 1px solid #e2e8f0;
    border-left: 3px solid #667eea;
    background: linear-gradient(180deg, #ffffff 0%, rgba(102, 126, 234, 0.04) 100%);
}

.skeleton-connector[b-ewvw5qavnw] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 0.25rem;
    flex-shrink: 0;
}

.skeleton-arrow-circle[b-ewvw5qavnw] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #f8fafc;
    border: 1px solid #cbd5e1;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    font-size: 1.1rem;
    font-weight: 700;
    user-select: none;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}

.skeleton-balance-card[b-ewvw5qavnw] {
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 0.85rem 1.1rem;
    width: 100%;
    box-sizing: border-box;
}

.skeleton-traceability[b-ewvw5qavnw] {
    border-top: 1px solid #e2e8f0;
    padding-top: 0.65rem;
    width: 100%;
}

/* ==========================================================================
   Selection Grid (Sede & Presentación Destino)
   ========================================================================== */
.selection-grid[b-ewvw5qavnw] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.75rem;
    width: 100%;
    box-sizing: border-box;
}

.selection-col[b-ewvw5qavnw] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.form-label-calm[b-ewvw5qavnw] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #475569;
    margin-bottom: 0.3rem;
    display: block;
    letter-spacing: 0.01em;
}

.empty-presentations-hint[b-ewvw5qavnw] {
    font-size: 0.78rem;
    color: #94a3b8;
    padding: 0.5rem 0.75rem;
    background: #f8fafc;
    border: 1px dashed #cbd5e1;
    border-radius: 8px;
}

/* ==========================================================================
   Operation Mode Pill (Fraccionar vs Agrupar)
   ========================================================================== */
.operation-mode-bar[b-ewvw5qavnw] {
    display: flex;
    justify-content: center;
    margin-top: -0.15rem;
    margin-bottom: 0.15rem;
    width: 100%;
}

.mode-pill[b-ewvw5qavnw] {
    display: inline-flex;
    align-items: center;
    padding: 0.28rem 0.85rem;
    border-radius: 9999px;
    font-size: 0.74rem;
    font-weight: 600;
    letter-spacing: 0.01em;
    user-select: none;
    text-align: center;
    max-width: 100%;
    white-space: normal;
    word-break: break-word;
}

.mode-subdivision[b-ewvw5qavnw] {
    background: #ecfdf5;
    color: #065f46;
    border: 1px solid #a7f3d0;
}

.mode-consolidation[b-ewvw5qavnw] {
    background: #eef2ff;
    color: #3730a3;
    border: 1px solid #c7d2fe;
}

.mode-equivalent[b-ewvw5qavnw] {
    background: #f8fafc;
    color: #334155;
    border: 1px solid #e2e8f0;
}

/* ==========================================================================
   Transformation Flow Cards (Origen ➔ Destino)
   ========================================================================== */
.transformation-flow[b-ewvw5qavnw] {
    display: flex;
    align-items: stretch;
    gap: 0.5rem;
    width: 100%;
    box-sizing: border-box;
}

.flow-card[b-ewvw5qavnw] {
    flex: 1;
    min-width: 0;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 0.9rem 1rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
    box-sizing: border-box;
    transition: all 0.2s ease;
}

.flow-card-source[b-ewvw5qavnw] {
    border-left: 3px solid #0f766e;
    background: linear-gradient(180deg, #ffffff 0%, #fafffd 100%);
}

.flow-card-target[b-ewvw5qavnw] {
    border-left: 3px solid #667eea;
    background: linear-gradient(180deg, #ffffff 0%, #fafbff 100%);
}

.flow-card-disabled[b-ewvw5qavnw] {
    background: #f8fafc;
    opacity: 0.85;
}

.flow-card-header[b-ewvw5qavnw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.45rem;
    gap: 0.35rem;
}

.flow-tag[b-ewvw5qavnw] {
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #0f766e;
}

.flow-tag-target[b-ewvw5qavnw] {
    color: #4f46e5;
}

.flow-stock-badge[b-ewvw5qavnw] {
    font-size: 0.74rem;
    color: #475569;
    white-space: nowrap;
}

.flow-theoretical-badge[b-ewvw5qavnw] {
    font-size: 0.72rem;
    color: #059669;
    font-weight: 600;
    background: #ecfdf5;
    border: 1px solid #d1fae5;
    padding: 0.15rem 0.5rem;
    border-radius: 9999px;
    white-space: nowrap;
}

.flow-card-body[b-ewvw5qavnw] {
    flex: 1;
    min-width: 0;
}

.flow-product-name[b-ewvw5qavnw] {
    font-size: 0.96rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.flow-product-meta[b-ewvw5qavnw] {
    font-size: 0.75rem;
    color: #64748b;
    margin-top: 0.15rem;
    line-height: 1.3;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.flow-active-batch-badge[b-ewvw5qavnw] {
    font-size: 0.7rem;
    color: #0f766e;
    background: #f0fdf9;
    border: 1px solid #ccfbf1;
    padding: 0.12rem 0.45rem;
    border-radius: 6px;
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.flow-input-group[b-ewvw5qavnw] {
    margin-top: 0.75rem;
}

.flow-input-label[b-ewvw5qavnw] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #334155;
    margin-bottom: 0.25rem;
    display: block;
}

.flow-empty-state[b-ewvw5qavnw] {
    padding: 1.5rem 0.5rem;
    text-align: center;
    color: #94a3b8;
    font-size: 0.82rem;
}

.flow-card-footer[b-ewvw5qavnw] {
    margin-top: 0.75rem;
    padding-top: 0.5rem;
    border-top: 1px dashed #e2e8f0;
    font-size: 0.78rem;
    color: #475569;
}

/* Conector Central */
.flow-connector[b-ewvw5qavnw] {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 0.25rem;
    flex-shrink: 0;
}

.flow-arrow-circle[b-ewvw5qavnw] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: #f8fafc;
    border: 1px solid #cbd5e1;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #64748b;
    font-size: 1.1rem;
    font-weight: 700;
    user-select: none;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}

/* ==========================================================================
   Calm Balance Card (Resumen Limpio)
   ========================================================================== */
.calm-balance-card[b-ewvw5qavnw] {
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 0.85rem 1.1rem;
    width: 100%;
    box-sizing: border-box;
}

.balance-metrics[b-ewvw5qavnw] {
    display: flex;
    align-items: center;
    justify-content: space-around;
    gap: 0.5rem;
    flex-wrap: wrap;
    width: 100%;
}

.balance-metric[b-ewvw5qavnw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.balance-metric-label[b-ewvw5qavnw] {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
}

.balance-metric-value[b-ewvw5qavnw] {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
}

.unit-text[b-ewvw5qavnw] {
    font-size: 0.74rem;
    font-weight: 500;
    color: #64748b;
}

.text-emerald[b-ewvw5qavnw] {
    color: #059669 !important;
}

.text-teal[b-ewvw5qavnw] {
    color: #0f766e !important;
}

.text-amber[b-ewvw5qavnw] {
    color: #d97706 !important;
}

.balance-divider[b-ewvw5qavnw] {
    color: #cbd5e1;
    font-size: 0.95rem;
    font-weight: 600;
    user-select: none;
}

.balance-actions-row[b-ewvw5qavnw] {
    margin-top: 0.75rem;
    padding-top: 0.65rem;
    border-top: 1px solid #e2e8f0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
    width: 100%;
}

.surplus-switch-group[b-ewvw5qavnw] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex: 1;
    min-width: 200px;
}

.surplus-switch-text[b-ewvw5qavnw] {
    font-size: 0.79rem;
    color: #334155;
    line-height: 1.3;
}

.waste-action-wrapper[b-ewvw5qavnw] {
    display: flex;
    align-items: center;
}

.btn-waste-toggle[b-ewvw5qavnw] {
    background: transparent;
    border: none;
    color: #64748b;
    font-size: 0.75rem;
    text-decoration: underline;
    cursor: pointer;
    padding: 0;
    transition: color 0.15s ease;
}

.btn-waste-toggle:hover[b-ewvw5qavnw] {
    color: #0f172a;
}

.waste-inline-input[b-ewvw5qavnw] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.waste-inline-label[b-ewvw5qavnw] {
    font-size: 0.75rem;
    color: #475569;
    font-weight: 500;
}

.btn-cancel-waste[b-ewvw5qavnw] {
    background: transparent;
    border: none;
    color: #94a3b8;
    font-size: 0.85rem;
    font-weight: 700;
    cursor: pointer;
    padding: 0 0.3rem;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: color 0.15s ease;
}

.btn-cancel-waste:hover[b-ewvw5qavnw] {
    color: #ef4444;
}

/* ==========================================================================
   Alertas Calmas
   ========================================================================== */
.calm-alert[b-ewvw5qavnw] {
    padding: 0.65rem 0.9rem;
    border-radius: 8px;
    font-size: 0.82rem;
    line-height: 1.4;
    width: 100%;
    box-sizing: border-box;
}

.calm-alert-danger[b-ewvw5qavnw] {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
}

.calm-alert-warning[b-ewvw5qavnw] {
    background: #fffbeb;
    border: 1px solid #fde68a;
    color: #92400e;
}

.calm-alert-info[b-ewvw5qavnw] {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    color: #166534;
}

.btn-calm-action[b-ewvw5qavnw] {
    background: #ffffff;
    border: 1px solid #16a34a;
    color: #15803d;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 0.28rem 0.7rem;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.btn-calm-action:hover[b-ewvw5qavnw] {
    background: #dcfce7;
    border-color: #15803d;
}

/* ==========================================================================
   Trazabilidad, Lotes & Vencimiento
   ========================================================================== */
.traceability-section[b-ewvw5qavnw] {
    border-top: 1px solid #e2e8f0;
    padding-top: 0.65rem;
    width: 100%;
    box-sizing: border-box;
}

.traceability-toggle-btn[b-ewvw5qavnw] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    background: transparent;
    border: none;
    font-size: 0.78rem;
    font-weight: 600;
    color: #64748b;
    cursor: pointer;
    padding: 0.2rem 0;
    transition: color 0.15s ease;
}

.traceability-toggle-btn:hover[b-ewvw5qavnw] {
    color: #0f172a;
}

.chevron-icon[b-ewvw5qavnw] {
    font-size: 0.85rem;
}

.traceability-content[b-ewvw5qavnw] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.75rem;
    width: 100%;
    box-sizing: border-box;
}

.batch-selector-box[b-ewvw5qavnw] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.6rem;
}

.empty-batches-hint[b-ewvw5qavnw] {
    font-size: 0.76rem;
    color: #94a3b8;
    background: #f1f5f9;
    border-radius: 6px;
    padding: 0.4rem 0.65rem;
}

.copy-batch-link[b-ewvw5qavnw] {
    font-size: 0.74rem;
    color: #0f766e !important;
}

.copy-batch-link:hover[b-ewvw5qavnw] {
    text-decoration: underline !important;
}

/* Prevenir overflow en rows */
.traceability-content[b-ewvw5qavnw]  .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
}

/* ==========================================================================
   Footer Actions
   ========================================================================== */
.modal-footer-actions[b-ewvw5qavnw] {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
    width: 100%;
}

/* ==========================================================================
   Controles Telerik adaptados
   ========================================================================== */
[b-ewvw5qavnw] .textbox-arregly,
[b-ewvw5qavnw] .dropdownlist-arregly {
    border-radius: 8px !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

[b-ewvw5qavnw] .switch-arregly.k-switch-on .k-switch-track,
[b-ewvw5qavnw] .k-switch-on .k-switch-track {
    background-color: #0f766e !important;
    border-color: #0f766e !important;
}

[b-ewvw5qavnw] .switch-arregly.k-switch-off .k-switch-track,
[b-ewvw5qavnw] .k-switch-off .k-switch-track {
    background-color: #e2e8f0 !important;
    border-color: #cbd5e1 !important;
}

[b-ewvw5qavnw] .switch-arregly .k-switch-thumb {
    background-color: #ffffff !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) !important;
}

[b-ewvw5qavnw] .readonly-input .k-input-inner,
[b-ewvw5qavnw] .k-disabled .k-input-inner {
    background-color: #f1f5f9 !important;
    color: #475569 !important;
    cursor: not-allowed !important;
}

/* ==========================================================================
   Mobile-First Responsiveness (First-Mobile)
   ========================================================================== */
@media (max-width: 767.98px) {
    .selection-grid[b-ewvw5qavnw],
    .skeleton-selection-grid[b-ewvw5qavnw] {
        grid-template-columns: 1fr;
    }

    .transformation-flow[b-ewvw5qavnw],
    .skeleton-flow[b-ewvw5qavnw] {
        flex-direction: column;
    }

    .flow-connector[b-ewvw5qavnw],
    .skeleton-connector[b-ewvw5qavnw] {
        padding: 0.25rem 0;
    }

    .flow-arrow-circle[b-ewvw5qavnw],
    .skeleton-arrow-circle[b-ewvw5qavnw] {
        transform: rotate(90deg);
    }

    .balance-metrics[b-ewvw5qavnw] {
        flex-direction: column;
        gap: 0.5rem;
    }

    .balance-divider[b-ewvw5qavnw] {
        display: none;
    }

    .balance-actions-row[b-ewvw5qavnw] {
        flex-direction: column;
        align-items: flex-start;
    }

    .surplus-switch-group[b-ewvw5qavnw] {
        width: 100%;
    }

    .modal-footer-actions[b-ewvw5qavnw] {
        flex-direction: column;
    }

    .modal-footer-actions :deep(.k-button)[b-ewvw5qavnw] {
        width: 100% !important;
    }
}
/* /Components/Modals/Inventory/InventoryWastageModal.razor.rz.scp.css */
/* ═══════════════════════════════════════════════
   MODAL DE REGISTRO DE MERMA / BAJA DE INVENTARIO
   Estándar de Diseño Aurocore - Mobile First
   ═══════════════════════════════════════════════ */

.wastage-modal-container[b-vt0aes4jhw] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

/* ── Ficha Resumen del Producto ── */
.wastage-product-card[b-vt0aes4jhw] {
    background: #f8fafc;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px;
}

.wastage-product-icon[b-vt0aes4jhw] {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background: rgba(3, 76, 72, 0.1);
    color: var(--primary-color, #034C48);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.wastage-sku-badge[b-vt0aes4jhw] {
    display: inline-flex;
    align-items: center;
    padding: 2px 7px;
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    font-size: 0.75rem;
    color: #0f172a;
    font-weight: 600;
}

/* ── Simulador Matemático de Proyección ── */
.wastage-preview-strip[b-vt0aes4jhw] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
}

.preview-col[b-vt0aes4jhw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    flex: 1;
}

.preview-title[b-vt0aes4jhw] {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
}

.preview-number[b-vt0aes4jhw] {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2;
}

.preview-number--current[b-vt0aes4jhw] {
    color: #0f172a;
}

.preview-number--waste[b-vt0aes4jhw] {
    color: #dc2626 !important;
}

.preview-number--result[b-vt0aes4jhw] {
    font-weight: 800;
}

.preview-unit[b-vt0aes4jhw] {
    font-size: 0.72rem;
    color: #94a3b8;
}

.preview-op[b-vt0aes4jhw] {
    width: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    user-select: none;
}

/* ── Formulario ── */
.wastage-form[b-vt0aes4jhw] {
    border-radius: 14px !important;
    border: 1px solid #e2e8f0 !important;
}

.wastage-error-banner[b-vt0aes4jhw] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 10px;
    color: #991b1b;
    font-size: 0.82rem;
    font-weight: 500;
}

/* ── Botones & Accesibilidad ── */
.btn-danger-arregly[b-vt0aes4jhw] {
    background: #dc2626 !important;
    border: 1px solid #dc2626 !important;
    color: #ffffff !important;
    font-weight: 600;
    border-radius: 8px;
    min-height: 44px;
    transition: all 0.2s ease;
}

.btn-danger-arregly:hover:not(:disabled)[b-vt0aes4jhw] {
    background: #b91c1c !important;
    border-color: #b91c1c !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(220, 38, 38, 0.25);
}

.btn-outline-secondary[b-vt0aes4jhw] {
    min-height: 44px;
    border-radius: 8px;
    font-weight: 500;
}

/* ── Mobile First ── */
@media (max-width: 576px) {
    .preview-number[b-vt0aes4jhw] {
        font-size: 1.05rem;
    }
    
    .preview-title[b-vt0aes4jhw] {
        font-size: 0.65rem;
    }

    .preview-op[b-vt0aes4jhw] {
        font-size: 1.1rem !important;
        width: 20px;
    }
}
/* /Components/Modals/Inventory/ProductKitModal.razor.rz.scp.css */
/* ══════════════════════════════════════════════════════
   Modal de Kits / Combos Comerciales (Aurocore Design System)
   UX Didáctica, BOM Liviano, Estilos Scoped CSS
   ══════════════════════════════════════════════════════ */

.kit-modal-container[b-fxjk0cjw60] {
    display: flex;
    flex-direction: column;
    gap: 1.15rem;
    padding: 0.25rem;
}

/* ── Callout Explicativo Calm UI ── */
.kit-info-callout[b-fxjk0cjw60] {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 0.85rem 1rem;
    color: #475569;
}

.kit-info-callout-icon[b-fxjk0cjw60] {
    font-size: 1.25rem;
    margin-top: 1px;
    flex-shrink: 0;
    color: var(--primary-color, #034C48);
}

.kit-info-callout-text[b-fxjk0cjw60] {
    font-size: 0.82rem;
    line-height: 1.45;
    color: #475569;
}

.kit-info-callout-text strong[b-fxjk0cjw60] {
    display: block;
    font-weight: 700;
    margin-bottom: 2px;
    color: #0f172a;
}

/* ── Secciones Visuales ── */
.kit-section[b-fxjk0cjw60] {
    background: #ffffff;
    border: 1px solid rgba(226, 232, 240, 0.9);
    border-radius: 12px;
    padding: 1.15rem;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.03);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.kit-section:hover[b-fxjk0cjw60] {
    border-color: rgba(203, 213, 225, 1);
}

.kit-section--bom[b-fxjk0cjw60] {
    background: #ffffff;
    border: 1px solid rgba(226, 232, 240, 0.9);
}

.kit-section-header[b-fxjk0cjw60] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px dashed #e2e8f0;
}

.kit-section-title[b-fxjk0cjw60] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.92rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
}

.kit-section-title-icon[b-fxjk0cjw60] {
    color: #0f766e;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.kit-section-step[b-fxjk0cjw60] {
    background: #f1f5f9;
    color: #475569;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.badge-item-count[b-fxjk0cjw60] {
    background: #e0f2fe;
    color: #0369a1;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 2px 10px;
    border-radius: 999px;
}

/* ── Labels & Ayudas ── */
.kit-label[b-fxjk0cjw60] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 0.83rem;
    font-weight: 600;
    color: #334155;
    margin-bottom: 0.35rem;
}

.kit-hint[b-fxjk0cjw60] {
    display: block;
    font-size: 0.74rem;
    color: #64748b;
    margin-top: 0.25rem;
    line-height: 1.35;
}

/* ── Dropdown Item de Producto Comercial ── */
.kit-product-dropdown-item[b-fxjk0cjw60] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 4px 0;
}

.kit-product-dropdown-info[b-fxjk0cjw60] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.kit-product-name[b-fxjk0cjw60] {
    font-weight: 600;
    font-size: 0.86rem;
    color: #1e293b;
}

.kit-product-meta[b-fxjk0cjw60] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.badge-sku[b-fxjk0cjw60] {
    font-size: 0.72rem;
    background: #f1f5f9;
    color: #475569;
    padding: 1px 6px;
    border-radius: 4px;
    font-family: monospace;
}

.badge-branch[b-fxjk0cjw60] {
    font-size: 0.72rem;
    background: #e0f2fe;
    color: #0369a1;
    padding: 1px 6px;
    border-radius: 4px;
}

.kit-product-dropdown-price[b-fxjk0cjw60] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.kit-price-label[b-fxjk0cjw60] {
    font-size: 0.68rem;
    color: #94a3b8;
    text-transform: uppercase;
}

.kit-price-val[b-fxjk0cjw60] {
    font-weight: 700;
    font-size: 0.88rem;
    color: #0f766e;
}

/* ── Switch Card ── */
.kit-switch-card[b-fxjk0cjw60] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
}

.kit-switch-info[b-fxjk0cjw60] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.kit-switch-title[b-fxjk0cjw60] {
    font-size: 0.85rem;
    font-weight: 700;
    color: #1e293b;
}

.kit-switch-desc[b-fxjk0cjw60] {
    font-size: 0.76rem;
    color: #64748b;
    max-width: 600px;
}

/* ── Reset Switch Labels (Anti-Overflow Telerik 2024+) ── */
[b-fxjk0cjw60] .switch-arregly.k-switch {
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    height: 26px !important;
    overflow: hidden !important;
}

[b-fxjk0cjw60] .switch-arregly .k-switch-label-on,
[b-fxjk0cjw60] .switch-arregly .k-switch-label-off {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    font-size: 0 !important;
    opacity: 0 !important;
}

/* ── Barra de Agregar Insumos ── */
.kit-add-bar[b-fxjk0cjw60] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
}

/* ── Empty State BOM ── */
.kit-empty-bom[b-fxjk0cjw60] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2rem 1rem;
    background: #ffffff;
    border: 1px dashed #cbd5e1;
    border-radius: 8px;
    text-align: center;
}

.kit-empty-bom-text[b-fxjk0cjw60] {
    font-size: 0.88rem;
    font-weight: 600;
    color: #475569;
}

.kit-empty-bom-sub[b-fxjk0cjw60] {
    font-size: 0.78rem;
    color: #94a3b8;
    margin-top: 2px;
}

/* ── Tabla de Insumos BOM ── */
.kit-bom-table-wrapper[b-fxjk0cjw60] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    overflow: hidden;
}

.kit-bom-table[b-fxjk0cjw60] {
    margin: 0;
    font-size: 0.84rem;
}

.kit-bom-table thead[b-fxjk0cjw60] {
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}

.kit-bom-table th[b-fxjk0cjw60] {
    font-size: 0.74rem;
    text-transform: uppercase;
    font-weight: 700;
    color: #475569;
    padding: 0.65rem 0.85rem;
    letter-spacing: 0.03em;
}

.kit-bom-table td[b-fxjk0cjw60] {
    padding: 0.65rem 0.85rem;
    border-bottom: 1px solid #f1f5f9;
}

.kit-item-cell[b-fxjk0cjw60] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.kit-item-name[b-fxjk0cjw60] {
    font-weight: 600;
    color: #1e293b;
}

.kit-item-sku[b-fxjk0cjw60] {
    font-size: 0.72rem;
    color: #64748b;
    font-family: monospace;
}

.badge-qty[b-fxjk0cjw60] {
    background: #f0fdf4;
    color: #166534;
    font-weight: 700;
    font-size: 0.78rem;
    padding: 3px 8px;
    border-radius: 6px;
    border: 1px solid #bbf7d0;
}

.btn-icon-danger[b-fxjk0cjw60] {
    background: transparent !important;
    border: none !important;
    color: #ef4444 !important;
    padding: 4px 6px !important;
    border-radius: 6px !important;
    transition: background 0.15s ease !important;
}

.btn-icon-danger:hover[b-fxjk0cjw60] {
    background: #fee2e2 !important;
    color: #dc2626 !important;
}

/* ── Resumen de Costos y Margen Bruto ── */
.kit-summary-card[b-fxjk0cjw60] {
    display: flex;
    align-items: center;
    justify-content: space-around;
    background: #ffffff;
    border: 1.5px solid #0f766e;
    border-radius: 12px;
    padding: 1rem;
    box-shadow: 0 4px 12px rgba(15, 118, 110, 0.08);
}

.kit-summary-item[b-fxjk0cjw60] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    text-align: center;
}

.kit-summary-label[b-fxjk0cjw60] {
    font-size: 0.72rem;
    text-transform: uppercase;
    font-weight: 700;
    color: #64748b;
    letter-spacing: 0.03em;
}

.kit-summary-value[b-fxjk0cjw60] {
    font-size: 1.05rem;
    font-weight: 800;
}

.kit-margin-pct[b-fxjk0cjw60] {
    font-size: 0.8rem;
    font-weight: 600;
}

.kit-summary-divider[b-fxjk0cjw60] {
    width: 1px;
    height: 36px;
    background: #e2e8f0;
}

/* ── Mobile ── */
@media (max-width: 768px) {
    .kit-summary-card[b-fxjk0cjw60] {
        flex-direction: column;
        gap: 0.75rem;
        align-items: stretch;
    }

    .kit-summary-divider[b-fxjk0cjw60] {
        width: 100%;
        height: 1px;
    }

    .kit-summary-item[b-fxjk0cjw60] {
        flex-direction: row;
        justify-content: space-between;
    }
}
/* /Components/Modals/Inventory/PromotionModal.razor.rz.scp.css */
/* ══════════════════════════════════════════════════════
   Modal de Promociones Comerciales (Aurocore Design System)
   Colores corporativos, Glassmorphism, Micro-detalles UX
   ══════════════════════════════════════════════════════ */

.promo-modal-container[b-yerysqnwcg] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    padding: 0.25rem;
}

/* ── Encabezado Sub-info ── */
.promo-header-subtitle[b-yerysqnwcg] {
    font-size: 0.82rem;
    color: #64748b;
    margin: -0.25rem 0 0.5rem 0;
    line-height: 1.4;
}

/* ── Secciones Visuales ── */
.promo-section[b-yerysqnwcg] {
    background: #ffffff;
    border: 1px solid rgba(226, 232, 240, 0.9);
    border-radius: 12px;
    padding: 1.15rem;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.03);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.promo-section:hover[b-yerysqnwcg] {
    border-color: rgba(203, 213, 225, 1);
}

.promo-section--highlight[b-yerysqnwcg] {
    background: #ffffff;
    border: 1px solid rgba(226, 232, 240, 0.9);
}

.promo-section-header[b-yerysqnwcg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px dashed #e2e8f0;
}

.promo-section-title[b-yerysqnwcg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.92rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
}

.promo-section-title-icon[b-yerysqnwcg] {
    color: #0f766e;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.promo-section-step[b-yerysqnwcg] {
    background: #f1f5f9;
    color: #475569;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

/* ── Labels & Ayudas ── */
.promo-label[b-yerysqnwcg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 0.83rem;
    font-weight: 600;
    color: #334155;
    margin-bottom: 0.35rem;
}

.promo-hint[b-yerysqnwcg] {
    display: block;
    font-size: 0.74rem;
    color: #64748b;
    margin-top: 0.25rem;
    line-height: 1.35;
}

/* ── Dropdown Item Templates ── */
.promo-dropdown-item[b-yerysqnwcg] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.4rem 0.2rem;
}

.promo-dropdown-icon[b-yerysqnwcg] {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: #f0fdf4;
    color: #0f766e;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.promo-dropdown-content[b-yerysqnwcg] {
    flex: 1;
    min-width: 0;
}

.promo-dropdown-title[b-yerysqnwcg] {
    font-size: 0.88rem;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.25;
}

.promo-dropdown-desc[b-yerysqnwcg] {
    font-size: 0.74rem;
    color: #64748b;
    margin-top: 2px;
}

.promo-dropdown-badge[b-yerysqnwcg] {
    font-size: 0.7rem;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 6px;
    background: #f1f5f9;
    color: #475569;
    white-space: nowrap;
}

/* ── Tarjeta de Previsualización en Vivo (Live Simulator) ── */
.promo-preview-card[b-yerysqnwcg] {
    background: linear-gradient(135deg, rgba(15, 118, 110, 0.05) 0%, rgba(255, 255, 255, 0.95) 50%, rgba(99, 102, 241, 0.04) 100%);
    border: 1.5px solid rgba(15, 118, 110, 0.3);
    border-radius: 12px;
    padding: 1rem 1.15rem;
    margin-top: 0.85rem;
    box-shadow: 0 4px 15px rgba(15, 118, 110, 0.06);
    position: relative;
    overflow: hidden;
}

.promo-preview-card[b-yerysqnwcg]::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background: linear-gradient(180deg, #0f766e 0%, #0d9488 100%);
}

.promo-preview-header[b-yerysqnwcg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}

.promo-preview-tag[b-yerysqnwcg] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #0f766e;
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.promo-preview-badge[b-yerysqnwcg] {
    background: #0f766e;
    color: #ffffff;
    font-size: 0.8rem;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 8px;
    box-shadow: 0 2px 6px rgba(15, 118, 110, 0.25);
}

.promo-preview-narrative[b-yerysqnwcg] {
    font-size: 0.88rem;
    font-weight: 500;
    color: #1e293b;
    line-height: 1.45;
    margin: 0 0 0.75rem 0;
}

.promo-preview-chips[b-yerysqnwcg] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.promo-chip[b-yerysqnwcg] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.73rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 6px;
    border: 1px solid transparent;
}

.promo-chip--active[b-yerysqnwcg] {
    background: #dcfce7;
    color: #15803d;
    border-color: #bbf7d0;
}

.promo-chip--inactive[b-yerysqnwcg] {
    background: #f1f5f9;
    color: #64748b;
    border-color: #e2e8f0;
}

.promo-chip--stackable[b-yerysqnwcg] {
    background: #e0f2fe;
    color: #0369a1;
    border-color: #bae6fd;
}

.promo-chip--exclusive[b-yerysqnwcg] {
    background: #fef3c7;
    color: #b45309;
    border-color: #fde68a;
}

/* ── Tarjetas Toggle Modernas (Switches) ── */
.toggle-card[b-yerysqnwcg] {
    background: #f8fafc;
    border: 1.5px solid #e2e8f0;
    border-radius: 12px;
    padding: 0.85rem 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    transition: all 0.2s ease;
    cursor: default;
    height: 100%;
}

.toggle-card:hover[b-yerysqnwcg] {
    border-color: #cbd5e1;
    background: #ffffff;
}

.toggle-card--active[b-yerysqnwcg] {
    background: #ffffff;
    border-color: #0f766e;
    box-shadow: 0 3px 12px rgba(15, 118, 110, 0.08);
}

.toggle-card-content[b-yerysqnwcg] {
    flex: 1;
    min-width: 0;
}

.toggle-card-header[b-yerysqnwcg] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.2rem;
}

.toggle-card-title[b-yerysqnwcg] {
    font-size: 0.88rem;
    font-weight: 700;
    color: #0f172a;
}

.toggle-card-badge[b-yerysqnwcg] {
    font-size: 0.68rem;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 4px;
    text-transform: uppercase;
}

.toggle-card-badge--on[b-yerysqnwcg] {
    background: #dcfce7;
    color: #15803d;
}

.toggle-card-badge--off[b-yerysqnwcg] {
    background: #f1f5f9;
    color: #64748b;
}

.toggle-card-badge--info[b-yerysqnwcg] {
    background: #e0f2fe;
    color: #0284c7;
}

.toggle-card-desc[b-yerysqnwcg] {
    font-size: 0.74rem;
    color: #64748b;
    margin: 0;
    line-height: 1.35;
}

.toggle-card-switch[b-yerysqnwcg] {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* ── Custom Scoped Telerik Switch (Anti-Overflow / Sin Texto Leakeado) ── */
[b-yerysqnwcg] .switch-arregly.k-switch {
    width: 52px !important;
    height: 28px !important;
    border-radius: 999px !important;
    padding: 3px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    cursor: pointer !important;
    vertical-align: middle !important;
    border: none !important;
    background: transparent !important;
}

[b-yerysqnwcg] .switch-arregly .k-switch-track {
    border-radius: 999px !important;
    background-color: #cbd5e1 !important;
    border: 1.5px solid #94a3b8 !important;
    transition: background-color 0.25s ease, border-color 0.25s ease !important;
    width: 100% !important;
    height: 100% !important;
}

[b-yerysqnwcg] .switch-arregly.k-switch-on .k-switch-track {
    background-color: #0f766e !important;
    border-color: #0f766e !important;
}

[b-yerysqnwcg] .switch-arregly .k-switch-thumb {
    width: 20px !important;
    height: 20px !important;
    border-radius: 50% !important;
    background-color: #ffffff !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !important;
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* Prohibición absoluta de textos desbordados internos en el switch */
[b-yerysqnwcg] .switch-arregly .k-switch-label-on,
[b-yerysqnwcg] .switch-arregly .k-switch-label-off {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
}

/* ── Adaptaciones de Controles Telerik al Design System ── */
[b-yerysqnwcg] .textbox-arregly .k-input-inner,
[b-yerysqnwcg] .picker-arregly .k-input-inner {
    font-size: 0.88rem !important;
    font-family: inherit !important;
}

[b-yerysqnwcg] .k-input-solid:focus-within {
    border-color: #0f766e !important;
    box-shadow: 0 0 0 3px rgba(15, 118, 110, 0.12) !important;
}

/* ── Footer ── */
.promo-modal-footer[b-yerysqnwcg] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

@media (max-width: 768px) {
    .promo-modal-container[b-yerysqnwcg] {
        padding: 0;
    }
    
    .promo-section[b-yerysqnwcg] {
        padding: 0.85rem;
    }

    .toggle-card[b-yerysqnwcg] {
        padding: 0.75rem;
    }

    [b-yerysqnwcg] .k-input-inner {
        font-size: 16px !important;
        min-height: 42px !important;
    }
}
/* /Components/Modals/Inventory/ReceiveTransferModal.razor.rz.scp.css */
.table th[b-pzacu8uvni] {
    font-weight: 600;
    color: #6c757d;
}

.table td[b-pzacu8uvni] {
    vertical-align: middle;
}
/* /Components/Modals/Inventory/StockInflowModal.razor.rz.scp.css */
.inflow-product-card[b-zgqvdjgb5v] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px;
}

.inflow-icon-box[b-zgqvdjgb5v] {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background: #e6f4f2;
    color: var(--primary-color, #034C48);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.inflow-sku-pill[b-zgqvdjgb5v] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #475569;
    background: #f1f5f9;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    padding: 2px 7px;
}

.inflow-preview-strip[b-zgqvdjgb5v] {
    background: linear-gradient(135deg, #f0fdf4 0%, #f8fafc 100%);
    border: 1px solid #bbf7d0;
    border-radius: 12px;
}

.preview-col[b-zgqvdjgb5v] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.preview-title[b-zgqvdjgb5v] {
    font-size: 0.70rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 600;
    margin-bottom: 2px;
}

.preview-number[b-zgqvdjgb5v] {
    font-size: 1.35rem;
    font-weight: 700;
    line-height: 1.2;
}

.preview-number--current[b-zgqvdjgb5v] {
    color: #334155;
}

.preview-number--in[b-zgqvdjgb5v] {
    color: #16a34a;
}

.preview-number--result[b-zgqvdjgb5v] {
    color: #0f172a;
}

.preview-unit[b-zgqvdjgb5v] {
    font-size: 0.72rem;
    color: #64748b;
    font-weight: 500;
}

.preview-op[b-zgqvdjgb5v] {
    width: 32px;
    line-height: 1;
    user-select: none;
}

.form-help-text[b-zgqvdjgb5v] {
    font-size: 0.73rem;
    color: #64748b;
    margin-top: 3px;
    display: block;
}
/* /Components/Modals/Inventory/SupplierStockInflowModal.razor.rz.scp.css */
.supplier-inflow-container[b-cignli5joy] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.supplier-inflow-card[b-cignli5joy] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    padding: 1rem 1.25rem;
}

.supplier-add-product-bar[b-cignli5joy] {
    background-color: #ffffff;
    border: 1px solid #e0e7ff;
    border-radius: 0.75rem;
    padding: 0.75rem 1rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
}

.supplier-batch-assistant-bar[b-cignli5joy] {
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    border: 1px dashed #cbd5e1;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.02);
}

.supplier-empty-state[b-cignli5joy] {
    text-align: center;
    padding: 3rem 1.5rem;
    background-color: #f8fafc;
    border: 1.5px dashed #cbd5e1;
    border-radius: 0.75rem;
}

.supplier-empty-state-icon[b-cignli5joy] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background-color: #e0e7ff;
    color: #4f46e5;
    font-size: 1.5rem;
    margin-bottom: 0.5rem;
}

.supplier-table-wrapper[b-cignli5joy] {
    max-height: 380px;
    background: #ffffff;
}

.supplier-inflow-table thead th[b-cignli5joy] {
    background-color: #f8fafc !important;
    color: #475569;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 0.65rem 0.75rem;
    border-bottom: 1px solid #e2e8f0;
}

.supplier-inflow-table tbody td[b-cignli5joy] {
    padding: 0.6rem 0.75rem;
    font-size: 0.85rem;
    border-bottom: 1px solid #f1f5f9;
}

.supplier-inflow-table tr.table-row--active[b-cignli5joy] {
    background-color: #f5f7ff !important;
}

.inventory-sku-pill[b-cignli5joy] {
    display: inline-block;
    padding: 0.1rem 0.45rem;
    background-color: #f1f5f9;
    color: #475569;
    border-radius: 0.25rem;
    border: 1px solid #e2e8f0;
}

.supplier-summary-bar[b-cignli5joy] {
    background: linear-gradient(135deg, #f8fafc 0%, #edf2f7 100%);
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    padding: 0.85rem 1.25rem;
}

.summary-stat[b-cignli5joy] {
    display: flex;
    flex-direction: column;
}

@media (min-width: 576px) {
    .summary-stat[b-cignli5joy] {
        flex-direction: row;
        align-items: baseline;
        gap: 0.35rem;
    }
}

.summary-stat-label[b-cignli5joy] {
    font-size: 0.75rem;
    color: #64748b;
    font-weight: 500;
}

.summary-stat-value[b-cignli5joy] {
    font-size: 0.95rem;
    font-weight: 700;
}
/* /Components/Modals/Inventory/TransferDetailModal.razor.rz.scp.css */
.step-item[b-t1ulzovnqb] {
    z-index: 2;
    min-width: 80px;
}

.step-icon[b-t1ulzovnqb] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    margin: 0 auto 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.95rem;
    transition: all 0.3s ease;
}

.step-completed[b-t1ulzovnqb] {
    background: #667eea;
    color: #fff;
    box-shadow: 0 2px 8px rgba(102, 126, 234, 0.35);
}

.step-pending[b-t1ulzovnqb] {
    background: #e9ecef;
    color: #adb5bd;
}

.step-cancelled[b-t1ulzovnqb] {
    background: #dc3545;
    color: #fff;
}

.step-title[b-t1ulzovnqb] {
    display: block;
    font-size: 0.78rem;
    font-weight: 600;
    color: #212529;
}

.step-date[b-t1ulzovnqb] {
    display: block;
    font-size: 0.68rem;
    color: #6c757d;
}

.step-line[b-t1ulzovnqb] {
    flex-grow: 1;
    height: 3px;
    background: #e9ecef;
    margin: 0 10px;
    margin-bottom: 22px;
    z-index: 1;
}

.step-line.line-active[b-t1ulzovnqb] {
    background: #667eea;
}

.table th[b-t1ulzovnqb] {
    font-weight: 600;
    color: #6c757d;
}

.table td[b-t1ulzovnqb] {
    vertical-align: middle;
}

.signature-line[b-t1ulzovnqb] {
    width: 80%;
    margin: 0 auto;
    border-bottom: 1.5px dashed #6c757d;
    height: 38px;
}

@media print {
    .modal-actions-bar[b-t1ulzovnqb] {
        display: none !important;
    }

    .dispatch-signatures-container[b-t1ulzovnqb] {
        page-break-inside: avoid;
        margin-top: 40px !important;
    }
}
/* /Components/Modals/Inventory/WarehouseLocationModal.razor.rz.scp.css */
.warehouse-modal-content[b-9wudgvg604] {
    font-family: 'Poppins', sans-serif;
}

.switch-arregly[b-9wudgvg604] {
    transform: scale(0.9);
}

.type-card[b-9wudgvg604] {
    cursor: pointer;
    border: 1.5px solid #e2e8f0;
    border-radius: 10px;
    padding: 9px 11px;
    background-color: #ffffff;
    transition: all 0.18s ease-in-out;
    position: relative;
    user-select: none;
    height: 100%;
}

.type-card:hover[b-9wudgvg604] {
    border-color: #cbd5e1;
    background-color: #f8fafc;
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
}

.type-card.selected[b-9wudgvg604] {
    border-color: #667eea;
    background-color: #f6f8ff;
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.12);
}

.type-card-icon[b-9wudgvg604] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.type-card-title[b-9wudgvg604] {
    font-size: 0.81rem;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.2;
}

.type-card-subtitle[b-9wudgvg604] {
    font-size: 0.70rem;
    color: #64748b;
    margin-top: 2px;
    line-height: 1.2;
}

.type-check-badge[b-9wudgvg604] {
    background-color: #667eea;
    color: #ffffff;
    width: 17px;
    height: 17px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.custom-type-container[b-9wudgvg604] {
    background-color: #f8fafc;
    border-color: #e2e8f0;
}

.btn-suggestion-telerik[b-9wudgvg604] {
    border: 1px solid #e2e8f0 !important;
    background-color: #ffffff !important;
    color: #475569 !important;
    border-radius: 20px !important;
    padding: 3px 10px !important;
    font-size: 0.72rem !important;
    font-weight: 500 !important;
    cursor: pointer;
    transition: all 0.15s ease-in-out !important;
    user-select: none;
    display: inline-flex !important;
    align-items: center !important;
}

.btn-suggestion-telerik:hover[b-9wudgvg604] {
    background-color: #eef2ff !important;
    border-color: #c7d2fe !important;
    color: #4338ca !important;
}

.btn-suggestion-telerik.active[b-9wudgvg604] {
    background-color: #667eea !important;
    border-color: #667eea !important;
    color: #ffffff !important;
    box-shadow: 0 2px 5px rgba(102, 126, 234, 0.3) !important;
}
/* /Components/Modals/Inventory/WarehouseLocationMovementsModal.razor.rz.scp.css */
.warehouse-kardex-modal[b-0nih1kdjnj] {
    min-height: 480px;
}

.kpi-metric-box[b-0nih1kdjnj] {
    background: #ffffff;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.kpi-metric-box:hover[b-0nih1kdjnj] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.kpi-label[b-0nih1kdjnj] {
    font-size: 0.74rem;
    letter-spacing: 0.02em;
    display: block;
}

.kpi-val[b-0nih1kdjnj] {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.1;
}

.kpi-sub[b-0nih1kdjnj] {
    font-size: 0.7rem;
    display: block;
    margin-top: 2px;
}

.filter-label[b-0nih1kdjnj] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #475569;
    margin-bottom: 3px;
}

.dropdown-arregly-select[b-0nih1kdjnj] {
    border-radius: 8px;
    border-color: #cbd5e1;
    font-size: 0.82rem;
    height: 38px;
}

.kardex-type-badge[b-0nih1kdjnj] {
    display: inline-flex;
    align-items: center;
    font-size: 0.74rem;
    font-weight: 600;
    border-radius: 20px;
    padding: 3px 9px;
    width: fit-content;
    white-space: nowrap;
}

.badge-green[b-0nih1kdjnj] {
    background: #dcfce7;
    color: #15803d;
    border: 1px solid #bbf7d0;
}

.badge-red[b-0nih1kdjnj] {
    background: #fee2e2;
    color: #b91c1c;
    border: 1px solid #fecaca;
}

.badge-amber[b-0nih1kdjnj] {
    background: #fef3c7;
    color: #b45309;
    border: 1px solid #fde68a;
}

.badge-sky[b-0nih1kdjnj] {
    background: #e0f2fe;
    color: #0369a1;
    border: 1px solid #bae6fd;
}

.badge-soft-red[b-0nih1kdjnj] {
    background: #fff1f2;
    color: #e11d48;
    border: 1px solid #ffe4e6;
}

.badge-gray[b-0nih1kdjnj] {
    background: #f1f5f9;
    color: #475569;
    border: 1px solid #e2e8f0;
}

.badge-purple[b-0nih1kdjnj] {
    background: #f3e8ff;
    color: #7e22ce;
    border: 1px solid #e9d5ff;
}

.user-initials-circle[b-0nih1kdjnj] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #ffffff;
    font-size: 0.68rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
/* /Components/Modals/ModalBase.razor.rz.scp.css */
.modal-overlay[b-zjptprzpg4] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100vw;
    width: 100dvw;
    height: 100vh;
    height: 100dvh;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    transition: all 0.3s ease;
    padding: 16px;
    box-sizing: border-box;
}

.modal-overlay.hidden[b-zjptprzpg4] {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.modal-overlay.visible[b-zjptprzpg4] {
    opacity: 1;
    visibility: visible;
    pointer-events: all;
}

.custom-modal[b-zjptprzpg4] {
    background: white;
    border-radius: 16px;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    max-height: calc(100dvh - 32px);
    max-width: 100%;
    width: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    opacity: 0;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.custom-modal.modal-enter[b-zjptprzpg4] {
    transform: none;
    opacity: 1;
    animation: slideUpFadeIn-b-zjptprzpg4 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.custom-modal.modal-exit[b-zjptprzpg4] {
    transform: translateY(100px);
    opacity: 0;
    animation: slideDownFadeOut-b-zjptprzpg4 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes slideUpFadeIn-b-zjptprzpg4 {
    0% {
        transform: translateY(100px);
        opacity: 0;
        scale: 0.95;
    }

    50% {
        opacity: 0.8;
    }

    100% {
        transform: none;
        opacity: 1;
        scale: 1;
    }
}

@keyframes slideDownFadeOut-b-zjptprzpg4 {
    0% {
        transform: translateY(0);
        opacity: 1;
        scale: 1;
    }

    100% {
        transform: translateY(100px);
        opacity: 0;
        scale: 0.95;
    }
}

.modal-header-custom[b-zjptprzpg4] {
    background: transparent !important;
    padding: 20px 24px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid var(--border-linear-theme-arregly);
    flex-shrink: 0;
}

    .modal-header-custom[b-zjptprzpg4]::before {
        content: '';
        position: absolute;
        top: -50%;
        right: -10%;
        width: 200px;
        height: 200px;
        background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);
        border-radius: 50%;
        animation: float-b-zjptprzpg4 6s ease-in-out infinite;
    }

.modal-header-content[b-zjptprzpg4] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    z-index: 2;
}

.modal-title-section[b-zjptprzpg4] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
}

[b-zjptprzpg4] .modal-title-icon {
    width: 24px;
    height: 24px;
    color: var(--text-theme-default-arregly);
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
}

.modal-title-text[b-zjptprzpg4] {
    font-size: 1.125rem !important;
    font-weight: 600 !important;
    color: #374151 !important;
    margin: 0 !important;
    letter-spacing: -0.015em !important;
    line-height: 1.35 !important;
}

[b-zjptprzpg4] .modal-close-btn {
    border: 1px solid #e2e8f0 !important;
    background: #f8fafc !important;
    border-radius: 50% !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    padding: 0 !important;
    min-width: auto !important;
    width: 32px !important;
    height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #64748b !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
    cursor: pointer !important;
}

[b-zjptprzpg4] .modal-title-icon {
    color: #6b7280 !important;
}

[b-zjptprzpg4] .modal-close-btn .k-button-icon,
[b-zjptprzpg4] .modal-close-btn .k-svg-icon {
    color: #64748b !important;
    font-size: 0.95rem !important;
    width: 14px !important;
    height: 14px !important;
    transition: all 0.2s ease !important;
}

[b-zjptprzpg4] .modal-close-btn:hover {
    background: #f1f5f9 !important;
    border-color: #cbd5e1 !important;
    color: #0f172a !important;
    transform: rotate(90deg) scale(1.08) !important;
    box-shadow: 0 4px 12px -2px rgba(0, 0, 0, 0.08) !important;
}

[b-zjptprzpg4] .modal-close-btn:hover .k-button-icon,
[b-zjptprzpg4] .modal-close-btn:hover .k-svg-icon {
    color: #0f172a !important;
}

[b-zjptprzpg4] .modal-close-btn:active {
    transform: scale(0.92) !important;
}

.animated-btn[b-zjptprzpg4] {
    transition: transform 0.1s cubic-bezier(.4,0,.2,1), box-shadow 0.2s cubic-bezier(.4,0,.2,1);
}

.animated-btn:active[b-zjptprzpg4] {
    transform: scale(0.96);
    box-shadow: 0 2px 10px rgba(102, 126, 234, 0.18) !important;
}

.modal-body-custom[b-zjptprzpg4] {
    padding: 15px 24px;
    /*flex: 1;*/
    flex: 1 1 auto; /* Ocupa el espacio disponible y permite scroll */
    min-height: 0 !important; /* Permite encogerse y activar scroll interno */
    overflow-y: auto;
    -webkit-overflow-scrolling: touch; /* Scroll suave en iOS */
    max-height: none; /* Dejar que el flexbox maneje el alto */
    /*max-height: calc(90vh - 160px);*/
}

.modal-footer-custom[b-zjptprzpg4] {
    padding: 16px 24px;
    border-top: 1px solid var(--border-linear-theme-arregly);
    background: transparent;
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    align-items: center;
    border-radius: 0 0 16px 16px;
    flex-shrink: 0;
}

.modal-footer-custom .btn-arregly[b-zjptprzpg4],
.modal-footer-custom .k-button[b-zjptprzpg4],
.modal-footer-custom button[b-zjptprzpg4] {
    text-align: center !important;
}

.modal-footer-custom .btn-arregly[b-zjptprzpg4],
.modal-footer-custom .k-button[b-zjptprzpg4] {
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
}

.modal-footer-custom .k-button .k-button-text[b-zjptprzpg4] {
    width: 100%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.modal-footer-custom button > div[b-zjptprzpg4] {
    width: 100%;
    justify-content: center !important;
}

/* Animación flotante para el elemento decorativo */
@keyframes float-b-zjptprzpg4 {
    0%, 100% {
        transform: translate(0, 0) scale(1);
    }

    50% {
        transform: translate(10px, -10px) scale(1.05);
    }
}

@media (max-width: 768px) {
    .modal-overlay[b-zjptprzpg4] {
        padding: 10px !important;
    }

    .custom-modal[b-zjptprzpg4] {
        /*border-radius: 12px;*/
        /*height: 100%;*/
        /*max-height: 100%;*/
        height: auto;
        max-height: calc(100vh - 20px) !important;
        max-height: calc(100dvh - 20px) !important; /* Respeta la barra de iOS */
        border-radius: 16px;
    }

    .modal-header-custom[b-zjptprzpg4] {
        padding: 12px 16px;
    }

    .modal-header-content[b-zjptprzpg4] {
        align-items: flex-start;
        gap: 10px;
    }

    .modal-title-text[b-zjptprzpg4] {
        font-size: 1rem !important;
        line-height: 1.3 !important;
    }

    .modal-body-custom[b-zjptprzpg4] {
        /*padding: 10px 10px;*/
        /* max-height: calc(100% - 100px);*/
        padding: 12px 16px;
        min-height: 0 !important;
    }

    .modal-footer-custom[b-zjptprzpg4] {
        padding: 10px 14px;
        flex-direction: row !important;
        flex-wrap: wrap;
        flex-shrink: 0 !important;
    }

    .modal-footer-custom[b-zjptprzpg4]  .d-flex.justify-content-between {
        width: 100% !important;
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: space-between !important;
        align-items: center !important;
        gap: 12px !important;
    }

    .modal-footer-custom[b-zjptprzpg4]  .d-flex.justify-content-between > .btn-arregly,
    .modal-footer-custom[b-zjptprzpg4]  .d-flex.justify-content-between > .k-button,
    .modal-footer-custom[b-zjptprzpg4]  .d-flex.justify-content-between > button,
    .modal-footer-custom[b-zjptprzpg4]  .d-flex.justify-content-between > .d-flex,
    .modal-footer-custom[b-zjptprzpg4]  .d-flex.justify-content-between > div {
        min-width: 0 !important;
        flex: 1 1 calc(50% - 6px) !important;
        max-width: 100% !important;
        margin: 0 !important;
    }

    .modal-footer-custom[b-zjptprzpg4]  .d-flex.justify-content-between .btn-arregly,
    .modal-footer-custom[b-zjptprzpg4]  .d-flex.justify-content-between .k-button,
    .modal-footer-custom[b-zjptprzpg4]  .d-flex.justify-content-between button {
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        min-height: 34px !important;
        height: auto !important;
        padding: 6px 10px !important;
        font-size: 0.82rem !important;
        font-weight: 500 !important;
        border-radius: 12px !important;
        display: inline-flex !important;
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        white-space: nowrap !important;
        box-shadow: 0 2px 8px rgba(102, 126, 234, 0.12) !important;
    }
}

@media (max-width: 360px) {
    .modal-footer-custom[b-zjptprzpg4] {
        padding: 10px 10px !important;
    }

    .modal-footer-custom[b-zjptprzpg4]  .d-flex.justify-content-between {
        gap: 10px !important;
    }

    .modal-footer-custom[b-zjptprzpg4]  .d-flex.justify-content-between > .btn-arregly,
    .modal-footer-custom[b-zjptprzpg4]  .d-flex.justify-content-between > .k-button,
    .modal-footer-custom[b-zjptprzpg4]  .d-flex.justify-content-between > button,
    .modal-footer-custom[b-zjptprzpg4]  .d-flex.justify-content-between > .d-flex,
    .modal-footer-custom[b-zjptprzpg4]  .d-flex.justify-content-between > div {
        flex: 1 1 calc(50% - 5px) !important;
    }

    .modal-footer-custom[b-zjptprzpg4]  .d-flex.justify-content-between .btn-arregly,
    .modal-footer-custom[b-zjptprzpg4]  .d-flex.justify-content-between .k-button,
    .modal-footer-custom[b-zjptprzpg4]  .d-flex.justify-content-between button {
        padding: 6px 6px !important;
        font-size: 0.78rem !important;
        letter-spacing: -0.2px !important;
    }
}
/*
@media (max-width: 480px) {
    .modal-overlay {
        padding: 16px;
        align-items: center;
    }

    .custom-modal {
        width: 100% !important;
        max-width: 100% !important;
        border-radius: 16px;
        max-height: 92vh;
    }

    .modal-header-custom {
        padding: 16px 20px;
    }

    .modal-body-custom {
        padding: 16px 8px;
    }

    .modal-footer-custom {
        padding: 12px 16px;
    }

    .custom-modal.modal-enter {
        animation: slideUpFromBottom 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    }

    .custom-modal.modal-exit {
        animation: slideDownToBottom 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    }
}

@media (max-width: 320px) {
    .modal-footer-custom ::deep .d-flex.justify-content-between {
        flex-wrap: wrap !important;
        gap: 8px !important;
    }

        .modal-footer-custom ::deep .d-flex.justify-content-between .d-flex {
            flex-wrap: wrap !important;
            gap: 8px !important;
            width: auto !important;
        }

    .modal-footer-custom ::deep .btn-arregly,
    .modal-footer-custom ::deep button,
    .modal-footer-custom ::deep .k-button {
        min-width: 0 !important;
        max-width: 100% !important;
        margin: 0 !important;
        flex: 1 1 auto !important;
    }
}

@keyframes slideUpFromBottom {
    0% {
        transform: translateY(100%);
        opacity: 0.8;
    }

    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes slideDownToBottom {
    0% {
        transform: translateY(0);
        opacity: 1;
    }

    100% {
        transform: translateY(100%);
        opacity: 0;
    }
}

.modal-overlay.visible ~ * .custom-sidebar,
.modal-overlay.visible + .custom-sidebar,
body:has(.modal-overlay.visible) .custom-sidebar {
    filter: blur(4px) !important;
    pointer-events: none !important;
    transition: filter 0.3s ease !important;
}

body:has(.modal-overlay.visible) .custom-sidebar {
    z-index: 900 !important;
}

.modal-footer-custom > .justify-content-between,
.modal-footer-custom ::deep .justify-content-between {
    width: 100% !important;
    flex-grow: 1 !important;
}*/




















/*.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 999;
    transition: all 0.3s ease;
    padding: 20px;
}

.modal-overlay.hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.modal-overlay.visible {
    opacity: 1;
    visibility: visible;
    pointer-events: all;
}

.custom-modal {
    background: white;
    border-radius: 16px;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    max-height: 90vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transform: translateY(100px);
    opacity: 0;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    max-width: 95vw;
}

.custom-modal.modal-enter {
    transform: translateY(0);
    opacity: 1;
    animation: slideUpFadeIn 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

.custom-modal.modal-exit {
    transform: translateY(100px);
    opacity: 0;
    animation: slideDownFadeOut 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes slideUpFadeIn {
    0% {
        transform: translateY(100px);
        opacity: 0;
        scale: 0.95;
    }

    50% {
        opacity: 0.8;
    }

    100% {
        transform: translateY(0);
        opacity: 1;
        scale: 1;
    }
}

@keyframes slideDownFadeOut {
    0% {
        transform: translateY(0);
        opacity: 1;
        scale: 1;
    }

    100% {
        transform: translateY(100px);
        opacity: 0;
        scale: 0.95;
    }
}

.modal-header-custom {
    background: transparent !important;
    padding: 20px 24px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    position: relative;
    overflow: hidden;
    border-bottom: 1px solid var(--border-linear-theme-arregly);
    flex-shrink: 0;
}

.modal-header-custom::before {
    content: '';
    position: absolute;
    top: -50%;
    right: -10%;
    width: 200px;
    height: 200px;
    background: radial-gradient(circle, rgba(255, 255, 255, 0.1) 0%, transparent 70%);
    border-radius: 50%;
    animation: float 6s ease-in-out infinite;
}

.modal-header-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    z-index: 2;
}

.modal-title-section {
    display: flex;
    align-items: center;
    gap: 12px;
    flex: 1;
}

::deep .modal-title-icon {
    width: 24px;
    height: 24px;
    color: var(--text-theme-default-arregly);
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.1));
}

.modal-title-text {
    font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    font-size: 1.125rem !important;
    font-weight: 600 !important;
    color: #374151 !important;
    margin: 0 !important;
    letter-spacing: -0.02em !important;
    line-height: 1.4 !important;
}

::deep .modal-close-btn {
    border: 1px solid #e2e8f0 !important;
    background: #f8fafc !important;
    border-radius: 50% !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    padding: 0 !important;
    min-width: auto !important;
    width: 32px !important;
    height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #64748b !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
    cursor: pointer !important;
}

::deep .modal-close-btn .k-button-icon,
::deep .modal-close-btn .k-svg-icon {
    color: #64748b !important;
    font-size: 0.95rem !important;
    width: 14px !important;
    height: 14px !important;
    transition: all 0.2s ease !important;
}

::deep .modal-close-btn:hover {
    background: #f1f5f9 !important;
    border-color: #cbd5e1 !important;
    color: #0f172a !important;
    transform: rotate(90deg) scale(1.08) !important;
    box-shadow: 0 4px 12px -2px rgba(0, 0, 0, 0.08) !important;
}

::deep .modal-close-btn:hover .k-button-icon,
::deep .modal-close-btn:hover .k-svg-icon {
    color: #0f172a !important;
}

::deep .modal-close-btn:active {
    transform: scale(0.92) !important;
}

.animated-btn {
    transition: transform 0.1s cubic-bezier(.4,0,.2,1), box-shadow 0.2s cubic-bezier(.4,0,.2,1);
}

.animated-btn:active {
    transform: scale(0.96);
    box-shadow: 0 2px 10px rgba(102, 126, 234, 0.18) !important;
}

.modal-body-custom {
    padding: 24px;
    flex: 1;
    overflow-y: auto;
    max-height: calc(90vh - 160px);
}

.modal-footer-custom {
    padding: 16px 24px;
    border-top: 1px solid var(--border-linear-theme-arregly);
    background: transparent;
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    align-items: center;
    border-radius: 0 0 16px 16px;
    flex-shrink: 0;
}

.modal-footer-custom .btn-arregly,
.modal-footer-custom .k-button,
.modal-footer-custom button {
    text-align: center !important;
}

.modal-footer-custom .btn-arregly,
.modal-footer-custom .k-button {
    display: inline-flex !important;
    justify-content: center !important;
    align-items: center !important;
}

.modal-footer-custom .k-button .k-button-text {
    width: 100%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.modal-footer-custom button > div {
    width: 100%;
    justify-content: center !important;
}*/

/* Animación flotante para el elemento decorativo */
/*@keyframes float {
    0%, 100% {
        transform: translate(0, 0) scale(1);
    }

    50% {
        transform: translate(10px, -10px) scale(1.05);
    }
}*/

/* Responsive */
/*@media (max-width: 768px) {
    .modal-overlay {
        padding: 10px;
    }

    .custom-modal {
        border-radius: 12px;
        max-height: 95vh;
    }

    .modal-header-custom {
        padding: 20px;
    }

    .modal-title-text {
        font-size: 1.125rem;
    }

    .modal-body-custom {
        padding: 24px 20px;
        max-height: calc(95vh - 160px);
    }

    .modal-footer-custom {
        padding: 16px 20px;
        flex-direction: row !important;
        justify-content: flex-end !important;
        gap: 12px;
        flex-wrap: wrap;
    }

    .modal-footer-custom > *:not(.justify-content-between),
    .modal-footer-custom ::deep .d-flex:not(.justify-content-between) {
        width: auto !important;
        flex-direction: row !important;
        justify-content: flex-end !important;
        gap: 12px !important;
        margin: 0 !important;
    }

    .modal-footer-custom ::deep .d-flex.justify-content-between {
        width: 100% !important;
        justify-content: space-between !important;
        display: flex !important;
    }

    .modal-footer-custom ::deep .k-button,
    .modal-footer-custom ::deep button {
        width: auto !important;
        margin: 0 !important;
    }
}

@media (max-width: 480px) {
    .modal-overlay {
        padding: 16px;
        align-items: center;
    }

    .custom-modal {
        width: 100% !important;
        max-width: 100% !important;
        border-radius: 16px;
        max-height: 92vh;
    }

    .modal-header-custom {
        padding: 16px 20px;
    }

    .modal-body-custom {
        padding: 16px 8px;
    }

    .modal-footer-custom {
        padding: 12px 16px;
    }

    .custom-modal.modal-enter {
        animation: slideUpFromBottom 0.4s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    }

    .custom-modal.modal-exit {
        animation: slideDownToBottom 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
    }
}

@media (max-width: 320px) {
    .modal-footer-custom ::deep .d-flex.justify-content-between {
        flex-wrap: wrap !important;
        gap: 8px !important;
    }

    .modal-footer-custom ::deep .d-flex.justify-content-between .d-flex {
        flex-wrap: wrap !important;
        gap: 8px !important;
        width: auto !important;
    }

    .modal-footer-custom ::deep .btn-arregly,
    .modal-footer-custom ::deep button,
    .modal-footer-custom ::deep .k-button {
        min-width: 0 !important;
        max-width: 100% !important;
        margin: 0 !important;
        flex: 1 1 auto !important;
    }
}

@keyframes slideUpFromBottom {
    0% {
        transform: translateY(100%);
        opacity: 0.8;
    }

    100% {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes slideDownToBottom {
    0% {
        transform: translateY(0);
        opacity: 1;
    }

    100% {
        transform: translateY(100%);
        opacity: 0;
    }
}

.modal-overlay.visible ~ * .custom-sidebar,
.modal-overlay.visible + .custom-sidebar,
body:has(.modal-overlay.visible) .custom-sidebar {
    filter: blur(4px) !important;
    pointer-events: none !important;
    transition: filter 0.3s ease !important;
}

body:has(.modal-overlay.visible) .custom-sidebar {
    z-index: 900 !important;
}

.modal-footer-custom > .justify-content-between,
.modal-footer-custom ::deep .justify-content-between {
    width: 100% !important;
    flex-grow: 1 !important;
}*/

/* /Components/Modals/Supplier/SupplierModal.razor.rz.scp.css */
/* ══════════════════════════════════════════════════════
   Modal de Crear / Editar Proveedor (Aurocore Design System)
   Scoped CSS
   ══════════════════════════════════════════════════════ */

.supplier-modal-container[b-td7xhzfzab] {
    display: flex;
    flex-direction: column;
    gap: 1.15rem;
    padding: 0.25rem;
}

.supplier-info-callout[b-td7xhzfzab] {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    background: #f0fdfa;
    border: 1px solid #ccfbf1;
    border-radius: 10px;
    padding: 0.85rem 1rem;
    color: #0f766e;
}

.supplier-info-callout-icon[b-td7xhzfzab] {
    font-size: 1.25rem;
    margin-top: 2px;
    flex-shrink: 0;
}

.supplier-info-callout-text[b-td7xhzfzab] {
    font-size: 0.82rem;
    line-height: 1.45;
    color: #115e59;
}

.supplier-info-callout-text strong[b-td7xhzfzab] {
    display: block;
    font-weight: 700;
    margin-bottom: 2px;
}

.form-help-text[b-td7xhzfzab] {
    font-size: 0.74rem;
    color: #64748b;
    margin-top: 0.25rem;
    display: block;
}

.active-switch-card[b-td7xhzfzab] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 0.85rem 1rem;
}

.switch-content[b-td7xhzfzab] {
    display: flex;
    flex-direction: column;
}

.switch-arregly[b-td7xhzfzab] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    width: 52px;
    overflow: hidden;
}

[b-td7xhzfzab] .switch-arregly .k-switch-label-on,
[b-td7xhzfzab] .switch-arregly .k-switch-label-off {
    display: none !important;
}
/* /Components/Modals/Supplier/SupplierProductLinkModal.razor.rz.scp.css */
/* ══════════════════════════════════════════════════════
   Modal de Vinculación Producto-Proveedor (MOQ / Lead Time)
   Aurocore Design System — Mobile-First Scoped CSS
   ══════════════════════════════════════════════════════ */

.moq-modal-container[b-ohvigo4gy5] {
    display: flex;
    flex-direction: column;
    gap: 1.15rem;
    padding: 0.25rem;
}

/* ── Callout Explicativo ── */
.moq-info-callout[b-ohvigo4gy5] {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
    background: #f0fdfa;
    border: 1px solid #ccfbf1;
    border-radius: 10px;
    padding: 0.85rem 1rem;
    color: #0f766e;
}

.moq-info-callout-icon[b-ohvigo4gy5] {
    font-size: 1.25rem;
    margin-top: 2px;
    flex-shrink: 0;
}

.moq-info-callout-text[b-ohvigo4gy5] {
    font-size: 0.82rem;
    line-height: 1.45;
    color: #115e59;
}

.moq-info-callout-text strong[b-ohvigo4gy5] {
    display: block;
    font-weight: 700;
    margin-bottom: 2px;
}

/* ── Pestañas de Navegación del Modal ── */
.moq-tabs-nav[b-ohvigo4gy5] {
    display: flex;
    gap: 0.5rem;
    border-bottom: 1px solid #e2e8f0;
    padding-bottom: 0.5rem;
}

.moq-tab-btn[b-ohvigo4gy5] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.45rem 1rem;
    font-size: 0.84rem;
    font-weight: 600;
    color: #475569;
    cursor: pointer;
    transition: all 0.2s ease;
}

.moq-tab-btn:hover[b-ohvigo4gy5] {
    background: #f1f5f9;
    color: #0f172a;
    border-color: #cbd5e1;
}

.moq-tab-btn--active[b-ohvigo4gy5] {
    background: #034C48;
    color: #ffffff !important;
    border-color: #034C48;
    box-shadow: 0 2px 4px rgba(3, 76, 72, 0.25);
}

.moq-tab-counter[b-ohvigo4gy5] {
    background: rgba(255, 255, 255, 0.25);
    color: inherit;
    padding: 1px 7px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
}

.moq-tab-btn:not(.moq-tab-btn--active) .moq-tab-counter[b-ohvigo4gy5] {
    background: #e2e8f0;
    color: #334155;
}

/* ── Secciones Visuales ── */
.moq-section[b-ohvigo4gy5] {
    background: #ffffff;
    border: 1px solid rgba(226, 232, 240, 0.9);
    border-radius: 12px;
    padding: 1.15rem;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.03);
}

.moq-section-header[b-ohvigo4gy5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 1px dashed #e2e8f0;
}

.moq-section-title[b-ohvigo4gy5] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.92rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
}

.moq-section-title-icon[b-ohvigo4gy5] {
    color: #034C48;
    display: inline-flex;
    align-items: center;
}

.moq-section-step[b-ohvigo4gy5] {
    background: #f1f5f9;
    color: #475569;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 999px;
    text-transform: uppercase;
}

.badge-item-count[b-ohvigo4gy5] {
    background: #e0f2fe;
    color: #0369a1;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 999px;
}

.form-help-text[b-ohvigo4gy5] {
    font-size: 0.74rem;
    color: #64748b;
    margin-top: 0.25rem;
    display: block;
}

/* ── Tarjeta de Producto Seleccionado ── */
.selected-product-card[b-ohvigo4gy5] {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    border: 1.5px solid #cbd5e1;
    border-radius: 10px;
    padding: 0.85rem 1rem;
    animation: fadeIn-b-ohvigo4gy5 0.25s ease-in-out;
}

@keyframes fadeIn-b-ohvigo4gy5 {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

.selected-product-avatar[b-ohvigo4gy5] {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background: #e6f4f2;
    color: #034C48;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.selected-product-info[b-ohvigo4gy5] {
    flex: 1;
    min-width: 0;
}

.selected-product-name[b-ohvigo4gy5] {
    font-weight: 700;
    font-size: 0.95rem;
    color: #0f172a;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.selected-product-meta[b-ohvigo4gy5] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 0.25rem;
}

.sku-pill[b-ohvigo4gy5] {
    background: #e2e8f0;
    color: #334155;
    font-size: 0.72rem;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 6px;
}

.brand-pill[b-ohvigo4gy5] {
    background: #fef3c7;
    color: #92400e;
    font-size: 0.72rem;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 6px;
}

.cost-reference[b-ohvigo4gy5] {
    font-size: 0.76rem;
    color: #64748b;
    margin-left: auto;
}

.cost-reference strong[b-ohvigo4gy5] {
    color: #047857;
}

/* ── Switch Card & Anti-overflow ── */
.primary-switch-card[b-ohvigo4gy5] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 0.75rem 1rem;
    height: 100%;
}

.switch-content[b-ohvigo4gy5] {
    display: flex;
    flex-direction: column;
}

.switch-arregly[b-ohvigo4gy5] {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    width: 52px;
    overflow: hidden;
}

[b-ohvigo4gy5] .switch-arregly .k-switch-label-on,
[b-ohvigo4gy5] .switch-arregly .k-switch-label-off {
    display: none !important;
}

/* ── Tabla de Productos Vinculados ── */
.linked-products-table-container[b-ohvigo4gy5] {
    overflow-x: auto;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
}

.table-custom[b-ohvigo4gy5] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.84rem;
}

.table-custom th[b-ohvigo4gy5] {
    background: #f8fafc;
    color: #475569;
    font-weight: 700;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    padding: 0.65rem 0.85rem;
    border-bottom: 1px solid #e2e8f0;
}

.table-custom td[b-ohvigo4gy5] {
    padding: 0.75rem 0.85rem;
    border-bottom: 1px solid #f1f5f9;
    vertical-align: middle;
}

.table-custom tr:last-child td[b-ohvigo4gy5] {
    border-bottom: none;
}

.table-custom tr:hover td[b-ohvigo4gy5] {
    background-color: #f8fafc;
}

.badge-moq[b-ohvigo4gy5] {
    background: #e0f2fe;
    color: #0369a1;
    font-weight: 700;
    font-size: 0.78rem;
    padding: 3px 8px;
    border-radius: 6px;
}

.badge-preferred[b-ohvigo4gy5] {
    background: #ecfdf5;
    color: #047857;
    font-weight: 700;
    font-size: 0.74rem;
    padding: 3px 8px;
    border-radius: 999px;
    border: 1px solid #a7f3d0;
    display: inline-flex;
    align-items: center;
    gap: 3px;
}

.badge-secondary-supplier[b-ohvigo4gy5] {
    background: #f1f5f9;
    color: #64748b;
    font-size: 0.72rem;
    padding: 2px 7px;
    border-radius: 999px;
}

.btn-delete-link[b-ohvigo4gy5] {
    background: transparent;
    border: 1px solid #fee2e2;
    color: #ef4444;
    border-radius: 6px;
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-delete-link:hover[b-ohvigo4gy5] {
    background: #ef4444;
    color: #ffffff;
    border-color: #ef4444;
}

.empty-linked-products[b-ohvigo4gy5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 2.5rem 1rem;
    text-align: center;
}
/* /Components/Navigation/AurocoreBreadcrumb.razor.rz.scp.css */
/* ── Aurocore Breadcrumbs — Subtle, Clean & Corporate Harmony ─────────────── */

.aurocore-breadcrumbs[b-2eesnsus60] {
    display: block;
    width: 95% !important;
    max-width: 1800px !important;
    margin: 0 auto 4px auto !important;
    position: relative;
    z-index: 2;
}

.breadcrumbs-container[b-2eesnsus60] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    padding: 2px 0;
    background: transparent;
    border: none;
    box-shadow: none;
}

/* ── Botón Píldora de Retorno (Sutil, Corporativo & Refinado) ─────────────── */
.breadcrumb-back-pill[b-2eesnsus60] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 30px;
    padding: 0 12px;
    background: color-mix(in srgb, var(--primary-color, #034C48) 5%, #ffffff);
    border: 1px solid color-mix(in srgb, var(--primary-color, #034C48) 22%, #cbd5e1);
    border-radius: 9999px;
    color: var(--primary-color, #034C48);
    font-size: 0.78125rem;
    font-weight: 500;
    text-decoration: none !important;
    cursor: pointer;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    user-select: none;
    flex-shrink: 0;
}

.breadcrumb-back-pill:hover[b-2eesnsus60] {
    background: color-mix(in srgb, var(--primary-color, #034C48) 12%, #ffffff);
    color: var(--primary-color, #034C48) !important;
    border-color: var(--primary-color, #034C48);
    transform: translateX(-2px);
    box-shadow: 0 2px 8px color-mix(in srgb, var(--primary-color, #034C48) 18%, transparent);
}

.breadcrumb-back-pill:active[b-2eesnsus60] {
    transform: translateX(-1px) scale(0.98);
}

[b-2eesnsus60] .back-pill-icon {
    width: 12px;
    height: 12px;
    color: var(--primary-color, #034C48);
    transition: transform 0.2s ease, color 0.2s ease;
}

.breadcrumb-back-pill:hover[b-2eesnsus60]  .back-pill-icon {
    transform: translateX(-2px);
}

.back-pill-text[b-2eesnsus60] {
    line-height: 1;
    white-space: nowrap;
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ── Secuencia Jerárquica de Nodos (Subtle Trail) ────────────────────────── */
.breadcrumb-trail[b-2eesnsus60] {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 0.8125rem;
    line-height: 1.4;
}

.breadcrumb-node[b-2eesnsus60] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

/* Enlaces navegables (ej. Inicio) */
.breadcrumb-link[b-2eesnsus60] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #475569;
    text-decoration: none !important;
    font-weight: 500;
    padding: 3px 6px;
    border-radius: 6px;
    transition: all 0.15s ease;
}

.breadcrumb-link:hover[b-2eesnsus60] {
    color: var(--primary-color, #034C48);
    background: color-mix(in srgb, var(--primary-color, #034C48) 8%, transparent);
}

/* Nodo categoría / menú (Informativo, sutil, no interactivo) */
.breadcrumb-category-node[b-2eesnsus60] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #64748b;
    font-weight: 400;
    padding: 2px 7px;
    background: color-mix(in srgb, var(--primary-color, #034C48) 4%, #f8fafc);
    border: 1px solid color-mix(in srgb, var(--primary-color, #034C48) 12%, #e2e8f0);
    border-radius: 6px;
    cursor: default;
    user-select: none;
    font-size: 0.75rem;
    transition: color 0.15s ease, border-color 0.15s ease;
}

.breadcrumb-category-node:hover[b-2eesnsus60] {
    color: #334155;
    border-color: color-mix(in srgb, var(--primary-color, #034C48) 22%, #cbd5e1);
}

/* Nodo de la vista actual activa */
.breadcrumb-current[b-2eesnsus60] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #0f172a;
    font-weight: 600;
    padding: 3px 6px;
}

[b-2eesnsus60] .node-icon {
    width: 13px;
    height: 13px;
    color: var(--primary-color, #034C48);
    opacity: 0.85;
}

[b-2eesnsus60] .category-icon {
    opacity: 0.65;
    color: #64748b;
}

[b-2eesnsus60] .breadcrumb-separator {
    width: 9px;
    height: 9px;
    color: color-mix(in srgb, var(--primary-color, #034C48) 30%, #cbd5e1);
    margin: 0 1px;
}

/* ── Adaptación Mobile-First (Pantallas <= 768px) ────────────────────────── */
@media (max-width: 768px) {
    .aurocore-breadcrumbs[b-2eesnsus60] {
        width: 100% !important;
        margin: 0 0 6px 0 !important;
        padding: 0 2px;
    }

    .breadcrumbs-container[b-2eesnsus60] {
        display: block !important;
        padding: 0;
        gap: 0;
    }

    /* En móvil se oculta el botón "Volver a": la ruta de migas de pan es suficiente, táctil y maximiza el espacio vertical */
    .breadcrumb-back-pill[b-2eesnsus60] {
        display: none !important;
    }

    .breadcrumb-trail[b-2eesnsus60] {
        width: 100%;
        overflow-x: auto;
        white-space: nowrap;
        padding: 2px 0 4px 0;
        scrollbar-width: none;
        -ms-overflow-style: none;
        -webkit-overflow-scrolling: touch;
        font-size: 0.78125rem;
    }

    .breadcrumb-trail[b-2eesnsus60]::-webkit-scrollbar {
        display: none;
    }

    .breadcrumb-node[b-2eesnsus60] {
        gap: 2px;
    }

    .breadcrumb-link[b-2eesnsus60],
    .breadcrumb-current[b-2eesnsus60] {
        padding: 2px 5px;
    }
}
/* /Components/Onboarding/FreePlanReminder.razor.rz.scp.css */
.free-plan-reminder-overlay[b-pzrgma8oqs] {
    position: fixed;
    inset: 0;
    z-index: 12000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: rgba(15, 23, 42, 0.48);
    backdrop-filter: blur(4px);
}

.free-plan-reminder-card[b-pzrgma8oqs] {
    width: min(100%, 650px);
    border-radius: 1.5rem;
    overflow: hidden;
    background: #ffffff;
    position: relative;
    padding: 2.5rem 2rem;
    border: 1px solid color-mix(in srgb, var(--primary-color) 12%, transparent);
    box-shadow: 0 28px 64px rgba(31, 41, 55, 0.16);
}

.free-plan-sr-only[b-pzrgma8oqs] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.free-plan-reminder-content-layer[b-pzrgma8oqs] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.free-plan-reminder-header[b-pzrgma8oqs] {
    display: flex;
    align-items: flex-start;
    gap: 1.25rem;
}

.free-plan-reminder-avatar[b-pzrgma8oqs] {
    width: 64px;
    height: 64px;
    flex-shrink: 0;
}

.free-plan-reminder-avatar-icon[b-pzrgma8oqs] {
    width: 100%;
    height: 100%;
}

.free-plan-reminder-title[b-pzrgma8oqs] {
    font-size: 1.35rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
}

.free-plan-reminder-subtitle[b-pzrgma8oqs] {
    font-size: 0.95rem;
    color: #475569;
    margin: 0.25rem 0 0 0;
    font-weight: 500;
}

.free-plan-reminder-text[b-pzrgma8oqs] {
    font-size: 0.9rem;
    color: #475569;
    margin: 0.5rem 0 0 0;
}

.free-plan-reminder-details[b-pzrgma8oqs] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    padding: 1.25rem;
    border-radius: 1rem;
}

.free-plan-reminder-details-title[b-pzrgma8oqs] {
    font-weight: 600;
    font-size: 0.95rem;
    color: #334155;
    margin: 0 0 0.75rem 0;
}

.free-plan-reminder-list[b-pzrgma8oqs] {
    margin: 0;
    padding-left: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    font-size: 0.9rem;
    color: #475569;
}

.free-plan-reminder-note[b-pzrgma8oqs] {
    font-size: 0.9rem;
    color: #475569;
    line-height: 1.5;
    background-color: color-mix(in srgb, var(--primary-color) 12%, #ffffff);
    padding: 1rem;
    border-radius: 0.75rem;
}

.free-plan-reminder-note p[b-pzrgma8oqs] {
    margin: 0;
}

.free-plan-reminder-actions[b-pzrgma8oqs] {
    display: flex;
    justify-content: flex-end;
    gap: 1rem;
    margin-top: 0.5rem;
}

.free-plan-reminder-button[b-pzrgma8oqs] {
    font-size: 0.95rem;
    font-weight: 600;
    padding: 0.75rem 1.5rem;
    border-radius: 0.75rem;
    cursor: pointer;
    border: none;
    transition: all 0.2s ease;
}

.free-plan-reminder-button-primary[b-pzrgma8oqs] {
    background-color: var(--primary-color);
    color: #ffffff;
}

.free-plan-reminder-button-primary:hover[b-pzrgma8oqs] {
    background-color: color-mix(in srgb, var(--primary-color) 85%, #000000);
    transform: translateY(-1px);
}
/* /Components/Onboarding/ProfileCompletionReminder.razor.rz.scp.css */
.profile-reminder-overlay[b-luw938hrp5] {
    position: fixed;
    inset: 0;
    z-index: 12000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    background: rgba(15, 23, 42, 0.48);
    backdrop-filter: blur(4px);
}

.profile-reminder-card[b-luw938hrp5] {
    width: min(100%, 1120px);
    border-radius: 2rem;
    overflow: hidden;
    background: linear-gradient(135deg, #f7f8ff 0%, #edf0ff 100%);
    position: relative;
    display: grid;
    grid-template-columns: minmax(300px, 420px) minmax(360px, 1fr);
    gap: 1.5rem;
    padding: 2rem;
    border: 1px solid rgba(139, 92, 246, 0.12);
    box-shadow: 0 28px 64px rgba(31, 41, 55, 0.16);
}

.profile-reminder-sr-only[b-luw938hrp5] {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.profile-reminder-layer[b-luw938hrp5] {
    position: relative;
    z-index: 1;
}

.profile-reminder-robot-layer[b-luw938hrp5] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.profile-reminder-robot-layer[b-luw938hrp5]::before {
    content: "";
    position: absolute;
    width: 92%;
    max-width: 360px;
    aspect-ratio: 1 / 1;
    border-radius: 1.5rem;
    background: radial-gradient(circle, rgba(108, 99, 255, 0.24) 0%, rgba(108, 99, 255, 0.09) 56%, transparent 72%);
    filter: blur(2px);
}

.profile-reminder-robot-image[b-luw938hrp5] {
    width: 100%;
    max-width: 380px;
    height: auto;
    display: block;
    position: relative;
    z-index: 1;
}

.profile-reminder-content-layer[b-luw938hrp5] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 1.25rem;
    background: transparent;
}

.profile-reminder-header[b-luw938hrp5] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.profile-reminder-avatar[b-luw938hrp5] {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 24px rgba(17, 24, 39, 0.08);
    flex-shrink: 0;
}

.profile-reminder-avatar-icon[b-luw938hrp5] {
    width: 56px;
    height: 56px;
    line-height: 0;
}

.profile-reminder-avatar-icon circle:first-child[b-luw938hrp5] {
    fill: #6c63ff;
}

.profile-reminder-avatar-fill[b-luw938hrp5] {
    fill: #ffffff;
}

.profile-reminder-avatar-stroke[b-luw938hrp5] {
    stroke: #ffffff;
    stroke-width: 5;
    stroke-linecap: round;
    fill: none;
}

.profile-reminder-title[b-luw938hrp5] {
    margin: 0;
    color: #1f2937;
    font-size: clamp(1.6rem, 2.2vw, 2.15rem);
    font-weight: 800;
    line-height: 1.15;
}

.profile-reminder-subtitle[b-luw938hrp5] {
    margin: 0.35rem 0 0;
    color: #4b5563;
    font-size: 1.05rem;
    line-height: 1.5;
}

.profile-reminder-note[b-luw938hrp5] {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    width: fit-content;
    min-width: min(100%, 420px);
    padding: 0.95rem 1.1rem;
    border-radius: 1.05rem;
    background: rgba(255, 255, 255, 0.92);
    border: 1px solid rgba(148, 163, 184, 0.28);
    box-shadow: 0 8px 20px rgba(31, 41, 55, 0.08);
}

.profile-reminder-note-icon[b-luw938hrp5] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #eef2ff;
    color: #6c63ff;
    font-weight: 800;
    flex-shrink: 0;
}

.profile-reminder-note-title[b-luw938hrp5] {
    margin: 0;
    color: #374151;
    font-size: 1rem;
    font-weight: 700;
}

.profile-reminder-note-text[b-luw938hrp5] {
    margin: 0.2rem 0 0;
    color: #6b7280;
    font-size: 0.95rem;
}

.profile-reminder-actions[b-luw938hrp5] {
    display: flex;
    align-items: center;
    gap: 0.8rem;
}

.profile-reminder-button[b-luw938hrp5] {
    border: none;
    cursor: pointer;
    border-radius: 999px;
    height: 52px;
    padding: 0 1.6rem;
    font-size: 1rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    transition: transform 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}

.profile-reminder-button:hover[b-luw938hrp5] {
    transform: translateY(-1px);
}

.profile-reminder-button:focus-visible[b-luw938hrp5] {
    outline: 3px solid rgba(37, 99, 235, 0.28);
    outline-offset: 3px;
}

.profile-reminder-button-primary[b-luw938hrp5] {
    min-width: 206px;
    background: linear-gradient(135deg, #6c63ff 0%, #8b5cff 100%);
    color: #ffffff;
    box-shadow: 0 10px 26px rgba(108, 99, 255, 0.35);
}

.profile-reminder-button-primary:hover[b-luw938hrp5] {
    box-shadow: 0 14px 30px rgba(108, 99, 255, 0.45);
}

.profile-reminder-button-secondary[b-luw938hrp5] {
    min-width: 150px;
    background: transparent;
    color: #8b5cff;
    border: 2px solid #8b5cff;
}

.profile-reminder-button-secondary:hover[b-luw938hrp5] {
    background: rgba(139, 92, 255, 0.08);
}

@media (max-width: 576px) {
    .profile-reminder-overlay[b-luw938hrp5] {
        padding: .6rem;
        align-items: center;
    }

    .profile-reminder-card[b-luw938hrp5] {
        width: 100%;
        border-radius: 1.3rem;
        grid-template-columns: 1fr;
        gap: 1rem;
        padding: 1rem;
    }

    .profile-reminder-robot-image[b-luw938hrp5] {
        max-width: 280px;
    }

    .profile-reminder-header[b-luw938hrp5] {
        align-items: flex-start;
    }

    .profile-reminder-avatar[b-luw938hrp5] {
        width: 56px;
        height: 56px;
    }

    .profile-reminder-avatar-icon[b-luw938hrp5] {
        width: 44px;
        height: 44px;
    }

    .profile-reminder-subtitle[b-luw938hrp5] {
        font-size: 0.95rem;
    }

    .profile-reminder-note[b-luw938hrp5] {
        width: 100%;
        min-width: 0;
    }

    .profile-reminder-actions[b-luw938hrp5] {
        width: 100%;
        flex-direction: column;
        align-items: stretch;
    }

    .profile-reminder-button[b-luw938hrp5] {
        width: 100%;
        min-width: 0;
    }
}
/* /Components/Order/Belongings/BelongingFormFields.razor.rz.scp.css */
.belonging-photo-preview-container[b-i89xm7ayqj] {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 1.5rem;
    margin-bottom: 1rem;
    width: 100%;
    clear: both;
}

.belonging-photo-preview[b-i89xm7ayqj] {
    max-width: 320px;
    max-height: 220px;
    width: auto;
    height: auto;
    object-fit: contain;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    background-color: #f8fafc;
    transition: transform 0.2s ease-in-out;
}

.belonging-photo-preview:hover[b-i89xm7ayqj] {
    transform: scale(1.02);
}

.belonging-photo-upload-dropzone-wrapper[b-i89xm7ayqj] {
    position: relative;
    border-radius: 18px;
    background: #edf4fc;
    padding: 14px;
    overflow: hidden;
}

.belonging-photo-upload-trigger[b-i89xm7ayqj] {
    display: block;
    width: 100%;
    min-height: 120px;
    cursor: pointer;
    position: relative;
    z-index: 1;
}

.belonging-photo-upload-overlay[b-i89xm7ayqj] {
    position: absolute;
    inset: 0;
    border: 1.5px dashed #c1d2e6;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    pointer-events: none;
}

.belonging-photo-upload-overlay-icon[b-i89xm7ayqj] {
    width: 46px;
    height: 46px;
    border-radius: 8px;
    margin-bottom: 10px;
    background: linear-gradient(145deg, #dbeafe, #93c5fd);
    -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 16 16"><path fill="black" d="M6.002 5.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z"/><path fill="black" d="M2.002 1a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2h-12zm12 1a1 1 0 0 1 1 1v6.5l-3.777-1.947a.5.5 0 0 0-.577.093l-3.71 3.71-2.66-1.772a.5.5 0 0 0-.63.062L1.002 12V3a1 1 0 0 1 1-1h12z"/></svg>') center / 24px 24px no-repeat;
    mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 16 16"><path fill="black" d="M6.002 5.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z"/><path fill="black" d="M2.002 1a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2h-12zm12 1a1 1 0 0 1 1 1v6.5l-3.777-1.947a.5.5 0 0 0-.577.093l-3.71 3.71-2.66-1.772a.5.5 0 0 0-.63.062L1.002 12V3a1 1 0 0 1 1-1h12z"/></svg>') center / 24px 24px no-repeat;
}

.belonging-photo-upload-overlay-title[b-i89xm7ayqj] {
    color: #1e3a63;
    font-size: 0.98rem;
    font-weight: 600;
}

.belonging-photo-upload-overlay-title span[b-i89xm7ayqj] {
    color: #1665d8;
}

.belonging-photo-upload-overlay-subtitle[b-i89xm7ayqj] {
    color: #9caec4;
    font-size: 0.74rem;
    font-weight: 500;
    margin-top: 0.25rem;
}

.belonging-photos-grid[b-i89xm7ayqj] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 10px;
}

.belonging-photos-limit-badge[b-i89xm7ayqj] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: #f0fdf4;
    border: 1.5px dashed #86efac;
    color: #166534;
    font-size: 0.85rem;
    font-weight: 600;
    padding: 14px;
    border-radius: 12px;
    text-align: center;
}

.belonging-photo-upload-filled-layout[b-i89xm7ayqj] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
    align-items: start;
}

.belonging-photo-file-card[b-i89xm7ayqj] {
    border: 1px solid #d7e2f0;
    border-radius: 12px;
    background: #ffffffcc;
    padding: 10px;
    height: 120px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.belonging-photo-thumbnail-btn[b-i89xm7ayqj] {
    border: none;
    background: transparent;
    padding: 0;
    border-radius: 8px;
    cursor: zoom-in;
    width: 86px;
    height: 86px;
    overflow: hidden;
    flex-shrink: 0;
}

.belonging-photo-upload-preview-image[b-i89xm7ayqj] {
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: cover;
    border-radius: 8px;
}

.belonging-photo-file-info[b-i89xm7ayqj] {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.belonging-photo-file-name[b-i89xm7ayqj] {
    font-size: 1.05rem;
    color: #28456f;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.belonging-photo-file-size[b-i89xm7ayqj] {
    font-size: 0.95rem;
    color: #6b87ac;
}

.belonging-photo-file-actions[b-i89xm7ayqj] {
    display: flex;
    gap: 6px;
}

.belonging-photo-action-btn[b-i89xm7ayqj] {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    border: 1px solid #d7e2f0;
    background: #f8fbff;
    color: #355f93;
    align-items: center;
    justify-content: center;
    display: inline-flex;
    padding: 0;
}

.belonging-photo-action-btn-danger[b-i89xm7ayqj] {
    color: #b42318;
    background: #fff5f4;
    border-color: #f3c2bd;
}

.belonging-photo-change-panel[b-i89xm7ayqj] {
    position: relative;
    border: 1.5px dashed #c1d2e6;
    border-radius: 12px;
    height: 120px;
    background: #ffffff;
    padding: 8px;
}

.belonging-photo-change-trigger[b-i89xm7ayqj] {
    display: block;
    width: 100%;
    min-height: 102px;
    cursor: pointer;
    position: relative;
}

.belonging-photo-change-overlay[b-i89xm7ayqj] {
    position: absolute;
    inset: 0;
    border: 1.5px dashed #c1d2e6;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    pointer-events: none;
}

.belonging-photo-preview-modal[b-i89xm7ayqj] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.72);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.belonging-photo-preview-modal-content[b-i89xm7ayqj] {
    position: relative;
    width: min(900px, 95vw);
    max-height: 90vh;
    background: #fff;
    border-radius: 12px;
    padding: 0.75rem;
}

.belonging-photo-preview-modal-image[b-i89xm7ayqj] {
    width: 100%;
    max-height: calc(90vh - 2rem);
    object-fit: contain;
    border-radius: 8px;
}

.belonging-photo-preview-modal-close[b-i89xm7ayqj] {
    position: absolute;
    top: -12px;
    right: -12px;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 50%;
    background: #ffffff;
    color: #111827;
    font-size: 1.2rem;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25);
}

@media (max-width: 768px) {
    .belonging-photo-preview[b-i89xm7ayqj] {
        max-width: 90vw;
        max-height: 160px;
    }
    
    .belonging-photo-preview-container[b-i89xm7ayqj] {
        margin-top: 1rem;
    }

    .belonging-photo-upload-trigger[b-i89xm7ayqj],
    .belonging-photo-change-trigger[b-i89xm7ayqj] {
        min-height: 110px;
    }

    .belonging-photo-upload-filled-layout[b-i89xm7ayqj] {
        grid-template-columns: 1fr;
    }

    .belonging-photo-file-card[b-i89xm7ayqj],
    .belonging-photo-change-panel[b-i89xm7ayqj] {
        min-height: 110px;
    }
}
/* /Components/Order/Belongings/DeleteBelongingConfirmModal.razor.rz.scp.css */
/* Delete Belonging Confirmation Modal Styling */

.delete-header-banner[b-sk74636ksl] {
    background: linear-gradient(135deg, rgba(254, 242, 242, 0.95) 0%, rgba(255, 237, 213, 0.6) 100%);
    border: 1px solid rgba(254, 202, 202, 0.8);
    border-radius: 0.85rem;
    padding: 1rem 1.25rem;
}

.delete-icon-wrapper[b-sk74636ksl] {
    width: 48px;
    height: 48px;
    min-width: 48px;
    border-radius: 50%;
    background: #fef2f2;
    border: 2px solid #fca5a5;
    color: #dc2626;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(220, 38, 38, 0.15);
}

.option-card[b-sk74636ksl] {
    position: relative;
    border: 2px solid #e2e8f0;
    border-radius: 0.85rem;
    padding: 1.1rem 1.25rem;
    background-color: #ffffff;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    user-select: none;
}

.option-card:hover[b-sk74636ksl] {
    border-color: #cbd5e1;
    background-color: #f8fafc;
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
}

/* Selected state - Option 1 (Primary/Indigo) */
.option-card.active-option-1[b-sk74636ksl] {
    border-color: var(--primary-color, #702f8a);
    background-color: #fcf7ff;
    box-shadow: 0 6px 20px rgba(112, 47, 138, 0.12);
}

.option-card.active-option-1 .radio-circle[b-sk74636ksl] {
    border-color: var(--primary-color, #702f8a);
    background-color: var(--primary-color, #702f8a);
}

.option-card.active-option-1 .radio-circle-dot[b-sk74636ksl] {
    opacity: 1;
    transform: scale(1);
}

/* Selected state - Option 2 (Danger/Red) */
.option-card.active-option-2[b-sk74636ksl] {
    border-color: #ef4444;
    background-color: #fff5f5;
    box-shadow: 0 6px 20px rgba(239, 68, 68, 0.14);
}

.option-card.active-option-2 .radio-circle[b-sk74636ksl] {
    border-color: #ef4444;
    background-color: #ef4444;
}

.option-card.active-option-2 .radio-circle-dot[b-sk74636ksl] {
    opacity: 1;
    transform: scale(1);
}

/* Custom Radio Circle */
.radio-circle[b-sk74636ksl] {
    width: 22px;
    height: 22px;
    min-width: 22px;
    border-radius: 50%;
    border: 2px solid #cbd5e1;
    background-color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
    margin-top: 2px;
}

.radio-circle-dot[b-sk74636ksl] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #ffffff;
    opacity: 0;
    transform: scale(0);
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.option-icon-box[b-sk74636ksl] {
    width: 38px;
    height: 38px;
    min-width: 38px;
    border-radius: 0.6rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.option-icon-box-primary[b-sk74636ksl] {
    background-color: #f3e8ff;
    color: #702f8a;
}

.option-icon-box-danger[b-sk74636ksl] {
    background-color: #fee2e2;
    color: #dc2626;
}

.btn-gradient-danger-arregly[b-sk74636ksl] {
    background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%) !important;
    border-color: #dc2626 !important;
    color: #ffffff !important;
}

.btn-gradient-danger-arregly:hover[b-sk74636ksl] {
    opacity: 0.9 !important;
    box-shadow: 0 4px 12px rgba(220, 38, 38, 0.3) !important;
}
/* /Components/Order/Belongings/OrderBelongingCreateModal.razor.rz.scp.css */
.order-belonging-create-grid[b-1d8gigleds] {
    display: grid;
    gap: 12px;
}
/* /Components/Order/Belongings/OrderBelongingDetailsModal.razor.rz.scp.css */
/* Order Belonging Details Modal Styling */

.belonging-hero-card[b-56pi924ghy] {
    background: linear-gradient(135deg, rgba(243, 232, 255, 0.85) 0%, rgba(238, 242, 255, 0.85) 100%);
    border: 1px solid rgba(221, 214, 254, 0.9);
    border-radius: 0.85rem;
    box-shadow: 0 2px 8px rgba(112, 47, 138, 0.05);
}

.belonging-hero-avatar[b-56pi924ghy] {
    width: 46px;
    height: 46px;
    min-width: 46px;
    border-radius: 50%;
    background: #ffffff;
    border: 2px solid #ddd6fe;
    color: var(--primary-color, #702f8a);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(112, 47, 138, 0.12);
}

.belonging-status-pill[b-56pi924ghy] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.85rem;
    border-radius: 50rem;
    font-size: 0.8rem;
    font-weight: 700;
    border: 1px solid transparent;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}

.belonging-status-dot[b-56pi924ghy] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
}

.detail-card-box[b-56pi924ghy] {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 0.85rem;
    padding: 1.15rem 1.25rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
    transition: box-shadow 0.2s ease;
}

.detail-card-box:hover[b-56pi924ghy] {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.detail-icon-circle[b-56pi924ghy] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background-color: #f1f5f9;
    display: flex;
    align-items: center;
    justify-content: center;
}

.info-field-item[b-56pi924ghy] {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.info-field-label[b-56pi924ghy] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.info-field-value[b-56pi924ghy] {
    font-size: 0.9rem;
}

.identification-code-box[b-56pi924ghy] {
    background-color: #f8fafc;
    border: 1px dashed #cbd5e1;
    transition: all 0.2s ease;
}

.identification-code-box:hover[b-56pi924ghy] {
    border-color: #702f8a;
    background-color: #faf5ff;
}

.condition-callout-box[b-56pi924ghy] {
    background-color: #fffbeb;
    border: 1px solid #fef3c7;
    border-left: 4px solid #f59e0b;
}

.description-box[b-56pi924ghy] {
    background-color: #f8fafc;
    border: 1px solid #f1f5f9;
    color: #334155;
    min-height: 48px;
}

/* Photography Thumbnails */
.order-belonging-photo-grid[b-56pi924ghy] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 12px;
}

.photo-thumbnail-card[b-56pi924ghy] {
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    overflow: hidden;
    background: #ffffff;
    cursor: pointer;
    transition: all 0.2s ease;
}

.photo-thumbnail-card:hover[b-56pi924ghy] {
    border-color: #cbd5e1;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.photo-thumbnail-wrapper[b-56pi924ghy] {
    position: relative;
    width: 100%;
    height: 120px;
    background-color: #f1f5f9;
    overflow: hidden;
}

.photo-thumbnail-img[b-56pi924ghy] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.photo-thumbnail-card:hover .photo-thumbnail-img[b-56pi924ghy] {
    transform: scale(1.05);
}

.photo-thumbnail-overlay[b-56pi924ghy] {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.photo-thumbnail-card:hover .photo-thumbnail-overlay[b-56pi924ghy] {
    opacity: 1;
}

.extra-small[b-56pi924ghy] {
    font-size: 0.75rem;
}

/* Identification Preview */
.order-identification-preview[b-56pi924ghy] {
    border: 1px dashed #cbd5e1;
    border-radius: 12px;
    padding: 16px;
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.order-belonging-identification-image[b-56pi924ghy] {
    max-width: 330px;
    max-height: 140px;
    width: auto;
    height: auto;
    object-fit: contain;
}

/* Zoom Overlay */
.order-photo-zoom-overlay[b-56pi924ghy] {
    position: fixed;
    inset: 0;
    z-index: 1200;
    background: rgba(15, 23, 42, 0.75);
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.order-photo-zoom-content[b-56pi924ghy] {
    background: #ffffff;
    border-radius: 1rem;
    padding: 1.25rem;
    max-width: min(92vw, 980px);
    max-height: 92vh;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.2);
    overflow: auto;
}

.order-photo-zoom-image[b-56pi924ghy] {
    display: block;
    max-width: 100%;
    max-height: 76vh;
    object-fit: contain;
    border-radius: 0.5rem;
}

.order-photo-zoom-close[b-56pi924ghy] {
    color: #6b7280;
}

/* Evidence items */
.evidence-item-card[b-56pi924ghy] {
    background-color: #ffffff;
    border-color: #f1f5f9 !important;
    transition: background-color 0.15s ease;
}

.evidence-item-card:hover[b-56pi924ghy] {
    background-color: #f8fafc;
}
/* /Components/Order/Belongings/OrderBelongingEditModal.razor.rz.scp.css */
.order-belonging-edit-grid[b-uqvmkbux3p] {
    display: grid;
    gap: 12px;
}
/* /Components/Order/Belongings/OrderBelongingServicesModal.razor.rz.scp.css */
/* Order Belonging Services Modal Styling */

.belonging-services-hero[b-i84o0yrs8q] {
    background: linear-gradient(135deg, rgba(243, 232, 255, 0.85) 0%, rgba(238, 242, 255, 0.85) 100%);
    border: 1px solid rgba(221, 214, 254, 0.9);
    border-radius: 0.85rem;
    padding: 1rem 1.25rem;
}

.belonging-hero-icon[b-i84o0yrs8q] {
    width: 44px;
    height: 44px;
    min-width: 44px;
    border-radius: 50%;
    background: #ffffff;
    border: 2px solid #ddd6fe;
    color: var(--primary-color, #702f8a);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 10px rgba(112, 47, 138, 0.1);
}

/* Custom Table Container & Scrollbar */
.table-scroll-container[b-i84o0yrs8q] {
    max-height: 320px;
    overflow-y: auto;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    background-color: #ffffff;
}

.table-scroll-container[b-i84o0yrs8q]::-webkit-scrollbar {
    width: 6px;
}

.table-scroll-container[b-i84o0yrs8q]::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 4px;
}

.table-scroll-container[b-i84o0yrs8q]::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}

.table-scroll-container[b-i84o0yrs8q]::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

.belonging-services-table[b-i84o0yrs8q] {
    margin-bottom: 0;
}

.belonging-services-table thead th[b-i84o0yrs8q] {
    background-color: #f8fafc;
    color: #475569;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #e2e8f0;
    position: sticky;
    top: 0;
    z-index: 2;
}

.belonging-services-table tbody td[b-i84o0yrs8q] {
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #f1f5f9;
    font-size: 0.875rem;
}

.belonging-services-table tbody tr:last-child td[b-i84o0yrs8q] {
    border-bottom: none;
}

.belonging-services-table tbody tr[b-i84o0yrs8q] {
    transition: background-color 0.15s ease-in-out;
}

.belonging-services-table tbody tr:hover[b-i84o0yrs8q] {
    background-color: #f8fafc;
}

.row-unlink-marked[b-i84o0yrs8q] {
    background-color: #fff1f2 !important;
}

.row-unlink-marked td[b-i84o0yrs8q] {
    color: #9f1239;
}

/* Status Badge Pill */
.status-pill-badge[b-i84o0yrs8q] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.25rem 0.65rem;
    border-radius: 50rem;
    font-size: 0.75rem;
    font-weight: 600;
}

.status-pill-dot[b-i84o0yrs8q] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
}

/* Service Action Cards (Linking / New) */
.section-card-box[b-i84o0yrs8q] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    padding: 1rem 1.15rem;
}

.section-card-box-primary[b-i84o0yrs8q] {
    background-color: #faf5ff;
    border: 1px solid #f3e8ff;
}

.pending-item-card[b-i84o0yrs8q] {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 0.6rem;
    padding: 0.6rem 0.85rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    transition: all 0.15s ease;
}

.pending-item-card:hover[b-i84o0yrs8q] {
    border-color: #cbd5e1;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
}

.btn-icon-danger[b-i84o0yrs8q] {
    color: #ef4444;
    background: transparent;
    border: none;
    padding: 0.25rem;
    border-radius: 0.375rem;
    transition: background-color 0.15s ease;
}

.btn-icon-danger:hover[b-i84o0yrs8q] {
    background-color: #fee2e2;
    color: #dc2626;
}
/* /Components/Order/CostBreakdown.razor.rz.scp.css */
.cost-breakdown-card[b-5ok3qdtkcv] {
    width: 100%;
}

.cost-breakdown-table[b-5ok3qdtkcv] {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    overflow: hidden;
    background-color: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.cost-breakdown-row[b-5ok3qdtkcv] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 16px;
    border-bottom: 1px solid #e2e8f0;
    font-size: 0.875rem;
    color: #475569;
    background-color: #ffffff;
}

.cost-breakdown-row:last-child[b-5ok3qdtkcv] {
    border-bottom: none;
}

.cost-label[b-5ok3qdtkcv] {
    font-weight: 500;
}

.cost-value[b-5ok3qdtkcv] {
    text-align: right;
}

.cost-row-discount[b-5ok3qdtkcv] {
    background-color: #fcfdfd;
}

.cost-row-discount .cost-value[b-5ok3qdtkcv] {
    color: #16a34a !important;
}

.cost-row-total-taxes[b-5ok3qdtkcv] {
    background-color: #f8fafc;
}

.cost-row-grand-total[b-5ok3qdtkcv] {
    background-color: #f8fafc;
    border-top: 1px solid #e2e8f0;
}

.cost-row-grand-total .cost-value[b-5ok3qdtkcv] {
    color: #16a34a !important;
    font-size: 1rem;
}

@media (max-width: 768px) {
    .cost-breakdown-row[b-5ok3qdtkcv] {
        padding: 8px 10px;
        font-size: 0.8125rem;
    }

    .cost-breakdown-card h6[b-5ok3qdtkcv] {
        margin-bottom: 8px !important;
        font-size: 0.75rem;
    }
}
/* /Components/Order/Create/OrderCreateModal.razor.rz.scp.css */
.order-create-modal-content[b-w2pr4l5yw5] {
    min-height: 450px;
    margin: 0 !important;
    padding: 0 !important;
}

.order-create-modal-content[b-w2pr4l5yw5],
.order-create-modal-content *[b-w2pr4l5yw5] {
    font-family: 'Poppins', sans-serif !important;
}

.order-summary-card[b-w2pr4l5yw5] {
    max-width: 420px;
}

[b-w2pr4l5yw5] .picker-arregly.k-invalid,
[b-w2pr4l5yw5] .picker-arregly.k-invalid:focus-within,
[b-w2pr4l5yw5] .picker-arregly.k-picker.k-invalid,
[b-w2pr4l5yw5] .picker-arregly.k-datepicker.k-invalid {
    border-color: #d0d5dd !important;
    box-shadow: none !important;
}

[b-w2pr4l5yw5] .picker-arregly.k-invalid .k-input-inner,
[b-w2pr4l5yw5] .picker-arregly.k-picker.k-invalid .k-input-inner,
[b-w2pr4l5yw5] .picker-arregly.k-datepicker.k-invalid .k-input-inner {
    color: #101828 !important;
}

/* Override local para legibilidad de botón deshabilitado en footer */
[b-w2pr4l5yw5] .btn-outline-primary-arregly:disabled,
[b-w2pr4l5yw5] .btn-outline-primary-arregly.k-disabled {
    background: #f8fafc !important; /* Fondo gris neutro claro */
    color: #94a3b8 !important;      /* Texto gris medio legible */
    border: 1px solid #e2e8f0 !important;
    opacity: 1 !important;           /* Forzamos opacidad total para contraste */
    cursor: not-allowed !important;
    box-shadow: none !important;
}

/* Garantizamos que el texto de Telerik herede el color */
[b-w2pr4l5yw5] .btn-outline-primary-arregly:disabled .k-button-text,
[b-w2pr4l5yw5] .btn-outline-primary-arregly.k-disabled .k-button-text {
    color: #94a3b8 !important;
}

/* Estandarización de bordes, radio de curvatura y fondo en inputs */
[b-w2pr4l5yw5] .k-textbox,
[b-w2pr4l5yw5] .k-picker,
[b-w2pr4l5yw5] .k-datepicker,
[b-w2pr4l5yw5] .k-dropdownlist,
[b-w2pr4l5yw5] .k-numerictextbox,
[b-w2pr4l5yw5] .k-textarea,
[b-w2pr4l5yw5] .form-select,
[b-w2pr4l5yw5] .form-control {
    border: 1px solid #d0d5dd !important;
    border-radius: 12px !important;
    background-color: #ffffff !important;
}

/* Estandarización de bordes y curvaturas en todas las cards y paneles del modal */
[b-w2pr4l5yw5] .card,
[b-w2pr4l5yw5] .order-section-card,
[b-w2pr4l5yw5] .order-aside-card {
    border: 1px solid #d0d5dd !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    background-color: #ffffff !important;
}

[b-w2pr4l5yw5] .order-section-card__header,
[b-w2pr4l5yw5] .order-aside-card__header {
    border-bottom: 1px solid #d0d5dd !important;
    background-color: #ffffff !important;
}

.empty-belongings-box[b-w2pr4l5yw5] {
    border: 1px solid #d0d5dd !important;
    border-radius: 12px !important;
    background-color: #ffffff !important;
    color: #667085 !important;
    padding: 24px !important;
    text-align: center !important;
    font-weight: 500 !important;
}

/* Drawer de Pertenencias dentro del Modal */
.belonging-drawer-backdrop[b-w2pr4l5yw5] {
    /* position: absolute !important;
    top: -48px !important;
    left: -24px !important;
    right: -24px !important;
    bottom: -24px !important;
    background: rgba(0, 0, 0, 0.15) !important;
    backdrop-filter: blur(1px) !important;
    -webkit-backdrop-filter: blur(1px) !important;
    z-index: 1040 !important;
    border-radius: 0 !important;*/
    position: absolute !important;
    top: 0 !important;
    left: -24px !important;
    right: -24px !important;
    bottom: 0 !important;
    background: rgba(0, 0, 0, 0.25) !important;
    backdrop-filter: blur(1px) !important;
    -webkit-backdrop-filter: blur(1px) !important;
    z-index: 1040 !important;
    border-radius: 0 !important; /* Mantiene la curvatura del modal principal */
    height: 100% !important;
}

.belonging-drawer-panel[b-w2pr4l5yw5] {
    /*position: absolute !important;
    top: -48px !important;
    left: -24px !important;
    bottom: -24px !important;
    width: 580px !important;
    max-width: 90% !important;
    background-color: #ffffff !important;
    z-index: 1050 !important;
    box-shadow: 4px 0 16px rgba(16, 24, 40, 0.08) !important;
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
    border-bottom-left-radius: 12px !important;
    border-right: 1px solid #eaecf0 !important;
    display: flex !important;
    flex-direction: column !important;
    animation: slideInLeft 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    overflow: hidden !important;*/
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    bottom: 0 !important;
    width: 580px !important;
    max-width: 90% !important;
    background-color: #ffffff !important;
    z-index: 1050 !important;
    box-shadow: 4px 0 16px rgba(16, 24, 40, 0.08) !important;
    border-top-left-radius: 16px !important; /* Coincide con el modal principal */
    border-bottom-left-radius: 16px !important;
    border-top-right-radius: 0px !important;
    border-right: 1px solid #eaecf0 !important;
    display: flex !important;
    flex-direction: column !important;
    animation: slideInLeft-b-w2pr4l5yw5 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    overflow: hidden !important;
}

@keyframes slideInLeft-b-w2pr4l5yw5 {
    from {
        transform: translateX(-100%);
    }
    to {
        transform: translateX(0);
    }
}

.belonging-drawer-header[b-w2pr4l5yw5] {
    /*padding: 16px 24px !important;
    margin: 0 !important;
    background-color: #ffffff !important;
    color: #101828 !important;
    border-bottom: 1px solid #eaecf0 !important;
    border-top-left-radius: 0px !important;
    border-top-right-radius: 0px !important;
    border-radius: 0px !important;*/
    padding: 20px 24px !important; /* Padding adecuado para separar el título del borde superior */
    margin: 0 !important;
    background-color: #ffffff !important;
    color: #101828 !important;
    border-bottom: 1px solid #eaecf0 !important;
    flex-shrink: 0; /* Evita que el header se aplaste si el contenido crece */
}

.custom-modal[b-w2pr4l5yw5] {
    position: relative !important; /* Garantiza el contexto de posicionamiento */
    overflow: hidden !important; /* Elimina el scrollbar lateral del modal principal */
}

[b-w2pr4l5yw5] .drawer-close-btn {
    color: #667085 !important;
    background: transparent !important;
    border-radius: 8px !important;
    padding: 6px !important;
}

[b-w2pr4l5yw5] .drawer-close-btn:hover {
    color: #101828 !important;
    background: #f1f5f9 !important;
}

.belonging-drawer-body[b-w2pr4l5yw5] {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
    background-color: #ffffff;
}

.belonging-drawer-footer[b-w2pr4l5yw5] {
    padding: 16px 24px;
    border-top: 1px solid #e2e8f0;
    background-color: transparent;
    box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.03);
}

[b-w2pr4l5yw5] .btn-outline-secondary-arregly {
    background-color: #ffffff !important;
    color: #475569 !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 12px !important;
    font-weight: 500 !important;
    padding: 8px 16px !important;
}

[b-w2pr4l5yw5] .btn-outline-secondary-arregly:hover {
    background-color: #f1f5f9 !important;
    color: #1e293b !important;
    border-color: #94a3b8 !important;
}

/* Tarjetas de Pertenencia Modernas */
[b-w2pr4l5yw5] .belonging-modern-card {
    border: 1px solid #eaecf0 !important;
    border-radius: 12px !important;
    background-color: #ffffff !important;
    box-shadow: 0 1px 3px rgba(16, 24, 40, 0.05) !important;
    transition: all 0.2s ease-in-out;
}

[b-w2pr4l5yw5] .belonging-modern-card:hover {
    border-color: #d0d5dd !important;
    box-shadow: 0 4px 8px -2px rgba(16, 24, 40, 0.1) !important;
}

.belonging-card-thumb-wrapper[b-w2pr4l5yw5] {
    width: 64px;
    height: 64px;
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.belonging-card-thumb[b-w2pr4l5yw5] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.belonging-card-thumb-placeholder[b-w2pr4l5yw5] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    gap: 2px;
}

.belonging-card-thumb-placeholder .placeholder-icon[b-w2pr4l5yw5] {
    font-size: 1.25rem;
}

.belonging-card-thumb-placeholder .placeholder-text[b-w2pr4l5yw5] {
    font-size: 0.65rem;
    font-weight: 500;
}

.belonging-card-title[b-w2pr4l5yw5] {
    font-size: 0.95rem;
    color: #101828;
}

.belonging-card-title:hover[b-w2pr4l5yw5] {
    color: #0284c7 !important;
}

.belonging-card-details[b-w2pr4l5yw5] {
    color: #64748b;
}

.cursor-pointer[b-w2pr4l5yw5] {
    cursor: pointer;
}

/* Estilos modernos y delicados para la sección de Servicios de Pertenencia */
.belonging-services-header-icon[b-w2pr4l5yw5] {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    background: rgba(102, 126, 234, 0.12);
    color: var(--primary-color);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.9rem;
}

.badge-service-count[b-w2pr4l5yw5] {
    background-color: #f1f5f9;
    color: #475569;
    font-size: 0.72rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
}

/* Estado vacío elegante */
.belonging-services-empty-state[b-w2pr4l5yw5] {
    border: 1.5px dashed #cbd5e1;
    border-radius: 12px;
    background-color: #f8fafc;
    padding: 20px 16px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
}

.belonging-services-empty-state .empty-state-icon-wrap[b-w2pr4l5yw5] {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background-color: #ffffff;
    color: #94a3b8;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    border: 1px solid #e2e8f0;
}

.belonging-services-empty-state .empty-state-title[b-w2pr4l5yw5] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #334155;
    margin: 0;
}

.belonging-services-empty-state .empty-state-subtitle[b-w2pr4l5yw5] {
    font-size: 0.75rem;
    color: #64748b;
    margin: 0;
}

/* Tabla moderna y delicada */
.belonging-services-table-wrapper[b-w2pr4l5yw5] {
    border: 1px solid #eaecf0;
    border-radius: 12px;
    overflow: hidden;
    background-color: #ffffff;
    box-shadow: 0 1px 3px rgba(16, 24, 40, 0.03);
}

.belonging-services-table[b-w2pr4l5yw5] {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
}

.belonging-services-table thead th[b-w2pr4l5yw5] {
    background-color: #f8fafc;
    color: #64748b;
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 10px 12px;
    border-bottom: 1px solid #eaecf0;
}

.belonging-service-row[b-w2pr4l5yw5] {
    transition: background-color 0.15s ease-in-out;
}

.belonging-service-row:hover[b-w2pr4l5yw5] {
    background-color: #f8fafc;
}

.belonging-service-row td[b-w2pr4l5yw5] {
    padding: 12px;
    border-bottom: 1px solid #f1f5f9;
    vertical-align: middle;
}

.belonging-service-row:last-child td[b-w2pr4l5yw5] {
    border-bottom: none;
}

.service-row-dot[b-w2pr4l5yw5] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background-color: var(--primary-color);
    display: inline-block;
    flex-shrink: 0;
}

.badge-qty[b-w2pr4l5yw5] {
    background-color: #f1f5f9;
    color: #334155;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 3px 8px;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
}

.fs-7[b-w2pr4l5yw5] {
    font-size: 0.85rem !important;
}

/* Botones de Acción Estilizados */
.btn-service-action[b-w2pr4l5yw5] {
    width: 30px;
    height: 30px;
    border-radius: 8px;
    border: 1px solid transparent;
    background-color: transparent;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    font-size: 0.9rem;
}

.btn-service-edit[b-w2pr4l5yw5] {
    color: #475569;
}

.btn-service-edit:hover[b-w2pr4l5yw5] {
    background-color: #f1f5f9;
    color: var(--primary-color);
    border-color: #cbd5e1;
}

.btn-service-delete[b-w2pr4l5yw5] {
    color: #94a3b8;
}

.btn-service-delete:hover[b-w2pr4l5yw5] {
    background-color: #fef2f2;
    color: #ef4444;
    border-color: #fecaca;
}

/* Banner Informativo Moderno */
.order-info-banner[b-w2pr4l5yw5] {
    background-color: #f0f9ff !important;
    border: 1px solid #b9e6fe !important;
    border-left: 4px solid #0284c7 !important;
    border-radius: 12px !important;
    padding: 14px 18px !important;
    box-shadow: 0 2px 6px rgba(2, 132, 199, 0.05) !important;
}

.info-banner-icon[b-w2pr4l5yw5] {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    background-color: #e0f2fe;
    color: #0284c7;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}

.info-banner-text[b-w2pr4l5yw5] {
    font-size: 0.875rem;
    line-height: 1.4;
}

@media (max-width: 768px) {
    .belonging-drawer-panel[b-w2pr4l5yw5] {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        background-color: #ffffff !important;
        z-index: 1050 !important;
        box-shadow: 4px 0 16px rgba(16, 24, 40, 0.08) !important;
        border-top-left-radius: 16px !important; /* Coincide con el modal principal */
        border-bottom-left-radius: 16px !important;
        border-top-right-radius: 0px !important;
        border-right: 1px solid #eaecf0 !important;
        display: flex !important;
        flex-direction: column !important;
        animation: slideInLeft-b-w2pr4l5yw5 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
        overflow: hidden !important;
    }
}
/* /Components/Order/Detail/Cards/OrderDetailPendingSignatureCard.razor.rz.scp.css */
[b-xg50m5rsj4] .btn-order-action-compact,
.btn-order-action-compact[b-xg50m5rsj4] {
    width: auto !important;
    max-width: max-content !important;
    min-width: 0 !important;
}
/* /Components/Order/Invoice/GenerateInvoiceModal.razor.rz.scp.css */
/* ═══════════════════════════════════════════════
   GenerateInvoiceModal — Scoped Styles
   ═══════════════════════════════════════════════ */

/* ── Icon del header ── */
.invoice-modal-icon[b-uoj2n1bfs1] {
    font-size: 1.3rem;
}

/* ═══════ PASO 1: Generar Factura ═══════ */

.invoice-generate-step[b-uoj2n1bfs1] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* Card resumen de la orden */
.invoice-summary-card[b-uoj2n1bfs1] {
    background-color: #f8fafb;
    border: 1px solid #e8ecef;
    border-radius: 10px;
    padding: 1rem 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.invoice-summary-row[b-uoj2n1bfs1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.invoice-label[b-uoj2n1bfs1] {
    color: #6b7280;
    font-size: 0.9rem;
    font-weight: 500;
}

.invoice-value[b-uoj2n1bfs1] {
    font-weight: 600;
    color: #1f2937;
    font-size: 0.9rem;
}

.invoice-code[b-uoj2n1bfs1] {
    font-family: 'Courier New', monospace;
    letter-spacing: 1px;
    color: #374151;
}

.invoice-total-row[b-uoj2n1bfs1] {
    border-top: 1px solid #e5e7eb;
    padding-top: 0.6rem;
    margin-top: 0.25rem;
}

.invoice-amount[b-uoj2n1bfs1] {
    font-size: 1.15rem;
    font-weight: 700;
    color: #059669;
}

/* Sección de notas */
.invoice-notes-section[b-uoj2n1bfs1] {
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.invoice-notes-label[b-uoj2n1bfs1] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #4b5563;
}

.invoice-textarea[b-uoj2n1bfs1] {
    width: 100%;
    border: 1.5px solid #d1d5db;
    border-radius: 8px;
    padding: 0.65rem 0.85rem;
    font-size: 0.875rem;
    color: #374151;
    resize: vertical;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    font-family: inherit;
    min-height: 70px;
    background: #fff;
}

.invoice-textarea:focus[b-uoj2n1bfs1] {
    outline: none;
    border-color: #10b981;
    box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.12);
}

.invoice-textarea[b-uoj2n1bfs1]::placeholder {
    color: #9ca3af;
}

.invoice-textarea:disabled[b-uoj2n1bfs1] {
    background: #f3f4f6;
    cursor: not-allowed;
}

/* Alerta de error */
.invoice-error-alert[b-uoj2n1bfs1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background-color: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 0.6rem 0.85rem;
    color: #dc2626;
    font-size: 0.85rem;
    font-weight: 500;
}

/* ═══════ PASO 2: Enviar por Email ═══════ */

.invoice-email-step[b-uoj2n1bfs1] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* Card del destinatario */
.invoice-recipient-card[b-uoj2n1bfs1] {
    background-color: #f8fafb;
    border: 1px solid #e8ecef;
    border-radius: 10px;
    padding: 0.85rem 1.1rem;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.invoice-recipient-label[b-uoj2n1bfs1] {
    font-size: 0.78rem;
    color: #9ca3af;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.invoice-recipient-info[b-uoj2n1bfs1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.invoice-recipient-details[b-uoj2n1bfs1] {
    display: flex;
    flex-direction: column;
}

.invoice-recipient-name[b-uoj2n1bfs1] {
    font-weight: 600;
    color: #1f2937;
    font-size: 0.95rem;
}

.invoice-recipient-email[b-uoj2n1bfs1] {
    color: #6b7280;
    font-size: 0.85rem;
}

.invoice-verified-badge[b-uoj2n1bfs1] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    color: #059669;
    font-size: 0.8rem;
    font-weight: 600;
    background-color: #ecfdf5;
    padding: 0.25rem 0.65rem;
    border-radius: 20px;
}

/* Sección vista previa del email */
.invoice-email-preview-section[b-uoj2n1bfs1] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.invoice-preview-label[b-uoj2n1bfs1] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #6b7280;
}

.invoice-email-preview-card[b-uoj2n1bfs1] {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
}

.invoice-email-subject[b-uoj2n1bfs1] {
    background-color: #f9fafb;
    padding: 0.65rem 1rem;
    border-bottom: 1px solid #e5e7eb;
    font-size: 0.85rem;
    color: #374151;
}

.invoice-email-subject-label[b-uoj2n1bfs1] {
    font-weight: 600;
    margin-right: 0.35rem;
    color: #6b7280;
}

.invoice-email-body[b-uoj2n1bfs1] {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
}

.invoice-email-greeting[b-uoj2n1bfs1] {
    margin: 0;
    font-size: 0.875rem;
    color: #374151;
}

.invoice-email-text[b-uoj2n1bfs1] {
    margin: 0;
    font-size: 0.85rem;
    color: #4b5563;
    line-height: 1.5;
}

.invoice-email-message-extra[b-uoj2n1bfs1] {
    background-color: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 0.75rem;
}

.invoice-message-badge[b-uoj2n1bfs1] {
    border-radius: 14px;
    font-size: 0.78rem;
}

.invoice-email-total-section[b-uoj2n1bfs1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #f8fafb;
    border-radius: 8px;
    padding: 0.75rem 1rem;
    margin-top: 0.25rem;
}

.invoice-email-total-label[b-uoj2n1bfs1] {
    font-size: 0.85rem;
    color: #6b7280;
    font-weight: 500;
}

.invoice-email-total-amount[b-uoj2n1bfs1] {
    font-size: 1.15rem;
    font-weight: 700;
    color: #059669;
}

.invoice-email-attachment[b-uoj2n1bfs1] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.8rem;
    color: #6b7280;
    padding-top: 0.35rem;
    border-top: 1px solid #f3f4f6;
}

/* ── Pantalla de Carga Inicial Personalizada ── */
.invoice-loading-spinner-wrap[b-uoj2n1bfs1] {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(163, 29, 29, 0.08) 0%, rgba(163, 29, 29, 0.16) 100%);
}

.invoice-loading-spinner[b-uoj2n1bfs1] {
    width: 34px;
    height: 34px;
    border-width: 3px;
    border-style: solid;
    border-color: #e2e8f0;
    border-top-color: var(--primary-color, #a31d1d);
    border-radius: 50%;
    animation: invoice-loading-spin-b-uoj2n1bfs1 0.85s linear infinite;
}

.invoice-loading-title[b-uoj2n1bfs1] {
    margin: 0;
    color: #1f2937;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -0.2px;
}

.invoice-loading-subtitle[b-uoj2n1bfs1] {
    margin: 0;
    color: #64748b;
    font-size: 0.92rem;
    line-height: 1.4;
    max-width: 380px;
}

@keyframes invoice-loading-spin-b-uoj2n1bfs1 {
    to {
        transform: rotate(360deg);
    }
}
/* /Components/Order/OrderEditTabs.razor.rz.scp.css */
.order-edit-content[b-eqmm7c0mk2] {
    background: transparent;
}

.order-edit-tabs-header[b-eqmm7c0mk2] {
    position: relative;
}

.order-edit-tabs-actions[b-eqmm7c0mk2] {
    position: absolute;
    top: 8px;
    right: 0;
    z-index: 2;
}

@media (max-width: 991px) {
    .order-edit-tabs-actions[b-eqmm7c0mk2] {
        position: static;
        margin-top: 8px;
        width: 100%;
        justify-content: flex-end;
    }
}
/* /Components/Order/ScannedOrderModal.razor.rz.scp.css */
/* ==========================================================================
   Overlay y Contenedor del Modal (Mayor opacidad y contraste de fondo)
   ========================================================================== */
[b-pcm8o1xv7h] .modal-overlay {
    background: rgba(15, 23, 42, 0.82) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
}

[b-pcm8o1xv7h] .custom-modal {
    background: #ffffff !important;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(0, 0, 0, 0.1) !important;
}

/* ==========================================================================
   Insignias de Estado de Orden (Idénticas a la grilla de Mis Órdenes)
   ========================================================================== */
.order-status-badge[b-pcm8o1xv7h] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.35rem 0.85rem;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1;
    border: 1px solid transparent;
}

.order-status-badge--created[b-pcm8o1xv7h] {
    color: #1d4ed8 !important;
    background-color: #dbeafe !important;
    border-color: #93c5fd !important;
}

.order-status-badge--progress[b-pcm8o1xv7h] {
    color: #92400e !important;
    background-color: #fef3c7 !important;
    border-color: #fcd34d !important;
}

.order-status-badge--completed[b-pcm8o1xv7h] {
    color: #166534 !important;
    background-color: #dcfce7 !important;
    border-color: #86efac !important;
}

.order-status-badge--invoiced[b-pcm8o1xv7h] {
    color: #6d28d9 !important;
    background-color: #ede9fe !important;
    border-color: #c4b5fd !important;
}

.order-status-badge--cancelled[b-pcm8o1xv7h] {
    color: #991b1b !important;
    background-color: #fee2e2 !important;
    border-color: #fca5a5 !important;
}

.order-status-badge--default[b-pcm8o1xv7h] {
    color: #374151 !important;
    background-color: #f3f4f6 !important;
    border-color: #d1d5db !important;
}

/* ==========================================================================
   Estructura y Tarjetas del Modal de Orden Escaneada
   ========================================================================== */
.scanned-modal-icon-badge[b-pcm8o1xv7h] {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background-color: var(--primary-rgba-color, rgba(80, 21, 10, 0.12));
    color: var(--primary-color, #50150a);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    flex-shrink: 0;
}

.scanned-card-highlight[b-pcm8o1xv7h] {
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    border: 1.5px solid #cbd5e1;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.scanned-info-card[b-pcm8o1xv7h] {
    background-color: #ffffff;
    border: 1.5px solid #cbd5e1;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.scanned-info-card:hover[b-pcm8o1xv7h] {
    border-color: #94a3b8;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.07);
}

.scanned-card-header[b-pcm8o1xv7h] {
    font-size: 0.75rem;
    font-weight: 700;
    color: #475569 !important;
    letter-spacing: 0.05em;
}

.scanned-card-title[b-pcm8o1xv7h] {
    font-size: 1rem;
    font-weight: 700;
    color: #0f172a !important;
}

.scanned-field-item[b-pcm8o1xv7h] {
    font-size: 0.85rem;
    color: #1e293b !important;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 0.45rem;
}

.scanned-field-item i[b-pcm8o1xv7h] {
    font-size: 0.875rem;
    color: #64748b !important;
    flex-shrink: 0;
}

.scanned-footer-barcode[b-pcm8o1xv7h] {
    background-color: #f1f5f9;
    border: 1.5px solid #cbd5e1;
}

.scanned-belonging-avatar[b-pcm8o1xv7h] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--primary-rgba-color, rgba(80, 21, 10, 0.15));
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    flex-shrink: 0;
}

.scanned-belonging-avatar:hover[b-pcm8o1xv7h] {
    transform: scale(1.1);
    border-color: var(--primary-color, #50150a);
    box-shadow: 0 4px 12px rgba(80, 21, 10, 0.25);
}
/* /Components/Order/ScannerInput.razor.rz.scp.css */
/* ==========================================================================
   Input / Escáner de Código de Barras (Estilos Oficiales Arregly)
   ========================================================================== */
.scanner-input-container[b-x19qstcjcv] {
    position: relative;
    width: 100%;
    display: inline-flex;
    align-items: center;
}

.scanner-icon[b-x19qstcjcv] {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: #667085;
    font-size: 0.9rem;
    pointer-events: none;
    z-index: 2;
    transition: color 0.2s ease;
}

.scanner-textbox-aurocore[b-x19qstcjcv] {
    width: 100%;
    height: 30px;
    padding: 0 12px 0 34px;
    border-radius: 12px;
    border: 1px solid #d0d5dd;
    background-color: #ffffff;
    color: #101828;
    font-size: 0.85rem;
    line-height: 30px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.scanner-textbox-aurocore[b-x19qstcjcv]::placeholder {
    color: #98a2b3;
    font-size: 0.825rem;
}

.scanner-textbox-aurocore:hover[b-x19qstcjcv] {
    border-color: var(--primary-color, #50150a) !important;
    box-shadow: 0 0 0 3px var(--primary-rgba-color, rgba(80, 21, 10, 0.1)) !important;
}

.scanner-textbox-aurocore:focus[b-x19qstcjcv] {
    outline: none;
    border-color: var(--primary-color, #50150a) !important;
    box-shadow: 0 0 0 3px var(--primary-rgba-color, rgba(80, 21, 10, 0.15)) !important;
    background-color: #ffffff;
}

.scanner-textbox-aurocore:focus + .scanner-icon[b-x19qstcjcv],
.scanner-input-container:focus-within .scanner-icon[b-x19qstcjcv] {
    color: var(--primary-color, #50150a);
}

.scanner-textbox-aurocore:disabled[b-x19qstcjcv] {
    background-color: #f2f4f7;
    color: #98a2b3;
    cursor: not-allowed;
}
/* /Components/Order/Services/ServiceTaskBelongingSelector.razor.rz.scp.css */
.belonging-selector-wrapper[b-uy2xzrc12v] {
    display: inline-flex;
    align-items: center;
}

.belonging-assign-btn[b-uy2xzrc12v] {
    opacity: 0.5;
    transition: opacity 0.2s ease;
}

.belonging-assign-btn:hover[b-uy2xzrc12v] {
    opacity: 1;
}

/* Items dentro del popup de Telerik */
[b-uy2xzrc12v] .belonging-item-active {
    background-color: #e8f5e9 !important;
    color: #2e7d32 !important;
    font-weight: 600;
}

[b-uy2xzrc12v] .belonging-item-clear {
    color: #d32f2f !important;
    border-bottom: 1px solid #f0f0f0;
}

[b-uy2xzrc12v] .belonging-item-clear:hover {
    background-color: #fde8e8 !important;
}
/* /Components/Order/Tabs/OrderEditBelongingsTab.razor.rz.scp.css */
.order-belongings-list[b-o825cw9i7m] {
    min-height: 120px;
}

.order-belonging-card[b-o825cw9i7m] {
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

.order-belonging-card:hover[b-o825cw9i7m] {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.02);
    transform: translateY(-2px);
}

.order-section-card[b-o825cw9i7m],
.order-aside-card[b-o825cw9i7m] {
    border: none;
    border-radius: 14px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    background-color: #fff;
    overflow: hidden;
}

.order-section-card__header[b-o825cw9i7m],
.order-aside-card__header[b-o825cw9i7m] {
    background-color: #fff;
    border-bottom: 1px solid #eef2f7;
    padding: 16px 18px;
}

.order-section-card__body[b-o825cw9i7m],
.order-aside-card__body[b-o825cw9i7m] {
    padding: 16px 18px;
}

.order-belongings-filters-container[b-o825cw9i7m] {
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    border: none !important;
    border-radius: 14px;
}

.filter-label[b-o825cw9i7m] {
    font-size: 0.85rem;
    color: #4b5563;
}

.chip-filter[b-o825cw9i7m] {
    border: 1px solid #e5e7eb;
    background-color: #f9fafb;
    color: #4b5563;
    font-size: 0.8rem;
    font-weight: 600;
    padding: 6px 14px;
    border-radius: 20px;
    transition: all 0.2s ease-in-out;
    cursor: pointer;
    outline: none;
}

.chip-filter:hover[b-o825cw9i7m] {
    background-color: #f3f4f6;
    border-color: #d1d5db;
    transform: translateY(-1px);
}

.chip-filter.chip-active[b-o825cw9i7m] {
    background-color: #0b593f;
    color: #ffffff;
    border-color: #0b593f;
    box-shadow: 0 4px 6px -1px rgba(11, 89, 63, 0.2);
}

.empty-belongings-state[b-o825cw9i7m] {
    padding: 50px;
    border-style: dashed !important;
}

.order-belongings-layout[b-o825cw9i7m] {
    align-items: flex-start;
}

.order-belonging-card[b-o825cw9i7m],
.order-aside-card[b-o825cw9i7m] {
    border: none;
    border-radius: 14px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    background-color: #fff;
    overflow: hidden;
}

.order-aside-card__body[b-o825cw9i7m] {
    padding: 16px !important;
}

.order-belonging-card__body[b-o825cw9i7m] {
    padding: 0 !important;
}

.order-aside-card__header[b-o825cw9i7m] {
    background-color: #fff;
    border-bottom: 1px solid #eef2f7;
    padding: 16px !important;
}

.order-aside-data-row[b-o825cw9i7m] {
    font-size: 1.0rem;
}

.order-aside-data-label[b-o825cw9i7m] {
    color: #6b7280;
    margin-right: 12px;
}

.order-aside-data-value[b-o825cw9i7m] {
    font-weight: 700;
    color: #111827;
    text-align: right;
}

.belonging-photo-thumbnail[b-o825cw9i7m] {
    width: 96px;
    height: 96px;
    border-radius: 10px;
    object-fit: cover;
    border: 1px solid #e5e7eb;
    flex-shrink: 0;
}

.order-belonging-card__body[b-o825cw9i7m] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.order-belonging-card__content[b-o825cw9i7m] {
    display: flex;
    align-items: center;
    gap: 16px;
    min-width: 0;
    flex: 1;
}

.order-belonging-card__media[b-o825cw9i7m] {
    flex-shrink: 0;
}

.belonging-photo-thumbnail-placeholder[b-o825cw9i7m] {
    width: 96px;
    height: 96px;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    background-color: #f8fafc;
    color: #94a3b8;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.order-belonging-card__info[b-o825cw9i7m] {
    min-width: 0;
}

.order-belonging-card__actions[b-o825cw9i7m] {
    display: flex;
    align-items: center;
    gap: 4px;
    flex-shrink: 0;
}

[b-o825cw9i7m] .order-belonging-action-btn,
[b-o825cw9i7m] .order-belonging-action-btn.k-button,
[b-o825cw9i7m] .order-belonging-action-btn.k-button:hover,
[b-o825cw9i7m] .order-belonging-action-btn.k-button.k-hover,
[b-o825cw9i7m] .order-belonging-action-btn.k-button:focus,
[b-o825cw9i7m] .order-belonging-action-btn.k-button.k-focus {
    color: #334155 !important;
    border-radius: 8px;
    width: 36px;
    height: 36px;
    min-width: 36px;
    padding: 0 !important;
}

.belonging-photo-preview-modal[b-o825cw9i7m] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.72);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.belonging-photo-preview-modal-content[b-o825cw9i7m] {
    position: relative;
    width: min(900px, 95vw);
    max-height: 90vh;
    background: #fff;
    border-radius: 12px;
    padding: 0.75rem;
}

.belonging-photo-preview-modal-image[b-o825cw9i7m] {
    width: 100%;
    max-height: calc(90vh - 2rem);
    object-fit: contain;
    border-radius: 8px;
}

.belonging-photo-preview-modal-close[b-o825cw9i7m] {
    position: absolute;
    top: -12px;
    right: -12px;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 50%;
    background: #ffffff;
    color: #111827;
    font-size: 1.2rem;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25);
}

[b-o825cw9i7m] .order-belongings-neutral-action-btn,
[b-o825cw9i7m] .order-belongings-neutral-action-btn.k-button,
[b-o825cw9i7m] .order-belongings-neutral-action-btn.k-button:hover,
[b-o825cw9i7m] .order-belongings-neutral-action-btn.k-button.k-hover,
[b-o825cw9i7m] .order-belongings-neutral-action-btn.k-button:focus,
[b-o825cw9i7m] .order-belongings-neutral-action-btn.k-button.k-focus,
[b-o825cw9i7m] .order-belongings-neutral-action-btn.k-button:active,
[b-o825cw9i7m] .order-belongings-neutral-action-btn.k-button.k-active {
    color: #374151 !important;
}

[b-o825cw9i7m] .order-belongings-neutral-action-btn .k-button-text,
[b-o825cw9i7m] .order-belongings-neutral-action-btn .k-svg-icon,
[b-o825cw9i7m] .order-belongings-neutral-action-btn:hover .k-button-text,
[b-o825cw9i7m] .order-belongings-neutral-action-btn:hover .k-svg-icon,
[b-o825cw9i7m] .order-belongings-neutral-action-btn.k-hover .k-button-text,
[b-o825cw9i7m] .order-belongings-neutral-action-btn.k-hover .k-svg-icon,
[b-o825cw9i7m] .order-belongings-neutral-action-btn.k-focus .k-button-text,
[b-o825cw9i7m] .order-belongings-neutral-action-btn.k-focus .k-svg-icon,
[b-o825cw9i7m] .order-belongings-neutral-action-btn.k-active .k-button-text,
[b-o825cw9i7m] .order-belongings-neutral-action-btn.k-active .k-svg-icon {
    color: #374151 !important;
}

.belonging-meta-grid[b-o825cw9i7m] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 3px 10px;
    font-size: 0.78rem;
    line-height: 1.35;
}

@media (max-width: 991px) {
    .order-belongings-main-column > div[b-o825cw9i7m] {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .order-belonging-card__body[b-o825cw9i7m] {
        align-items: flex-start;
    }

    .order-belonging-card__content[b-o825cw9i7m] {
        align-items: flex-start;
    }
}

@media (max-width: 767px) {
    .order-belonging-card__body[b-o825cw9i7m] {
        flex-direction: column;
        align-items: stretch;
        padding: 0 !important;
    }

    .order-belonging-card__content[b-o825cw9i7m] {
        width: 100%;
        gap: 12px;
    }

    .belonging-photo-thumbnail[b-o825cw9i7m],
    .belonging-photo-thumbnail-placeholder[b-o825cw9i7m] {
        width: 90px;
        height: 90px;
        border-radius: 12px 0 0 0;
    }

    .order-belonging-card__actions[b-o825cw9i7m] {
        border-top: 1px solid #f1f5f9;
        width: 100%;
        display: flex;
        justify-content: flex-end;
        align-items: center;
        gap: 6px;
        margin-top: 4px;
        margin-bottom: 6px;
        padding-right: 8px;
    }
}
/* /Components/Order/Tabs/OrderEditDetailTab.razor.rz.scp.css */
.order-edit-layout[b-i4hfdfo4c6] {
    background: transparent !important;
    align-items: flex-start;
}

.order-edit-main-content[b-i4hfdfo4c6] {
    padding: 0;
}

[b-i4hfdfo4c6] .order-section-card,
[b-i4hfdfo4c6] .order-aside-card,
.order-section-card[b-i4hfdfo4c6],
.order-aside-card[b-i4hfdfo4c6] {
    border: none;
    border-radius: 14px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    background-color: #fff;
    overflow: hidden;
}

[b-i4hfdfo4c6] .order-section-card__header,
[b-i4hfdfo4c6] .order-aside-card__header,
.order-section-card__header[b-i4hfdfo4c6],
.order-aside-card__header[b-i4hfdfo4c6] {
    background-color: #fff;
    border-bottom: 1px solid #eef2f7;
    padding: 16px 18px;
}

[b-i4hfdfo4c6] .order-section-card__body,
.order-section-card__body[b-i4hfdfo4c6] {
    padding: 16px 18px;
}

[b-i4hfdfo4c6] .order-section-card__body.p-0,
.order-section-card__body.p-0[b-i4hfdfo4c6] {
    padding: 0 !important;
}

[b-i4hfdfo4c6] .order-aside-card__body,
.order-aside-card__body[b-i4hfdfo4c6] {
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 12px;
    flex-grow: 1;
}

[b-i4hfdfo4c6] .single-button-container,
[b-i4hfdfo4c6] .signature-buttons-container,
.single-button-container[b-i4hfdfo4c6],
.signature-buttons-container[b-i4hfdfo4c6] {
    margin-top: auto !important;
}

[b-i4hfdfo4c6] .order-aside-data-row,
.order-aside-data-row[b-i4hfdfo4c6] {
    font-size: 1.0rem;
}

[b-i4hfdfo4c6] .order-aside-data-label,
.order-aside-data-label[b-i4hfdfo4c6] {
    color: #6b7280;
    margin-right: 12px;
}

[b-i4hfdfo4c6] .order-aside-card .order-aside-data-value,
.order-aside-card .order-aside-data-value[b-i4hfdfo4c6] {
    font-weight: 600 !important;
    color: #111827 !important;
    text-align: right !important;
    letter-spacing: -0.015em !important;
    line-height: 1.25 !important;
}

[b-i4hfdfo4c6] .order-service-item,
.order-service-item[b-i4hfdfo4c6] {
    border: none !important;
    border-bottom: 1px solid #eef2f7 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    overflow: hidden;
}

[b-i4hfdfo4c6] .order-service-item:last-child,
.order-service-item:last-child[b-i4hfdfo4c6] {
    border-bottom: none !important;
}

[b-i4hfdfo4c6] .order-service-history,
.order-service-history[b-i4hfdfo4c6] {
    border-color: #edf0f4 !important;
}

[b-i4hfdfo4c6] .order-products-summary,
.order-products-summary[b-i4hfdfo4c6] {
    border-color: #edf0f4 !important;
    background-color: #fff !important;
}

[b-i4hfdfo4c6] .order-products-table-shell,
.order-products-table-shell[b-i4hfdfo4c6] {
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    background-color: #fff;
}

[b-i4hfdfo4c6] .custom-telerik-grid,
.custom-telerik-grid[b-i4hfdfo4c6] {
    border: 0 !important;
}

[b-i4hfdfo4c6] .order-products-table-shell .k-grid {
    border: 0 !important;
    border-radius: 12px;
    background-color: #fff;
    height: auto !important;
}

[b-i4hfdfo4c6] .order-products-table-shell .k-grid-header,
[b-i4hfdfo4c6] .order-products-table-shell .k-grid-content,
[b-i4hfdfo4c6] .order-products-table-shell .k-grid-header-wrap,
[b-i4hfdfo4c6] .order-products-table-shell .k-grid-content-wrap {
    margin-right: 0 !important;
    padding-right: 0 !important;
    background-color: #fff !important;
}

[b-i4hfdfo4c6] .order-products-table-shell .k-grid-content-wrap {
    overflow-x: hidden !important;
}

[b-i4hfdfo4c6] .order-products-table-shell .k-grid-content,
[b-i4hfdfo4c6] .order-products-table-shell .k-grid-content-wrap,
[b-i4hfdfo4c6] .order-products-table-shell .k-table-container {
    max-height: none !important;
    height: auto !important;
    overflow-y: visible !important;
}

[b-i4hfdfo4c6] .order-products-table-shell .k-grid-header table,
[b-i4hfdfo4c6] .order-products-table-shell .k-grid-content table {
    table-layout: fixed !important;
    width: 100% !important;
}

[b-i4hfdfo4c6] .order-products-table-shell .k-grid-header th,
[b-i4hfdfo4c6] .order-products-table-shell .k-grid-content td {
    box-sizing: border-box;
}

[b-i4hfdfo4c6] .order-section-card .btn.btn-sm.border-0.p-0,
[b-i4hfdfo4c6] .order-section-card .k-button.btn.btn-sm.border-0.p-0 {
    background-color: transparent !important;
    box-shadow: none !important;
}

[b-i4hfdfo4c6] .order-section-card .btn-arregly-add-warning,
[b-i4hfdfo4c6] .order-section-card .btn-arregly-add-warning.k-button {
    background-color: transparent !important;
    color: #bb4d00 !important;
    border: 1px solid #ffd230 !important;
}

[b-i4hfdfo4c6] .order-section-card .btn-arregly-add-warning:hover,
[b-i4hfdfo4c6] .order-section-card .btn-arregly-add-warning.k-button:hover {
    background-color: #fffbeb !important;
    color: #bb4d00 !important;
    border-color: #ffd230 !important;
}

[b-i4hfdfo4c6] .order-section-card .btn-arregly-add-danger,
[b-i4hfdfo4c6] .order-section-card .btn-arregly-add-danger.k-button {
    background-color: transparent !important;
    color: #c10007 !important;
    border: 1px solid #ffa2a2 !important;
}

[b-i4hfdfo4c6] .order-section-card .btn-arregly-add-danger:hover,
[b-i4hfdfo4c6] .order-section-card .btn-arregly-add-danger.k-button:hover {
    background-color: #fef2f2 !important;
    color: #c10007 !important;
    border-color: #ffa2a2 !important;
}

[b-i4hfdfo4c6] .order-section-card .btn-arregly-add-success,
[b-i4hfdfo4c6] .order-section-card .btn-arregly-add-success.k-button {
    background-color: transparent !important;
    color: #007a55 !important;
    border: 1px solid #5ee9b5 !important;
}

[b-i4hfdfo4c6] .order-section-card .btn-arregly-add-success:hover,
[b-i4hfdfo4c6] .order-section-card .btn-arregly-add-success.k-button:hover {
    background-color: #ecfdf5 !important;
    color: #006045 !important;
    border-color: #5ee9b5 !important;
}

[b-i4hfdfo4c6] .order-detail-neutral-action-btn,
[b-i4hfdfo4c6] .order-detail-neutral-action-btn.k-button,
[b-i4hfdfo4c6] .order-detail-neutral-action-btn.k-button:hover,
[b-i4hfdfo4c6] .order-detail-neutral-action-btn.k-button.k-hover,
[b-i4hfdfo4c6] .order-detail-neutral-action-btn.k-button:focus,
[b-i4hfdfo4c6] .order-detail-neutral-action-btn.k-button.k-focus,
[b-i4hfdfo4c6] .order-detail-neutral-action-btn.k-button:active,
[b-i4hfdfo4c6] .order-detail-neutral-action-btn.k-button.k-active {
    color: #374151 !important;
}

[b-i4hfdfo4c6] .order-detail-neutral-action-btn .k-button-text,
[b-i4hfdfo4c6] .order-detail-neutral-action-btn .k-svg-icon,
[b-i4hfdfo4c6] .order-detail-neutral-action-btn:hover .k-button-text,
[b-i4hfdfo4c6] .order-detail-neutral-action-btn:hover .k-svg-icon,
[b-i4hfdfo4c6] .order-detail-neutral-action-btn.k-hover .k-button-text,
[b-i4hfdfo4c6] .order-detail-neutral-action-btn.k-hover .k-svg-icon,
[b-i4hfdfo4c6] .order-detail-neutral-action-btn.k-focus .k-button-text,
[b-i4hfdfo4c6] .order-detail-neutral-action-btn.k-focus .k-svg-icon,
[b-i4hfdfo4c6] .order-detail-neutral-action-btn.k-active .k-button-text,
[b-i4hfdfo4c6] .order-detail-neutral-action-btn.k-active .k-svg-icon {
    color: #374151 !important;
}

.custom-telerik-grid .k-grid-header[b-i4hfdfo4c6] {
    background-color: #f9f9f9 !important;
    font-size: 0.85rem;
}

.custom-telerik-grid .k-grid-header .k-header[b-i4hfdfo4c6] {
    border-bottom: 0 !important;
    background-color: #f9f9f9 !important;
}

.custom-telerik-grid .k-grid-table[b-i4hfdfo4c6] {
    vertical-align: middle;
}

.order-product-additional-badge[b-i4hfdfo4c6] {
    background-color: #ecfdf3;
    color: #15803d;
    border: 1px solid #86efac;
    font-size: 0.70rem;
    font-weight: 600;
    padding: 0.2rem 0.55rem;
    line-height: 1;
}

[b-i4hfdfo4c6] .order-products-summary,
[b-i4hfdfo4c6] .order-products-summary.bg-light {
    background-color: #fff !important;
}

[b-i4hfdfo4c6] .order-section-card__body .order-products-summary {
    background-color: #fff !important;
}

.order-history-date-line[b-i4hfdfo4c6] {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.875rem;
}

.order-history-date-label[b-i4hfdfo4c6] {
    color: #6b7280;
    font-weight: 600;
}

.order-history-date-value[b-i4hfdfo4c6] {
    color: #111827;
    font-weight: 700;
}

.service-modal-title-row[b-i4hfdfo4c6] {
    align-items: baseline;
}

.service-modal-title-text[b-i4hfdfo4c6] {
    font-size: 1rem;
    color: #2f3440;
    line-height: 1.3;
}

.service-modal-responsible-text[b-i4hfdfo4c6] {
    font-size: 1rem;
    color: #4b5563;
    line-height: 1.4;
}

.service-modal-responsible-name[b-i4hfdfo4c6] {
    font-size: 1rem;
    color: #1f2937;
}

@media (max-width: 991px) {
    .order-edit-main-column > div[b-i4hfdfo4c6] {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

.order-item-highlight[b-i4hfdfo4c6] {
    position: relative;
    border-left: 4px solid var(--arregly-primary, #7c3aed);
    box-shadow: 0 0 0 2px rgba(124, 58, 237, 0.20) inset;
    animation: order-item-pulse-b-i4hfdfo4c6 1.1s ease-in-out 10;
}

@keyframes order-item-pulse-b-i4hfdfo4c6 {
    0% {
        box-shadow: 0 0 0 0 rgba(124, 58, 237, 0.35) inset;
    }

    50% {
        box-shadow: 0 0 0 999px rgba(124, 58, 237, 0.10) inset;
    }

    100% {
        box-shadow: 0 0 0 0 rgba(124, 58, 237, 0.35) inset;
    }
}

/* ============================================================
   PERSONALIZACIÓN DE TELERIK TOOLTIP (DISEÑO CORPORATIVO)
   ============================================================ */
[b-i4hfdfo4c6] .k-tooltip {
    background-color: #059669 !important; /* Verde Corporativo Arregly detectado en Layout */
    color: #ffffff !important;
    border-radius: 8px !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15) !important;
    padding: 8px 12px !important;
    font-size: 0.8rem !important;
    font-weight: 500 !important;
    border: none !important;
    max-width: 250px !important;
    text-align: center !important;
    line-height: 1.3 !important;
}

[b-i4hfdfo4c6] .k-tooltip .k-tooltip-content {
    padding: 0 !important;
}

[b-i4hfdfo4c6] .k-callout {
    color: #059669 !important; /* Asegura la flechita en el mismo verde */
}



[b-i4hfdfo4c6] .service-icon-circle,
.service-icon-circle[b-i4hfdfo4c6] {
    flex-shrink: 0 !important;
    min-width: 36px !important;
    min-height: 36px !important;
    max-width: 36px !important;
    max-height: 36px !important;
    width: 36px !important;
    height: 36px !important;
    aspect-ratio: 1 / 1 !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

@media (max-width: 480px) {
    [b-i4hfdfo4c6] .service-icon-circle,
    .service-icon-circle[b-i4hfdfo4c6] {
        min-width: 32px !important;
        min-height: 32px !important;
        max-width: 32px !important;
        max-height: 32px !important;
        width: 32px !important;
        height: 32px !important;
    }
    
    [b-i4hfdfo4c6] .order-service-item .btn-arregly-add,
    .order-service-item .btn-arregly-add[b-i4hfdfo4c6] {
        padding: 4px 8px !important;
        font-size: 0.75rem !important;
        gap: 4px !important;
    }
}

/* Card state for pending information (no client, no delivery date, no signature) */
[b-i4hfdfo4c6] .order-aside-card--no-client,
[b-i4hfdfo4c6] .order-aside-card--no-delivery-date,
[b-i4hfdfo4c6] .order-aside-card--no-signature,
.order-aside-card--no-client[b-i4hfdfo4c6],
.order-aside-card--no-delivery-date[b-i4hfdfo4c6],
.order-aside-card--no-signature[b-i4hfdfo4c6] {
    background-color: #fef2f2 !important;
    border: 1px solid #fecaca !important;
}

[b-i4hfdfo4c6] .order-aside-card--no-client .order-aside-card__header,
[b-i4hfdfo4c6] .order-aside-card--no-delivery-date .order-aside-card__header,
[b-i4hfdfo4c6] .order-aside-card--no-signature .order-aside-card__header,
.order-aside-card--no-client .order-aside-card__header[b-i4hfdfo4c6],
.order-aside-card--no-delivery-date .order-aside-card__header[b-i4hfdfo4c6],
.order-aside-card--no-signature .order-aside-card__header[b-i4hfdfo4c6] {
    background-color: #fef2f2 !important;
    border-bottom: 1px solid #fecaca;
}

[b-i4hfdfo4c6] .order-aside-card--no-client .order-aside-card__header h6,
[b-i4hfdfo4c6] .order-aside-card--no-delivery-date .order-aside-card__header h6,
[b-i4hfdfo4c6] .order-aside-card--no-signature .order-aside-card__header h6,
[b-i4hfdfo4c6] .order-aside-card--no-client .order-aside-card__header .text-dark,
[b-i4hfdfo4c6] .order-aside-card--no-signature .order-aside-card__header .text-dark,
.order-aside-card--no-client .order-aside-card__header h6[b-i4hfdfo4c6],
.order-aside-card--no-delivery-date .order-aside-card__header h6[b-i4hfdfo4c6],
.order-aside-card--no-signature .order-aside-card__header h6[b-i4hfdfo4c6],
.order-aside-card--no-client .order-aside-card__header .text-dark[b-i4hfdfo4c6],
.order-aside-card--no-signature .order-aside-card__header .text-dark[b-i4hfdfo4c6] {
    color: #dc3545 !important;
}

[b-i4hfdfo4c6] .order-aside-card--no-client .order-aside-data-label,
[b-i4hfdfo4c6] .order-aside-card--no-delivery-date .order-aside-data-label,
[b-i4hfdfo4c6] .order-aside-card--no-signature .order-aside-data-label,
.order-aside-card--no-client .order-aside-data-label[b-i4hfdfo4c6],
.order-aside-card--no-delivery-date .order-aside-data-label[b-i4hfdfo4c6],
.order-aside-card--no-signature .order-aside-data-label[b-i4hfdfo4c6] {
    color: #d32f2f !important;
}

[b-i4hfdfo4c6] .order-aside-card--no-client .order-aside-data-value,
[b-i4hfdfo4c6] .order-aside-card--no-delivery-date .order-aside-data-value,
[b-i4hfdfo4c6] .order-aside-card--no-signature .order-aside-data-value,
.order-aside-card--no-client .order-aside-data-value[b-i4hfdfo4c6],
.order-aside-card--no-delivery-date .order-aside-data-value[b-i4hfdfo4c6],
.order-aside-card--no-signature .order-aside-data-value[b-i4hfdfo4c6] {
    color: #b71c1c !important;
}

[b-i4hfdfo4c6] .order-aside-card--no-client .order-aside-data-value.text-muted,
[b-i4hfdfo4c6] .order-aside-card--no-delivery-date .order-aside-data-value.text-muted,
[b-i4hfdfo4c6] .order-aside-card--no-signature .order-aside-data-value.text-muted,
.order-aside-card--no-client .order-aside-data-value.text-muted[b-i4hfdfo4c6],
.order-aside-card--no-delivery-date .order-aside-data-value.text-muted[b-i4hfdfo4c6],
.order-aside-card--no-signature .order-aside-data-value.text-muted[b-i4hfdfo4c6] {
    color: #e57373 !important;
}

/* Button style inside unassigned client card */
[b-i4hfdfo4c6] .order-aside-card--no-client .btn-outline-danger-arregly,
[b-i4hfdfo4c6] .order-aside-card--no-delivery-date .btn-outline-danger-arregly,
[b-i4hfdfo4c6] .order-aside-card--no-signature .btn-outline-danger-arregly,
[b-i4hfdfo4c6] .order-aside-card--no-client .btn-outline-danger-arregly.k-button,
[b-i4hfdfo4c6] .order-aside-card--no-delivery-date .btn-outline-danger-arregly.k-button,
[b-i4hfdfo4c6] .order-aside-card--no-signature .btn-outline-danger-arregly.k-button {
    background-color: transparent !important;
    color: #dc3545 !important;
    border: 1px solid #fca5a5 !important;
}

[b-i4hfdfo4c6] .order-aside-card--no-client .btn-outline-danger-arregly:hover,
[b-i4hfdfo4c6] .order-aside-card--no-delivery-date .btn-outline-danger-arregly:hover,
[b-i4hfdfo4c6] .order-aside-card--no-signature .btn-outline-danger-arregly:hover,
[b-i4hfdfo4c6] .order-aside-card--no-client .btn-outline-danger-arregly.k-button:hover,
[b-i4hfdfo4c6] .order-aside-card--no-delivery-date .btn-outline-danger-arregly.k-button:hover,
[b-i4hfdfo4c6] .order-aside-card--no-signature .btn-outline-danger-arregly.k-button:hover {
    background-color: #dc3545 !important;
    color: #ffffff !important;
    border-color: #dc3545 !important;
}

/* Styling for the pending expected delivery date field as a button that looks like an input */
[b-i4hfdfo4c6] .pending-delivery-input-btn,
.pending-delivery-input-btn[b-i4hfdfo4c6] {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    width: 130px;
    height: 28px;
    padding: 0 10px;
    background-color: #fff5f5; /* Soft light red background */
    border: 1px solid #dc3545; /* Soft red border to show it needs attention */
    border-radius: 6px;
    color: #dc3545; /* Dark red text */
    font-size: 0.85rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    box-shadow: 0 1px 2px rgba(220, 53, 69, 0.05);
}

[b-i4hfdfo4c6] .pending-delivery-input-btn:hover,
.pending-delivery-input-btn:hover[b-i4hfdfo4c6] {
    background-color: #fde8e8; /* Slightly darker light red */
    border-color: #c82333; /* Darker red border */
    color: #bd2130; /* Darker red text */
    box-shadow: 0 2px 4px rgba(220, 53, 69, 0.15);
}

[b-i4hfdfo4c6] .pending-delivery-input-btn .pending-text,
.pending-delivery-input-btn .pending-text[b-i4hfdfo4c6] {
    flex-grow: 1;
    text-align: left;
}

[b-i4hfdfo4c6] .pending-delivery-input-btn .edit-icon-wrapper,
.pending-delivery-input-btn .edit-icon-wrapper[b-i4hfdfo4c6] {
    display: flex;
    align-items: center;
    color: #dc3545;
}

[b-i4hfdfo4c6] .pending-delivery-input-btn:hover .edit-icon-wrapper,
.pending-delivery-input-btn:hover .edit-icon-wrapper[b-i4hfdfo4c6] {
    color: #bd2130;
}



/* ============================================================
   SECCIÓN DETALLE DE LA ORDEN
   ============================================================ */
[b-i4hfdfo4c6] .order-detail-table-container,
.order-detail-table-container[b-i4hfdfo4c6] {
    overflow-x: auto;
    background-color: #fff;
}

[b-i4hfdfo4c6] .order-detail-table,
.order-detail-table[b-i4hfdfo4c6] {
    border-collapse: collapse;
    margin: 0;
    padding: 0;
    font-size: 0.9rem;
}

[b-i4hfdfo4c6] .order-detail-table th,
.order-detail-table th[b-i4hfdfo4c6] {
    background-color: #f8fafc;
    color: #475569;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.05em;
    padding: 12px 18px;
    border-bottom: 2px solid #e2e8f0;
}

[b-i4hfdfo4c6] .order-detail-table td,
.order-detail-table td[b-i4hfdfo4c6] {
    padding: 16px 18px;
    border-bottom: 1px solid #f1f5f9;
    color: #334155;
}

[b-i4hfdfo4c6] .order-detail-table tbody tr:hover,
.order-detail-table tbody tr:hover[b-i4hfdfo4c6] {
    background-color: #f8fafc;
}

[b-i4hfdfo4c6] .order-detail-table .item-taxes-info,
.order-detail-table .item-taxes-info[b-i4hfdfo4c6] {
    color: #64748b;
    font-size: 0.75rem;
}

[b-i4hfdfo4c6] .order-detail-table .taxes-breakdown-cell,
.order-detail-table .taxes-breakdown-cell[b-i4hfdfo4c6] {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-end;
    text-align: right;
    min-width: 150px;
}

[b-i4hfdfo4c6] .tax-item-row,
.tax-item-row[b-i4hfdfo4c6] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    line-height: 1.4;
    white-space: nowrap;
    width: 100%;
}

[b-i4hfdfo4c6] .tax-item-label,
.tax-item-label[b-i4hfdfo4c6] {
    color: #7f8c8d;
    font-weight: 400;
}

[b-i4hfdfo4c6] .tax-item-val,
.tax-item-val[b-i4hfdfo4c6] {
    color: #2c3e50;
    font-weight: 500;
}

[b-i4hfdfo4c6] .tax-cell-divider,
.tax-cell-divider[b-i4hfdfo4c6] {
    border-top: 1px solid #b2bec3;
    width: 100%;
    margin-top: 4px;
    margin-bottom: 4px;
}

[b-i4hfdfo4c6] .tax-total-bold,
.tax-total-bold[b-i4hfdfo4c6] {
    font-weight: 750;
    color: #2c3e50;
    font-size: 0.95rem;
}


[b-i4hfdfo4c6] .order-detail-summary,
.order-detail-summary[b-i4hfdfo4c6] {
    background-color: #f8fafc !important;
}

[b-i4hfdfo4c6] .summary-row,
.summary-row[b-i4hfdfo4c6] {
    font-size: 0.9rem;
}

/* ============================================================
   DESGLOSE DE COSTOS DEL SERVICIO
   ============================================================ */
[b-i4hfdfo4c6] .order-service-cost-breakdown,
.order-service-cost-breakdown[b-i4hfdfo4c6] {
    border: 1px solid #e2e8f0 !important;
    background-color: #f8fafc !important;
    border-radius: 10px !important;
}

[b-i4hfdfo4c6] .order-service-cost-breakdown h6,
.order-service-cost-breakdown h6[b-i4hfdfo4c6] {
    color: #475569 !important;
    letter-spacing: 0.05em;
}

[b-i4hfdfo4c6] .cost-breakdown-box,
.cost-breakdown-box[b-i4hfdfo4c6] {
    max-width: 100%;
}

[b-i4hfdfo4c6] .cost-row,
.cost-row[b-i4hfdfo4c6] {
    font-size: 0.85rem;
}

/* Responsive Table for Mobile */
@media (max-width: 768px) {
    .order-detail-table-container[b-i4hfdfo4c6] {
        border: none;
    }

    .order-detail-table[b-i4hfdfo4c6], 
    .order-detail-table thead[b-i4hfdfo4c6], 
    .order-detail-table tbody[b-i4hfdfo4c6], 
    .order-detail-table th[b-i4hfdfo4c6], 
    .order-detail-table td[b-i4hfdfo4c6], 
    .order-detail-table tr[b-i4hfdfo4c6] {
        display: block;
    }

    .order-detail-table thead[b-i4hfdfo4c6] {
        display: none; /* Hide header on mobile */
    }

    .order-detail-table tr[b-i4hfdfo4c6] {
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        margin-bottom: 16px;
        padding: 8px;
        background-color: #fff;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05);
    }

    .order-detail-table td[b-i4hfdfo4c6] {
        text-align: right !important;
        padding: 8px 12px;
        border-bottom: 1px solid #f1f5f9;
        position: relative;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .order-detail-table td:last-child[b-i4hfdfo4c6] {
        border-bottom: none;
    }

    .order-detail-table td[b-i4hfdfo4c6]::before {
        content: attr(data-label);
        font-weight: 700;
        text-transform: uppercase;
        font-size: 0.7rem;
        color: #64748b;
        text-align: left;
        margin-right: 16px;
    }

    .order-detail-table td[data-label="Descripción"][b-i4hfdfo4c6] {
        flex-direction: column;
        align-items: flex-start;
        text-align: left !important;
        background-color: #f8fafc;
        border-radius: 6px;
        margin-bottom: 8px;
    }

    .order-detail-table td[data-label="Descripción"][b-i4hfdfo4c6]::before {
        display: none;
    }

    .order-detail-table td[data-label="Descripción"] .item-taxes-info[b-i4hfdfo4c6] {
        margin-top: 4px;
    }

    .order-detail-summary[b-i4hfdfo4c6] {
        padding: 16px !important;
    }

    .summary-box[b-i4hfdfo4c6] {
        width: 100% !important;
    }
}

@media (min-width: 768px) and (max-width: 1100px) {
    .order-aside-data-row[b-i4hfdfo4c6] {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 2px !important;
    }
    .order-aside-data-value[b-i4hfdfo4c6] {
        text-align: left !important;
        width: 100% !important;
    }
    .order-aside-data-label[b-i4hfdfo4c6] {
        margin-right: 0 !important;
        font-size: 0.85rem !important;
    }
}

/* ============================================================
   RESPONSIVE MOBILE CARDS (LISTA INTEGRADA SIN PADDINGS REDUNDANTES)
   ============================================================ */
[b-i4hfdfo4c6] .order-mobile-cards,
.order-mobile-cards[b-i4hfdfo4c6] {
    background-color: transparent !important;
    padding: 0 !important;
}

[b-i4hfdfo4c6] .order-item-card,
.order-item-card[b-i4hfdfo4c6] {
    background-color: #ffffff;
    border: none;
    border-bottom: 1px solid #e2e8f0;
    border-radius: 0;
    box-shadow: none;
    padding: 14px 16px;
    margin-bottom: 0 !important;
}

[b-i4hfdfo4c6] .order-item-card:last-child,
.order-item-card:last-child[b-i4hfdfo4c6] {
    border-bottom: none;
}

[b-i4hfdfo4c6] .order-item-card-grey-box,
.order-item-card-grey-box[b-i4hfdfo4c6] {
    background-color: #f8fafc;
    border: 1px solid #edf2f7;
    border-radius: 8px;
    padding: 10px 8px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}

[b-i4hfdfo4c6] .grey-box-col,
.grey-box-col[b-i4hfdfo4c6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

[b-i4hfdfo4c6] .grey-box-label,
.grey-box-label[b-i4hfdfo4c6] {
    font-size: 0.65rem;
    color: #64748b;
    font-weight: 700;
    letter-spacing: 0.05em;
    margin-bottom: 4px;
    text-align: center;
}

[b-i4hfdfo4c6] .grey-box-val,
.grey-box-val[b-i4hfdfo4c6] {
    font-size: 0.9rem;
    font-weight: 700;
    text-align: center;
}

[b-i4hfdfo4c6] .order-item-card-divider,
.order-item-card-divider[b-i4hfdfo4c6] {
    border-top: 1px dashed #e2e8f0;
    margin-top: 12px;
    margin-bottom: 12px;
}

[b-i4hfdfo4c6] .border-top-light,
.border-top-light[b-i4hfdfo4c6] {
    border-top-color: #e2e8f0 !important;
}

/* Botón de acción compacto y alineado al costado derecho */
[b-i4hfdfo4c6] .order-aside-card .btn-order-date-action,
[b-i4hfdfo4c6] .order-aside-card .btn-order-action-compact,
.order-aside-card .btn-order-date-action[b-i4hfdfo4c6],
.order-aside-card .btn-order-action-compact[b-i4hfdfo4c6] {
    width: auto !important;
    max-width: max-content !important;
    min-width: 0 !important;
    padding: 6px 14px !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
}

/* Divisor responsive entre Cliente y Sede */
[b-i4hfdfo4c6] .client-branch-col-divider,
.client-branch-col-divider[b-i4hfdfo4c6] {
    border-right: 1px solid #eef2f7;
}

@media (max-width: 575.98px) {
    [b-i4hfdfo4c6] .client-branch-col-divider,
    .client-branch-col-divider[b-i4hfdfo4c6] {
        border-right: none !important;
        border-bottom: 1px solid #eef2f7 !important;
        padding-bottom: 12px !important;
        margin-bottom: 6px !important;
    }

    [b-i4hfdfo4c6] .client-branch-col-branch,
    .client-branch-col-branch[b-i4hfdfo4c6] {
        padding-top: 6px !important;
        padding-bottom: 12px !important;
        padding-left: 0 !important;
    }
}

/* Optimización de padding en móvil para Detalle de la Orden sin perder organización */
@media (max-width: 768px) {
    [b-i4hfdfo4c6] .order-section-card__body.p-0,
    .order-section-card__body.p-0[b-i4hfdfo4c6] {
        padding: 0 !important;
    }

    [b-i4hfdfo4c6] .order-aside-card,
    .order-aside-card[b-i4hfdfo4c6] {
        height: auto !important;
    }

    [b-i4hfdfo4c6] .order-aside-card__body,
    .order-aside-card__body[b-i4hfdfo4c6] {
        padding: 12px 14px !important;
        height: auto !important;
    }

    [b-i4hfdfo4c6] .order-item-card,
    .order-item-card[b-i4hfdfo4c6] {
        padding: 8px 10px !important;
    }

    [b-i4hfdfo4c6] .order-item-card-grey-box,
    .order-item-card-grey-box[b-i4hfdfo4c6] {
        padding: 8px 6px !important;
        gap: 4px !important;
    }

    [b-i4hfdfo4c6] .order-detail-summary,
    .order-detail-summary[b-i4hfdfo4c6] {
        padding: 10px 10px !important;
        background-color: #f8fafc !important;
    }

    [b-i4hfdfo4c6] .order-service-history,
    .order-service-history[b-i4hfdfo4c6] {
        padding: 10px 12px !important;
        margin-left: 0 !important;
        width: 100% !important;
    }

    [b-i4hfdfo4c6] .order-service-history .alert,
    .order-service-history .alert[b-i4hfdfo4c6] {
        padding: 8px 10px !important;
        margin-top: 6px !important;
    }
}

/* Glassmorphism Signature Card */
[b-i4hfdfo4c6] .signature-conformity-card,
.signature-conformity-card[b-i4hfdfo4c6] {
    background: rgba(255, 255, 255, 0.7) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(226, 232, 240, 0.8) !important;
    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.05) !important;
    transition: all 0.3s ease;
}

[b-i4hfdfo4c6] .signature-conformity-card:hover,
.signature-conformity-card:hover[b-i4hfdfo4c6] {
    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.08) !important;
    transform: translateY(-2px);
}

[b-i4hfdfo4c6] .signature-conformity-card.order-aside-card--no-signature,
.signature-conformity-card.order-aside-card--no-signature[b-i4hfdfo4c6] {
    background: #fef2f2 !important;
    border: 1px solid #fecaca !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

[b-i4hfdfo4c6] .signature-conformity-card.order-aside-card--no-signature:hover,
.signature-conformity-card.order-aside-card--no-signature:hover[b-i4hfdfo4c6] {
    transform: none !important;
}

[b-i4hfdfo4c6] .signature-conformity-card.order-aside-card--no-signature .order-aside-card__header,
.signature-conformity-card.order-aside-card--no-signature .order-aside-card__header[b-i4hfdfo4c6] {
    background-color: #fef2f2 !important;
    border-bottom: 1px solid #fecaca;
}

[b-i4hfdfo4c6] .signature-display-box,
.signature-display-box[b-i4hfdfo4c6] {
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(0, 200, 83, 0.2) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.02) !important;
    transition: all 0.2s ease-in-out;
}

[b-i4hfdfo4c6] .signature-display-box:hover,
.signature-display-box:hover[b-i4hfdfo4c6] {
    box-shadow: 0 4px 16px rgba(0, 200, 83, 0.1) !important;
}

[b-i4hfdfo4c6] .signature-conformity-card .order-section-card__body,
.signature-conformity-card .order-section-card__body[b-i4hfdfo4c6] {
    padding: 12px 14px !important;
}

@media (max-width: 768px) {
    [b-i4hfdfo4c6] .signature-conformity-card .order-section-card__body,
    .signature-conformity-card .order-section-card__body[b-i4hfdfo4c6] {
        padding: 8px 10px !important;
    }
}

[b-i4hfdfo4c6] .signature-pad-wrapper,
.signature-pad-wrapper[b-i4hfdfo4c6] {
    background: #ffffff;
    box-shadow: inset 0 2px 4px rgba(0,0,0,0.06);
    border-color: #cbd5e1 !important;
}

/* Container Query and Flexbox layout for Card-level responsive buttons */
.order-aside-card[b-i4hfdfo4c6] {
    container-type: inline-size;
}

/* Default styles for wide cards (width > 340px) */
.signature-buttons-container[b-i4hfdfo4c6] {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    width: 100%;
}

.signature-buttons-container .btn-arregly[b-i4hfdfo4c6] {
    width: auto !important;
}

.single-button-container[b-i4hfdfo4c6] {
    display: flex;
    justify-content: flex-end;
    width: 100%;
}

.single-button-container .btn-arregly[b-i4hfdfo4c6] {
    width: auto !important;
}

/* Styles for narrow/reduced cards (width <= 340px) */
@container (max-width: 340px) {
    .signature-buttons-container[b-i4hfdfo4c6] {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
    }
    
    .signature-buttons-container .btn-arregly[b-i4hfdfo4c6] {
        width: 100% !important;
    }
    
    .single-button-container[b-i4hfdfo4c6] {
        justify-content: stretch !important;
    }
    
    .single-button-container .btn-arregly[b-i4hfdfo4c6] {
        width: 100% !important;
    }
}
/* /Components/Order/Tabs/OrderEditHistoryTab.razor.rz.scp.css */
.order-history-list[b-tjcvalwxg7] {
    min-height: 120px;
    min-width: 0;
    /*padding: 20px 40px;*/
}

.order-history-wrapper[b-tjcvalwxg7] {
    min-height: 120px;
    min-width: 0;
}

.order-history-layout[b-tjcvalwxg7] {
    align-items: flex-start;
}

.order-history-card[b-tjcvalwxg7],
.order-aside-card[b-tjcvalwxg7] {
    border: none;
    border-radius: 14px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    background-color: #fff;
    overflow: hidden;
    min-width: 0;
}

.order-history-card__body[b-tjcvalwxg7] {
    padding: 16px !important;
}

.order-aside-card__header[b-tjcvalwxg7] {
    background-color: #fff;
    border-bottom: 1px solid #eef2f7;
    padding: 16px !important;
}

.order-aside-card__body[b-tjcvalwxg7] {
    padding: 16px !important;
}

.order-aside-data-row[b-tjcvalwxg7] {
    font-size: 1.0rem;
}

.order-aside-data-label[b-tjcvalwxg7] {
    color: #6b7280;
    margin-right: 12px;
}

.order-aside-data-value[b-tjcvalwxg7] {
    font-weight: 700;
    color: #111827;
    text-align: right;
}

.timeline-item[b-tjcvalwxg7] {
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: 10px;
    position: relative;
    padding-bottom: 22px;
    min-width: 0;
}

.timeline-item[b-tjcvalwxg7]::after {
    content: "";
    position: absolute;
    left: 17px;
    top: 36px;
    bottom: -2px;
    width: 1px;
    background: #dbe3ee !important;
}

.timeline-item:last-child[b-tjcvalwxg7]::after {
    display: none;
}

.timeline-dot[b-tjcvalwxg7] {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.timeline-card[b-tjcvalwxg7] {
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
    padding: 0 12px 0 8px;
    min-width: 0;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.timeline-card.timeline-card--bubble[b-tjcvalwxg7] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
    padding: 12px 16px;
    position: relative;
    margin-left: 6px;
    transition: all 0.2s ease;
}

.timeline-card.timeline-card--bubble:hover[b-tjcvalwxg7] {
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
    border-color: #cbd5e1;
}

.timeline-card.timeline-card--bubble[b-tjcvalwxg7]::before {
    content: "";
    position: absolute;
    left: -6px;
    top: 14px;
    width: 10px;
    height: 10px;
    background: #ffffff;
    border-left: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
    transform: rotate(45deg);
    transition: all 0.2s ease;
}

.timeline-card.timeline-card--bubble:hover[b-tjcvalwxg7]::before {
    border-color: #cbd5e1;
}

/* Burbuja - Creada (Azul) */
.timeline-card.timeline-card--bubble-created[b-tjcvalwxg7] {
    border-color: #93c5fd !important;
    background-color: #eff6ff !important;
}
.timeline-card.timeline-card--bubble-created[b-tjcvalwxg7]::before {
    border-left-color: #93c5fd !important;
    border-bottom-color: #93c5fd !important;
    background-color: #eff6ff !important;
}
.timeline-card.timeline-card--bubble-created:hover[b-tjcvalwxg7] {
    border-color: #3b82f6 !important;
}
.timeline-card.timeline-card--bubble-created:hover[b-tjcvalwxg7]::before {
    border-left-color: #3b82f6 !important;
    border-bottom-color: #3b82f6 !important;
}

/* Burbuja - En Proceso (Naranja) */
.timeline-card.timeline-card--bubble-progress[b-tjcvalwxg7] {
    border-color: #fcd34d !important;
    background-color: #fffdf5 !important;
}
.timeline-card.timeline-card--bubble-progress[b-tjcvalwxg7]::before {
    border-left-color: #fcd34d !important;
    border-bottom-color: #fcd34d !important;
    background-color: #fffdf5 !important;
}
.timeline-card.timeline-card--bubble-progress:hover[b-tjcvalwxg7] {
    border-color: #f59e0b !important;
}
.timeline-card.timeline-card--bubble-progress:hover[b-tjcvalwxg7]::before {
    border-left-color: #f59e0b !important;
    border-bottom-color: #f59e0b !important;
}

/* Burbuja - Finalizada (Verde) */
.timeline-card.timeline-card--bubble-completed[b-tjcvalwxg7] {
    border-color: #86efac !important;
    background-color: #f9fefb !important;
}
.timeline-card.timeline-card--bubble-completed[b-tjcvalwxg7]::before {
    border-left-color: #86efac !important;
    border-bottom-color: #86efac !important;
    background-color: #f9fefb !important;
}
.timeline-card.timeline-card--bubble-completed:hover[b-tjcvalwxg7] {
    border-color: #10b981 !important;
}
.timeline-card.timeline-card--bubble-completed:hover[b-tjcvalwxg7]::before {
    border-left-color: #10b981 !important;
    border-bottom-color: #10b981 !important;
}

/* Burbuja - Facturada (Morada) */
.timeline-card.timeline-card--bubble-invoiced[b-tjcvalwxg7] {
    border-color: #c4b5fd !important;
    background-color: #faf9ff !important;
}
.timeline-card.timeline-card--bubble-invoiced[b-tjcvalwxg7]::before {
    border-left-color: #c4b5fd !important;
    border-bottom-color: #c4b5fd !important;
    background-color: #faf9ff !important;
}
.timeline-card.timeline-card--bubble-invoiced:hover[b-tjcvalwxg7] {
    border-color: #8b5cf6 !important;
}
.timeline-card.timeline-card--bubble-invoiced:hover[b-tjcvalwxg7]::before {
    border-left-color: #8b5cf6 !important;
    border-bottom-color: #8b5cf6 !important;
}

/* Burbuja - Cancelada (Roja) */
.timeline-card.timeline-card--bubble-cancelled[b-tjcvalwxg7] {
    border-color: #fca5a5 !important;
    background-color: #fffafb !important;
}
.timeline-card.timeline-card--bubble-cancelled[b-tjcvalwxg7]::before {
    border-left-color: #fca5a5 !important;
    border-bottom-color: #fca5a5 !important;
    background-color: #fffafb !important;
}
.timeline-card.timeline-card--bubble-cancelled:hover[b-tjcvalwxg7] {
    border-color: #ef4444 !important;
}
.timeline-card.timeline-card--bubble-cancelled:hover[b-tjcvalwxg7]::before {
    border-left-color: #ef4444 !important;
    border-bottom-color: #ef4444 !important;
}

.timeline-card-head[b-tjcvalwxg7] {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

.timeline-item.current .timeline-dot[b-tjcvalwxg7] {
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.15) !important;
}

.timeline-item.current[b-tjcvalwxg7]::after {
    background: linear-gradient(to bottom, #dbe3ee, rgba(219, 227, 238, 0.2)) !important;
}

.timeline-item.current .timeline-dot[b-tjcvalwxg7]::after {
    content: "";
    position: absolute;
    inset: -7px;
    border: 2px solid rgba(59, 130, 246, 0.2) !important;
    border-radius: 50%;
    animation: currentStepPulse-b-tjcvalwxg7 1.35s ease-out infinite;
}

.timeline-icon-blue[b-tjcvalwxg7] {
    background-color: #dbeafe !important;
    border: 1px solid #93c5fd !important;
}
[b-tjcvalwxg7] .timeline-icon-blue .k-svg-icon {
    color: #1d4ed8 !important;
    width: 14px !important;
    height: 14px !important;
}

.timeline-icon-green[b-tjcvalwxg7] {
    background-color: #dcfce7 !important;
    border: 1px solid #86efac !important;
}
[b-tjcvalwxg7] .timeline-icon-green .k-svg-icon {
    color: #166534 !important;
    width: 14px !important;
    height: 14px !important;
}

.timeline-icon-orange[b-tjcvalwxg7] {
    background-color: #fef3c7 !important;
    border: 1px solid #fcd34d !important;
}
[b-tjcvalwxg7] .timeline-icon-orange .k-svg-icon {
    color: #92400e !important;
    width: 14px !important;
    height: 14px !important;
}

.timeline-icon-red[b-tjcvalwxg7] {
    background-color: #fee2e2 !important;
    border: 1px solid #fca5a5 !important;
}
[b-tjcvalwxg7] .timeline-icon-red .k-svg-icon {
    color: #991b1b !important;
    width: 14px !important;
    height: 14px !important;
}

.timeline-icon-purple[b-tjcvalwxg7] {
    background-color: #ede9fe !important;
    border: 1px solid #c4b5fd !important;
}
[b-tjcvalwxg7] .timeline-icon-purple .k-svg-icon {
    color: #6d28d9 !important;
    width: 14px !important;
    height: 14px !important;
}

.timeline-icon-grey[b-tjcvalwxg7] {
    background-color: #f3f4f6 !important;
    border: 1px solid #d1d5db !important;
}
[b-tjcvalwxg7] .timeline-icon-grey .k-svg-icon {
    color: #374151 !important;
    width: 14px !important;
    height: 14px !important;
}

@keyframes currentStepPulse-b-tjcvalwxg7 {
    0% {
        transform: scale(0.7);
        opacity: 0.95;
    }

    70% {
        transform: scale(1.35);
        opacity: 0;
    }

    100% {
        transform: scale(1.35);
        opacity: 0;
    }
}

@media (max-width: 768px) {
    .timeline-card-head[b-tjcvalwxg7] {
        flex-direction: column;
        gap: 2px;
    }

    .order-history-main-column > div[b-tjcvalwxg7],
    .order-history-aside-column > div[b-tjcvalwxg7] {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

.evidence-preview[b-tjcvalwxg7] {
    display: inline-flex;
    margin-top: 10px;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #e5e7eb;
    background: #f9fafb;
}

.evidence-thumbnail[b-tjcvalwxg7] {
    width: 56px;
    height: 56px;
    object-fit: cover;
    display: block;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.evidence-thumbnail--clickable[b-tjcvalwxg7] {
    cursor: pointer;
}

.evidence-thumbnail--clickable:hover[b-tjcvalwxg7] {
    transform: scale(1.03);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
}

.lightbox-overlay[b-tjcvalwxg7] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.82);
    z-index: 9000;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: fadeIn-b-tjcvalwxg7 0.18s ease;
}

.lightbox-container[b-tjcvalwxg7] {
    position: relative;
    max-width: 90vw;
    max-height: 90vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lightbox-image[b-tjcvalwxg7] {
    max-width: 90vw;
    max-height: 90vh;
    object-fit: contain;
    border-radius: 8px;
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.5);
    image-rendering: high-quality;
}

.lightbox-close[b-tjcvalwxg7] {
    position: absolute;
    top: -16px;
    right: -16px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #fff;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
    z-index: 1;
    transition: background 0.15s ease;
    min-width: 36px !important;
    padding: 0 !important;
}

.lightbox-close:hover[b-tjcvalwxg7] {
    background: #f3f4f6;
}

.lightbox-close .k-button-text[b-tjcvalwxg7],
.lightbox-close .k-icon[b-tjcvalwxg7],
.lightbox-close .k-svg-icon[b-tjcvalwxg7] {
    color: #111827 !important;
}

@keyframes fadeIn-b-tjcvalwxg7 {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@media (max-width: 576px) {
    .order-history-card__body[b-tjcvalwxg7],
    .order-aside-card__body[b-tjcvalwxg7],
    .order-aside-card__header[b-tjcvalwxg7] {
        padding: 16px !important;
    }

    .timeline-card.timeline-card--bubble[b-tjcvalwxg7] {
        padding: 10px 12px !important;
    }
}
/* /Components/Order/Tabs/OrderEditNotesTab.razor.rz.scp.css */
/* Pestaña de Notas de la Orden */
.order-notes-container[b-96ifgwepjy] {
    padding: 10px 0;
}

.order-notes-header[b-96ifgwepjy] {
    border-bottom: 1px solid #f3f4f6;
    padding-bottom: 16px;
}

/* Chips de Filtro */
.order-notes-filters-container[b-96ifgwepjy] {
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    border: none !important;
    border-radius: 14px;
}

.filter-label[b-96ifgwepjy] {
    font-size: 0.85rem;
    color: #4b5563;
}

.chip-filter[b-96ifgwepjy] {
    border: 1px solid #e5e7eb;
    background-color: #f9fafb;
    color: #4b5563;
    font-size: 0.8rem;
    font-weight: 600;
    padding: 6px 14px;
    border-radius: 20px;
    transition: all 0.2s ease-in-out;
    cursor: pointer;
    outline: none;
}

.chip-filter:hover[b-96ifgwepjy] {
    background-color: #f3f4f6;
    border-color: #d1d5db;
    transform: translateY(-1px);
}

.chip-filter.chip-active[b-96ifgwepjy] {
    background-color: #0b593f;
    color: #ffffff;
    border-color: #0b593f;
    box-shadow: 0 4px 6px -1px rgba(11, 89, 63, 0.2);
}

/* Tarjetas de Nota */
.note-card[b-96ifgwepjy] {
    background-color: #ffffff;
    border-radius: 14px;
    border-top: none !important;
    border-right: none !important;
    border-bottom: none !important;
    border-left: 5px solid transparent;
    padding: 14px 16px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

.note-card:hover[b-96ifgwepjy] {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.02);
    transform: translateY(-2px);
}

/* Variaciones de Tarjeta según Tipo */
.note-card-blue[b-96ifgwepjy] { border-left-color: #3b82f6; }
.note-card-purple[b-96ifgwepjy] { border-left-color: #8b5cf6; }
.note-card-green[b-96ifgwepjy] { border-left-color: #10b981; }
.note-card-teal[b-96ifgwepjy] { border-left-color: #14b8a6; }
.note-card-red[b-96ifgwepjy] { border-left-color: #f43f5e; }
.note-card-default[b-96ifgwepjy] { border-left-color: #9ca3af; }

/* Contenedor de Iconos Circulares */
.note-icon-container[b-96ifgwepjy] {
    display: flex;
    align-items: flex-start;
}

.note-circle-icon[b-96ifgwepjy] {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    transition: transform 0.2s ease;
}

.note-card:hover .note-circle-icon[b-96ifgwepjy] {
    transform: scale(1.05);
}

.note-circle-icon-small[b-96ifgwepjy] {
    width: 32px;
    height: 32px;
    font-size: 0.95rem;
    flex-shrink: 0;
}

/* Colores de Icono por Tipo */
.circle-icon-blue[b-96ifgwepjy] { background-color: #eff6ff; color: #1d4ed8; }
.circle-icon-purple[b-96ifgwepjy] { background-color: #f5f3ff; color: #6d28d9; }
.circle-icon-green[b-96ifgwepjy] { background-color: #ecfdf5; color: #047857; }
.circle-icon-teal[b-96ifgwepjy] { background-color: #f0fdfa; color: #0f766e; }
.circle-icon-red[b-96ifgwepjy] { background-color: #fff5f5; color: #e11d48; }
.circle-icon-default[b-96ifgwepjy] { background-color: #f3f4f6; color: #4b5563; }

/* Detalles de Nota */
.note-title[b-96ifgwepjy] {
    font-size: 0.95rem;
    letter-spacing: -0.01em;
}

.note-content-text[b-96ifgwepjy] {
    font-size: 0.875rem;
    line-height: 1.5;
    word-break: break-word;
}

.note-metadata[b-96ifgwepjy] {
    font-size: 0.775rem;
    font-weight: 500;
}

.note-metadata span[b-96ifgwepjy] {
    display: inline-flex;
    align-items: center;
}

.note-card-action[b-96ifgwepjy] {
    opacity: 0.5;
    transition: opacity 0.2s ease;
}

.note-card:hover .note-card-action[b-96ifgwepjy] {
    opacity: 1;
}

/* Badges */
.badge-note[b-96ifgwepjy] {
    padding: 3px 9px;
    font-size: 0.725rem;
    font-weight: 700;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
}

.badge-visibility[b-96ifgwepjy] {
    padding: 3px 9px;
    font-size: 0.725rem;
    font-weight: 700;
    border-radius: 12px;
}

/* Colores de Badges por Tipo */
.badge-note-blue[b-96ifgwepjy] { background-color: #eff6ff; color: #1e40af; }
.badge-note-purple[b-96ifgwepjy] { background-color: #f5f3ff; color: #5b21b6; }
.badge-note-green[b-96ifgwepjy] { background-color: #ecfdf5; color: #065f46; }
.badge-note-teal[b-96ifgwepjy] { background-color: #f0fdfa; color: #115e59; }
.badge-note-red[b-96ifgwepjy] { background-color: #fff1f2; color: #9f1239; }
.badge-note-default[b-96ifgwepjy] { background-color: #f3f4f6; color: #374151; }

.badge-visibility-visible[b-96ifgwepjy] {
    background-color: #e6f4ea;
    color: #137333;
}

.badge-visibility-internal[b-96ifgwepjy] {
    background-color: #f3e8ff;
    color: #6b21a8;
}

/* Estado Vacío */
.empty-notes-state[b-96ifgwepjy] {
    padding: 50px;
    border-style: dashed !important;
}

/* Elementos del Modal */
.note-type-description-box[b-96ifgwepjy] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0 !important;
}

.note-visibility-toggle-panel[b-96ifgwepjy] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0 !important;
}

.note-visibility-icon-box[b-96ifgwepjy] {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #eff6ff;
    color: #2563eb;
    flex-shrink: 0;
}

/* TelerikSwitch corporativo Arregly */
[b-96ifgwepjy] .switch-arregly.k-switch {
    width: 66px !important;
    border-radius: 9999px !important;
    outline: none !important;
    box-shadow: none !important;
    flex-shrink: 0;
}

[b-96ifgwepjy] .switch-arregly .k-switch-track {
    border-radius: 9999px !important;
    transition: background-color 0.2s ease, border-color 0.2s ease !important;
}

[b-96ifgwepjy] .switch-arregly.k-switch-on .k-switch-track {
    background-color: var(--primary-color, #0b593f) !important;
    border-color: var(--primary-color, #0b593f) !important;
}

[b-96ifgwepjy] .switch-arregly.k-switch-off .k-switch-track {
    background-color: #cbd5e1 !important;
    border-color: #cbd5e1 !important;
}

[b-96ifgwepjy] .switch-arregly .k-switch-thumb {
    background-color: #ffffff !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25) !important;
    border: none !important;
}

[b-96ifgwepjy] .switch-arregly .k-switch-label-on,
[b-96ifgwepjy] .switch-arregly .k-switch-label-off {
    font-size: 0.72rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    padding: 0 6px !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

/* Botón de ver detalle de nota */
.btn-note-view-detail[b-96ifgwepjy] {
    background: transparent;
    border: none;
    cursor: pointer;
    color: #9ca3af;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px;
    border-radius: 50%;
    transition: all 0.2s ease;
    outline: none;
}

.btn-note-view-detail:hover[b-96ifgwepjy] {
    background-color: #f3f4f6;
    color: #111827;
    transform: scale(1.1);
}

/* Panel de detalle de nota */
.note-detail-title-panel[b-96ifgwepjy] {
    border-left: 5px solid transparent;
}

.detail-panel-blue[b-96ifgwepjy] { background-color: #eff6ff; border: 1px solid #bfdbfe; border-left: 5px solid #3b82f6; }
.detail-panel-purple[b-96ifgwepjy] { background-color: #f5f3ff; border: 1px solid #ddd6fe; border-left: 5px solid #8b5cf6; }
.detail-panel-green[b-96ifgwepjy] { background-color: #ecfdf5; border: 1px solid #a7f3d0; border-left: 5px solid #10b981; }
.detail-panel-teal[b-96ifgwepjy] { background-color: #f0fdfa; border: 1px solid #99f6e4; border-left: 5px solid #14b8a6; }
.detail-panel-red[b-96ifgwepjy] { background-color: #fff5f5; border: 1px solid #fecaca; border-left: 5px solid #f43f5e; }
.detail-panel-default[b-96ifgwepjy] { background-color: #f3f4f6; border: 1px solid #d1d5db; border-left: 5px solid #9ca3af; }

/* Card de archivos firmados */
.signed-file-card[b-96ifgwepjy] {
    background-color: #f8fafc;
    border-color: #e2e8f0 !important;
}

.signed-file-empty-state[b-96ifgwepjy] {
    background-color: #f9fafb;
    border-style: dashed;
    border-color: #d1d5db !important;
}

.order-notes-content-layout[b-96ifgwepjy] {
    align-items: stretch;
}

.order-section-card[b-96ifgwepjy],
.order-aside-card[b-96ifgwepjy] {
    border: none;
    border-radius: 14px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    background-color: #fff;
    overflow: hidden;
}

.order-section-card__header[b-96ifgwepjy],
.order-aside-card__header[b-96ifgwepjy] {
    background-color: #fff;
    border-bottom: 1px solid #eef2f7;
    padding: 16px !important;
}

.order-section-card__body[b-96ifgwepjy],
.order-aside-card__body[b-96ifgwepjy] {
    padding: 16px !important;
}

.order-aside-data-row[b-96ifgwepjy] {
    font-size: 1rem;
}

.order-aside-data-label[b-96ifgwepjy] {
    color: #6b7280;
    margin-right: 12px;
}

.order-aside-data-value[b-96ifgwepjy] {
    font-weight: 700;
    color: #111827;
    text-align: right;
}

.order-files-section[b-96ifgwepjy] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.order-files-section__title[b-96ifgwepjy] {
    margin: 0;
    font-size: 0.85rem;
    font-weight: 700;
    color: #374151;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.order-files-grid[b-96ifgwepjy] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.order-document-card[b-96ifgwepjy] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    border-radius: 10px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.15s ease;
}

.order-document-card:hover[b-96ifgwepjy] {
    background: #f3f4f6;
    border-color: #d1d5db;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
    transform: translateY(-1px);
}

.order-document-card:active[b-96ifgwepjy] {
    transform: translateY(0);
}

.order-document-card--disabled[b-96ifgwepjy] {
    opacity: 0.45 !important;
    pointer-events: none !important;
    cursor: not-allowed !important;
    filter: grayscale(0.2);
    box-shadow: none !important;
    transform: none !important;
}

.order-document-card--loading[b-96ifgwepjy] {
    border-color: var(--primary-color, #6366f1) !important;
    background-color: #ffffff !important;
    box-shadow: 0 0 0 2px var(--primary-rgba-color, rgba(99, 102, 241, 0.2)) !important;
    pointer-events: none !important;
    cursor: wait !important;
}

.badge-downloading-pulse[b-96ifgwepjy] {
    background-color: var(--primary-color, #6366f1);
    color: #ffffff;
    font-size: 0.65rem;
    font-weight: 600;
    padding: 2px 7px;
    border-radius: 10px;
    animation: badge-pulse-soft-b-96ifgwepjy 1.4s ease-in-out infinite;
}

@keyframes badge-pulse-soft-b-96ifgwepjy {
    0% { opacity: 0.75; transform: scale(0.97); }
    50% { opacity: 1; transform: scale(1.03); }
    100% { opacity: 0.75; transform: scale(0.97); }
}

.order-document-card__icon[b-96ifgwepjy] {
    width: 24px;
    height: 24px;
    color: #ef4444;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.order-document-card__icon .k-svg-icon[b-96ifgwepjy],
[b-96ifgwepjy] .order-document-card__icon .k-svg-icon {
    width: 24px !important;
    height: 24px !important;
    color: #ef4444 !important;
}

.order-document-card__info[b-96ifgwepjy] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.order-document-card__info strong[b-96ifgwepjy] {
    font-size: 0.82rem;
    color: #111827;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.order-document-card__category[b-96ifgwepjy] {
    font-size: 0.68rem;
    color: #9ca3af;
}

@media (min-width: 768px) {
    .order-files-grid[b-96ifgwepjy] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .order-section-card__body[b-96ifgwepjy],
    .order-aside-card__body[b-96ifgwepjy] {
        padding: 16px !important;
    }

    .note-card[b-96ifgwepjy] {
        padding: 10px 12px !important;
    }

    .order-document-card[b-96ifgwepjy] {
        padding: 10px 12px;
        gap: 10px;
    }

    .note-card-action[b-96ifgwepjy] {
        padding-left: 4px !important;
        padding-right: 0 !important;
    }
}
/* /Components/PaymentGateway/BoldPaymentActions.razor.rz.scp.css */
.bold-actions-grid[b-nfwj9ebcdd] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
    width: 100%;
}

@media (max-width: 576px) {
    .bold-actions-grid[b-nfwj9ebcdd] {
        grid-template-columns: 1fr;
    }
}

.bold-action-card[b-nfwj9ebcdd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 16px 12px;
    background: #ffffff;
    border: 1.5px solid #e2e8f0;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    user-select: none;
}

.bold-action-card:hover[b-nfwj9ebcdd] {
    border-color: var(--primary-color, #7c3aed);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px color-mix(in srgb, var(--primary-color, #7c3aed) 15%, transparent);
    background: color-mix(in srgb, var(--primary-color, #7c3aed) 3%, #ffffff);
}

.bold-action-card:focus-visible[b-nfwj9ebcdd] {
    outline: 2px solid var(--primary-color, #7c3aed);
    outline-offset: 2px;
}

.bold-action-card.processing[b-nfwj9ebcdd] {
    pointer-events: none;
    opacity: 0.75;
}

.bold-card-icon-wrapper[b-nfwj9ebcdd] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
    transition: all 0.2s ease;
}

.bold-card-icon-wrapper.terminal-icon[b-nfwj9ebcdd] {
    background: color-mix(in srgb, var(--primary-color, #7c3aed) 12%, #ffffff);
    color: var(--primary-color, #7c3aed);
    border: 1px solid color-mix(in srgb, var(--primary-color, #7c3aed) 25%, transparent);
}

.bold-card-icon-wrapper.link-icon[b-nfwj9ebcdd] {
    background: #f0fdf4;
    color: #16a34a;
    border: 1px solid #bbf7d0;
}

.bold-action-card:hover .bold-card-icon-wrapper[b-nfwj9ebcdd] {
    transform: scale(1.06);
}

.bold-card-content[b-nfwj9ebcdd] {
    flex-grow: 1;
    margin-bottom: 12px;
}

.bold-card-title[b-nfwj9ebcdd] {
    font-weight: 700;
    font-size: 0.92rem;
    color: #1e293b;
    margin-bottom: 4px;
}

.bold-card-desc[b-nfwj9ebcdd] {
    font-size: 0.775rem;
    color: #64748b;
    line-height: 1.35;
}

.bold-card-badge[b-nfwj9ebcdd] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 6px 14px;
    font-size: 0.8rem;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.15s ease;
    width: 100%;
}

.bold-card-badge.primary[b-nfwj9ebcdd] {
    background: var(--primary-color, #7c3aed);
    color: #ffffff;
    border: 1px solid var(--primary-color, #7c3aed);
}

.bold-card-badge.outline[b-nfwj9ebcdd] {
    background: transparent;
    color: var(--primary-color, #7c3aed);
    border: 1.5px solid var(--primary-color, #7c3aed);
}

.bold-action-card:hover .bold-card-badge.outline[b-nfwj9ebcdd] {
    background: var(--primary-color, #7c3aed);
    color: #ffffff;
}

.bold-action-card:hover .bold-card-badge.primary[b-nfwj9ebcdd] {
    filter: brightness(1.08);
}
/* /Components/PaymentGateway/MercadoPagoPaymentActions.razor.rz.scp.css */
.mp-action-card[b-ttctl91w5p] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    margin-top: 10px;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.mp-action-card:hover[b-ttctl91w5p] {
    border-color: #009ee3;
    background-color: #f0f9ff;
    box-shadow: 0 4px 6px -1px rgba(0, 158, 227, 0.1);
}

.mp-card-icon-wrapper[b-ttctl91w5p] {
    flex-shrink: 0;
}

.mp-brand-badge[b-ttctl91w5p] {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background-color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 3px;
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.mp-brand-logo-img[b-ttctl91w5p] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.mp-card-content[b-ttctl91w5p] {
    flex-grow: 1;
}

.mp-card-title[b-ttctl91w5p] {
    font-size: 14px;
    font-weight: 600;
    color: #1e293b;
    margin-bottom: 2px;
}

.mp-card-desc[b-ttctl91w5p] {
    font-size: 12px;
    color: #64748b;
}

.mp-card-action[b-ttctl91w5p] {
    flex-shrink: 0;
}

@media (max-width: 576px) {
    .mp-action-card[b-ttctl91w5p] {
        flex-direction: column;
        align-items: stretch;
        text-align: center;
        gap: 10px;
    }

    .mp-card-icon-wrapper[b-ttctl91w5p] {
        display: flex;
        justify-content: center;
    }

    .mp-card-action[b-ttctl91w5p] {
        width: 100%;
    }

    .mp-card-action button[b-ttctl91w5p] {
        width: 100%;
    }
}

/* /Components/PaymentGateway/MercadoPagoPaymentDialog.razor.rz.scp.css */
.mp-payment-container[b-8m06oy1ir1] {
    padding: 4px 2px;
}

/* ==========================================================================
   PESTAÑAS (TABS) IDÉNTICAS A LA IMAGEN 1 DE ARREGLY
   ========================================================================== */
.mp-tabs-header[b-8m06oy1ir1] {
    display: flex;
    gap: 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid #eaecf0;
    padding-bottom: 0;
    overflow-x: auto;
}

.mp-tab-btn[b-8m06oy1ir1] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 4px 10px 4px;
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    font-size: 13px;
    font-weight: 500;
    color: #667085;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.mp-tab-btn:hover[b-8m06oy1ir1] {
    color: var(--primary-color);
    background: transparent;
}

.mp-tab-btn.active[b-8m06oy1ir1] {
    color: var(--primary-color) !important;
    border-bottom: 2px solid var(--primary-color) !important;
    font-weight: 600 !important;
    background: transparent !important;
}

/* ==========================================================================
   RESUMEN DEL MONTO
   ========================================================================== */
.mp-amount-summary[b-8m06oy1ir1] {
    background: #f8fafc;
    border: 1px solid #eaecf0;
    border-radius: 12px;
    padding: 10px 14px;
    text-align: center;
    margin-bottom: 16px;
}

.mp-amount-summary .summary-label[b-8m06oy1ir1] {
    font-size: 11px;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: 600;
}

.mp-amount-summary .summary-value[b-8m06oy1ir1] {
    font-size: 20px;
    font-weight: 700;
    color: #0f172a;
    margin: 2px 0;
}

.mp-amount-summary .summary-value small[b-8m06oy1ir1] {
    font-size: 12px;
    color: #64748b;
    font-weight: 500;
}

.mp-amount-summary .summary-desc[b-8m06oy1ir1] {
    font-size: 12px;
    color: #475569;
}

/* ==========================================================================
   LABELS (ESTÁNDAR FORM-LABEL DE ARREGLY)
   ========================================================================== */
.form-label[b-8m06oy1ir1] {
    display: block;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #344054;
    margin-bottom: 4px;
}

/* ==========================================================================
   INPUTS TEXTBOX-ARREGLY (IDÉNTICOS A IMAGEN 1: 30px, BORDER-RADIUS 12px, #d0d5dd)
   ========================================================================== */
.textbox-arregly[b-8m06oy1ir1],
input.textbox-arregly[b-8m06oy1ir1],
.mp-input-container.textbox-arregly[b-8m06oy1ir1],
[b-8m06oy1ir1] .textbox-arregly {
    height: 30px !important;
    border-radius: 12px !important;
    border: 1px solid #d0d5dd !important;
    background-color: #ffffff !important;
    padding: 0 12px !important;
    font-size: 0.8125rem !important;
    font-weight: 400 !important;
    color: #101828 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease !important;
}

.textbox-arregly:hover[b-8m06oy1ir1],
input.textbox-arregly:hover[b-8m06oy1ir1],
.mp-input-container.textbox-arregly:hover[b-8m06oy1ir1],
[b-8m06oy1ir1] .textbox-arregly:hover {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 3px var(--primary-rgba-color) !important;
}

.textbox-arregly:focus[b-8m06oy1ir1],
input.textbox-arregly:focus[b-8m06oy1ir1],
.mp-input-container.textbox-arregly:focus-within[b-8m06oy1ir1],
[b-8m06oy1ir1] .textbox-arregly:focus,
[b-8m06oy1ir1] .textbox-arregly:focus-within {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 3px var(--primary-rgba-color) !important;
    outline: none !important;
}

.textbox-arregly[b-8m06oy1ir1]::placeholder,
input.textbox-arregly[b-8m06oy1ir1]::placeholder,
[b-8m06oy1ir1] .textbox-arregly::placeholder {
    color: #98a2b3 !important;
    font-size: 0.8125rem !important;
}

/* ==========================================================================
   CONTROLES COMBOBOX Y DROPDOWNLIST ARREGLY (IDÉNTICOS A IMAGEN 2)
   ========================================================================== */
[b-8m06oy1ir1] .combobox-arregly.k-combobox,
[b-8m06oy1ir1] .combobox-arregly.k-picker,
[b-8m06oy1ir1] .dropdownlist-arregly.k-dropdownlist,
[b-8m06oy1ir1] .dropdownlist-arregly.k-picker,
.combobox-arregly.k-combobox[b-8m06oy1ir1],
.combobox-arregly.k-picker[b-8m06oy1ir1],
select.dropdownlist-arregly[b-8m06oy1ir1] {
    height: 30px !important;
    min-height: 30px !important;
    max-height: 30px !important;
    border-radius: 12px !important;
    border: 1px solid #d0d5dd !important;
    background-color: #ffffff !important;
    font-size: 0.8125rem !important;
    width: 100% !important;
    box-sizing: border-box !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease !important;
}

[b-8m06oy1ir1] .combobox-arregly .k-input-inner,
[b-8m06oy1ir1] .dropdownlist-arregly .k-input-inner,
.combobox-arregly .k-input-inner[b-8m06oy1ir1] {
    height: 30px !important;
    line-height: 30px !important;
    padding: 0 12px !important;
    font-size: 0.8125rem !important;
    font-weight: 400 !important;
    color: #101828 !important;
}

[b-8m06oy1ir1] .combobox-arregly .k-input-button,
[b-8m06oy1ir1] .dropdownlist-arregly .k-input-button,
.combobox-arregly .k-input-button[b-8m06oy1ir1] {
    border: none !important;
    background: transparent !important;
    color: #667085 !important;
    padding-right: 8px !important;
}

[b-8m06oy1ir1] .combobox-arregly:hover,
[b-8m06oy1ir1] .dropdownlist-arregly:hover,
.combobox-arregly:hover[b-8m06oy1ir1] {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 3px var(--primary-rgba-color) !important;
}

[b-8m06oy1ir1] .combobox-arregly.k-focus,
[b-8m06oy1ir1] .combobox-arregly:focus-within,
[b-8m06oy1ir1] .dropdownlist-arregly.k-focus,
[b-8m06oy1ir1] .dropdownlist-arregly:focus-within,
.combobox-arregly.k-focus[b-8m06oy1ir1],
.combobox-arregly:focus-within[b-8m06oy1ir1] {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 3px var(--primary-rgba-color) !important;
    outline: none !important;
}

/* ==========================================================================
   CONTENEDORES SEGUROS PARA IFRAMES MERCADOPAGO.JS
   ========================================================================== */
.mp-input-container[b-8m06oy1ir1] {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    padding: 0 12px !important;
    height: 30px !important;
}

/* ==========================================================================
   ACCIONES / BOTONES (DISPOSICIÓN ESPACIADA IDÉNTICA A FOOTER DE IMAGEN 1)
   ========================================================================== */
.mp-actions[b-8m06oy1ir1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-top: 18px;
    padding-top: 14px;
    border-top: 1px solid #eaecf0;
}

.mp-loading-state[b-8m06oy1ir1] {
    text-align: center;
    padding: 30px 0;
    color: #64748b;
}

.mp-payment-inline-wrapper[b-8m06oy1ir1] {
    display: flex;
    flex-direction: column;
    width: 100%;
}

@media (max-width: 576px) {
    .mp-tabs-header[b-8m06oy1ir1] {
        display: flex;
        flex-wrap: wrap;
        gap: 6px;
    }

    .mp-tab-btn[b-8m06oy1ir1] {
        flex: 1 1 calc(50% - 6px);
        justify-content: center;
        padding: 8px 6px;
        font-size: 12px;
    }

    .mp-actions[b-8m06oy1ir1] {
        flex-direction: column-reverse;
        width: 100%;
    }

    .mp-actions button[b-8m06oy1ir1] {
        width: 100%;
        justify-content: center;
    }
}

/* ==========================================================================
   DESPLEGABLES ARREGLY PARA TARJETA (CLASES CANÓNICAS COMBOBOX / K-LIST-ITEM)
   ========================================================================== */
[b-8m06oy1ir1] .combobox-arregly-wrapper,
.combobox-arregly-wrapper[b-8m06oy1ir1] {
    position: relative;
    width: 100%;
}

[b-8m06oy1ir1] .combobox-arregly-wrapper .k-combobox,
.combobox-arregly-wrapper .k-combobox[b-8m06oy1ir1] {
    cursor: pointer !important;
}

[b-8m06oy1ir1] .combobox-arregly-wrapper .k-animation-container,
.combobox-arregly-wrapper .k-animation-container[b-8m06oy1ir1] {
    position: absolute !important;
    top: calc(100% + 4px) !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 2200 !important;
}

[b-8m06oy1ir1] .combobox-arregly-wrapper .k-popup.k-list-container,
.combobox-arregly-wrapper .k-popup.k-list-container[b-8m06oy1ir1] {
    background-color: #ffffff !important;
    border: 1px solid #eaecf0 !important;
    border-radius: 12px !important;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
    padding: 4px !important;
    max-height: 220px !important;
    overflow-y: auto !important;
}

[b-8m06oy1ir1] .combobox-arregly-wrapper .k-list-item,
.combobox-arregly-wrapper .k-list-item[b-8m06oy1ir1] {
    font-size: 0.8125rem !important;
    padding: 6px 12px !important;
    border-radius: 6px !important;
    margin-bottom: 2px !important;
    color: #101828 !important;
    cursor: pointer !important;
    transition: background-color 0.15s ease, color 0.15s ease !important;
}

[b-8m06oy1ir1] .combobox-arregly-wrapper .k-list-item:hover,
.combobox-arregly-wrapper .k-list-item:hover[b-8m06oy1ir1] {
    background-color: #f1f5f9 !important;
    color: #101828 !important;
}

[b-8m06oy1ir1] .combobox-arregly-wrapper .k-list-item.k-selected,
[b-8m06oy1ir1] .combobox-arregly-wrapper .k-list-item.k-focus,
.combobox-arregly-wrapper .k-list-item.k-selected[b-8m06oy1ir1],
.combobox-arregly-wrapper .k-list-item.k-focus[b-8m06oy1ir1] {
    background-color: var(--primary-color) !important;
    background: var(--primary-color) !important;
    color: #ffffff !important;
    font-weight: 500 !important;
}
/* /Components/PaymentGateway/SendPaymentLinkDialog.razor.rz.scp.css */
.send-payment-link-inline-wrapper[b-gzf2eax87y] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.dialog-header-row[b-gzf2eax87y] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 10px;
    margin-bottom: 12px;
    border-bottom: 1px solid #e2e8f0;
}

.dialog-header-title[b-gzf2eax87y] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.dialog-header-title h6[b-gzf2eax87y] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1e293b;
    margin: 0;
}

.dialog-header-icon[b-gzf2eax87y] {
    color: var(--primary-color, #7c3aed);
    font-size: 1.1rem;
}

.btn-icon-back[b-gzf2eax87y] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    border-radius: 50% !important;
    background: #f1f5f9 !important;
    border: 1px solid #e2e8f0 !important;
    color: #475569 !important;
    padding: 0 !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.btn-icon-back:hover[b-gzf2eax87y] {
    background: color-mix(in srgb, var(--primary-color, #7c3aed) 12%, #ffffff) !important;
    border-color: var(--primary-color, #7c3aed) !important;
    color: var(--primary-color, #7c3aed) !important;
    transform: scale(1.08) !important;
}

/* Tarjeta de Resumen */
.payment-summary-card[b-gzf2eax87y] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 12px 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 14px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
}

.summary-left[b-gzf2eax87y] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.summary-label[b-gzf2eax87y] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
}

.summary-concept[b-gzf2eax87y] {
    font-size: 0.92rem;
    font-weight: 700;
    color: #1e293b;
}

.summary-client[b-gzf2eax87y] {
    font-size: 0.78rem;
    color: #64748b;
    margin-top: 2px;
}

.summary-right[b-gzf2eax87y] {
    text-align: right;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.summary-amount[b-gzf2eax87y] {
    font-size: 1.3rem;
    font-weight: 800;
    color: var(--primary-color, #7c3aed);
    line-height: 1.2;
}

/* Selector de Canales (Pills en una sola línea) */
.channels-section[b-gzf2eax87y] {
    margin-bottom: 12px;
}

.channels-section-label[b-gzf2eax87y] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #334155;
    margin-bottom: 6px;
}

.channels-pills-container[b-gzf2eax87y] {
    display: flex;
    gap: 4px;
    background: #f1f5f9;
    padding: 4px;
    border-radius: 10px;
    border: 1px solid #e2e8f0;
    width: 100%;
}

.channel-pill-btn[b-gzf2eax87y] {
    flex: 1 1 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 7px 6px;
    background: transparent;
    border: none;
    border-radius: 8px;
    font-size: 0.775rem;
    font-weight: 600;
    color: #64748b;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.channel-pill-btn span[b-gzf2eax87y] {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.channel-pill-btn:hover[b-gzf2eax87y] {
    color: var(--primary-color, #7c3aed);
    background: rgba(255, 255, 255, 0.7);
}

.channel-pill-btn.active[b-gzf2eax87y] {
    background: var(--primary-color, #7c3aed);
    color: #ffffff;
    box-shadow: 0 2px 6px color-mix(in srgb, var(--primary-color, #7c3aed) 25%, transparent);
}

/* Formulario de Canal Activo */
.channel-form-card[b-gzf2eax87y] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 14px;
    margin-bottom: 12px;
}

.channel-form-label[b-gzf2eax87y] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #1e293b;
    margin-bottom: 6px;
    display: block;
}

.channel-form-hint[b-gzf2eax87y] {
    font-size: 0.75rem;
    color: #64748b;
    margin-top: 4px;
    margin-bottom: 12px;
    display: block;
}

.copy-url-container[b-gzf2eax87y] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.copy-url-input-wrapper[b-gzf2eax87y] {
    width: 100%;
}

.copy-url-input[b-gzf2eax87y] {
    width: 100%;
    font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: 0.8rem;
    padding: 8px 12px;
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    color: #334155;
}

.copy-actions-row[b-gzf2eax87y] {
    display: flex;
    gap: 8px;
    width: 100%;
}

.copy-action-btn[b-gzf2eax87y] {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

/* Card de Estado en Tiempo Real */
.live-status-card[b-gzf2eax87y] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 10px 14px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
}

.live-status-left[b-gzf2eax87y] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.live-status-text[b-gzf2eax87y] {
    font-size: 0.8rem;
    color: #475569;
    font-weight: 500;
}

.live-status-right[b-gzf2eax87y] {
    display: flex;
    align-items: center;
}

.status-badge-pending[b-gzf2eax87y] {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fde68a;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 700;
}

.status-badge-checking[b-gzf2eax87y] {
    background: #e0e7ff;
    color: #3730a3;
    border: 1px solid #c7d2fe;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 700;
}

.live-status-card.status-failed[b-gzf2eax87y] {
    background: #fff5f5;
    border-color: #fecdd3;
}

.status-badge-failed[b-gzf2eax87y] {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fca5a5;
    padding: 4px 10px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 700;
}

.status-failed-icon[b-gzf2eax87y] {
    color: #dc2626;
    flex-shrink: 0;
}
/* /Components/PdfPreviewModal.razor.rz.scp.css */
.pdf-preview-modal-body[b-mc221bt1ii] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    height: 100%;
}

[b-mc221bt1ii] .modal-body-custom {
    overflow-y: hidden !important;
}

.pdf-preview-header-info h6[b-mc221bt1ii] {
    margin: 0;
    font-weight: 700;
}

.pdf-preview-frame[b-mc221bt1ii] {
    width: 100%;
    height: calc(75vh - 100px);
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    background: #f8fafc;
}

[b-mc221bt1ii] .modal-overlay {
    background: rgba(0, 0, 0, 0.5) !important;
    backdrop-filter: blur(4px) !important;
    -webkit-backdrop-filter: blur(4px) !important;
}

/* Footer en escritorio (> 768px): Cerrar a la izquierda, Imprimir y Descargar agrupados a la derecha */
.pdf-preview-footer[b-mc221bt1ii] {
    display: flex;
    align-items: center;
    width: 100%;
    gap: 12px;
}

.pdf-preview-footer[b-mc221bt1ii]  .btn-pdf-close {
    margin-right: auto !important;
}

/* Footer en móvil (<= 768px): Fila 1 = Descargar PDF (100%), Fila 2 = Cerrar e Imprimir (50% / 50%) */
@media (max-width: 768px) {
    .pdf-preview-footer[b-mc221bt1ii] {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        justify-content: space-between !important;
        gap: 8px !important;
        width: 100% !important;
    }

    /* Botón principal CTA: Fila superior completa (100%) */
    .pdf-preview-footer[b-mc221bt1ii]  .btn-pdf-download {
        order: 1 !important;
        width: 100% !important;
        flex: 1 1 100% !important;
        margin: 0 !important;
    }

    /* Botones secundarios outline: Fila inferior en paralelo (50% / 50%) */
    .pdf-preview-footer[b-mc221bt1ii]  .btn-pdf-close,
    .pdf-preview-footer[b-mc221bt1ii]  .btn-pdf-print {
        order: 2 !important;
        flex: 1 1 calc(50% - 4px) !important;
        min-width: 0 !important;
        width: auto !important;
        margin: 0 !important;
    }

    /* Homologación con el sistema de botones Arregly */
    .pdf-preview-footer[b-mc221bt1ii]  .btn-arregly,
    .pdf-preview-footer[b-mc221bt1ii]  .k-button {
        min-height: 34px !important;
        height: auto !important;
        padding: 8px 10px !important;
        font-size: 0.84rem !important;
        font-weight: 500 !important;
        border-radius: 12px !important;
        justify-content: center !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 6px !important;
        white-space: nowrap !important;
    }

    .pdf-preview-footer[b-mc221bt1ii]  .k-button svg,
    .pdf-preview-footer[b-mc221bt1ii]  .k-button .k-svg-icon {
        width: 15px !important;
        height: 15px !important;
        flex-shrink: 0 !important;
    }

    .pdf-preview-footer[b-mc221bt1ii]  .k-button .k-button-text {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}


/* /Components/Shared/CustomTabStrip.razor.rz.scp.css */
/*.custom-tab-strip-container {
    width: 100%;
    height: 100%;
}

.tab-icon {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    transition: all 0.2s ease;
}

.tab-title {
    font-weight: 500;
    font-size: 14px;
    transition: all 0.2s ease;
}

.tab-badge {
    background: #dc3545;
    color: white;
    border-radius: 50%;
    padding: 2px 6px;
    font-size: 11px;
    font-weight: 600;
    min-width: 18px;
    text-align: center;
    line-height: 1.2;
}

.tab-content {
    padding: 24px;
    height: 100%;
    overflow-y: auto;
    max-width: 1000px;
    margin: 0 auto;
}

.tab-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    gap: 16px;
    color: #6b7280;
}*/

/* Variante global reutilizable para tabs voladores */
[b-yjn8lu5cxf] .custom-tab-strip--floating.k-tabstrip,
[b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip,
[b-yjn8lu5cxf] .custom-tab-strip--floating.k-widget {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0;
}

[b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-items-wrapper,
[b-yjn8lu5cxf] .custom-tab-strip--floating .k-reset {
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 0 16px 0 !important;
    gap: 10px;
}

[b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-items {
    background: transparent !important;
    border: 0 !important;
    padding: 4px 4px 6px 4px !important;
    margin: 0 0 16px 0 !important;
    gap: 10px;
}

[b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-item,
[b-yjn8lu5cxf] .custom-tab-strip--floating .k-item,
[b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-item.k-tabstrip-item,
[b-yjn8lu5cxf] .custom-tab-strip--floating .k-item.k-item {
    border: 0 !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    color: #6b7280 !important;
    transition: all 0.15s ease;
    box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px;
}

    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-item:hover,
    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-item:hover,
    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-item.k-hover,
    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-item.k-hover {
        border-color: var(--primary-color) !important;
        background: #fff !important;
        color: var(--primary-color) !important;
        box-shadow: none !important;
    }

    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-item.k-active,
    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-item.k-active,
    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-item.k-active:hover,
    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-item.k-active:hover {
        border: 0.1px solid #111827 !important;
        background: #fff !important;
        color: #111827 !important;
        box-shadow: none;
    }

    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-item .k-link,
    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-item .k-link,
    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-item .k-button-text,
    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-item .k-button-text {
        padding: 9px 18px !important;
        color: inherit !important;
        font-weight: 600;
    }

[b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-content,
[b-yjn8lu5cxf] .custom-tab-strip--floating .k-content,
[b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-content:focus,
[b-yjn8lu5cxf] .custom-tab-strip--floating .k-content:focus {
    background: transparent !important;
    border: 0 !important;
    outline: 1px solid transparent;
    background-clip: padding-box;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    overflow-y: visible !important;
    height: auto !important;
}

.custom-tab-strip-container .custom-tab-strip--floating .tab-content[b-yjn8lu5cxf],
.custom-tab-strip--floating .tab-content[b-yjn8lu5cxf],
.employee-tabstrip.custom-tab-strip--floating .tab-content[b-yjn8lu5cxf] {
    background: transparent !important;
    border: 0 !important;
    outline: 1px solid transparent;
    background-clip: padding-box;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    overflow-y: visible !important;
    height: auto !important;
}

.configuration-tabs .k-tabstrip-tab.k-active[b-yjn8lu5cxf] {
    background: white;
    border-bottom: 3px solid var(--primary-color, #6366f1);
    margin-bottom: -2px;
}

.configuration-tabs .k-tabstrip-tab.k-active .tab-title[b-yjn8lu5cxf] {
    color: var(--primary-color, #6366f1);
    font-weight: 600;
}

.configuration-tabs .k-tabstrip-tab.k-active .tab-icon[b-yjn8lu5cxf] {
    color: var(--primary-color, #6366f1);
}

.configuration-tabs .k-tabstrip-tab:not(.k-active):not(.k-disabled):hover[b-yjn8lu5cxf] {
    background: rgba(99, 102, 241, 0.05);
}

.configuration-tabs .k-tabstrip-tab:not(.k-active):not(.k-disabled):hover .tab-title[b-yjn8lu5cxf] {
    color: var(--primary-color, #6366f1);
}

.configuration-tabs .k-tabstrip-tab:not(.k-active):not(.k-disabled):hover .tab-icon[b-yjn8lu5cxf] {
    color: var(--primary-color, #6366f1);
}

.configuration-tabs .k-tabstrip-tab.k-disabled[b-yjn8lu5cxf] {
    opacity: 0.6;
    cursor: not-allowed;
}

.configuration-tabs .k-tabstrip-tab.k-disabled .tab-title[b-yjn8lu5cxf],
.configuration-tabs .k-tabstrip-tab.k-disabled .tab-icon[b-yjn8lu5cxf] {
    color: #9ca3af;
}

@media (max-width: 768px) {
    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-items-wrapper,
    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-reset {
        margin-bottom: 8px !important;
    }

    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-items {
        margin-bottom: 8px !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none !important;
        -ms-overflow-style: none !important;
    }

    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-items::-webkit-scrollbar {
        display: none !important;
    }

    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-item,
    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-item {
        flex-shrink: 0 !important;
    }

        [b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-item .k-link,
        [b-yjn8lu5cxf] .custom-tab-strip--floating .k-item .k-link,
        [b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-item .k-button-text,
        [b-yjn8lu5cxf] .custom-tab-strip--floating .k-item .k-button-text {
            padding: 5px 5px !important;
        }

    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-items {
        gap: 5px;
    }
}

@media (max-width: 480px) {
    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-tabstrip-item .k-link,
    [b-yjn8lu5cxf] .custom-tab-strip--floating .k-item .k-link {
        padding: 8px 12px !important;
        font-size: 0.85rem !important;
    }
}

/*@media (max-width: 768px) {
    .configuration-tabs .k-tabstrip-header {
        padding: 0 16px;
    }

    .tab-content {
        padding: 16px;
    }

    .tab-title {
        font-size: 13px;
    }

    .tab-icon {
        width: 18px;
        height: 18px;
    }
}*/
/* /Components/Shared/FormTabs.razor.rz.scp.css */
/* Estilos centralizados del componente FormTabs.
   Replican exactamente el look de ServiceForm.razor.css y ProductForm.razor.css.
   Se usa el wrapper .shared-form-tabs-wrapper como padre para que ::deep
   pueda alcanzar al TelerikTabStrip y todas sus clases internas. */

.shared-form-tabs-wrapper[b-krh6iaaytn] {
    width: 100%;
}

[b-krh6iaaytn] .shared-form-tabs {
    width: 100%;
}

[b-krh6iaaytn] .shared-form-tabs .k-tabstrip-items-wrapper,
[b-krh6iaaytn] .shared-form-tabs .k-tabstrip-items,
[b-krh6iaaytn] .shared-form-tabs .k-tabstrip-content,
[b-krh6iaaytn] .shared-form-tabs .k-tabstrip-content .k-content,
[b-krh6iaaytn] .shared-form-tabs .k-tabstrip-content > .k-content,
[b-krh6iaaytn] .shared-form-tabs .k-tabstrip-content > .k-content.k-active,
[b-krh6iaaytn] .shared-form-tabs .k-tabstrip-content > .k-content.k-state-active,
[b-krh6iaaytn] .shared-form-tabs .k-content.k-active {
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}

[b-krh6iaaytn] .shared-form-tabs .k-tabstrip-items {
    gap: 0 !important;
}

[b-krh6iaaytn] .shared-form-tabs.k-tabstrip .k-tabstrip-items .k-item,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip .k-tabstrip-items .k-item.k-active,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip .k-tabstrip-items .k-item.k-selected,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip .k-tabstrip-items .k-item.k-focus,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip .k-tabstrip-items .k-item.k-hover {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    outline: none !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

[b-krh6iaaytn] .shared-form-tabs.k-tabstrip .k-tabstrip-items .k-item::before,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip .k-tabstrip-items .k-item::after,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip .k-tabstrip-items .k-link::before,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip .k-tabstrip-items .k-link::after {
    display: none !important;
    content: none !important;
}

[b-krh6iaaytn] .shared-form-tabs .k-tabstrip-items-wrapper {
    border-bottom: 1px solid #e5e7eb !important;
}

[b-krh6iaaytn] .shared-form-tabs .k-link {
    min-height: 44px !important;
    padding: 0.75rem 1rem !important;
    color: #4b5563 !important;
    font-weight: 500 !important;
    border-radius: 0 !important;
    border: 0 !important;
    border-bottom: 3px solid transparent !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
}

[b-krh6iaaytn] .shared-form-tabs .k-item:hover .k-link,
[b-krh6iaaytn] .shared-form-tabs .k-link:hover {
    color: #111827 !important;
    background: transparent !important;
    border-bottom-color: transparent !important;
}

[b-krh6iaaytn] .shared-form-tabs .k-item.k-active .k-link,
[b-krh6iaaytn] .shared-form-tabs .k-item.k-selected .k-link,
[b-krh6iaaytn] .shared-form-tabs .k-link.k-active,
[b-krh6iaaytn] .shared-form-tabs .k-link.k-selected,
[b-krh6iaaytn] .shared-form-tabs .k-link[aria-selected='true'] {
    color: var(--primary-color) !important;
    font-weight: 600 !important;
    background: transparent !important;
    border: 0 !important;
    border-bottom-color: var(--primary-color) !important;
    box-shadow: none !important;
}

[b-krh6iaaytn] .shared-form-tabs.k-tabstrip .k-tabstrip-items .k-link:focus,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip .k-tabstrip-items .k-link:focus-visible,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip .k-tabstrip-items .k-item.k-focus .k-link {
    box-shadow: none !important;
    outline: none !important;
}

/* Override final: sin cajas, solo línea inferior gruesa en activo (copiado de ProductForm). */
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-item,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-tabstrip-item,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-item.k-active,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-tabstrip-item.k-active,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-item.k-selected,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-tabstrip-item.k-selected {
    border: 0 !important;
    border-image: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    margin: 0 !important;
}

[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-item > .k-link,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-tabstrip-item > .k-link {
    border: 0 !important;
    border-bottom: 3px solid transparent !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
}

[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-item.k-active > .k-link,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-tabstrip-item.k-active > .k-link,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-item.k-selected > .k-link,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-tabstrip-item.k-selected > .k-link,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-item > .k-link[aria-selected='true'],
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-tabstrip-item > .k-link[aria-selected='true'] {
    border: 0 !important;
    border-bottom: 3px solid var(--primary-color) !important;
    background: transparent !important;
    box-shadow: none !important;
}

[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-content,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-content > .k-content,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-content > .k-content.k-active,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-content > .k-content.k-state-active {
    border: 0 !important;
    border-image: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
}

[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-content > .k-content::before,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-content > .k-content::after,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-content > .k-content.k-active::before,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-content > .k-content.k-active::after,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-content > .k-content.k-state-active::before,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-content > .k-content.k-state-active::after,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-item::before,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-item::after,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-tabstrip-item::before,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-tabstrip-item::after,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-link::before,
[b-krh6iaaytn] .shared-form-tabs.k-tabstrip.k-tabstrip-top > .k-tabstrip-items-wrapper > .k-tabstrip-items > .k-link::after {
    content: none !important;
    display: none !important;
}

[b-krh6iaaytn] .shared-form-tabs .k-item.k-active .k-link .k-svg-icon,
[b-krh6iaaytn] .shared-form-tabs .k-item.k-selected .k-link .k-svg-icon,
[b-krh6iaaytn] .shared-form-tabs .k-link.k-active .k-svg-icon,
[b-krh6iaaytn] .shared-form-tabs .k-link.k-selected .k-svg-icon,
[b-krh6iaaytn] .shared-form-tabs .k-link[aria-selected='true'] .k-svg-icon,
[b-krh6iaaytn] .shared-form-tabs .k-item.k-active .k-link .k-icon,
[b-krh6iaaytn] .shared-form-tabs .k-item.k-selected .k-link .k-icon,
[b-krh6iaaytn] .shared-form-tabs .k-link[aria-selected='true'] .k-icon {
    color: var(--primary-color) !important;
}

@media (max-width: 576px) {
    [b-krh6iaaytn] .shared-form-tabs .k-tabstrip-items-wrapper {
        overflow-x: auto !important;
        overflow-y: hidden !important;
        display: block !important;
        max-width: 100% !important;
        border-bottom: 1px solid #e5e7eb !important;
        -ms-overflow-style: none !important;
        scrollbar-width: none !important;
    }
    [b-krh6iaaytn] .shared-form-tabs .k-tabstrip-items-wrapper::-webkit-scrollbar {
        display: none !important;
    }
    [b-krh6iaaytn] .shared-form-tabs .k-tabstrip-items {
        display: flex !important;
        flex-wrap: nowrap !important;
        width: max-content !important;
        gap: 4px !important;
    }
    [b-krh6iaaytn] .shared-form-tabs .k-tabstrip-items .k-item,
    [b-krh6iaaytn] .shared-form-tabs .k-tabstrip-items .k-tabstrip-item {
        flex: 0 0 auto !important;
        display: flex !important;
        justify-content: center !important;
    }
    [b-krh6iaaytn] .shared-form-tabs .k-tabstrip-items .k-link {
        width: auto !important;
        display: inline-flex !important;
        justify-content: center !important;
        padding: 0.5rem 0.65rem !important;
        min-height: 50px !important;
    }
    [b-krh6iaaytn] .shared-form-tabs .k-tabstrip-items .k-link > div.d-flex {
        flex-direction: column !important;
        gap: 6px !important;
        align-items: center !important;
        text-align: center !important;
    }
    [b-krh6iaaytn] .shared-form-tabs .k-tabstrip-items .k-link > div.d-flex > span:not(.k-svg-icon):not(.k-icon) {
        font-size: 11px !important;
        line-height: 1.1 !important;
        font-weight: 600 !important;
    }
    [b-krh6iaaytn] .shared-form-tabs .k-tabstrip-items .k-link > div.d-flex > .k-svg-icon,
    [b-krh6iaaytn] .shared-form-tabs .k-tabstrip-items .k-link > div.d-flex > .k-icon {
        font-size: 16px !important;
        width: 16px !important;
        height: 16px !important;
        margin: 0 !important;
    }
}
/* /Components/Shared/JwtAuthorizeView.razor.rz.scp.css */
/* /Components/Shared/Notifications/NotificationDropdown.razor.rz.scp.css */
.header-btn-wrapper[b-0s0wri0gjk] {
    position: relative;
    overflow: visible;
}

.notifications-trigger[b-0s0wri0gjk] {
    position: relative;
    display: inline-flex;
    cursor: pointer;
    padding: 8px;
    margin: -8px;
    border-radius: 10px;
    transition: background 0.15s ease;
}

.notifications-badge-container[b-0s0wri0gjk] {
    position: relative;
    display: inline-flex;
}

.notifications-trigger:hover[b-0s0wri0gjk] {
    background: rgba(0, 0, 0, 0.06);
}

[b-0s0wri0gjk] .header-btn.k-button {
    width: 42px !important;
    height: 42px !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}


.notifications-overlay[b-0s0wri0gjk] {
    position: fixed;
    inset: 0;
    z-index: 1999;
    background: transparent;
    border: 0;
    margin: 0;
    padding: 0;
}

.notifications-dropdown-menu[b-0s0wri0gjk] {
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    width: 380px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.18);
    z-index: 2000;
    overflow: hidden;
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.notifications-dropdown-menu.closing[b-0s0wri0gjk] {
    opacity: 0;
    transform: translateY(-10px);
    pointer-events: none;
}

.notifications-dropdown-header[b-0s0wri0gjk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 12px 14px 8px;
}

.notifications-dropdown-title[b-0s0wri0gjk] {
    font-size: 22px;
    font-weight: 700;
    color: #111827;
}

.notifications-dropdown-count[b-0s0wri0gjk] {
    font-size: 12px;
    font-weight: 700;
    color: #111827;
    background: #f3f4f6;
    border-radius: 999px;
    padding: 2px 8px;
}

.notifications-actions-row[b-0s0wri0gjk] {
    padding: 10px 14px;
}

.notifications-mark-all-btn[b-0s0wri0gjk] {
    width: 100%;
    font-weight: 700;
    border-radius: 999px;
}

.notifications-actions-row[b-0s0wri0gjk]  .notifications-mark-all-btn.k-button {
    border-radius: 999px;
    border-color: #374151;
    background-color: #374151;
    color: #f9fafb;
    box-shadow: 0 4px 10px rgba(17, 24, 39, 0.18);
    transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
}

.notifications-actions-row[b-0s0wri0gjk]  .notifications-mark-all-btn.k-button:hover {
    background-color: #1f2937;
    border-color: #1f2937;
    transform: translateY(-1px);
}

.notifications-footer-actions[b-0s0wri0gjk] {
    padding: 8px 10px;
}

.notifications-footer-actions[b-0s0wri0gjk]  .notifications-view-all-btn.k-button {
    width: 100%;
    justify-content: flex-start;
    border-radius: 10px;
    color: #111827;
    font-weight: 600;
}

.notifications-footer-actions[b-0s0wri0gjk]  .notifications-view-all-btn.k-button:hover {
    background: #f8fafc;
}

.notifications-dropdown-list[b-0s0wri0gjk] {
    max-height: 320px;
    overflow-y: auto;
    overflow-x: hidden;
    border-top: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;
}

.notifications-dropdown-item[b-0s0wri0gjk] {
    padding: 12px 14px;
    border-bottom: 1px solid #eef2f7;
    background: #ffffff;
}

.notifications-dropdown-list[b-0s0wri0gjk]  .notifications-dropdown-item.k-button {
    width: 100%;
    border-radius: 0;
    border: 0;
    min-width: auto;
    justify-content: flex-start;
    text-align: left;
    white-space: normal;
    box-sizing: border-box;
    max-width: 100%;
}

.notifications-read-item[b-0s0wri0gjk] {
    background: #f8fafc;
}

.notifications-section-title[b-0s0wri0gjk] {
    padding: 8px 14px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #6b7280;
    background: #f9fafb;
    border-bottom: 1px solid #eef2f7;
}

.notifications-dropdown-item:hover[b-0s0wri0gjk] {
    background: #f8fafc;
}

.notifications-item-title-row[b-0s0wri0gjk] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.notifications-item-layout[b-0s0wri0gjk] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.notifications-item-main[b-0s0wri0gjk] {
    min-width: 0;
    flex: 1;
}

.notifications-item-title[b-0s0wri0gjk] {
    font-weight: 700;
    font-size: 13px;
    color: #111827;
}

.notifications-unread-dot[b-0s0wri0gjk] {
    color: #111827;
    font-size: 11px;
}

.notifications-item-subtitle[b-0s0wri0gjk] {
    font-size: 13px;
    color: #4b5563;
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.notifications-item-time[b-0s0wri0gjk] {
    font-size: 11px;
    color: #6b7280;
    margin-top: 4px;
}

.notifications-item-tags[b-0s0wri0gjk] {
    margin-top: 6px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.notifications-item-tags-right[b-0s0wri0gjk] {
    margin-top: 0;
    justify-content: flex-end;
    max-width: 42%;
}

.notifications-item-tag[b-0s0wri0gjk] {
    border-radius: 999px;
    padding: 2px 8px;
    font-size: 11px;
    font-weight: 700;
}

.tag-order[b-0s0wri0gjk] { background: #e0ecff; color: #2563eb; }
.tag-employee[b-0s0wri0gjk] { background: #e0e7ff; color: #4338ca; }
.tag-service[b-0s0wri0gjk] { background: #e2e8f0; color: #334155; }
.tag-product[b-0s0wri0gjk] { background: #dbf4ff; color: #0369a1; }
.tag-inventory[b-0s0wri0gjk] { background: #fff4d6; color: #b45309; }
.tag-client[b-0s0wri0gjk] { background: #cffafe; color: #0e7490; }
.tag-quote[b-0s0wri0gjk] { background: #ece9ff; color: #5b21b6; }
.tag-invoice[b-0s0wri0gjk] { background: #e5e7eb; color: #374151; }
.tag-event[b-0s0wri0gjk] { background: #fce7f3; color: #db2777; }
.tag-system[b-0s0wri0gjk] { background: #ffedd5; color: #ea580c; }

.notifications-empty-state[b-0s0wri0gjk] {
    padding: 14px;
    color: #6b7280;
    font-size: 13px;
}

@media (max-width: 767px) {
    .notifications-dropdown-menu[b-0s0wri0gjk] {
        position: fixed;
        top: 64px;
        left: 8px;
        right: 8px;
        width: auto;
        max-height: calc(100dvh - 76px);
    }

    .notifications-dropdown-list[b-0s0wri0gjk] {
        max-height: calc(100dvh - 220px);
    }

    .notifications-item-layout[b-0s0wri0gjk] {
        flex-direction: column;
    }

    .notifications-item-tags-right[b-0s0wri0gjk] {
        max-width: 100%;
        justify-content: flex-start;
    }
}

@media (max-width: 480px) {
    .notifications-dropdown-menu[b-0s0wri0gjk] {
        top: 56px;
        left: 6px;
        right: 6px;
        max-height: calc(100dvh - 64px);
    }

    .notifications-dropdown-list[b-0s0wri0gjk] {
        max-height: calc(100dvh - 210px);
    }
}
/* /Components/Shared/PhotoGallerySlider/PhotoGallerySlider.razor.rz.scp.css */
.photo-gallery-slider-wrapper[b-gqfkev8bpy] {
    width: 100%;
}

.photo-gallery-slider-header[b-gqfkev8bpy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.photo-gallery-slider-counter[b-gqfkev8bpy] {
    color: #64748b;
    font-size: 0.8rem;
    font-weight: 500;
}

.photo-gallery-slider-strip[b-gqfkev8bpy] {
    display: flex;
    gap: 12px;
    align-items: center;
    overflow-x: auto;
    padding: 4px 2px 8px;
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 transparent;
}

.photo-gallery-slider-strip[b-gqfkev8bpy]::-webkit-scrollbar {
    height: 4px;
}

.photo-gallery-slider-strip[b-gqfkev8bpy]::-webkit-scrollbar-thumb {
    background-color: #cbd5e1;
    border-radius: 4px;
}

/* Card de foto individual en la tira */
.photo-gallery-card[b-gqfkev8bpy] {
    width: 92px;
    height: 92px;
    min-width: 92px;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    border: 1px solid var(--border-linear-theme-arregly, #e2e8f0);
    background: #f8fafc;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.photo-gallery-card:hover[b-gqfkev8bpy] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    border-color: var(--primary-color, #601a18);
}

.photo-gallery-thumb[b-gqfkev8bpy] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.photo-gallery-badge[b-gqfkev8bpy] {
    position: absolute;
    top: 6px;
    left: 6px;
    background: rgba(15, 23, 42, 0.7);
    backdrop-filter: blur(4px);
    color: #ffffff;
    font-size: 0.65rem;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 6px;
    pointer-events: none;
    z-index: 2;
}

/* Overlay de acciones */
.photo-gallery-card-overlay[b-gqfkev8bpy] {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0.2) 60%, transparent 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    opacity: 0;
    transition: opacity 0.2s ease;
    z-index: 3;
}

.photo-gallery-card:hover .photo-gallery-card-overlay[b-gqfkev8bpy] {
    opacity: 1;
}

/* En dispositivos táctiles o móviles, mostrar siempre una sutil barra */
@media (hover: none) {
    .photo-gallery-card-overlay[b-gqfkev8bpy] {
        opacity: 1;
        background: rgba(0, 0, 0, 0.4);
    }
}

.photo-gallery-action-btn[b-gqfkev8bpy] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.15s ease, background-color 0.15s ease;
    backdrop-filter: blur(4px);
    padding: 0;
}

.photo-gallery-action-btn-view[b-gqfkev8bpy] {
    background: rgba(255, 255, 255, 0.95);
    color: #1e293b;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

.photo-gallery-action-btn-view:hover[b-gqfkev8bpy] {
    background: #ffffff;
    transform: scale(1.1);
    color: var(--primary-color, #601a18);
}

.photo-gallery-action-btn-delete[b-gqfkev8bpy] {
    background: rgba(220, 38, 38, 0.95);
    color: #ffffff;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

.photo-gallery-action-btn-delete:hover[b-gqfkev8bpy] {
    background: #dc2626;
    transform: scale(1.1);
}

/* Tile para agregar fotos inline */
.photo-gallery-add-tile[b-gqfkev8bpy] {
    width: 92px;
    height: 92px;
    min-width: 92px;
    border-radius: 12px;
    border: 2px dashed var(--border-linear-theme-arregly, #cbd5e1);
    background: #ffffff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
    color: #64748b;
    gap: 2px;
    padding: 4px;
    margin: 0;
}

.photo-gallery-add-tile:hover[b-gqfkev8bpy] {
    border-color: var(--primary-color, #601a18);
    background: var(--primary-rgba-color, rgba(96, 26, 24, 0.04));
    color: var(--primary-color, #601a18);
    transform: translateY(-2px);
}

.photo-gallery-add-icon[b-gqfkev8bpy] {
    font-size: 1.1rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.photo-gallery-add-label[b-gqfkev8bpy] {
    font-size: 0.72rem;
    font-weight: 600;
    text-align: center;
    line-height: 1.1;
}

.photo-gallery-add-sub[b-gqfkev8bpy] {
    font-size: 0.62rem;
    color: #94a3b8;
    font-weight: 500;
}

/* ── Lightbox Slider Modal (Estilo Arregly Clean Light) ── */
.photo-lightbox-backdrop[b-gqfkev8bpy] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(6px);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10050;
    padding: 20px;
    outline: none;
    animation: photoLightboxFadeIn-b-gqfkev8bpy 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes photoLightboxFadeIn-b-gqfkev8bpy {
    from { opacity: 0; }
    to { opacity: 1; }
}

.photo-lightbox-modal[b-gqfkev8bpy] {
    background: #ffffff;
    border-radius: 16px;
    max-width: 880px;
    width: 100%;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25), 0 10px 20px -5px rgba(0, 0, 0, 0.1);
    border: 1px solid var(--border-linear-theme-arregly, #e2e8f0);
    animation: photoLightboxScaleUp-b-gqfkev8bpy 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes photoLightboxScaleUp-b-gqfkev8bpy {
    from { 
        transform: translateY(20px) scale(0.96); 
        opacity: 0; 
    }
    to { 
        transform: translateY(0) scale(1); 
        opacity: 1; 
    }
}

.photo-lightbox-header[b-gqfkev8bpy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 24px;
    background: #ffffff;
    border-bottom: 1px solid var(--border-linear-theme-arregly, #e2e8f0);
}

.photo-lightbox-title[b-gqfkev8bpy] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: 'Poppins', sans-serif;
    font-size: 0.95rem;
    font-weight: 600;
    color: #1e293b;
}

.photo-lightbox-filename[b-gqfkev8bpy] {
    color: #64748b;
    font-size: 0.85rem;
    font-weight: 400;
    max-width: 450px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.photo-lightbox-close[b-gqfkev8bpy] {
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    color: #475569;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.15s ease;
    padding: 0;
}

.photo-lightbox-close:hover[b-gqfkev8bpy] {
    background: #e2e8f0;
    color: #0f172a;
    transform: scale(1.06);
}

.photo-lightbox-body[b-gqfkev8bpy] {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: #f8fafc;
    min-height: 340px;
    max-height: 68vh;
}

.photo-lightbox-image-container[b-gqfkev8bpy] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.photo-lightbox-image[b-gqfkev8bpy] {
    max-width: 100%;
    max-height: 62vh;
    object-fit: contain;
    border-radius: 10px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
    border: 1px solid #e2e8f0;
    background: #ffffff;
}

.photo-lightbox-nav[b-gqfkev8bpy] {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    color: #334155;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.12);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 10;
    padding: 0;
}

.photo-lightbox-nav:hover[b-gqfkev8bpy] {
    background: var(--primary-color, #601a18);
    color: #ffffff;
    border-color: var(--primary-color, #601a18);
    transform: translateY(-50%) scale(1.1);
    box-shadow: 0 6px 18px var(--primary-rgba-color, rgba(96, 26, 24, 0.25));
}

.photo-lightbox-nav-prev[b-gqfkev8bpy] {
    left: 18px;
}

.photo-lightbox-nav-next[b-gqfkev8bpy] {
    right: 18px;
}

.photo-lightbox-footer[b-gqfkev8bpy] {
    padding: 14px 24px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #ffffff;
    border-top: 1px solid var(--border-linear-theme-arregly, #e2e8f0);
}

.photo-lightbox-dots[b-gqfkev8bpy] {
    display: flex;
    gap: 8px;
    align-items: center;
}

.photo-lightbox-dot[b-gqfkev8bpy] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #cbd5e1;
    border: none;
    padding: 0;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.photo-lightbox-dot:hover[b-gqfkev8bpy] {
    background: #94a3b8;
}

.photo-lightbox-dot.active[b-gqfkev8bpy] {
    width: 26px;
    border-radius: 5px;
    background: var(--primary-color, #601a18);
}
/* /Components/Shared/Signature/DigitalSignaturePad.razor.rz.scp.css */
/* Canvas Drawing Block style */
.signature-canvas-container[b-q1ooalml7x] {
    position: relative;
    width: 100%;
    border-radius: 12px;
    overflow: hidden;
    border: 2px dashed #cbd5e1;
    background-color: #fafafa;
    transition: border-color 0.2s ease;
}

.signature-canvas-container:hover[b-q1ooalml7x] {
    border-color: var(--primary-color, #667eea);
}

.signature-canvas[b-q1ooalml7x] {
    display: block;
    width: 100%;
    height: 100%;
    cursor: crosshair;
    touch-action: none;
}

.btn-clear-signature[b-q1ooalml7x] {
    position: absolute;
    bottom: 12px;
    right: 12px;
    background-color: rgba(255, 255, 255, 0.95);
    border: 1px solid #e2e8f0;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
    border-radius: 8px;
    padding: 6px 12px;
    font-size: 0.75rem;
    font-weight: 600;
    color: #dc2626;
    display: flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    transition: background-color 0.2s, transform 0.1s;
    backdrop-filter: blur(4px);
    z-index: 10;
}

.btn-clear-signature:hover[b-q1ooalml7x] {
    background-color: #fff1f2;
    transform: translateY(-1px);
}

.btn-clear-signature:active[b-q1ooalml7x] {
    transform: translateY(0);
}

/* Terms Acceptance layout styling */
.terms-acceptance-block[b-q1ooalml7x] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}

.terms-text[b-q1ooalml7x] {
    font-size: 0.85rem;
    color: #475569;
    line-height: 1.5;
}

.checkbox-custom[b-q1ooalml7x] {
    width: 16px;
    height: 16px;
    border-radius: 4px;
    border: 1px solid #cbd5e1;
    accent-color: var(--primary-color, #667eea);
    flex-shrink: 0;
}

.form-label[b-q1ooalml7x] {
    margin-bottom: 0.5rem;
}

/* Error validation styling */
.signature-canvas-container.has-error[b-q1ooalml7x] {
    border-color: #ef4444 !important;
    background-color: #fef2f2;
}

.signature-validation-label[b-q1ooalml7x] {
    font-size: 0.85rem;
    color: #dc2626;
    background-color: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 8px 12px;
}

/* /Components/Shared/Signature/SignatureProcessingOverlay.razor.rz.scp.css */
.signature-loading-overlay[b-vkbfvgllyb] {
    position: fixed;
    inset: 0;
    z-index: 1100;
    background: rgba(15, 23, 42, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(2px);
}

.signature-loading-card[b-vkbfvgllyb] {
    width: min(92vw, 460px);
    background: #ffffff;
    border-radius: 14px;
    box-shadow: 0 14px 36px rgba(15, 23, 42, 0.2);
    padding: 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    text-align: center;
    border: 1px solid #e2e8f0;
}

.signature-loading-spinner-wrap[b-vkbfvgllyb] {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(37, 99, 235, 0.08) 0%, rgba(37, 99, 235, 0.16) 100%);
}

.signature-loading-spinner[b-vkbfvgllyb] {
    width: 34px;
    height: 34px;
    border-width: 3px;
    border-style: solid;
    border-color: #e2e8f0;
    border-top-color: var(--primary-color, #2563eb);
    border-radius: 50%;
    animation: signature-loading-spin-b-vkbfvgllyb 0.85s linear infinite;
}

.signature-loading-title[b-vkbfvgllyb] {
    margin: 0;
    color: #1f2937;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -0.2px;
}

.signature-loading-subtitle[b-vkbfvgllyb] {
    margin: 0;
    color: #64748b;
    font-size: 0.95rem;
    line-height: 1.4;
    max-width: 380px;
}

@keyframes signature-loading-spin-b-vkbfvgllyb {
    to {
        transform: rotate(360deg);
    }
}
/* /Components/Shared/Signature/SignatureSuccessCard.razor.rz.scp.css */
/* Success page elements */
.signature-success-card__icon-wrapper[b-7h83py3ecz] {
    display: inline-block;
}

.signature-success-card__ring[b-7h83py3ecz] {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: #ecfdf5;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 15px rgba(16, 185, 129, 0.15);
}

.signature-success-card__checkmark[b-7h83py3ecz] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    stroke: var(--success-color);
    stroke-width: 4;
    stroke-miterlimit: 10;
    box-shadow: inset 0px 0px 0px var(--success-color);
    animation: signatureSuccessFill-b-7h83py3ecz .4s ease-in-out .4s forwards, signatureSuccessScale-b-7h83py3ecz .3s ease-in-out .9s both;
}

.signature-success-card__checkmark-circle[b-7h83py3ecz] {
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    stroke-width: 4;
    stroke-miterlimit: 10;
    stroke: var(--success-color);
    fill: none;
    animation: signatureSuccessStroke-b-7h83py3ecz 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}

.signature-success-card__checkmark-check[b-7h83py3ecz] {
    transform-origin: 50% 50%;
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: signatureSuccessStroke-b-7h83py3ecz 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.6s forwards;
}

@keyframes signatureSuccessStroke-b-7h83py3ecz {
    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes signatureSuccessScale-b-7h83py3ecz {
    0%,
    100% {
        transform: none;
    }

    50% {
        transform: scale3d(1.1, 1.1, 1);
    }
}

@keyframes signatureSuccessFill-b-7h83py3ecz {
    100% {
        box-shadow: inset 0px 0px 0px 30px transparent;
    }
}

.signature-success-card__title[b-7h83py3ecz] {
    font-size: 2rem;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 0.75rem;
}

.signature-success-card__subtitle[b-7h83py3ecz] {
    font-size: 1.1rem;
    color: #475569;
}

.signature-success-card__details[b-7h83py3ecz] {
    max-width: 450px;
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
}

.signature-success-card__details p[b-7h83py3ecz] {
    font-size: 0.9rem;
    color: #334155;
}

.signature-success-card__details p strong[b-7h83py3ecz] {
    color: #0f172a;
}

.signature-success-card__info-note[b-7h83py3ecz] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.8rem !important;
    line-height: 1.4;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed #cbd5e1;
}

.signature-success-card__info-note[b-7h83py3ecz]  svg {
    color: var(--primary-color);
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}
/* /Components/Skeleton/AnalyticsReportSkeletonLoading.razor.rz.scp.css */
.analytics-report-skeleton[b-6pcda7sgpt] {
    --skeleton-surface: #ffffff;
    --skeleton-border: #e5e7eb;
    --skeleton-grid: #cfd4dc;
    --skeleton-fill-1: #f3f4f6;
    --skeleton-fill-2: #e5e7eb;
    --skeleton-fill-3: #f3f4f6;
    --skeleton-line: #d1d5db;
    --skeleton-shadow: 0 2px 10px rgba(15, 23, 42, 0.04);
    display: flex;
    flex-direction: column;
    gap: 1rem;
    width: 100%;
}

.skeleton-block[b-6pcda7sgpt] {
    background: linear-gradient(90deg, var(--skeleton-fill-1) 0%, var(--skeleton-fill-2) 50%, var(--skeleton-fill-3) 100%);
    background-size: 200% 100%;
    animation: analytics-report-skeleton-shimmer-b-6pcda7sgpt 1.6s linear infinite;
    border-radius: 0.625rem;
}

.analytics-report-skeleton__filters[b-6pcda7sgpt] {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    padding: 0.875rem 1rem;
    background: var(--skeleton-surface);
    border: 1px solid var(--skeleton-border);
    border-radius: 1rem;
    box-shadow: var(--skeleton-shadow);
}

.analytics-report-skeleton__filters-label[b-6pcda7sgpt] {
    display: inline-flex;
    align-items: center;
    gap: 0.625rem;
    min-width: 8rem;
}

.analytics-report-skeleton__section[b-6pcda7sgpt] {
    display: inline-flex;
    align-items: center;
    gap: 0.75rem;
    padding-top: 0.25rem;
}

.analytics-report-skeleton__section-icon[b-6pcda7sgpt] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    background: #eef2f7;
    border-radius: 0.875rem;
}

.analytics-report-skeleton__card[b-6pcda7sgpt] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    height: 100%;
    min-height: 29rem;
    padding: 0.875rem 0.875rem 1rem;
    background: var(--skeleton-surface);
    border: 1px solid var(--skeleton-border);
    border-radius: 1rem;
    box-shadow: var(--skeleton-shadow);
}

.analytics-report-skeleton__card-header[b-6pcda7sgpt] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.analytics-report-skeleton__chart[b-6pcda7sgpt] {
    display: grid;
    grid-template-columns: 2.25rem 1fr;
    gap: 0.75rem;
    flex: 1;
    min-height: 21rem;
}

.analytics-report-skeleton__y-axis[b-6pcda7sgpt] {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-top: 1.25rem;
    padding-bottom: 1.625rem;
}

.analytics-report-skeleton__plot[b-6pcda7sgpt] {
    position: relative;
    min-height: 21rem;
    border: 1px solid var(--skeleton-grid);
    background: linear-gradient(180deg, rgba(249, 250, 251, 0.9), rgba(249, 250, 251, 0.9)), #fafafa;
    overflow: hidden;
}

.analytics-report-skeleton__grid-row[b-6pcda7sgpt],
.analytics-report-skeleton__grid-column[b-6pcda7sgpt] {
    position: absolute;
    background: var(--skeleton-line);
    opacity: 0.8;
}

.analytics-report-skeleton__grid-row[b-6pcda7sgpt] {
    left: 0;
    right: 0;
    height: 1px;
}

.analytics-report-skeleton__grid-column[b-6pcda7sgpt] {
    top: 0;
    bottom: 0;
    width: 1px;
}

.analytics-report-skeleton__x-axis[b-6pcda7sgpt] {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 0.75rem;
    padding-left: 3rem;
    padding-right: 0.5rem;
}

.analytics-report-skeleton__legend[b-6pcda7sgpt] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.analytics-report-skeleton__legend--side[b-6pcda7sgpt] {
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    gap: 0.5rem;
}

.analytics-report-skeleton__legend--bottom[b-6pcda7sgpt] {
    justify-content: center;
    gap: 1.5rem;
    padding-top: 0.25rem;
}

.analytics-report-skeleton__legend-item[b-6pcda7sgpt] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.analytics-report-skeleton__line-preview[b-6pcda7sgpt] {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    background: #b7bcc5;
}

.analytics-report-skeleton__point[b-6pcda7sgpt] {
    position: absolute;
    width: 0.625rem;
    height: 0.625rem;
    border: 2px solid #a8adb7;
    border-radius: 999px;
    background: #f8fafc;
    transform: translate(-50%, 50%);
}

.skeleton-icon[b-6pcda7sgpt] {
    width: 1rem;
    height: 1rem;
    border-radius: 0.25rem;
}

.skeleton-icon--soft[b-6pcda7sgpt] {
    width: 0.875rem;
    height: 0.875rem;
    border-radius: 999px;
}

.skeleton-dropdown[b-6pcda7sgpt] {
    width: 14rem;
    height: 2rem;
    border-radius: 0.4rem;
}

.skeleton-text[b-6pcda7sgpt] {
    height: 0.875rem;
}

.skeleton-text--label[b-6pcda7sgpt] {
    width: 4.5rem;
}

.skeleton-text--section[b-6pcda7sgpt] {
    width: 5.75rem;
    height: 1rem;
    border-radius: 999px;
}

.skeleton-text--title[b-6pcda7sgpt] {
    width: 10rem;
    height: 1rem;
}

.skeleton-text--subtitle[b-6pcda7sgpt] {
    width: 12.5rem;
    height: 0.75rem;
}

.skeleton-text--axis[b-6pcda7sgpt] {
    width: 1.1rem;
    height: 0.75rem;
}

.skeleton-text--month[b-6pcda7sgpt] {
    width: 2rem;
    height: 0.75rem;
    justify-self: center;
}

.skeleton-text--legend[b-6pcda7sgpt] {
    width: 3rem;
    height: 0.75rem;
}

.skeleton-legend-box[b-6pcda7sgpt] {
    width: 1rem;
    height: 1rem;
    border-radius: 0.2rem;
}

.skeleton-legend-line[b-6pcda7sgpt] {
    width: 1rem;
    height: 0.25rem;
    border-radius: 999px;
}

.skeleton-legend-line--alt[b-6pcda7sgpt] {
    width: 0.875rem;
}

@keyframes analytics-report-skeleton-shimmer-b-6pcda7sgpt {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

@media (max-width: 1199.98px) {
    .analytics-report-skeleton__card[b-6pcda7sgpt] {
        min-height: 26rem;
    }

    .analytics-report-skeleton__chart[b-6pcda7sgpt],
    .analytics-report-skeleton__plot[b-6pcda7sgpt] {
        min-height: 18rem;
    }
}

@media (max-width: 767.98px) {
    .analytics-report-skeleton__filters[b-6pcda7sgpt] {
        flex-wrap: wrap;
    }

    .analytics-report-skeleton__filters-label[b-6pcda7sgpt] {
        width: 100%;
    }

    .skeleton-dropdown[b-6pcda7sgpt] {
        width: 100%;
    }

    .analytics-report-skeleton__card[b-6pcda7sgpt] {
        min-height: 23rem;
    }

    .analytics-report-skeleton__chart[b-6pcda7sgpt] {
        grid-template-columns: 1.75rem 1fr;
        gap: 0.5rem;
        min-height: 15rem;
    }

    .analytics-report-skeleton__plot[b-6pcda7sgpt] {
        min-height: 15rem;
    }

    .analytics-report-skeleton__x-axis[b-6pcda7sgpt] {
        padding-left: 2.25rem;
        gap: 0.35rem;
    }

    .analytics-report-skeleton__legend--side[b-6pcda7sgpt] {
        display: none;
    }
}
/* /Components/Skeleton/CardSkeletonLoading.razor.rz.scp.css */
.skeleton[b-9deujjhhm9] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-loading-b-9deujjhhm9 1.5s infinite;
    border-radius: 4px;
    display: inline-block;
}

.skeleton-text[b-9deujjhhm9] {
    border-radius: 4px;
}

.skeleton-button[b-9deujjhhm9] {
    border-radius: 6px;
}

.skeleton-image[b-9deujjhhm9] {
    border-radius: 8px 8px 0 0;
}

@keyframes skeleton-loading-b-9deujjhhm9 {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

.cards-skeleton-container[b-9deujjhhm9] {
    margin: 0;
}

.card-skeleton[b-9deujjhhm9] {
    background: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    border: 1px solid #e5e7eb;
    height: 100%;
}

.skeleton-image-container[b-9deujjhhm9] {
    width: 100%;
    overflow: hidden;
}

.skeleton-card-body[b-9deujjhhm9] {
    padding: 20px;
}
/* /Components/Skeleton/CompanyCardSkeleton.razor.rz.scp.css */
.skeleton[b-lu0vhu9brg] {
    background: linear-gradient(90deg, rgba(255, 255, 255, 0.2) 25%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.2) 75%);
    background-size: 200% 100%;
    animation: company-skeleton-loading-b-lu0vhu9brg 1.5s infinite;
    border-radius: 4px;
    display: inline-block;
}

.company-skeleton-header .skeleton[b-lu0vhu9brg] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: company-skeleton-loading-b-lu0vhu9brg 1.5s infinite;
}

.company-skeleton-body .skeleton[b-lu0vhu9brg] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: company-skeleton-loading-b-lu0vhu9brg 1.5s infinite;
}

@keyframes company-skeleton-loading-b-lu0vhu9brg {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

.company-skeleton-card[b-lu0vhu9brg] {
    width: 100% !important;
    background: #f8fafc;
    border-radius: 24px;
    box-shadow: 0 2px 5px rgba(255, 255, 255, 0.1);
    border: 1px solid #e5e7eb;
    overflow: hidden;
    position: relative;
}

.company-skeleton-card[b-lu0vhu9brg]::before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    width: 200px;
    height: 200px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    pointer-events: none;
    transform: translate(50px, -50px);
}

.company-skeleton-card[b-lu0vhu9brg]::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 150px;
    height: 150px;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 50%;
    pointer-events: none;
    transform: translate(-50px, 50px);
}

.company-skeleton-header[b-lu0vhu9brg] {
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(20px);
    color: white;
    padding: 32px 40px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 24px;
    flex-wrap: wrap;
}

.company-skeleton-brand-section[b-lu0vhu9brg] {
    display: flex;
    align-items: center;
    gap: 24px;
    flex: 1;
}

.company-skeleton-logo[b-lu0vhu9brg] {
    position: relative;
}

.skeleton-logo[b-lu0vhu9brg] {
    width: 80px;
    height: 80px;
    border-radius: 16px;
    border: 3px solid rgba(255, 255, 255, 0.2);
}

.company-skeleton-identity[b-lu0vhu9brg] {
    flex: 1;
}

.skeleton-title[b-lu0vhu9brg] {
    width: 320px;
    height: 40px;
    border-radius: 8px;
    margin-bottom: 8px;
}

.company-skeleton-subtitle-section[b-lu0vhu9brg] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.skeleton-subtitle[b-lu0vhu9brg] {
    width: 200px;
    height: 18px;
    border-radius: 6px;
}

.skeleton-badge[b-lu0vhu9brg] {
    width: 120px;
    height: 30px;
    border-radius: 20px;
}

.company-skeleton-actions[b-lu0vhu9brg] {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 20px;
}

.skeleton-button-outline[b-lu0vhu9brg],
.skeleton-button-flat[b-lu0vhu9brg] {
    height: 36px;
    border-radius: 12px;
}

.skeleton-button-outline[b-lu0vhu9brg] {
    width: 140px;
}

.skeleton-button-flat[b-lu0vhu9brg] {
    width: 150px;
}

.company-skeleton-body[b-lu0vhu9brg] {
    padding: 40px;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(20px);
    position: relative;
    z-index: 2;
    margin: 0;
}

.company-skeleton-info-card[b-lu0vhu9brg] {
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(20px);
    border-radius: 20px;
    padding: 28px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: 0 8px 32px rgba(102, 126, 234, 0.1);
    height: 100%;
}

.company-skeleton-info-header[b-lu0vhu9brg] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 2px solid rgba(148, 163, 184, 0.1);
}

.skeleton-icon[b-lu0vhu9brg] {
    width: 28px;
    height: 28px;
    border-radius: 10px;
}

.skeleton-card-title[b-lu0vhu9brg] {
    width: 180px;
    height: 20px;
    border-radius: 6px;
}

.company-skeleton-info-content[b-lu0vhu9brg] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.company-skeleton-info-item[b-lu0vhu9brg] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px;
    border-radius: 12px;
    background: rgba(248, 250, 252, 0.8);
}

.skeleton-item-icon[b-lu0vhu9brg] {
    width: 20px;
    height: 20px;
    border-radius: 4px;
    margin-top: 2px;
    flex-shrink: 0;
}

.company-skeleton-item-details[b-lu0vhu9brg] {
    flex: 1;
}

.skeleton-label[b-lu0vhu9brg] {
    width: 120px;
    height: 14px;
    border-radius: 4px;
}

.skeleton-value[b-lu0vhu9brg] {
    width: 180px;
    height: 16px;
    border-radius: 4px;
}

.skeleton-value-long[b-lu0vhu9brg] {
    width: 100%;
    max-width: 280px;
}

.company-skeleton-color-display[b-lu0vhu9brg] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.skeleton-color-sample[b-lu0vhu9brg] {
    width: 24px;
    height: 24px;
    border-radius: 6px;
}

.skeleton-color-text[b-lu0vhu9brg] {
    width: 80px;
    height: 16px;
    border-radius: 4px;
}

.skeleton-plan-badge[b-lu0vhu9brg] {
    width: 140px;
    height: 28px;
    border-radius: 20px;
}

@media (max-width: 1024px) {
    .company-skeleton-header[b-lu0vhu9brg] {
        padding: 24px 32px;
    }

    .company-skeleton-body[b-lu0vhu9brg] {
        padding: 32px 24px;
    }
}

@media (max-width: 768px) {
    .company-skeleton-container[b-lu0vhu9brg] {
        padding: 0 16px 16px 16px;
    }

    .company-skeleton-brand-section[b-lu0vhu9brg] {
        flex-direction: column;
        text-align: center;
        gap: 16px;
    }

    .skeleton-title[b-lu0vhu9brg] {
        width: 280px;
        height: 32px;
    }

    .company-skeleton-actions[b-lu0vhu9brg] {
        justify-content: center;
        width: 100%;
    }

    .company-skeleton-header[b-lu0vhu9brg] {
        padding: 20px;
        flex-direction: column;
        align-items: center;
    }

    .company-skeleton-body[b-lu0vhu9brg] {
        padding: 24px 20px;
    }

    .skeleton-button-outline[b-lu0vhu9brg],
    .skeleton-button-flat[b-lu0vhu9brg] {
        width: 120px;
        height: 32px;
    }
}
/* /Components/Skeleton/ConfigurationTabsSkeleton.razor.rz.scp.css */
.configuration-tabs-skeleton[b-i9eykzoo2y] {
    background: transparent;
}

.configuration-tabs-skeleton__tabs[b-i9eykzoo2y] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.configuration-tabs-skeleton__tab[b-i9eykzoo2y] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: #ffffff;
    border-radius: 12px;
    padding: 9px 18px;
    box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px;
}

.configuration-tabs-skeleton__tab--active[b-i9eykzoo2y] {
    border: 0.1px solid #111827;
    box-shadow: none;
}

.configuration-tabs-skeleton[b-i9eykzoo2y]  .k-skeleton {
    background-color: #e2e8f0 !important;
}

.configuration-tabs-skeleton[b-i9eykzoo2y]  .k-skeleton-wave::after {
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.6), transparent) !important;
}

.configuration-tabs-skeleton__content[b-i9eykzoo2y] {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: 1000px;
    margin: 0 auto;
    padding: 8px 0;
}

.configuration-tabs-skeleton__card[b-i9eykzoo2y] {
    background: #fff;
    border-radius: 14px;
    border: none;
    padding: 28px 32px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    overflow: hidden;
}

.configuration-tabs-skeleton__card .card-section-header[b-i9eykzoo2y] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 24px;
    padding-bottom: 18px;
    border-bottom: 1px solid #f3f4f6;
}

@media (max-width: 640px) {
    .configuration-tabs-skeleton__tab[b-i9eykzoo2y] {
        padding: 8px 14px;
    }

    .configuration-tabs-skeleton__card[b-i9eykzoo2y] {
        padding: 20px 18px;
    }
}
/* /Components/Skeleton/EditOrderSkeleton.razor.rz.scp.css */
.order-edit-skeleton[b-h7181mwhsu] {
    background: transparent;
}

.order-edit-skeleton__header-card[b-h7181mwhsu],
.order-edit-skeleton__stepper-card[b-h7181mwhsu],
.order-edit-skeleton__tabs-card[b-h7181mwhsu] {
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    background-color: #fff;
    box-shadow: 0 2px 8px rgba(99, 99, 99, 0.12);
}

.order-edit-skeleton__header-content[b-h7181mwhsu] {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 12px;
    padding: 16px 18px;
}

.order-edit-skeleton__header-main[b-h7181mwhsu] {
    display: flex;
    gap: 12px;
    align-items: center;
}

.order-edit-skeleton__header-actions[b-h7181mwhsu] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.order-edit-skeleton[b-h7181mwhsu]  .k-skeleton {
    background-color: #e2e8f0 !important;
}

.order-edit-skeleton[b-h7181mwhsu]  .k-skeleton-wave::after {
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.6), transparent) !important;
}

.order-edit-skeleton__stepper-card[b-h7181mwhsu] {
    overflow: hidden;
    padding-bottom: 12px;
}

.order-edit-skeleton__step-line[b-h7181mwhsu] {
    position: absolute;
    top: 45px;
    left: 10%;
    right: 10%;
    height: 2px;
    background-color: #e2e8f0;
    z-index: 0;
}

.order-edit-skeleton__step-item[b-h7181mwhsu] {
    position: relative;
    z-index: 1;
    background: #fff;
    padding: 0 10px;
}

.order-edit-skeleton__tabs-card[b-h7181mwhsu] {
    overflow: hidden;
}

.order-edit-skeleton__tabs-card .card-body[b-h7181mwhsu] {
    padding: 16px 18px;
}

@media (max-width: 768px) {
    .order-edit-skeleton__header-content[b-h7181mwhsu] {
        align-items: stretch;
        flex-direction: column;
    }

    .order-edit-skeleton__header-main[b-h7181mwhsu] {
        align-items: flex-start;
    }

    .order-edit-skeleton__header-actions[b-h7181mwhsu] {
        justify-content: stretch;
    }

    .order-edit-skeleton__header-actions[b-h7181mwhsu]  .k-skeleton {
        width: 100% !important;
    }

    .order-edit-skeleton__step-line[b-h7181mwhsu] {
        left: 12%;
        right: 12%;
    }
}
/* /Components/Skeleton/InventoryAlertsSkeleton.razor.rz.scp.css */
.alerts-skeleton-container[b-yko552ewej] {
    width: 100%;
}

.skeleton-circle-icon[b-yko552ewej],
.skeleton-text[b-yko552ewej],
.skeleton-pill[b-yko552ewej],
.skeleton-badge-severity[b-yko552ewej],
.skeleton-badge[b-yko552ewej],
.skeleton-btn[b-yko552ewej] {
    background: linear-gradient(90deg, #f1f4f9 25%, #e2e8f0 50%, #f1f4f9 75%);
    background-size: 200% 100%;
    animation: alerts-shimmer-b-yko552ewej 1.5s infinite;
    border-radius: 8px;
}

@keyframes alerts-shimmer-b-yko552ewej {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.skeleton-circle-icon[b-yko552ewej] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    flex-shrink: 0;
}
/* /Components/Skeleton/InventoryAuditSkeleton.razor.rz.scp.css */
.audit-skeleton-container[b-5r270scfic] {
    width: 100%;
}

.skeleton-text[b-5r270scfic],
.skeleton-pill-sm[b-5r270scfic],
.skeleton-badge-sm[b-5r270scfic],
.skeleton-btn-sm[b-5r270scfic] {
    background: linear-gradient(90deg, #f1f4f9 25%, #e2e8f0 50%, #f1f4f9 75%);
    background-size: 200% 100%;
    animation: audit-shimmer-b-5r270scfic 1.5s infinite;
    border-radius: 6px;
}

@keyframes audit-shimmer-b-5r270scfic {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.skeleton-pill-sm[b-5r270scfic] {
    border-radius: 12px;
}

.skeleton-badge-sm[b-5r270scfic] {
    border-radius: 4px;
}

.skeleton-btn-sm[b-5r270scfic] {
    border-radius: 6px;
}
/* /Components/Skeleton/InventoryBatchesSkeleton.razor.rz.scp.css */
.batches-skeleton-container[b-uf0k33n174] {
    width: 100%;
}

.skeleton[b-uf0k33n174] {
    background: linear-gradient(90deg, #f1f4f9 25%, #e2e8f0 50%, #f1f4f9 75%);
    background-size: 200% 100%;
    animation: batches-shimmer-b-uf0k33n174 1.5s infinite;
    border-radius: 6px;
}

@keyframes batches-shimmer-b-uf0k33n174 {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.batches-kpi-icon[b-uf0k33n174] {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    flex-shrink: 0;
}

.batches-kpi-label[b-uf0k33n174] {
    width: 65%;
    height: 11px;
}

.batches-kpi-value[b-uf0k33n174] {
    width: 35%;
    height: 20px;
}

.batches-title-shimmer[b-uf0k33n174] {
    width: 140px;
    height: 18px;
}

.batches-button-shimmer[b-uf0k33n174] {
    width: 160px;
    height: 36px;
    border-radius: 8px;
}

.batches-table-skeleton[b-uf0k33n174] {
    border-color: #e2e8f0 !important;
}

.batches-thead-shimmer[b-uf0k33n174] {
    background-color: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}

.batches-row-shimmer:last-child[b-uf0k33n174] {
    border-bottom: none !important;
}
/* /Components/Skeleton/InventoryConfigSkeleton.razor.rz.scp.css */
.config-skeleton-container[b-fu2czg7non] {
    width: 100%;
}

.skeleton-text[b-fu2czg7non],
.skeleton-circle-lg[b-fu2czg7non],
.skeleton-badge-sm[b-fu2czg7non],
.skeleton-pill-btn[b-fu2czg7non],
.skeleton-toggle[b-fu2czg7non] {
    background: linear-gradient(90deg, #f1f4f9 25%, #e2e8f0 50%, #f1f4f9 75%);
    background-size: 200% 100%;
    animation: config-shimmer-b-fu2czg7non 1.5s infinite;
    border-radius: 6px;
}

@keyframes config-shimmer-b-fu2czg7non {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.skeleton-circle-lg[b-fu2czg7non] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    flex-shrink: 0;
}

.skeleton-badge-sm[b-fu2czg7non] {
    border-radius: 12px;
}

.skeleton-pill-btn[b-fu2czg7non] {
    height: 30px;
    border-radius: 15px;
}

.skeleton-toggle[b-fu2czg7non] {
    width: 42px;
    height: 24px;
    border-radius: 12px;
    flex-shrink: 0;
}
/* /Components/Skeleton/InventoryExistenciasSkeleton.razor.rz.scp.css */
.existencias-skeleton-container[b-y9bup3t7s2] {
    width: 100%;
}

.skeleton-pill[b-y9bup3t7s2],
.skeleton-input[b-y9bup3t7s2],
.skeleton-btn-icon[b-y9bup3t7s2],
.skeleton-text[b-y9bup3t7s2],
.skeleton-badge[b-y9bup3t7s2],
.skeleton-tag[b-y9bup3t7s2],
.skeleton-checkbox[b-y9bup3t7s2],
.skeleton-btn-sm[b-y9bup3t7s2] {
    background: linear-gradient(90deg, #f1f4f9 25%, #e2e8f0 50%, #f1f4f9 75%);
    background-size: 200% 100%;
    animation: existencias-shimmer-b-y9bup3t7s2 1.5s infinite;
    border-radius: 8px;
}

@keyframes existencias-shimmer-b-y9bup3t7s2 {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.skeleton-pill[b-y9bup3t7s2] {
    width: 90px;
    height: 34px;
    border-radius: 20px;
}

.skeleton-pill.active[b-y9bup3t7s2] {
    background: linear-gradient(90deg, #e6f4f2 25%, #d1ebe8 50%, #e6f4f2 75%);
    background-size: 200% 100%;
}

.skeleton-input[b-y9bup3t7s2] {
    height: 38px;
    border-radius: 10px;
}

.skeleton-btn-icon[b-y9bup3t7s2] {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    flex-shrink: 0;
}

.skeleton-checkbox[b-y9bup3t7s2] {
    width: 18px;
    height: 18px;
    border-radius: 4px;
}

.skeleton-text[b-y9bup3t7s2] {
    height: 14px;
}

.skeleton-badge[b-y9bup3t7s2] {
    height: 18px;
    border-radius: 6px;
}

.skeleton-tag[b-y9bup3t7s2] {
    height: 24px;
    border-radius: 8px;
}

.skeleton-btn-sm[b-y9bup3t7s2] {
    width: 28px;
    height: 28px;
    border-radius: 6px;
}

.row-shimmer[b-y9bup3t7s2] {
    transition: background-color 0.2s ease;
}
/* /Components/Skeleton/InventoryFinancialSkeleton.razor.rz.scp.css */
.financial-skeleton-container[b-oed5kzkdvo] {
    width: 100%;
}

.skeleton-text[b-oed5kzkdvo],
.skeleton-circle-sm[b-oed5kzkdvo],
.skeleton-badge-sm[b-oed5kzkdvo] {
    background: linear-gradient(90deg, #f1f4f9 25%, #e2e8f0 50%, #f1f4f9 75%);
    background-size: 200% 100%;
    animation: financial-shimmer-b-oed5kzkdvo 1.5s infinite;
    border-radius: 6px;
}

@keyframes financial-shimmer-b-oed5kzkdvo {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.skeleton-circle-sm[b-oed5kzkdvo] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    flex-shrink: 0;
}

.skeleton-badge-sm[b-oed5kzkdvo] {
    border-radius: 12px;
}

.row-shimmer[b-oed5kzkdvo] {
    transition: background-color 0.2s ease;
}
/* /Components/Skeleton/InventoryMovementsSkeleton.razor.rz.scp.css */
.movements-skeleton-container[b-a97gyxca59] {
    width: 100%;
}

.skeleton[b-a97gyxca59] {
    background: linear-gradient(90deg, #f1f4f9 25%, #e2e8f0 50%, #f1f4f9 75%);
    background-size: 200% 100%;
    animation: movements-shimmer-b-a97gyxca59 1.5s infinite;
    border-radius: 6px;
}

@keyframes movements-shimmer-b-a97gyxca59 {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.movements-skeleton-header[b-a97gyxca59] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
}

.movements-skeleton-product-icon[b-a97gyxca59] {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    flex-shrink: 0;
}

.movements-skeleton-title[b-a97gyxca59] {
    width: 45%;
    height: 20px;
}

.movements-skeleton-badge[b-a97gyxca59] {
    width: 80px;
    height: 18px;
    border-radius: 6px;
}

.movements-skeleton-desc[b-a97gyxca59] {
    width: 180px;
    height: 14px;
}

.movements-skeleton-kpi-card[b-a97gyxca59] {
    background-color: #ffffff;
    border-color: #e2e8f0 !important;
}

.movements-kpi-label[b-a97gyxca59] {
    width: 60%;
    height: 11px;
}

.movements-kpi-val[b-a97gyxca59] {
    width: 45%;
    height: 22px;
}

.movements-kpi-sub[b-a97gyxca59] {
    height: 10px;
}

.movements-skeleton-table-wrapper[b-a97gyxca59] {
    border-color: #e2e8f0 !important;
}

.movements-thead-shimmer[b-a97gyxca59] {
    background-color: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}

.movements-row-shimmer:last-child[b-a97gyxca59] {
    border-bottom: none !important;
}
/* /Components/Skeleton/InventoryPresentationsSkeleton.razor.rz.scp.css */
.presentations-skeleton-container[b-mgxcgyejpf] {
    width: 100%;
}

.skeleton[b-mgxcgyejpf] {
    background: linear-gradient(90deg, #f1f4f9 25%, #e2e8f0 50%, #f1f4f9 75%);
    background-size: 200% 100%;
    animation: presentations-shimmer-b-mgxcgyejpf 1.5s infinite;
    border-radius: 6px;
}

@keyframes presentations-shimmer-b-mgxcgyejpf {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.presentations-skeleton-card[b-mgxcgyejpf] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
}

.presentations-skeleton-icon[b-mgxcgyejpf] {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    flex-shrink: 0;
}

.presentations-skeleton-title[b-mgxcgyejpf] {
    width: 45%;
    height: 18px;
}

.presentations-skeleton-sku[b-mgxcgyejpf] {
    width: 75px;
    height: 18px;
    border-radius: 6px;
}

.presentations-skeleton-meta[b-mgxcgyejpf] {
    width: 60%;
    height: 12px;
}

.presentations-skeleton-kpi[b-mgxcgyejpf] {
    background-color: #ffffff;
    border-color: #e2e8f0 !important;
}

.presentations-skeleton-table[b-mgxcgyejpf] {
    border-color: #e2e8f0 !important;
}

.presentations-thead-shimmer[b-mgxcgyejpf] {
    background-color: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}

.presentations-row-shimmer:last-child[b-mgxcgyejpf] {
    border-bottom: none !important;
}
/* /Components/Skeleton/InventoryTransfersSkeleton.razor.rz.scp.css */
.transfers-skeleton-container[b-stjzr9uic4] {
    width: 100%;
}

.skeleton-text[b-stjzr9uic4],
.skeleton-icon-box[b-stjzr9uic4],
.skeleton-pill-sm[b-stjzr9uic4],
.skeleton-icon-btn[b-stjzr9uic4] {
    background: linear-gradient(90deg, #f1f4f9 25%, #e2e8f0 50%, #f1f4f9 75%);
    background-size: 200% 100%;
    animation: transfers-shimmer-b-stjzr9uic4 1.5s infinite;
    border-radius: 6px;
}

@keyframes transfers-shimmer-b-stjzr9uic4 {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.skeleton-icon-box[b-stjzr9uic4] {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    flex-shrink: 0;
}

.skeleton-pill-sm[b-stjzr9uic4] {
    height: 20px;
    border-radius: 12px;
}

.skeleton-icon-btn[b-stjzr9uic4] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    flex-shrink: 0;
}

.row-shimmer[b-stjzr9uic4] {
    transition: background-color 0.2s ease;
}
/* /Components/Skeleton/ListSkeletonLoading.razor.rz.scp.css */
.skeleton[b-on6q1mmbqs] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-loading-b-on6q1mmbqs 1.5s infinite;
    border-radius: 4px;
    display: inline-block;
}

.skeleton-text[b-on6q1mmbqs] {
    border-radius: 4px;
}

.skeleton-avatar-circle[b-on6q1mmbqs] {
    border-radius: 50%;
}

.skeleton-button[b-on6q1mmbqs] {
    border-radius: 6px;
}

@keyframes skeleton-loading-b-on6q1mmbqs {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

.list-skeleton-container[b-on6q1mmbqs] {
    background: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    border: 1px solid #e5e7eb;
}

.list-skeleton-item[b-on6q1mmbqs] {
    padding: 16px 20px;
    border-bottom: 1px solid #f1f5f9;
}

.list-skeleton-item:last-child[b-on6q1mmbqs] {
    border-bottom: none;
}

.skeleton-avatar[b-on6q1mmbqs] {
    flex-shrink: 0;
}

.skeleton-content[b-on6q1mmbqs] {
    min-width: 0;
}

.skeleton-actions[b-on6q1mmbqs] {
    flex-shrink: 0;
}

@media (max-width: 768px) {
    .list-skeleton-item[b-on6q1mmbqs] {
        padding: 12px 16px;
    }

    .list-skeleton-item .d-flex[b-on6q1mmbqs] {
        gap: 12px;
    }
}
/* /Components/Skeleton/ManufacturingOrdersSkeleton.razor.rz.scp.css */
.mfg-skeleton-container[b-j96l78ti4j] {
    width: 100%;
}

.skeleton-pill[b-j96l78ti4j],
.skeleton-circle-sm[b-j96l78ti4j],
.skeleton-text[b-j96l78ti4j],
.skeleton-badge-sm[b-j96l78ti4j],
.skeleton-btn-sm[b-j96l78ti4j] {
    background: linear-gradient(90deg, #f1f4f9 25%, #e2e8f0 50%, #f1f4f9 75%);
    background-size: 200% 100%;
    animation: mfg-shimmer-b-j96l78ti4j 1.5s infinite;
    border-radius: 6px;
}

@keyframes mfg-shimmer-b-j96l78ti4j {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.skeleton-pill[b-j96l78ti4j] {
    border-radius: 20px;
}

.skeleton-circle-sm[b-j96l78ti4j] {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    flex-shrink: 0;
}

.skeleton-badge-sm[b-j96l78ti4j] {
    border-radius: 12px;
}

.skeleton-btn-sm[b-j96l78ti4j] {
    border-radius: 8px;
}
/* /Components/Skeleton/OrderBelongingsTabSkeleton.razor.rz.scp.css */
.order-belongings-skeleton[b-1aqtq399fo] {
    margin-top: 0 !important;
    align-items: flex-start;
}

.order-belongings-skeleton .order-belonging-card[b-1aqtq399fo],
.order-belongings-skeleton .order-aside-card[b-1aqtq399fo] {
    border: none;
    border-radius: 14px;
    background-color: #fff;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    overflow: hidden;
}

.order-belongings-skeleton .order-belonging-card__body[b-1aqtq399fo],
.order-belongings-skeleton .order-aside-card__body[b-1aqtq399fo] {
    padding: 16px 18px;
}

.order-belongings-skeleton .order-aside-card__header[b-1aqtq399fo] {
    border-bottom: 1px solid #eef2f7;
    background-color: #fff;
    padding: 16px 18px;
}

@media (max-width: 991px) {
    .order-belongings-skeleton .order-belongings-main-column > div[b-1aqtq399fo],
    .order-belongings-skeleton .order-belongings-aside-column > div[b-1aqtq399fo] {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

.order-belongings-skeleton .order-belonging-card__media[b-1aqtq399fo]  .k-skeleton {
    border-radius: 10px !important;
}
/* /Components/Skeleton/OrderDetailTabSkeleton.razor.rz.scp.css */
.order-detail-skeleton[b-mcygu6dlqe] {
    margin-top: 0 !important;
    align-items: flex-start;
}

.order-detail-skeleton .order-section-card[b-mcygu6dlqe],
.order-detail-skeleton .order-aside-card[b-mcygu6dlqe] {
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    background-color: #fff;
    box-shadow: 0 2px 8px rgba(99, 99, 99, 0.12);
    overflow: hidden;
}

.order-detail-skeleton .order-section-card__header[b-mcygu6dlqe],
.order-detail-skeleton .order-aside-card__header[b-mcygu6dlqe] {
    border-bottom: 1px solid #eef2f7;
    background-color: #fff;
    padding: 16px 18px;
}

.order-detail-skeleton .order-section-card__body[b-mcygu6dlqe],
.order-detail-skeleton .order-aside-card__body[b-mcygu6dlqe] {
    padding: 16px 18px;
}

.order-detail-skeleton .order-edit-aside-column[b-mcygu6dlqe] {
    align-content: start;
}

@media (max-width: 991px) {
    .order-detail-skeleton .order-edit-main-column > div[b-mcygu6dlqe],
    .order-detail-skeleton .order-edit-aside-column > div[b-mcygu6dlqe] {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}
/* /Components/Skeleton/OrderHistoryTabSkeleton.razor.rz.scp.css */
.order-history-skeleton[b-ykalwmxasj] {
    margin-top: 0 !important;
    align-items: flex-start;
}

.order-history-skeleton .order-history-card[b-ykalwmxasj],
.order-history-skeleton .order-aside-card[b-ykalwmxasj] {
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    background-color: #fff;
    box-shadow: 0 2px 8px rgba(99, 99, 99, 0.12);
    overflow: hidden;
}

.order-history-skeleton .order-history-card__body[b-ykalwmxasj],
.order-history-skeleton .order-aside-card__body[b-ykalwmxasj] {
    padding: 16px 18px;
}

.order-history-skeleton .order-aside-card__header[b-ykalwmxasj] {
    border-bottom: 1px solid #eef2f7;
    background-color: #fff;
    padding: 16px 18px;
}

.order-history-skeleton__timeline-item[b-ykalwmxasj] {
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 14px;
    background-color: #fff;
}

@media (max-width: 991px) {
    .order-history-skeleton .order-history-main-column > div[b-ykalwmxasj],
    .order-history-skeleton .order-history-aside-column > div[b-ykalwmxasj] {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}
/* /Components/Skeleton/OrderNotesTabSkeleton.razor.rz.scp.css */
.order-notes-skeleton .note-card[b-0fga1kz35q] {
    background-color: #ffffff;
    border-radius: 14px;
    border: none;
    border-left: 5px solid #e5e7eb;
    padding: 18px 22px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.order-notes-skeleton .order-aside-card[b-0fga1kz35q] {
    border: none;
    border-radius: 14px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    background-color: #fff;
    overflow: hidden;
}

.order-notes-skeleton .order-aside-card__header[b-0fga1kz35q] {
    background-color: #fff;
    border-bottom: 1px solid #eef2f7;
    padding: 16px 18px;
}

.order-notes-skeleton .order-aside-card__body[b-0fga1kz35q] {
    padding: 16px 18px;
}

.order-notes-skeleton .note-icon-container[b-0fga1kz35q] {
    display: flex;
    align-items: center;
    justify-content: center;
}

.order-notes-skeleton .note-card-action[b-0fga1kz35q] {
    display: flex;
    align-items: center;
    justify-content: center;
}
/* /Components/Skeleton/PointOfSaleSkeleton.razor.rz.scp.css */
.pos-skeleton-container[b-kif80owxbn] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.skeleton-text[b-kif80owxbn],
.skeleton-input[b-kif80owxbn],
.skeleton-pill-sm[b-kif80owxbn],
.skeleton-btn-sm[b-kif80owxbn],
.skeleton-circle-sm[b-kif80owxbn],
.skeleton-divider[b-kif80owxbn] {
    background: linear-gradient(90deg, #f1f4f9 25%, #e2e8f0 50%, #f1f4f9 75%);
    background-size: 200% 100%;
    animation: pos-shimmer-b-kif80owxbn 1.5s infinite;
    border-radius: 6px;
}

@keyframes pos-shimmer-b-kif80owxbn {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.pos-skeleton-top-controls[b-kif80owxbn] {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 16px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

@media (max-width: 992px) {
    .pos-skeleton-top-controls[b-kif80owxbn] {
        grid-template-columns: 1fr;
    }
}

.skeleton-control-box[b-kif80owxbn] {
    display: flex;
    flex-direction: column;
}

.pos-skeleton-search[b-kif80owxbn] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 12px 16px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.pos-skeleton-grid-layout[b-kif80owxbn] {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 20px;
    align-items: start;
}

@media (max-width: 1200px) {
    .pos-skeleton-grid-layout[b-kif80owxbn] {
        grid-template-columns: 1fr 350px;
    }
}

@media (max-width: 900px) {
    .pos-skeleton-grid-layout[b-kif80owxbn] {
        grid-template-columns: 1fr;
    }
}

.pos-skeleton-catalog-column[b-kif80owxbn] {
    display: flex;
    flex-direction: column;
}

.pos-skeleton-cards-grid[b-kif80owxbn] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 14px;
}

.pos-skeleton-card[b-kif80owxbn] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 14px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 200px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.pos-skeleton-ticket-column[b-kif80owxbn] {
    display: flex;
    flex-direction: column;
}

.pos-skeleton-receipt-paper[b-kif80owxbn] {
    background: #ffffff;
    border-radius: 4px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08), 0 2px 6px rgba(0, 0, 0, 0.04);
    position: relative;
    overflow: hidden;
}

.receipt-sawtooth-top-skeleton[b-kif80owxbn] {
    height: 10px;
    background: linear-gradient(135deg, #f3f4f6 5px, transparent 0) 0 0,
                linear-gradient(225deg, #f3f4f6 5px, transparent 0) 0 0;
    background-size: 10px 10px;
    background-repeat: repeat-x;
}

.receipt-sawtooth-bottom-skeleton[b-kif80owxbn] {
    height: 10px;
    background: linear-gradient(45deg, #f3f4f6 5px, transparent 0) 0 0,
                linear-gradient(-45deg, #f3f4f6 5px, transparent 0) 0 0;
    background-size: 10px 10px;
    background-repeat: repeat-x;
}

.skeleton-divider[b-kif80owxbn] {
    height: 2px;
    width: 100%;
}
/* /Components/Skeleton/PosHistorySkeleton.razor.rz.scp.css */
.skeleton[b-tvw86mlpli] {
    background: linear-gradient(90deg, #f1f5f9 0%, #e2e8f0 50%, #f1f5f9 100%);
    background-size: 200% 100%;
    animation: skeleton-shimmer-b-tvw86mlpli 1.5s cubic-bezier(0.4, 0, 0.2, 1) infinite;
    display: inline-block;
}

@keyframes skeleton-shimmer-b-tvw86mlpli {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

.skeleton-text[b-tvw86mlpli] {
    border-radius: 4px;
}

.skeleton-avatar[b-tvw86mlpli] {
    border-radius: 8px;
}

.skeleton-pill[b-tvw86mlpli] {
    border-radius: 9999px;
}

.pos-history-skeleton-container[b-tvw86mlpli] {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    overflow: hidden;
    width: 100%;
}

.skeleton-toolbar[b-tvw86mlpli] {
    background: #ffffff;
    border-bottom: 1px solid #f1f5f9;
}

.skeleton-table-wrapper[b-tvw86mlpli] {
    width: 100%;
    overflow-x: auto;
}

.skeleton-table-header[b-tvw86mlpli] {
    background: #f8fafc;
    padding: 14px 20px;
    border-top: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
}

.skeleton-table-rows[b-tvw86mlpli] {
    padding: 0;
}

.skeleton-table-row[b-tvw86mlpli] {
    padding: 14px 20px;
    border-bottom: 1px solid #f1f5f9;
    transition: background-color 0.15s ease;
}

@media (max-width: 768px) {
    .skeleton-toolbar[b-tvw86mlpli] {
        flex-direction: column;
        align-items: flex-start !important;
        gap: 12px;
    }
}
/* /Components/Skeleton/ProductDetailSkeleton.razor.rz.scp.css */
.product-detail-skeleton[b-lnr1lsz1lz] {
    width: 100%;
}

.skeleton[b-lnr1lsz1lz] {
    background: linear-gradient(90deg, #f1f4f9 25%, #e2e8f0 50%, #f1f4f9 75%);
    background-size: 200% 100%;
    animation: pds-shimmer-b-lnr1lsz1lz 1.5s infinite;
    border-radius: 8px;
}

@keyframes pds-shimmer-b-lnr1lsz1lz {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* 4 Bento KPI Cards */
.pds-kpi-card[b-lnr1lsz1lz] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}

.pds-kpi-label[b-lnr1lsz1lz] {
    width: 100px;
    height: 12px;
}

.pds-kpi-icon[b-lnr1lsz1lz] {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: linear-gradient(90deg, #e6f4f2 25%, #d1ebe8 50%, #e6f4f2 75%);
    background-size: 200% 100%;
}

.pds-kpi-icon.icon-available[b-lnr1lsz1lz] {
    background: linear-gradient(90deg, #dcfce7 25%, #bbf7d0 50%, #dcfce7 75%);
    background-size: 200% 100%;
}

.pds-kpi-icon.icon-reserved[b-lnr1lsz1lz] {
    background: linear-gradient(90deg, #fef3c7 25%, #fde68a 50%, #fef3c7 75%);
    background-size: 200% 100%;
}

.pds-kpi-icon.icon-price[b-lnr1lsz1lz] {
    background: linear-gradient(90deg, #e0e7ff 25%, #c7d2fe 50%, #e0e7ff 75%);
    background-size: 200% 100%;
}

.pds-kpi-value[b-lnr1lsz1lz] {
    width: 120px;
    height: 32px;
    border-radius: 6px;
}

.pds-kpi-hint[b-lnr1lsz1lz] {
    width: 140px;
    height: 12px;
}

/* Floating Tabstrip */
.pds-tabstrip-bar[b-lnr1lsz1lz] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
}

.pds-tab[b-lnr1lsz1lz] {
    width: 130px;
    height: 38px;
    border-radius: 10px;
}

.pds-tab.active[b-lnr1lsz1lz] {
    background: linear-gradient(90deg, #034C48 25%, #056862 50%, #034C48 75%);
    background-size: 200% 100%;
}

/* Content Surface */
.pds-content-surface[b-lnr1lsz1lz] {
    border: 1px solid #e2e8f0;
    border-radius: 16px;
}

.pds-cover-box[b-lnr1lsz1lz] {
    width: 100%;
    max-width: 280px;
    aspect-ratio: 1 / 1;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
}

.pds-pill[b-lnr1lsz1lz] {
    width: 80px;
    height: 24px;
    border-radius: 999px;
    border: 1px solid #e2e8f0;
}

/* Section Cards */
.pds-section-card[b-lnr1lsz1lz] {
    background: #f8fafc;
    border: 1px solid #e2e8f0 !important;
    border-radius: 14px;
}

.pds-section-icon[b-lnr1lsz1lz] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: linear-gradient(90deg, #e6f4f2 25%, #d1ebe8 50%, #e6f4f2 75%);
    background-size: 200% 100%;
}

.pds-section-icon.icon-finance[b-lnr1lsz1lz] {
    background: linear-gradient(90deg, #e0e7ff 25%, #c7d2fe 50%, #e0e7ff 75%);
    background-size: 200% 100%;
}

.pds-section-title[b-lnr1lsz1lz] {
    width: 180px;
    height: 16px;
}

.pds-section-subtitle[b-lnr1lsz1lz] {
    width: 250px;
    height: 11px;
}

.pds-field-label[b-lnr1lsz1lz] {
    width: 75px;
    height: 11px;
}

.pds-field-value[b-lnr1lsz1lz] {
    width: 90%;
    height: 16px;
    border-radius: 4px;
}

.pds-field-hint[b-lnr1lsz1lz] {
    width: 65px;
    height: 10px;
}

.pds-finance-cell[b-lnr1lsz1lz] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
}
/* /Components/Skeleton/ProfileFormSkeleton.razor.rz.scp.css */
.skeleton[b-w5db8u9xjo] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: profile-skeleton-loading-b-w5db8u9xjo 1.5s infinite;
    border-radius: 4px;
    display: inline-block;
}

@keyframes profile-skeleton-loading-b-w5db8u9xjo {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

.profile-skeleton-container[b-w5db8u9xjo] {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
}

.profile-skeleton-card[b-w5db8u9xjo] {
    background: white;
    border-radius: 16px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    border: 1px solid #e5e7eb;
    overflow: hidden;
}

.profile-skeleton-section[b-w5db8u9xjo] {
    padding: 24px;
    border-bottom: 1px solid #f3f4f6;
}

.profile-skeleton-section:last-child[b-w5db8u9xjo] {
    border-bottom: none;
}

.profile-skeleton-section-header[b-w5db8u9xjo] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
}

.profile-skeleton-section-body[b-w5db8u9xjo] {
    padding-left: 36px;
}

.skeleton-icon-small[b-w5db8u9xjo] {
    width: 20px;
    height: 20px;
    border-radius: 4px;
}

.skeleton-section-title[b-w5db8u9xjo] {
    width: 180px;
    height: 20px;
    border-radius: 6px;
}

.profile-skeleton-photo-section[b-w5db8u9xjo] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.skeleton-avatar[b-w5db8u9xjo] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    flex-shrink: 0;
}

.profile-skeleton-photo-info[b-w5db8u9xjo] {
    flex: 1;
}

.skeleton-photo-text[b-w5db8u9xjo] {
    width: 200px;
    height: 16px;
    border-radius: 4px;
}

.skeleton-photo-subtext[b-w5db8u9xjo] {
    width: 150px;
    height: 14px;
    border-radius: 4px;
}

.profile-skeleton-field[b-w5db8u9xjo] {
    width: 100%;
}

.skeleton-label[b-w5db8u9xjo] {
    width: 120px;
    height: 14px;
    border-radius: 4px;
}

.skeleton-input[b-w5db8u9xjo] {
    width: 100%;
    height: 38px;
    border-radius: 8px;
}

.skeleton-dropdown[b-w5db8u9xjo] {
    width: 100%;
    height: 38px;
    border-radius: 8px;
}

.skeleton-textarea[b-w5db8u9xjo] {
    width: 100%;
    height: 80px;
    border-radius: 8px;
}

.profile-skeleton-actions[b-w5db8u9xjo] {
    display: flex;
    gap: 12px;
    justify-content: flex-end;
    margin-top: 24px;
}

.skeleton-button-outline[b-w5db8u9xjo] {
    width: 100px;
    height: 40px;
    border-radius: 8px;
}

.skeleton-button-primary[b-w5db8u9xjo] {
    width: 140px;
    height: 40px;
    border-radius: 8px;
}

.profile-skeleton-account-info[b-w5db8u9xjo] {
    text-align: center;
}

.skeleton-account-label[b-w5db8u9xjo] {
    width: 80px;
    height: 12px;
    border-radius: 4px;
    margin: 0 auto;
}

.skeleton-account-value[b-w5db8u9xjo] {
    width: 120px;
    height: 16px;
    border-radius: 4px;
    margin: 0 auto;
}

@media (max-width: 768px) {
    .profile-skeleton-section[b-w5db8u9xjo] {
        padding: 16px;
    }

    .profile-skeleton-section-body[b-w5db8u9xjo] {
        padding-left: 0;
    }

    .profile-skeleton-photo-section[b-w5db8u9xjo] {
        flex-direction: column;
        text-align: center;
    }

    .skeleton-avatar[b-w5db8u9xjo] {
        margin: 0 auto;
    }

    .profile-skeleton-actions[b-w5db8u9xjo] {
        flex-direction: column;
        align-items: stretch;
    }

    .skeleton-button-outline[b-w5db8u9xjo],
    .skeleton-button-primary[b-w5db8u9xjo] {
        width: 100%;
        margin-bottom: 8px;
    }
}

@media (max-width: 480px) {
    .profile-skeleton-section[b-w5db8u9xjo] {
        padding: 12px;
    }

    .skeleton-avatar[b-w5db8u9xjo] {
        width: 56px;
        height: 56px;
    }

    .profile-skeleton-photo-section[b-w5db8u9xjo] {
        gap: 12px;
    }

    .skeleton-section-title[b-w5db8u9xjo] {
        width: 140px;
        height: 18px;
    }
}
/* /Components/Skeleton/RegisterFormSkeleton.razor.rz.scp.css */
.register-skeleton-container[b-fwmnftmc5i] {
    width: 100%;
    padding: 0.25rem 0;
}

.register-skeleton-card[b-fwmnftmc5i] {
    background: #fff;
    border: 1px solid #eef1f6;
    border-radius: 18px;
    padding: 1.25rem;
}

.skeleton[b-fwmnftmc5i] {
    background: linear-gradient(90deg, #f1f4f9 25%, #e6ebf3 50%, #f1f4f9 75%);
    background-size: 200% 100%;
    animation: register-skeleton-loading-b-fwmnftmc5i 1.4s infinite;
    border-radius: 10px;
}

@keyframes register-skeleton-loading-b-fwmnftmc5i {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.skeleton-title[b-fwmnftmc5i] {
    width: 38%;
    height: 28px;
    margin: 0 auto 8px;
}

.skeleton-subtitle[b-fwmnftmc5i] {
    width: 52%;
    height: 16px;
    margin: 0 auto 20px;
}

.skeleton-grid[b-fwmnftmc5i] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.skeleton-field[b-fwmnftmc5i] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.skeleton-label[b-fwmnftmc5i] {
    width: 45%;
    height: 14px;
}

.skeleton-input[b-fwmnftmc5i] {
    width: 100%;
    height: 42px;
}

.skeleton-password-block[b-fwmnftmc5i] {
    margin-top: 16px;
}

.skeleton-bars[b-fwmnftmc5i] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin: 10px 0;
}

.skeleton-bar[b-fwmnftmc5i] {
    height: 8px;
    border-radius: 999px;
}

.skeleton-card-block[b-fwmnftmc5i] {
    width: 100%;
    height: 110px;
    border-radius: 12px;
}

.skeleton-actions[b-fwmnftmc5i] {
    margin-top: 18px;
    display: flex;
    justify-content: space-between;
}

.skeleton-btn-outline[b-fwmnftmc5i],
.skeleton-btn-primary[b-fwmnftmc5i] {
    width: 120px;
    height: 42px;
    border-radius: 12px;
}

@media (max-width: 767px) {
    .skeleton-grid[b-fwmnftmc5i] {
        grid-template-columns: 1fr;
    }

    .skeleton-title[b-fwmnftmc5i],
    .skeleton-subtitle[b-fwmnftmc5i] {
        width: 80%;
    }
}
/* /Components/Skeleton/ResumenCardsSkeleton.razor.rz.scp.css */
@keyframes resumen-cards-skeleton-loading-b-ii8bbsgxxb {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

.resumen-cards-skeleton[b-ii8bbsgxxb] {
    --resumen-skeleton-base: #e9edf5;
    --resumen-skeleton-highlight: #f5f7fb;
    display: block;
}

.dark .resumen-cards-skeleton[b-ii8bbsgxxb] {
    --resumen-skeleton-base: #243244;
    --resumen-skeleton-highlight: #31445d;
}

.resumen-cards-skeleton__grid[b-ii8bbsgxxb] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.resumen-cards-skeleton__item[b-ii8bbsgxxb] {
    min-width: 0;
}

.resumen-cards-skeleton__card[b-ii8bbsgxxb] {
    border: 1px solid rgba(226, 232, 240, 0.9);
    border-radius: 22px;
    padding: 1.2rem;
    background: rgba(255, 255, 255, 0.92);
    box-shadow: rgba(33, 35, 38, 0.1) 0px 10px 10px -10px;
    display: grid;
    gap: 1rem;
}

.resumen-cards-skeleton__header[b-ii8bbsgxxb] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.resumen-cards-skeleton__content[b-ii8bbsgxxb] {
    display: grid;
    gap: 0.45rem;
}

.skeleton[b-ii8bbsgxxb] {
    background: linear-gradient(90deg, var(--resumen-skeleton-base) 25%, var(--resumen-skeleton-highlight) 50%, var(--resumen-skeleton-base) 75%);
    background-size: 200% 100%;
    animation: resumen-cards-skeleton-loading-b-ii8bbsgxxb 1.5s infinite;
}

.resumen-cards-skeleton__icon[b-ii8bbsgxxb] {
    width: 3rem;
    height: 3rem;
    border-radius: 16px;
}

.resumen-cards-skeleton__badge[b-ii8bbsgxxb] {
    width: 4.8rem;
    height: 1.8rem;
    border-radius: 999px;
}

.resumen-cards-skeleton__value[b-ii8bbsgxxb] {
    width: 58%;
    height: 2.2rem;
    border-radius: 12px;
}

.resumen-cards-skeleton__title[b-ii8bbsgxxb] {
    width: 72%;
    height: 0.9rem;
    border-radius: 999px;
}

.resumen-cards-skeleton__chart[b-ii8bbsgxxb] {
    width: 100%;
    height: 52px;
    border-radius: 18px;
}

@media (max-width: 1199.98px) {
    .resumen-cards-skeleton__grid[b-ii8bbsgxxb] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .resumen-cards-skeleton__grid[b-ii8bbsgxxb] {
        grid-template-columns: 1fr;
    }

    .resumen-cards-skeleton__card[b-ii8bbsgxxb] {
        padding: 1rem;
    }
}
/* /Components/Skeleton/RolesSkeleton.razor.rz.scp.css */
.roles-skeleton[b-rnuych06s9] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.roles-skeleton[b-rnuych06s9]  .k-skeleton {
    background-color: #e2e8f0 !important;
}

.roles-skeleton[b-rnuych06s9]  .k-skeleton-wave::after {
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.6), transparent) !important;
}

.roles-skeleton__stats-grid[b-rnuych06s9] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.roles-skeleton__stat-card[b-rnuych06s9] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    padding: 16px 18px;
    min-height: 130px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
}

.roles-skeleton__stat-header[b-rnuych06s9] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.roles-skeleton__tabs-container[b-rnuych06s9] {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
}

.roles-skeleton__tab[b-rnuych06s9] {
    border: 1px solid #d1d5db;
    background: #fff;
    border-radius: 10px;
    padding: 6px 10px;
    display: inline-flex;
    align-items: center;
}

.roles-skeleton__tab--active[b-rnuych06s9] {
    border-color: #111827;
}

.roles-skeleton__search-row[b-rnuych06s9] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.roles-skeleton__search-input[b-rnuych06s9] {
    flex: 1;
    min-width: 250px;
    max-width: 90%;
}

.roles-skeleton__toggle[b-rnuych06s9] {
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    flex-shrink: 0;
}

.roles-skeleton__list[b-rnuych06s9] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.roles-skeleton__role-card[b-rnuych06s9] {
    border: 1px solid #e5e7eb;
    background: #fff;
    border-radius: 14px;
    padding: 16px;
}

.roles-skeleton__role-header[b-rnuych06s9] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.roles-skeleton__role-main-info[b-rnuych06s9] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.roles-skeleton__role-actions[b-rnuych06s9] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.roles-skeleton__role-summary[b-rnuych06s9] {
    margin-top: 14px;
    padding-top: 10px;
    border-top: 1px solid #eef2f7;
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

@media (max-width: 576px) {
    .roles-skeleton__stats-grid[b-rnuych06s9] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .roles-skeleton__stat-card[b-rnuych06s9] {
        padding: 12px;
        min-height: 100px;
        gap: 6px;
    }

    .roles-skeleton__tabs-container[b-rnuych06s9] {
        overflow-x: auto;
        white-space: nowrap;
        flex-wrap: nowrap;
        padding-bottom: 4px;
        -webkit-overflow-scrolling: touch;
    }

    .roles-skeleton__tabs-container[b-rnuych06s9]::-webkit-scrollbar {
        display: none;
    }

    .roles-skeleton__tab[b-rnuych06s9] {
        flex-shrink: 0;
    }

    .roles-skeleton__search-row[b-rnuych06s9] {
        flex-wrap: nowrap;
        justify-content: space-between;
        gap: 12px;
    }

    .roles-skeleton__search-input[b-rnuych06s9] {
        flex: 1;
        min-width: 0;
        max-width: none;
    }

    .roles-skeleton__role-header[b-rnuych06s9] {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }

    .roles-skeleton__role-actions[b-rnuych06s9] {
        display: grid;
        grid-template-columns: 1fr 1fr;
        width: 100%;
        gap: 8px;
    }

    .roles-skeleton__role-actions[b-rnuych06s9]  .k-skeleton {
        width: 100% !important;
    }

    .roles-skeleton__role-actions > :last-child[b-rnuych06s9] {
        grid-column: span 2;
    }
}
/* /Components/Skeleton/StockInflowSkeleton.razor.rz.scp.css */
.inflow-skeleton-container[b-95v05e34bq] {
    width: 100%;
}

.inflow-skeleton-card[b-95v05e34bq] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 1rem;
}

.skeleton[b-95v05e34bq] {
    background: linear-gradient(90deg, #f1f4f9 25%, #e2e8f0 50%, #f1f4f9 75%);
    background-size: 200% 100%;
    animation: inflow-shimmer-b-95v05e34bq 1.5s infinite;
    border-radius: 8px;
}

@keyframes inflow-shimmer-b-95v05e34bq {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.inflow-skeleton-icon[b-95v05e34bq] {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    flex-shrink: 0;
    background: linear-gradient(90deg, #e6f4f2 25%, #d1ebe8 50%, #e6f4f2 75%);
    background-size: 200% 100%;
}

.inflow-skeleton-title[b-95v05e34bq] {
    width: 190px;
    height: 18px;
}

.inflow-skeleton-pill[b-95v05e34bq] {
    width: 110px;
    height: 20px;
    border-radius: 6px;
    border: 1px solid #e2e8f0;
}

.inflow-skeleton-subtitle[b-95v05e34bq] {
    width: 130px;
    height: 12px;
}

.inflow-skeleton-preview[b-95v05e34bq] {
    background: linear-gradient(135deg, #f0fdf4 0%, #f8fafc 100%);
    border: 1px solid #bbf7d0;
    border-radius: 12px;
}

.inflow-skeleton-col[b-95v05e34bq] {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.inflow-skeleton-label-center[b-95v05e34bq] {
    width: 90px;
    height: 11px;
}

.inflow-skeleton-number[b-95v05e34bq] {
    width: 32px;
    height: 26px;
    border-radius: 6px;
}

.inflow-skeleton-number-highlight[b-95v05e34bq] {
    width: 32px;
    height: 26px;
    border-radius: 6px;
    background: linear-gradient(90deg, #dcfce7 25%, #bbf7d0 50%, #dcfce7 75%);
    background-size: 200% 100%;
}

.inflow-skeleton-unit[b-95v05e34bq] {
    width: 45px;
    height: 10px;
}

.inflow-skeleton-op[b-95v05e34bq] {
    width: 32px;
    user-select: none;
}

.inflow-skeleton-label[b-95v05e34bq] {
    height: 14px;
}

.inflow-skeleton-input[b-95v05e34bq] {
    width: 100%;
    height: 38px;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
}

.inflow-skeleton-dropdown[b-95v05e34bq] {
    position: relative;
}

.inflow-skeleton-unit-badge[b-95v05e34bq] {
    width: 60px;
    height: 38px;
    border-radius: 6px;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    flex-shrink: 0;
}

.inflow-skeleton-helper[b-95v05e34bq] {
    height: 10px;
}

.inflow-skeleton-cost-card[b-95v05e34bq] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px;
}

.inflow-skeleton-badge[b-95v05e34bq] {
    height: 22px;
    border-radius: 6px;
    border: 1px solid #e2e8f0;
    background: #ffffff;
}

.inflow-skeleton-batch-card[b-95v05e34bq] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px;
}

.inflow-skeleton-batch-icon[b-95v05e34bq] {
    width: 24px;
    height: 24px;
    border-radius: 6px;
    flex-shrink: 0;
}

.inflow-skeleton-switch[b-95v05e34bq] {
    width: 52px;
    height: 26px;
    border-radius: 999px;
    flex-shrink: 0;
}

.inflow-skeleton-textarea[b-95v05e34bq] {
    width: 100%;
    height: 76px;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
}

.inflow-skeleton-btn-cancel[b-95v05e34bq] {
    width: 100px;
    height: 38px;
    border-radius: 8px;
    border: 1px solid #cbd5e1;
    background: #ffffff;
}

.inflow-skeleton-btn-confirm[b-95v05e34bq] {
    width: 215px;
    height: 38px;
    border-radius: 8px;
    background: linear-gradient(90deg, #034C48 25%, #056862 50%, #034C48 75%);
    background-size: 200% 100%;
}
/* /Components/Skeleton/SupplierManagementSkeleton.razor.rz.scp.css */
.supplier-skeleton-container[b-5d4jmctuek] {
    width: 100%;
}

.skeleton-circle-sm[b-5d4jmctuek],
.skeleton-text[b-5d4jmctuek],
.skeleton-pill[b-5d4jmctuek],
.skeleton-btn-sm[b-5d4jmctuek] {
    background: linear-gradient(90deg, #f1f4f9 25%, #e2e8f0 50%, #f1f4f9 75%);
    background-size: 200% 100%;
    animation: supplier-shimmer-b-5d4jmctuek 1.5s infinite;
    border-radius: 6px;
}

@keyframes supplier-shimmer-b-5d4jmctuek {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.skeleton-circle-sm[b-5d4jmctuek] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    flex-shrink: 0;
}

.skeleton-pill[b-5d4jmctuek] {
    border-radius: 20px;
}

.skeleton-btn-sm[b-5d4jmctuek] {
    border-radius: 8px;
}
/* /Components/Skeleton/SupplierProductLinkSkeleton.razor.rz.scp.css */
.supplier-link-skeleton-container[b-4xl5uwmard] {
    width: 100%;
}

.skeleton[b-4xl5uwmard] {
    background: linear-gradient(90deg, #f1f4f9 25%, #e2e8f0 50%, #f1f4f9 75%);
    background-size: 200% 100%;
    animation: supplier-shimmer-b-4xl5uwmard 1.5s infinite;
    border-radius: 6px;
}

@keyframes supplier-shimmer-b-4xl5uwmard {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.supplier-link-table-skeleton[b-4xl5uwmard] {
    border-color: #e2e8f0 !important;
}

.supplier-thead-shimmer[b-4xl5uwmard] {
    background-color: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}

.supplier-row-shimmer:last-child[b-4xl5uwmard] {
    border-bottom: none !important;
}
/* /Components/Skeleton/TableSkeletonLoading.razor.rz.scp.css */
.skeleton[b-wosc0wggaq] {
    background: linear-gradient(90deg, #f1f5f9 0%, #e2e8f0 50%, #f1f5f9 100%);
    background-size: 200% 100%;
    animation: skeleton-shimmer-b-wosc0wggaq 1.5s cubic-bezier(0.4, 0, 0.2, 1) infinite;
    display: inline-block;
}

@keyframes skeleton-shimmer-b-wosc0wggaq {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

.skeleton-text[b-wosc0wggaq] {
    border-radius: 4px;
}

.skeleton-checkbox[b-wosc0wggaq] {
    width: 18px;
    height: 18px;
    border-radius: 4px;
}

.skeleton-avatar[b-wosc0wggaq] {
    border-radius: 8px;
}

.skeleton-pill[b-wosc0wggaq] {
    border-radius: 12px;
}

.skeleton-circle[b-wosc0wggaq] {
    border-radius: 50%;
}

.table-skeleton-container[b-wosc0wggaq] {
    background: #ffffff;
    border-radius: 12px;
    overflow: hidden;
    width: 100%;
}

.skeleton-header[b-wosc0wggaq] {
    background: #f8fafc;
    padding: 14px 20px;
    border-bottom: 1px solid #e2e8f0;
}

.skeleton-rows[b-wosc0wggaq] {
    padding: 0;
}

.skeleton-row[b-wosc0wggaq] {
    padding: 14px 20px;
    border-bottom: 1px solid #f1f5f9;
    transition: background-color 0.15s ease;
}

.skeleton-row:last-child[b-wosc0wggaq] {
    border-bottom: none;
}

.skeleton-footer[b-wosc0wggaq] {
    padding: 12px 20px;
    border-top: 1px solid #e2e8f0;
    background: #f8fafc;
}
/* /Components/Skeleton/ThemeSkeleton.razor.rz.scp.css */
.theme-layout-skeleton[b-f5dguzhj8x] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    width: 100%;
    min-height: calc(100vh - 140px);
}

.theme-layout-skeleton__hero[b-f5dguzhj8x],
.theme-layout-skeleton__panel[b-f5dguzhj8x],
.theme-layout-skeleton__card[b-f5dguzhj8x] {
    position: relative;
    overflow: hidden;
    background: #ffffff;
    border: 1px solid #eef2f7;
    border-radius: 16px;
}

.theme-layout-skeleton__hero[b-f5dguzhj8x],
.theme-layout-skeleton__panel[b-f5dguzhj8x],
.theme-layout-skeleton__card[b-f5dguzhj8x] {
    padding: 1.25rem;
}

    .theme-layout-skeleton__hero[b-f5dguzhj8x]::before,
    .theme-layout-skeleton__panel[b-f5dguzhj8x]::before,
    .theme-layout-skeleton__card[b-f5dguzhj8x]::before,
    .theme-layout-skeleton__line[b-f5dguzhj8x]::before {
        content: '';
        position: absolute;
        inset: 0;
        background: linear-gradient(90deg, rgba(241, 245, 249, 0.85) 25%, rgba(226, 232, 240, 0.95) 50%, rgba(241, 245, 249, 0.85) 75%);
        background-size: 200% 100%;
        animation: theme-layout-skeleton-shimmer-b-f5dguzhj8x 1.35s infinite;
    }

.theme-layout-skeleton__line[b-f5dguzhj8x] {
    position: relative;
    overflow: hidden;
    height: 16px;
    border-radius: 999px;
    background: #f8fafc;
}

.theme-layout-skeleton__line--title[b-f5dguzhj8x] {
    width: 240px;
    height: 24px;
    margin-bottom: 0.85rem;
}

.theme-layout-skeleton__line--subtitle[b-f5dguzhj8x] {
    width: 160px;
}

.theme-layout-skeleton__hero[b-f5dguzhj8x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.theme-layout-skeleton__hero-content[b-f5dguzhj8x],
.theme-layout-skeleton__hero-actions[b-f5dguzhj8x],
.theme-layout-skeleton__card-top[b-f5dguzhj8x],
.theme-layout-skeleton__panel-header[b-f5dguzhj8x],
.theme-layout-skeleton__summary-item[b-f5dguzhj8x],
.theme-layout-skeleton__row-main[b-f5dguzhj8x] {
    position: relative;
    z-index: 1;
}

.theme-layout-skeleton__hero-actions[b-f5dguzhj8x] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.theme-layout-skeleton__pill[b-f5dguzhj8x],
.theme-layout-skeleton__button[b-f5dguzhj8x],
.theme-layout-skeleton__icon[b-f5dguzhj8x],
.theme-layout-skeleton__summary-icon[b-f5dguzhj8x],
.theme-layout-skeleton__avatar[b-f5dguzhj8x],
.theme-layout-skeleton__chart-grid[b-f5dguzhj8x],
.theme-layout-skeleton__chart-shape[b-f5dguzhj8x] {
    position: relative;
    overflow: hidden;
    background: #f8fafc;
}

    .theme-layout-skeleton__pill[b-f5dguzhj8x],
    .theme-layout-skeleton__button[b-f5dguzhj8x],
    .theme-layout-skeleton__icon[b-f5dguzhj8x],
    .theme-layout-skeleton__summary-icon[b-f5dguzhj8x],
    .theme-layout-skeleton__avatar[b-f5dguzhj8x],
    .theme-layout-skeleton__chart-grid[b-f5dguzhj8x]::before,
    .theme-layout-skeleton__chart-shape[b-f5dguzhj8x]::before {
        z-index: 1;
    }

        .theme-layout-skeleton__pill[b-f5dguzhj8x]::before,
        .theme-layout-skeleton__button[b-f5dguzhj8x]::before,
        .theme-layout-skeleton__icon[b-f5dguzhj8x]::before,
        .theme-layout-skeleton__summary-icon[b-f5dguzhj8x]::before,
        .theme-layout-skeleton__avatar[b-f5dguzhj8x]::before,
        .theme-layout-skeleton__chart-grid[b-f5dguzhj8x]::before,
        .theme-layout-skeleton__chart-shape[b-f5dguzhj8x]::before {
            content: '';
            position: absolute;
            inset: 0;
            background: linear-gradient(90deg, rgba(241, 245, 249, 0.85) 25%, rgba(226, 232, 240, 0.95) 50%, rgba(241, 245, 249, 0.85) 75%);
            background-size: 200% 100%;
            animation: theme-layout-skeleton-shimmer-b-f5dguzhj8x 1.35s infinite;
        }

.theme-layout-skeleton__pill[b-f5dguzhj8x] {
    width: 96px;
    height: 36px;
    border-radius: 999px;
}

.theme-layout-skeleton__button[b-f5dguzhj8x] {
    width: 136px;
    height: 40px;
    border-radius: 12px;
}

.theme-layout-skeleton__button--small[b-f5dguzhj8x] {
    width: 110px;
    height: 36px;
}

.theme-layout-skeleton__cards[b-f5dguzhj8x] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.theme-layout-skeleton__card[b-f5dguzhj8x] {
    min-height: 158px;
    display: flex;
    flex-direction: column;
    gap: 0.9rem;
}

.theme-layout-skeleton__card-top[b-f5dguzhj8x] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.theme-layout-skeleton__icon[b-f5dguzhj8x] {
    width: 44px;
    height: 44px;
    border-radius: 12px;
}

.theme-layout-skeleton__line--chip[b-f5dguzhj8x] {
    width: 72px;
    height: 14px;
}

.theme-layout-skeleton__line--metric[b-f5dguzhj8x] {
    width: 58%;
    height: 28px;
}

.theme-layout-skeleton__line--card-label[b-f5dguzhj8x] {
    width: 72%;
}

.theme-layout-skeleton__line--card-foot[b-f5dguzhj8x] {
    width: 42%;
    height: 14px;
}

.theme-layout-skeleton__content-grid[b-f5dguzhj8x] {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(280px, 0.95fr);
    gap: 1rem;
}

.theme-layout-skeleton__panel[b-f5dguzhj8x] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.theme-layout-skeleton__panel-header[b-f5dguzhj8x] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 1rem;
}

.theme-layout-skeleton__line--panel-title[b-f5dguzhj8x] {
    width: 180px;
    height: 20px;
    margin-bottom: 0.75rem;
}

.theme-layout-skeleton__line--panel-subtitle[b-f5dguzhj8x] {
    width: 120px;
    height: 14px;
}

.theme-layout-skeleton__panel--chart[b-f5dguzhj8x] {
    min-height: 360px;
}

.theme-layout-skeleton__chart-area[b-f5dguzhj8x] {
    position: relative;
    z-index: 1;
    flex: 1;
    min-height: 260px;
    border-radius: 16px;
    background: linear-gradient(180deg, #f8fafc 0%, #ffffff 100%);
    border: 1px solid #eef2f7;
    overflow: hidden;
}

.theme-layout-skeleton__chart-grid[b-f5dguzhj8x] {
    position: absolute;
    inset: 0;
    opacity: 0.75;
    background-image: linear-gradient(to right, rgba(203, 213, 225, 0.35) 1px, transparent 1px), linear-gradient(to bottom, rgba(203, 213, 225, 0.35) 1px, transparent 1px);
    background-size: 48px 48px;
}

    .theme-layout-skeleton__chart-grid[b-f5dguzhj8x]::before {
        background: linear-gradient(90deg, rgba(248, 250, 252, 0) 10%, rgba(226, 232, 240, 0.28) 50%, rgba(248, 250, 252, 0) 90%);
    }

.theme-layout-skeleton__chart-shape[b-f5dguzhj8x] {
    position: absolute;
    left: 3%;
    right: 3%;
    bottom: 10%;
    height: 62%;
    clip-path: polygon(0% 75%, 10% 62%, 20% 68%, 30% 40%, 42% 50%, 54% 28%, 66% 45%, 78% 24%, 90% 35%, 100% 10%, 100% 100%, 0% 100%);
    border-radius: 0;
    background: linear-gradient(180deg, rgba(203, 213, 225, 0.45) 0%, rgba(226, 232, 240, 0.7) 100%);
}

.theme-layout-skeleton__sidebar[b-f5dguzhj8x] {
    display: flex;
}

.theme-layout-skeleton__panel--summary[b-f5dguzhj8x] {
    width: 100%;
    min-height: 360px;
}

.theme-layout-skeleton__summary-item[b-f5dguzhj8x] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    padding: 0.85rem 0;
    border-bottom: 1px solid #eef2f7;
}

    .theme-layout-skeleton__summary-item:last-child[b-f5dguzhj8x] {
        border-bottom: 0;
    }

.theme-layout-skeleton__summary-icon[b-f5dguzhj8x] {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    flex-shrink: 0;
}

.theme-layout-skeleton__summary-text[b-f5dguzhj8x] {
    width: 100%;
}

.theme-layout-skeleton__line--summary-title[b-f5dguzhj8x] {
    width: 58%;
    margin-bottom: 0.6rem;
}

.theme-layout-skeleton__line--summary-value[b-f5dguzhj8x] {
    width: 36%;
    height: 14px;
}

.theme-layout-skeleton__panel--table[b-f5dguzhj8x] {
    min-height: 320px;
}

.theme-layout-skeleton__table-head[b-f5dguzhj8x],
.theme-layout-skeleton__table-row[b-f5dguzhj8x] {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: minmax(240px, 2fr) 1fr 1fr 120px;
    gap: 1rem;
    align-items: center;
}

.theme-layout-skeleton__table-head[b-f5dguzhj8x] {
    padding: 0.25rem 0 0.85rem;
    border-bottom: 1px solid #eef2f7;
}

.theme-layout-skeleton__line--table-head[b-f5dguzhj8x] {
    width: 72%;
    height: 14px;
}

.theme-layout-skeleton__table-row[b-f5dguzhj8x] {
    padding: 1rem 0;
    border-bottom: 1px solid #eef2f7;
}

    .theme-layout-skeleton__table-row:last-child[b-f5dguzhj8x] {
        border-bottom: 0;
    }

.theme-layout-skeleton__row-main[b-f5dguzhj8x] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
}

.theme-layout-skeleton__avatar[b-f5dguzhj8x] {
    width: 42px;
    height: 42px;
    border-radius: 999px;
    flex-shrink: 0;
}

.theme-layout-skeleton__row-content[b-f5dguzhj8x] {
    width: 100%;
}

.theme-layout-skeleton__line--row-title[b-f5dguzhj8x] {
    width: 62%;
    margin-bottom: 0.55rem;
}

.theme-layout-skeleton__line--row-subtitle[b-f5dguzhj8x] {
    width: 46%;
    height: 14px;
}

.theme-layout-skeleton__line--row-meta[b-f5dguzhj8x] {
    width: 70%;
    height: 14px;
}

.theme-layout-skeleton__line--row-action[b-f5dguzhj8x] {
    width: 82px;
    height: 34px;
    border-radius: 999px;
}

@keyframes theme-layout-skeleton-shimmer-b-f5dguzhj8x {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

@media (max-width: 991px) {
    .theme-layout-skeleton__hero[b-f5dguzhj8x],
    .theme-layout-skeleton__panel-header[b-f5dguzhj8x],
    .theme-layout-skeleton__table-head[b-f5dguzhj8x],
    .theme-layout-skeleton__table-row[b-f5dguzhj8x] {
        grid-template-columns: 1fr;
    }

    .theme-layout-skeleton__cards[b-f5dguzhj8x] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .theme-layout-skeleton__content-grid[b-f5dguzhj8x] {
        grid-template-columns: 1fr;
    }

    .theme-layout-skeleton__hero[b-f5dguzhj8x],
    .theme-layout-skeleton__panel-header[b-f5dguzhj8x] {
        flex-direction: column;
        align-items: flex-start;
    }

    .theme-layout-skeleton__hero-actions[b-f5dguzhj8x] {
        width: 100%;
    }

    .theme-layout-skeleton__button[b-f5dguzhj8x] {
        flex: 1;
        max-width: 180px;
    }

    .theme-layout-skeleton__table-head[b-f5dguzhj8x] {
        display: none;
    }

    .theme-layout-skeleton__table-row[b-f5dguzhj8x] {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (max-width: 576px) {
    .theme-layout-skeleton__cards[b-f5dguzhj8x] {
        grid-template-columns: 1fr;
    }

    .theme-layout-skeleton__hero-actions[b-f5dguzhj8x] {
        flex-direction: column;
        align-items: stretch;
    }

    .theme-layout-skeleton__pill[b-f5dguzhj8x],
    .theme-layout-skeleton__button[b-f5dguzhj8x] {
        width: 100%;
        max-width: none;
    }
}
/* /Components/Skeleton/TrackOrderClientSkeleton.razor.rz.scp.css */
.tab-cliente-skeleton[b-y2hcn5qiw0] {
    display: grid;
    gap: 16px;
}

.detail-card[b-y2hcn5qiw0] {
    background: #ffffff;
    border: none;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    padding: 18px 16px;
    box-sizing: border-box;
}

@media (max-width: 480px) {
    .detail-card[b-y2hcn5qiw0] {
        padding: 12px 10px;
    }
}

.detail-card h3[b-y2hcn5qiw0] {
    margin: 0 0 12px;
    font-size: 0.9rem;
    font-weight: 700;
    color: #111827;
    display: flex;
    align-items: center;
    gap: 8px;
}

.client-data-grid-skeleton[b-y2hcn5qiw0] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
}

.client-info-card-skeleton[b-y2hcn5qiw0] {
    background: #f9fafb;
    border-radius: 12px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-sizing: border-box;
}

.comment-block-skeleton[b-y2hcn5qiw0] {
    background: #f3f4f6; /* Gray background */
    border-radius: 12px;
    padding: 14px 16px;
    margin-bottom: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-sizing: border-box;
}

.comment-block-skeleton:last-child[b-y2hcn5qiw0] {
    margin-bottom: 0;
}

.client-info-card-footer-skeleton[b-y2hcn5qiw0] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 16px;
    font-size: 0.8rem;
    color: #6b7280;
    flex-wrap: wrap;
}

.card-coming-soon-skeleton[b-y2hcn5qiw0] {
    background: #f9fafb;
    border: 1px dashed #d1d5db;
    border-radius: 16px;
    text-align: center;
    padding: 20px;
}

@media (min-width: 768px) {
    .client-data-grid-skeleton[b-y2hcn5qiw0] {
        grid-template-columns: repeat(3, 1fr);
        gap: 14px;
    }
    .detail-card[b-y2hcn5qiw0] {
        padding: 20px;
    }
}
/* /Components/Skeleton/TrackOrderFinanceSkeleton.razor.rz.scp.css */
.tab-finanzas-skeleton[b-zim92xjy16] {
    display: grid;
    gap: 16px;
}

.finanzas-top-grid-skeleton[b-zim92xjy16] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

.detail-card[b-zim92xjy16] {
    background: #ffffff;
    border: none;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    padding: 18px 16px;
    box-sizing: border-box;
}

@media (max-width: 480px) {
    .detail-card[b-zim92xjy16] {
        padding: 12px 10px;
    }
}

.detail-card h3[b-zim92xjy16] {
    margin: 0 0 12px;
    font-size: 0.9rem;
    font-weight: 700;
    color: #111827;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Financial Detail */
.financial-status-badge-skeleton[b-zim92xjy16] {
    display: inline-block;
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 0.72rem;
    font-weight: 700;
    margin-bottom: 14px;
}

.financial-row-skeleton[b-zim92xjy16] {
    display: flex;
    justify-content: space-between;
    padding: 6px 0;
    border-bottom: 1px solid #f3f4f6;
    font-size: 0.875rem;
}

.financial-row-skeleton:last-child[b-zim92xjy16] {
    border-bottom: none;
}

/* Payments */
.payments-list-skeleton[b-zim92xjy16] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 14px;
}

.payment-card-skeleton[b-zim92xjy16] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
    box-sizing: border-box;
}

/* Evidence Photos */
.photo-grid-skeleton[b-zim92xjy16] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

.photo-card-skeleton[b-zim92xjy16] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    height: 160px;
    box-sizing: border-box;
}

.photo-card-img-skeleton[b-zim92xjy16] {
    width: 150px;
    height: 100%;
    min-height: 140px;
    border-right: 1px solid #e5e7eb;
    flex-shrink: 0;
}

.photo-card-info-skeleton[b-zim92xjy16] {
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex-grow: 1;
    min-width: 0;
    box-sizing: border-box;
}

.photo-card-notes-skeleton[b-zim92xjy16] {
    background: #f9fafb;
    border-left: 3px solid var(--primary-color, #16a34a);
    padding: 4px 8px;
    border-radius: 0 6px 6px 0;
    margin-top: 2px;
}

/* Documents */
.documents-grid-skeleton[b-zim92xjy16] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.document-card-skeleton[b-zim92xjy16] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    border-radius: 10px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    opacity: 0.6;
    box-sizing: border-box;
}

@media (min-width: 768px) {
    .finanzas-top-grid-skeleton[b-zim92xjy16] {
        grid-template-columns: 1.2fr 1fr;
        gap: 16px;
    }
    .documents-grid-skeleton[b-zim92xjy16] {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
    .detail-card[b-zim92xjy16] {
        padding: 20px;
    }
}
/* /Components/Skeleton/TrackOrderHistorySkeleton.razor.rz.scp.css */
.tab-seguimiento-skeleton[b-2bj0shbnv1] {
    display: grid;
    gap: 16px;
}

.detail-card[b-2bj0shbnv1] {
    background: #ffffff;
    border: none;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    padding: 18px 16px;
    box-sizing: border-box;
}

@media (max-width: 480px) {
    .detail-card[b-2bj0shbnv1] {
        padding: 12px 10px;
    }
}

.detail-card h3[b-2bj0shbnv1] {
    margin: 0 0 12px;
    font-size: 0.9rem;
    font-weight: 700;
    color: #111827;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Timeline */
.timeline[b-2bj0shbnv1] {
    position: relative;
}

.timeline-item-skeleton[b-2bj0shbnv1] {
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: 10px;
    position: relative;
    padding-bottom: 22px;
}

.timeline-item-skeleton[b-2bj0shbnv1]::after {
    content: "";
    position: absolute;
    left: 17px;
    top: 36px;
    bottom: -2px;
    width: 1px;
    background: #dbe3ee;
}

.timeline-item-skeleton:last-child[b-2bj0shbnv1]::after {
    display: none;
}

.timeline-dot-skeleton[b-2bj0shbnv1] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.timeline-dot-bg[b-2bj0shbnv1] {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid #dbe3ee;
    background: #dfe8f6;
    display: flex;
    align-items: center;
    justify-content: center;
}

.timeline-header-skeleton[b-2bj0shbnv1] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.notes-box-skeleton[b-2bj0shbnv1] {
    background: #f9fafb;
    border-radius: 10px;
    padding: 14px;
}

.detailed-note-card-skeleton[b-2bj0shbnv1] {
    border-left: 4px solid var(--kendo-color-primary, #0d6efd) !important;
    border: 1px solid #dee2e6;
    border-radius: 0.25rem;
    background-color: #f8f9fa;
    padding: 1rem;
}

.comment-block-skeleton[b-2bj0shbnv1] {
    background: #f3f4f6;
    border-radius: 12px;
    padding: 14px 16px;
    margin-bottom: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-sizing: border-box;
}

.comment-block-skeleton:last-child[b-2bj0shbnv1] {
    margin-bottom: 0;
}

@media (min-width: 768px) {
    .timeline-header-skeleton[b-2bj0shbnv1] {
        flex-direction: row;
        justify-content: space-between;
        gap: 10px;
        align-items: flex-start;
    }
    .detail-card[b-2bj0shbnv1] {
        padding: 20px;
    }
}
/* /Components/Skeleton/TrackOrderSummarySkeleton.razor.rz.scp.css */
.tab-resumen-skeleton[b-6sxnj68732] {
    display: grid;
    gap: 16px;
}

.resumen-cards-grid[b-6sxnj68732] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

.detail-card[b-6sxnj68732] {
    background: #ffffff;
    border: none;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    padding: 18px 16px;
    box-sizing: border-box;
}

@media (max-width: 480px) {
    .detail-card[b-6sxnj68732] {
        padding: 12px 10px;
    }
}

.detail-card h3[b-6sxnj68732] {
    margin: 0 0 12px;
    font-size: 0.9rem;
    font-weight: 700;
    color: #111827;
    display: flex;
    align-items: center;
    gap: 8px;
}

.service-label[b-6sxnj68732] {
    font-size: 0.75rem !important;
    color: #9ca3af !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin-bottom: 2px !important;
    font-weight: 600 !important;
}

.meta-row[b-6sxnj68732] {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    font-size: 0.875rem;
}

.financial-summary-grid[b-6sxnj68732] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}

.financial-pill[b-6sxnj68732] {
    border-radius: 12px;
    padding: 10px 8px;
    text-align: center;
}

@media (max-width: 360px) {
    .financial-pill[b-6sxnj68732] {
        padding: 8px 4px;
    }
}

.financial-pill__label[b-6sxnj68732] {
    display: block;
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: 6px;
}

.financial-pill__value[b-6sxnj68732] {
    display: block;
    font-size: 0.95rem;
    font-weight: 700;
}

.pill-total-skeleton[b-6sxnj68732] { background: #f0f4f8; }
.pill-paid-skeleton[b-6sxnj68732] { background: #ecfdf5; }
.pill-pending-skeleton[b-6sxnj68732] { background: #fef3c7; }
.pill-percent-skeleton[b-6sxnj68732] { background: #f5f3ff; }

@media (min-width: 768px) {
    .resumen-cards-grid[b-6sxnj68732] {
        grid-template-columns: repeat(3, 1fr);
        gap: 16px;
    }
    .financial-summary-grid[b-6sxnj68732] {
        grid-template-columns: repeat(4, 1fr);
        gap: 12px;
    }
    .financial-pill[b-6sxnj68732] {
        padding: 14px 12px;
    }
    .meta-row[b-6sxnj68732] {
        flex-direction: row;
        justify-content: space-between;
        gap: 10px;
    }
    .detail-card[b-6sxnj68732] {
        padding: 20px;
    }
}
/* /Components/Skeleton/TransferProductSkeleton.razor.rz.scp.css */
.transfer-product-skeleton[b-0psd6z0chx] {
    width: 100%;
}

.skeleton[b-0psd6z0chx] {
    background: linear-gradient(90deg, #f1f4f9 25%, #e2e8f0 50%, #f1f4f9 75%);
    background-size: 200% 100%;
    animation: transfer-shimmer-b-0psd6z0chx 1.5s infinite;
    border-radius: 6px;
}

@keyframes transfer-shimmer-b-0psd6z0chx {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}
/* /Components/Skeleton/WarehouseLocationsSkeleton.razor.rz.scp.css */
.locations-skeleton-container[b-r0yd0mivkq] {
    width: 100%;
}

.skeleton-text[b-r0yd0mivkq],
.skeleton-circle-sm[b-r0yd0mivkq],
.skeleton-pill-sm[b-r0yd0mivkq],
.skeleton-btn-sm[b-r0yd0mivkq],
.skeleton-icon-btn[b-r0yd0mivkq] {
    background: linear-gradient(90deg, #f1f4f9 25%, #e2e8f0 50%, #f1f4f9 75%);
    background-size: 200% 100%;
    animation: locations-shimmer-b-r0yd0mivkq 1.5s infinite;
    border-radius: 6px;
}

@keyframes locations-shimmer-b-r0yd0mivkq {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.skeleton-circle-sm[b-r0yd0mivkq] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    flex-shrink: 0;
}

.skeleton-pill-sm[b-r0yd0mivkq] {
    height: 22px;
    border-radius: 12px;
}

.skeleton-btn-sm[b-r0yd0mivkq] {
    border-radius: 6px;
}

.skeleton-icon-btn[b-r0yd0mivkq] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    flex-shrink: 0;
}
/* /Components/Step/WorkflowStepper.razor.rz.scp.css */
.workflow-stepper[b-tpxyqhc3ig] {
    --workflow-step-active-color: var(--primary-color, #7378d9);
    --workflow-step-progress-color: var(--primary-color, #7378d9);
    --workflow-step-track-color: #e2e8f0;
    --workflow-step-pending-bg: #f8fafc;
    --workflow-step-pending-border: #e2e8f0;
    --workflow-step-pending-icon: #94a3b8;
    --workflow-step-active-text: var(--primary-color, #7378d9);
    --workflow-step-completed-text: var(--primary-color, #7378d9);
    --workflow-step-pulse-shadow: rgba(115, 120, 217, 0.35);
}

.workflow-stepper--orders-green[b-tpxyqhc3ig] {
    --workflow-step-active-color: #16a34a;
    --workflow-step-progress-color: #22c55e;
    --workflow-step-active-text: #16a34a;
    --workflow-step-completed-text: #16a34a;
    --workflow-step-pulse-shadow: rgba(22, 163, 74, 0.40);
}

.workflow-stepper--orders-red[b-tpxyqhc3ig] {
    --workflow-step-active-color: #e11d48;
    --workflow-step-progress-color: #fca5a5;
    --workflow-step-active-text: #e11d48;
    --workflow-step-completed-text: #e11d48;
    --workflow-step-pulse-shadow: rgba(225, 29, 72, 0.40);
}

.workflow-stepper--tenant-theme[b-tpxyqhc3ig] {
    --workflow-step-active-color: var(--brand-primary, #059669);
    --workflow-step-progress-color: var(--brand-primary, #059669);
    --workflow-step-active-text: var(--brand-primary, #059669);
    --workflow-step-completed-text: var(--brand-primary, #059669);
    --workflow-step-pulse-shadow: color-mix(in srgb, var(--brand-primary, #059669) 35%, transparent);
}

.workflow-stepper.workflow-stepper--orders-red[b-tpxyqhc3ig]  .k-step-current .workflow-stepper__step-node,
.workflow-stepper.workflow-stepper--orders-red[b-tpxyqhc3ig]  .k-step-done .workflow-stepper__step-node {
    border-color: #fca5a5 !important;
    background: #fee2e2 !important;
    box-shadow: 0 4px 12px rgba(225, 29, 72, 0.08) !important;
}

.workflow-stepper.workflow-stepper--orders-red[b-tpxyqhc3ig]  .k-step-current .workflow-stepper__step-node .k-icon,
.workflow-stepper.workflow-stepper--orders-red[b-tpxyqhc3ig]  .k-step-done .workflow-stepper__step-node .k-icon,
.workflow-stepper.workflow-stepper--orders-red[b-tpxyqhc3ig]  .k-step-current .workflow-stepper__step-node .k-font-icon,
.workflow-stepper.workflow-stepper--orders-red[b-tpxyqhc3ig]  .k-step-done .workflow-stepper__step-node .k-font-icon {
    color: #e11d48 !important;
    opacity: 1 !important;
}

.workflow-stepper.workflow-stepper--orders-red[b-tpxyqhc3ig]  .k-step-current .workflow-stepper__step-label,
.workflow-stepper.workflow-stepper--orders-red[b-tpxyqhc3ig]  .k-step-done .workflow-stepper__step-label {
    color: #e11d48 !important;
}

.workflow-stepper.workflow-stepper--orders-red[b-tpxyqhc3ig]  .k-step-current .workflow-stepper__step-subtitle,
.workflow-stepper.workflow-stepper--orders-red[b-tpxyqhc3ig]  .k-step-done .workflow-stepper__step-subtitle {
    color: #fca5a5 !important;
}

.workflow-stepper.workflow-stepper--orders-red[b-tpxyqhc3ig]  .k-step-current .workflow-stepper__step-node::after {
    border-color: #fca5a5 !important;
}

.workflow-stepper.workflow-stepper--orders-red[b-tpxyqhc3ig]  .workflow-stepper__k-stepper > .k-progressbar .k-selected {
    background: #fca5a5 !important;
}

.workflow-stepper[b-tpxyqhc3ig]  .workflow-stepper__k-stepper {
    margin-top: 20px !important;
}

.workflow-stepper[b-tpxyqhc3ig]  .workflow-stepper__k-stepper > .k-progressbar-horizontal {
    height: 4px !important;
    top: 32px !important;
    background: var(--workflow-step-track-color) !important;
    border-radius: 2px !important;
    overflow: hidden;
}

.workflow-stepper[b-tpxyqhc3ig]  .workflow-stepper__k-stepper > .k-progressbar .k-selected {
    background: var(--workflow-step-progress-color) !important;
    box-shadow: 0 0 8px color-mix(in srgb, var(--workflow-step-progress-color) 40%, transparent);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.workflow-stepper[b-tpxyqhc3ig]  .workflow-stepper__step-node {
    margin-top: 5px;
    width: 48px !important;
    height: 48px !important;
    border: 2px solid var(--workflow-step-pending-border) !important;
    border-radius: 50% !important;
    background: var(--workflow-step-pending-bg) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    position: relative;
    z-index: 2;
}

.workflow-stepper[b-tpxyqhc3ig]  .workflow-stepper__step-node .k-icon,
.workflow-stepper[b-tpxyqhc3ig]  .workflow-stepper__step-node .k-font-icon {
    color: var(--workflow-step-pending-icon) !important;
    font-size: 18px !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.workflow-stepper[b-tpxyqhc3ig]  .k-step-current .workflow-stepper__step-node,
.workflow-stepper[b-tpxyqhc3ig]  .k-step-done .workflow-stepper__step-node {
    border-color: var(--workflow-step-accent, var(--workflow-step-active-color)) !important;
    background: var(--workflow-step-accent, var(--workflow-step-active-color)) !important;
    box-shadow: 0 4px 12px color-mix(in srgb, var(--workflow-step-accent, var(--workflow-step-active-color)) 35%, transparent) !important;
}

.workflow-stepper[b-tpxyqhc3ig]  .k-step-current .workflow-stepper__step-node {
    transform: scale(1.08) !important;
    z-index: 3;
}

.workflow-stepper[b-tpxyqhc3ig]  .k-step-current .workflow-stepper__step-node::after {
    content: "";
    position: absolute;
    inset: -6px;
    border-radius: 50%;
    border: 2px solid var(--workflow-step-accent, var(--workflow-step-active-color));
    animation: workflowCurrentStepPulseRing-b-tpxyqhc3ig 1.6s infinite ease-in-out;
    pointer-events: none;
}

.workflow-stepper--no-pulse[b-tpxyqhc3ig]  .k-step-current .workflow-stepper__step-node {
    transform: none !important;
}

.workflow-stepper--no-pulse[b-tpxyqhc3ig]  .k-step-current .workflow-stepper__step-node::after {
    display: none;
}

.workflow-stepper[b-tpxyqhc3ig]  .k-step-current .workflow-stepper__step-node .k-icon,
.workflow-stepper[b-tpxyqhc3ig]  .k-step-done .workflow-stepper__step-node .k-icon,
.workflow-stepper[b-tpxyqhc3ig]  .k-step-current .workflow-stepper__step-node .k-font-icon,
.workflow-stepper[b-tpxyqhc3ig]  .k-step-done .workflow-stepper__step-node .k-font-icon {
    color: #ffffff !important;
    opacity: 1 !important;
}

.workflow-stepper[b-tpxyqhc3ig]  .workflow-stepper__step-label {
    color: #475569 !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    margin-top: 8px !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.workflow-stepper[b-tpxyqhc3ig]  .workflow-stepper__step-subtitle {
    color: #64748b !important;
    font-size: 12px !important;
    margin: 4px 0 0 0 !important;
    line-height: 1.3 !important;
    opacity: 0.8;
}

.workflow-stepper[b-tpxyqhc3ig]  .k-step-current .workflow-stepper__step-label {
    color: var(--workflow-step-accent, var(--workflow-step-active-text)) !important;
    font-weight: 700 !important;
}

.workflow-stepper[b-tpxyqhc3ig]  .k-step-done .workflow-stepper__step-label {
    color: var(--workflow-step-accent, var(--workflow-step-completed-text)) !important;
    font-weight: 700 !important;
}

.workflow-stepper[b-tpxyqhc3ig]  .k-step-current .workflow-stepper__step-subtitle,
.workflow-stepper[b-tpxyqhc3ig]  .k-step-done .workflow-stepper__step-subtitle {
    color: var(--workflow-step-accent, var(--workflow-step-active-text)) !important;
}

@keyframes workflowCurrentStepPulseRing-b-tpxyqhc3ig {
    0%,
    100% {
        opacity: 0.9;
        transform: scale(0.96);
    }

    50% {
        opacity: 0.25;
        transform: scale(1.12);
    }
}

@media (max-width: 768px) {
    .workflow-stepper[b-tpxyqhc3ig]  .workflow-stepper__step-node {
        width: 40px !important;
        height: 40px !important;
    }

    .workflow-stepper[b-tpxyqhc3ig]  .workflow-stepper__step-node .k-icon,
    .workflow-stepper[b-tpxyqhc3ig]  .workflow-stepper__step-node .k-font-icon {
        font-size: 16px !important;
    }

    .workflow-stepper[b-tpxyqhc3ig]  .workflow-stepper__step-label {
        font-size: 13px !important;
    }

    .workflow-stepper[b-tpxyqhc3ig]  .workflow-stepper__step-subtitle {
        font-size: 11px !important;
    }

    .workflow-stepper[b-tpxyqhc3ig]  .workflow-stepper__k-stepper > .k-progressbar-horizontal {
        top: 28px !important;
    }
}

@media (max-width: 480px) {
    .workflow-stepper[b-tpxyqhc3ig]  .workflow-stepper__step-subtitle {
        display: none !important;
    }

    .workflow-stepper[b-tpxyqhc3ig]  .workflow-stepper__step-label {
        font-size: 11px !important;
        max-width: 80px;
        text-align: center;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .workflow-stepper[b-tpxyqhc3ig]  .workflow-stepper__step-node {
        width: 36px !important;
        height: 36px !important;
    }

    .workflow-stepper[b-tpxyqhc3ig]  .workflow-stepper__k-stepper > .k-progressbar-horizontal {
        top: 24px !important;
    }
}
/* /Components/Subscription/TenantPurchaseCheckoutModal.razor.rz.scp.css */
.success-icon-circle[b-5r62pz2xc9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background-color: #d1fae5;
    font-size: 2.5rem;
}

.error-icon-circle[b-5r62pz2xc9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background-color: #fee2e2;
    font-size: 2.2rem;
}

.order-summary-box[b-5r62pz2xc9] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
}

.bold-container[b-5r62pz2xc9] {
    min-height: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
}
/* /Components/SuperAdmin/Addons/AddonFormModal/AddonFormModal.razor.rz.scp.css */
.cursor-pointer[b-r9rmc5judn] {
    cursor: pointer;
}

.required[b-r9rmc5judn]::after {
    content: " *";
    color: #ef4444;
}
/* /Components/SuperAdmin/Addons/AddonForm/AddonForm.razor.rz.scp.css */
/* Dimensiones Fijas del Modal */
.plan-tab-content[b-7ys2re8uq7] {
    height: 480px;
    overflow-y: auto;
    padding: 1.25rem;
}

/* Sección de Títulos y Separación */
.section-title[b-7ys2re8uq7] {
    display: flex;
    align-items: center;
    color: var(--text-heading-primary, #09224f);
}

.section-title h4[b-7ys2re8uq7] {
    margin: 0;
    color: inherit;
}

.section-title[b-7ys2re8uq7]  svg,
.section-title svg[b-7ys2re8uq7] {
    color: var(--brand-blue, #093d93);
    width: 22px;
    height: 22px;
}

/* Caja de Registro de Precios */
.price-register-box[b-7ys2re8uq7] {
    background: #ffffff !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 12px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

/* Switch personalización */
[b-7ys2re8uq7] .switch-arregly.k-switch {
    width: 68px !important;
}

[b-7ys2re8uq7] .switch-arregly .k-switch-label-on,
[b-7ys2re8uq7] .switch-arregly .k-switch-label-off {
    font-size: 0.7rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    padding: 0 6px !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

[b-7ys2re8uq7] .k-switch.k-switch-on .k-switch-track,
[b-7ys2re8uq7] .switch-arregly.k-switch-on .k-switch-track {
    background-color: var(--primary-color, #093d93) !important;
    border-color: var(--primary-color, #093d93) !important;
    box-shadow: none !important;
}

/* Checkbox personalizado */
[b-7ys2re8uq7] .checkbox-theme-arregly.k-checkbox {
    border-radius: 4px !important;
    width: 18px !important;
    height: 18px !important;
    flex-shrink: 0 !important;
}

[b-7ys2re8uq7] .checkbox-theme-arregly.k-checkbox:checked,
[b-7ys2re8uq7] .checkbox-theme-arregly.k-checkbox.k-checked {
    background-color: var(--primary-color, #093d93) !important;
    border-color: var(--primary-color, #093d93) !important;
}

/* Checklist Módulos y Beneficios */
.tab-instruction-text[b-7ys2re8uq7] {
    font-size: 0.875rem;
    color: #475569;
    margin-bottom: 1.25rem;
}

.modules-checklist-grid[b-7ys2re8uq7], .benefits-checklist-grid[b-7ys2re8uq7] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1rem;
}

.checklist-item-box[b-7ys2re8uq7] {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 0.85rem 1rem;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background: #ffffff;
    transition: all 0.15s ease-in-out;
    cursor: pointer;
}

.checklist-item-box:hover[b-7ys2re8uq7] {
    border-color: #94a3b8;
    background: #f8fafc;
}

.checklist-item-box.checked[b-7ys2re8uq7] {
    border-color: var(--primary-color, #093d93);
    background: #f0f5ff;
}

.checklist-label-wrapper[b-7ys2re8uq7] {
    display: flex;
    gap: 12px;
    cursor: pointer;
    flex-grow: 1;
    margin-bottom: 0;
}

.checklist-icon-wrap[b-7ys2re8uq7] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: #f1f5f9;
    color: #475569;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
    transition: all 0.2s ease;
}

.checked .checklist-icon-wrap[b-7ys2re8uq7] {
    background: var(--primary-color, #093d93);
    color: #ffffff;
}

.checklist-info[b-7ys2re8uq7] {
    display: flex;
    flex-direction: column;
}

.checklist-name[b-7ys2re8uq7] {
    font-weight: 600;
    font-size: 0.9rem;
    color: #0f172a;
}

.checklist-desc[b-7ys2re8uq7] {
    font-size: 0.75rem;
    color: #64748b;
    margin-top: 2px;
    line-height: 1.3;
}

/* Elementos requeridos en etiquetas */
.required[b-7ys2re8uq7]::after {
    content: " *";
    color: #dc3545;
}

.form-label[b-7ys2re8uq7] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #334155;
    margin-bottom: 0.4rem;
}

.max-h-350[b-7ys2re8uq7] {
    max-height: 350px;
}

.cursor-pointer[b-7ys2re8uq7] {
    cursor: pointer;
}

@media (max-width: 768px) {
    [b-7ys2re8uq7] .k-tabstrip-items-wrapper,
    [b-7ys2re8uq7] .k-tabstrip-items {
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        white-space: nowrap !important;
        width: 100% !important;
    }

    [b-7ys2re8uq7] .k-tabstrip-items .k-item {
        flex-shrink: 0 !important;
    }
}

@media (max-width: 576px) {
    .plan-tab-content[b-7ys2re8uq7] {
        padding: 0.75rem !important;
        height: auto !important;
        max-height: 440px !important;
    }
    
    .modules-checklist-grid[b-7ys2re8uq7], .benefits-checklist-grid[b-7ys2re8uq7] {
        grid-template-columns: 1fr !important;
    }

    .checklist-item-box[b-7ys2re8uq7] {
        width: 100% !important;
        box-sizing: border-box;
    }
}

/* Estilos para Tabla de Vigencias */
[b-7ys2re8uq7] .table-arregly {
    width: 100%;
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
}

[b-7ys2re8uq7] .table-arregly thead th {
    background-color: #f8fafc;
    color: #475569;
    font-weight: 700;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 10px 14px;
    border-bottom: 2px solid #e2e8f0;
}

[b-7ys2re8uq7] .table-arregly tbody td {
    padding: 12px 14px;
    border-bottom: 1px solid #f1f5f9;
    color: #1e293b;
    vertical-align: middle;
    transition: background-color 0.15s ease;
}

[b-7ys2re8uq7] .table-arregly tbody tr:hover td {
    background-color: #f8fafc;
}

[b-7ys2re8uq7] .table-arregly tbody tr:last-child td {
    border-bottom: none;
}

[b-7ys2re8uq7] .table-arregly tbody tr.editing-row td {
    background-color: #f0f5ff !important;
}

[b-7ys2re8uq7] .table-arregly tbody tr.editing-row td:first-child {
    border-left: 4px solid var(--primary-color, #093d93);
}

[b-7ys2re8uq7] .btn-action-circle {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    padding: 0;
}

[b-7ys2re8uq7] .btn-action-circle svg {
    width: 15px;
    height: 15px;
}

[b-7ys2re8uq7] .btn-action-edit {
    background-color: #f0f5ff;
    color: var(--primary-color, #093d93);
}

[b-7ys2re8uq7] .btn-action-edit:hover {
    background-color: var(--primary-color, #093d93);
    color: #ffffff;
    transform: scale(1.1);
    box-shadow: 0 4px 10px rgba(9, 61, 147, 0.25);
}

[b-7ys2re8uq7] .btn-action-delete {
    background-color: #fef2f2;
    color: #dc2626;
}

[b-7ys2re8uq7] .btn-action-delete:hover {
    background-color: #dc2626;
    color: #ffffff;
    transform: scale(1.1);
    box-shadow: 0 4px 10px rgba(220, 38, 38, 0.25);
}

[b-7ys2re8uq7] .btn-action-view {
    background-color: #f1f5f9;
    color: #94a3b8;
}

.bg-primary-subtle-light[b-7ys2re8uq7] {
    background-color: #f0f5ff !important;
}

.shadow-xs[b-7ys2re8uq7] {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.transition-all[b-7ys2re8uq7] {
    transition: all 0.2s ease;
}
/* /Components/SuperAdmin/Addons/AddonItemsModal/AddonItemsModal.razor.rz.scp.css */
.max-h-350[b-bz8r5uk0kp] {
    max-height: 350px;
}

.cursor-pointer[b-bz8r5uk0kp] {
    cursor: pointer;
}
/* /Components/SuperAdmin/Addons/AddonLimitsModal/AddonLimitsModal.razor.rz.scp.css */
.table-hover tbody tr:hover[b-k9m58a5ufx] {
    background-color: #f8fafc;
}
/* /Components/SuperAdmin/Addons/AddonPricesModal/AddonPricesModal.razor.rz.scp.css */
.table-striped tbody tr:nth-of-type(odd)[b-1s8pjkds45] {
    background-color: rgba(241, 245, 249, 0.5);
}
/* /Components/SuperAdmin/Billing/GenerateBatchModal/GenerateBatchModal.razor.rz.scp.css */
/* ==========================================================================
   ESTILOS LIQUID GLASS FACTURA Y SKELETON PARA GENERATE BATCH MODAL
   ========================================================================== */

/* Contenedor Hoja de Factura Liquid Glass */
.invoice-glass-sheet[b-yaoinx8pmy] {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.95) 0%, rgba(248, 250, 252, 0.88) 100%);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    border: 1px solid rgba(226, 232, 240, 0.85);
    border-radius: 16px;
    box-shadow: 0 10px 28px -6px rgba(15, 23, 42, 0.08), 
                0 0 0 1px rgba(255, 255, 255, 0.9) inset;
    position: relative;
    overflow: hidden;
    padding: 1.25rem 1.4rem;
}

/* Encabezado de la factura */
.invoice-header-stamp[b-yaoinx8pmy] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    padding-bottom: 0.85rem;
    border-bottom: 1px solid rgba(226, 232, 240, 0.7);
}

.invoice-title[b-yaoinx8pmy] {
    font-size: 1.05rem;
    font-weight: 600;
    color: #0f172a;
    letter-spacing: -0.01em;
    margin: 0;
}

.invoice-folio[b-yaoinx8pmy] {
    font-size: 0.72rem;
    font-weight: 500;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Grilla de Metadatos de Facturación */
.invoice-meta-grid[b-yaoinx8pmy] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.65rem 1rem;
    padding: 0.85rem 0;
    font-size: 0.78rem;
}

@media (min-width: 576px) {
    .invoice-meta-grid[b-yaoinx8pmy] {
        grid-template-columns: repeat(4, 1fr);
    }
}

.invoice-meta-item[b-yaoinx8pmy] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.invoice-meta-label[b-yaoinx8pmy] {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    color: #94a3b8;
    letter-spacing: 0.3px;
}

.invoice-meta-val[b-yaoinx8pmy] {
    font-weight: 500;
    color: #1e293b;
}

/* Línea de Perforación de Factura / Ticket */
.invoice-perforation[b-yaoinx8pmy] {
    border-top: 2px dashed #cbd5e1;
    margin: 0.85rem -1.4rem;
    position: relative;
}

.invoice-notch-left[b-yaoinx8pmy],
.invoice-notch-right[b-yaoinx8pmy] {
    position: absolute;
    top: -8px;
    width: 14px;
    height: 14px;
    background-color: #ffffff;
    border-radius: 50%;
    border: 1px solid rgba(226, 232, 240, 0.85);
}

.invoice-notch-left[b-yaoinx8pmy] {
    left: -8px;
    clip-path: polygon(50% 0%, 100% 0%, 100% 100%, 50% 100%);
}

.invoice-notch-right[b-yaoinx8pmy] {
    right: -8px;
    clip-path: polygon(0% 0%, 50% 0%, 50% 100%, 0% 100%);
}

/* Tabla / Desglose de Líneas de Factura */
.invoice-lines-table[b-yaoinx8pmy] {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    padding: 0.25rem 0;
}

.invoice-line-row[b-yaoinx8pmy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.55rem 0.75rem;
    border-radius: 8px;
    background: rgba(248, 250, 252, 0.7);
    border: 1px solid rgba(241, 245, 249, 0.8);
    font-size: 0.82rem;
    transition: background-color 0.15s ease;
}

.invoice-line-row:hover[b-yaoinx8pmy] {
    background: rgba(241, 245, 249, 0.9);
}

.invoice-line-concept[b-yaoinx8pmy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: #334155;
    font-weight: 400;
}

.invoice-line-value[b-yaoinx8pmy] {
    font-weight: 600;
    color: #0f172a;
}

/* Bloque Total de la Factura */
.invoice-total-panel[b-yaoinx8pmy] {
    background: linear-gradient(135deg, rgba(238, 242, 255, 0.5) 0%, rgba(248, 250, 252, 0.8) 100%);
    border: 1px solid rgba(199, 210, 254, 0.5);
    border-radius: 12px;
    padding: 0.9rem 1.15rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 0.5rem;
}

.invoice-total-label-wrap[b-yaoinx8pmy] {
    display: flex;
    flex-direction: column;
}

.invoice-total-title[b-yaoinx8pmy] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    color: #475569;
    letter-spacing: 0.5px;
}

.invoice-total-subtitle[b-yaoinx8pmy] {
    font-size: 0.72rem;
    color: #64748b;
    font-weight: 400;
}

.invoice-total-amount[b-yaoinx8pmy] {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--primary-color, #093d93);
    line-height: 1;
    letter-spacing: -0.02em;
}

/* Tipografía liviana y limpia para alertas dentro del modal */
.alert-theme[b-yaoinx8pmy] {
    font-weight: 400 !important;
    font-size: 0.8125rem !important;
    line-height: 1.45 !important;
}

.alert-theme strong[b-yaoinx8pmy] {
    font-weight: 600 !important;
}

/* SKELETON ANIMATIONS */
.skeleton-shimmer[b-yaoinx8pmy] {
    background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 50%, #f1f5f9 75%);
    background-size: 200% 100%;
    animation: invoice-skeleton-shimmer-b-yaoinx8pmy 1.5s infinite ease-in-out;
    border-radius: 6px;
}

@keyframes invoice-skeleton-shimmer-b-yaoinx8pmy {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

.pulse-dot[b-yaoinx8pmy] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--primary-color, #0d6efd);
    display: inline-block;
    animation: pulse-dot-anim-b-yaoinx8pmy 1.2s infinite ease-in-out;
}

@keyframes pulse-dot-anim-b-yaoinx8pmy {
    0%, 100% { transform: scale(0.8); opacity: 0.4; }
    50% { transform: scale(1.2); opacity: 1; }
}

.icon-sparkle-success[b-yaoinx8pmy] {
    color: #059669 !important;
}

/* Responsividad de botones en Footer */
@media (max-width: 768px) {
    [b-yaoinx8pmy] .modal-footer-custom {
        flex-shrink: 0 !important;
    }

    [b-yaoinx8pmy] .modal-footer-custom .modal-wizard-footer.d-flex {
        width: 100% !important;
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        gap: 12px !important;
    }

    [b-yaoinx8pmy] .modal-footer-custom .modal-wizard-footer.d-flex > button {
        width: auto !important;
        min-width: 0 !important;
        flex: 1 1 0% !important;
        max-width: 160px !important;
        margin: 0 !important;
    }
}
/* /Components/SuperAdmin/Billing/InvoiceDetailModal/InvoiceDetailModal.razor.rz.scp.css */
/* ==========================================================================
   ESTILOS MODO FACTURA LIQUID GLASS PARA INVOICE DETAIL MODAL
   ========================================================================== */

/* Hoja de Factura Liquid Glass */
.invoice-glass-sheet[b-448mjp1jge] {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.95) 0%, rgba(248, 250, 252, 0.88) 100%);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    border: 1px solid rgba(226, 232, 240, 0.85);
    border-radius: 16px;
    box-shadow: 0 10px 28px -6px rgba(15, 23, 42, 0.08), 
                0 0 0 1px rgba(255, 255, 255, 0.9) inset;
    position: relative;
    overflow: hidden;
    padding: 1.25rem 1.4rem;
}

/* Encabezado / Timbre de la Factura */
.invoice-header-stamp[b-448mjp1jge] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    padding-bottom: 0.85rem;
    border-bottom: 1px solid rgba(226, 232, 240, 0.7);
}

.invoice-title[b-448mjp1jge] {
    font-size: 1.15rem;
    font-weight: 600;
    color: #0f172a;
    letter-spacing: -0.01em;
    margin: 0;
    line-height: 1.3;
}

.invoice-folio[b-448mjp1jge] {
    font-size: 0.72rem;
    font-weight: 500;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.invoice-period-text[b-448mjp1jge] {
    font-size: 0.8rem;
    color: #64748b;
    font-weight: 400;
}

/* Grilla de Metadatos de Facturación */
.invoice-meta-grid[b-448mjp1jge] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.65rem 1rem;
    padding: 0.85rem 0;
    font-size: 0.78rem;
}

@media (min-width: 576px) {
    .invoice-meta-grid[b-448mjp1jge] {
        grid-template-columns: 2fr 1fr 1fr;
    }
}

.invoice-meta-item[b-448mjp1jge] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.invoice-meta-label[b-448mjp1jge] {
    font-size: 0.68rem;
    font-weight: 600;
    text-transform: uppercase;
    color: #94a3b8;
    letter-spacing: 0.3px;
}

.invoice-meta-val[b-448mjp1jge] {
    font-weight: 500;
    color: #1e293b;
    font-size: 0.85rem;
}

/* Panel de Información de Pago */
.invoice-payment-panel[b-448mjp1jge] {
    background: rgba(240, 253, 244, 0.6);
    border: 1px solid rgba(187, 247, 208, 0.75);
    border-radius: 10px;
    padding: 0.65rem 0.9rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 0.5rem 1rem;
    font-size: 0.78rem;
    margin-bottom: 0.35rem;
}

.invoice-payment-item[b-448mjp1jge] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.invoice-payment-label[b-448mjp1jge] {
    font-size: 0.65rem;
    font-weight: 600;
    text-transform: uppercase;
    color: #15803d;
    letter-spacing: 0.3px;
}

.invoice-payment-val[b-448mjp1jge] {
    font-weight: 500;
    color: #14532d;
}

/* Línea de Perforación / Cupón */
.invoice-perforation[b-448mjp1jge] {
    border-top: 2px dashed #cbd5e1;
    margin: 0.85rem -1.4rem;
    position: relative;
}

.invoice-notch-left[b-448mjp1jge],
.invoice-notch-right[b-448mjp1jge] {
    position: absolute;
    top: -8px;
    width: 14px;
    height: 14px;
    background-color: #ffffff;
    border-radius: 50%;
    border: 1px solid rgba(226, 232, 240, 0.85);
}

.invoice-notch-left[b-448mjp1jge] {
    left: -8px;
    clip-path: polygon(50% 0%, 100% 0%, 100% 100%, 50% 100%);
}

.invoice-notch-right[b-448mjp1jge] {
    right: -8px;
    clip-path: polygon(0% 0%, 50% 0%, 50% 100%, 0% 100%);
}

/* Tabla de Ítems / Conceptos */
.invoice-table-container[b-448mjp1jge] {
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid rgba(226, 232, 240, 0.9);
    background: #ffffff;
}

.invoice-items-table[b-448mjp1jge] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
}

.invoice-items-table thead th[b-448mjp1jge] {
    background: #f8fafc;
    color: #475569;
    font-weight: 600;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 0.6rem 0.75rem;
    border-bottom: 1px solid #e2e8f0;
}

.invoice-items-table tbody td[b-448mjp1jge] {
    padding: 0.65rem 0.75rem;
    border-bottom: 1px solid #f1f5f9;
    vertical-align: middle;
}

.invoice-items-table tbody tr:hover[b-448mjp1jge] {
    background-color: #f8fafc;
}

.invoice-item-source[b-448mjp1jge] {
    font-size: 0.68rem;
    font-weight: 500;
    color: #475569;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    padding: 1px 6px;
}

/* Fila de Vigencia Expandida */
.invoice-expansion-row td[b-448mjp1jge] {
    background: #f8fafc !important;
    border-bottom: 1px solid #e2e8f0 !important;
    padding: 0.65rem 0.9rem !important;
}

.invoice-expansion-box[b-448mjp1jge] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
    font-size: 0.78rem;
    color: #475569;
}

/* Panel Total de Factura */
.invoice-total-panel[b-448mjp1jge] {
    background: linear-gradient(135deg, rgba(238, 242, 255, 0.45) 0%, rgba(248, 250, 252, 0.8) 100%);
    border: 1px solid rgba(199, 210, 254, 0.5);
    border-radius: 12px;
    padding: 0.85rem 1.15rem;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    margin-top: 0.65rem;
}

.invoice-total-row[b-448mjp1jge] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.invoice-total-title[b-448mjp1jge] {
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    color: #475569;
    letter-spacing: 0.5px;
}

.invoice-total-amount[b-448mjp1jge] {
    font-size: 1.55rem;
    font-weight: 700;
    color: var(--primary-color, #093d93);
    line-height: 1;
    letter-spacing: -0.02em;
}

/* Notas */
.invoice-notes-box[b-448mjp1jge] {
    background: rgba(248, 250, 252, 0.8);
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.6rem 0.85rem;
    font-size: 0.78rem;
    color: #475569;
    font-weight: 400;
}

/* Responsividad de botones en Footer */
@media (max-width: 768px) {
    [b-448mjp1jge] .modal-footer-custom {
        flex-shrink: 0 !important;
    }

    [b-448mjp1jge] .modal-footer-custom .modal-wizard-footer.d-flex {
        width: 100% !important;
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        gap: 12px !important;
    }

    [b-448mjp1jge] .modal-footer-custom .modal-wizard-footer.d-flex > button {
        width: auto !important;
        min-width: 0 !important;
        flex: 1 1 0% !important;
        max-width: 160px !important;
        margin: 0 !important;
    }
}
/* /Components/SuperAdmin/Billing/RecordPaymentModal/RecordPaymentModal.razor.rz.scp.css */
.payment-gateway-card[b-fhbrfek8qu] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px;
    transition: all 0.2s ease;
}

.gateway-badge[b-fhbrfek8qu] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #eef2ff;
    color: #4f46e5;
    font-size: 0.75rem;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 20px;
    border: 1px solid #c7d2fe;
}

.gateway-badge.bold[b-fhbrfek8qu] {
    background: #fdf2f8;
    color: #db2777;
    border-color: #fbcfe8;
}

.gateway-badge.mercadopago[b-fhbrfek8qu] {
    background: #f0fdf4;
    color: #059669;
    border-color: #bbf7d0;
}

.contact-info-box[b-fhbrfek8qu] {
    background: #ffffff;
    border: 1px dashed #cbd5e1;
    border-radius: 8px;
    padding: 12px 14px;
}

.contact-info-row[b-fhbrfek8qu] {
    display: flex;
    justify-content: space-between;
    font-size: 0.82rem;
    margin-bottom: 4px;
}

.contact-info-row:last-child[b-fhbrfek8qu] {
    margin-bottom: 0;
}

.contact-label[b-fhbrfek8qu] {
    color: #64748b;
}

.contact-value[b-fhbrfek8qu] {
    font-weight: 600;
    color: #1e293b;
}

.link-actions-box[b-fhbrfek8qu] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 12px;
}

.polling-indicator[b-fhbrfek8qu] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 0.82rem;
    color: #d97706;
    background: #fffbeb;
    padding: 6px 12px;
    border-radius: 6px;
    border: 1px solid #fde68a;
}
/* /Components/SuperAdmin/Reports/FinancialReportTab.razor.rz.scp.css */
/* Styles for FinancialReportTab */
.stats-grid[b-5t3lynq5c7] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
}

@media (max-width: 768px) {
    .stats-grid[b-5t3lynq5c7] {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        gap: 0.75rem;
        padding-bottom: 0.5rem;
        margin-bottom: 1rem !important;
        scrollbar-width: thin;
    }

    .stats-grid .stat-card[b-5t3lynq5c7] {
        flex: 0 0 75%;
        min-width: 220px;
        scroll-snap-align: start;
    }
}

.stat-card[b-5t3lynq5c7] {
    background: #ffffff;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
    border: 1px solid #f1f3f5;
    transition: transform 0.2s, box-shadow 0.2s;
}

.stat-card:hover[b-5t3lynq5c7] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
}

.stat-card-body[b-5t3lynq5c7] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.stat-info[b-5t3lynq5c7] {
    display: flex;
    flex-direction: column;
}

.stat-label[b-5t3lynq5c7] {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 500;
}

.stat-value[b-5t3lynq5c7] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #212529;
    margin-top: 0.25rem;
}

.stat-icon-wrapper[b-5t3lynq5c7] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.stat-icon-wrapper[b-5t3lynq5c7]  svg {
    width: 24px;
    height: 24px;
}

.stat-icon-total[b-5t3lynq5c7] {
    background-color: #e0f2fe;
    color: #0284c7;
}

.stat-icon-plans[b-5t3lynq5c7] {
    background-color: rgba(9, 61, 147, 0.08);
    color: var(--brand-blue, #093d93);
}

.stat-icon-active[b-5t3lynq5c7] {
    background-color: #dcfce7;
    color: #15803d;
}

.stat-icon-warning[b-5t3lynq5c7] {
    background-color: #fef3c7;
    color: #d97706;
}

.modern-card[b-5t3lynq5c7] {
    background: #ffffff;
    border-radius: 16px;
    border: 1px solid #e9ecef;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
    overflow: hidden;
    transition: box-shadow 0.3s ease;
}

.modern-card-header[b-5t3lynq5c7] {
    background: #fafafa;
    border-bottom: 1px solid #f0f0f0;
    padding: 1.1rem 1.5rem;
}

.geo-header-icon-wrapper[b-5t3lynq5c7] {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background-color: #f3e8ff;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #7e22ce;
}

.geo-header-icon-wrapper[b-5t3lynq5c7]  svg {
    width: 24px;
    height: 24px;
}

.geo-highlight-box[b-5t3lynq5c7] {
    background-color: #f8fafc;
    border: 1px solid #f1f5f9;
    border-radius: 16px;
    padding: 1.5rem;
    display: flex;
}

.custom-progress[b-5t3lynq5c7] {
    height: 8px;
    background-color: #f1f5f9;
    border-radius: 999px;
    overflow: hidden;
}

.custom-progress-bar[b-5t3lynq5c7] {
    height: 100%;
    border-radius: 999px;
    transition: width 0.6s ease;
}
/* /Components/SuperAdmin/Reports/GeneralReportTab.razor.rz.scp.css */
/* Styles for GeneralReportTab */
.stats-grid[b-178sazr6jl] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
}

@media (max-width: 768px) {
    .stats-grid[b-178sazr6jl] {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        gap: 0.75rem;
        padding-bottom: 0.5rem;
        margin-bottom: 1rem !important;
        scrollbar-width: thin;
    }

    .stats-grid .stat-card[b-178sazr6jl] {
        flex: 0 0 75%;
        min-width: 220px;
        scroll-snap-align: start;
    }
}

.stat-card[b-178sazr6jl] {
    background: #ffffff;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
    border: 1px solid #f1f3f5;
    transition: transform 0.2s, box-shadow 0.2s;
}

.stat-card:hover[b-178sazr6jl] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
}

.stat-card-body[b-178sazr6jl] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.stat-info[b-178sazr6jl] {
    display: flex;
    flex-direction: column;
}

.stat-label[b-178sazr6jl] {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 500;
}

.stat-value[b-178sazr6jl] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #212529;
    margin-top: 0.25rem;
}

.stat-icon-wrapper[b-178sazr6jl] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.stat-icon-wrapper[b-178sazr6jl]  svg {
    width: 24px;
    height: 24px;
}

.stat-icon-total[b-178sazr6jl] {
    background-color: #e0f2fe;
    color: #0284c7;
}

.stat-icon-plans[b-178sazr6jl] {
    background-color: rgba(9, 61, 147, 0.08);
    color: var(--brand-blue, #093d93);
}

.stat-icon-active[b-178sazr6jl] {
    background-color: #dcfce7;
    color: #15803d;
}

.stat-icon-warning[b-178sazr6jl] {
    background-color: #fef3c7;
    color: #d97706;
}

.modern-card[b-178sazr6jl] {
    background: #ffffff;
    border-radius: 16px;
    border: 1px solid #e9ecef;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
    overflow: hidden;
    transition: box-shadow 0.3s ease;
}

.modern-card:hover[b-178sazr6jl] {
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.06);
}

.modern-card-header[b-178sazr6jl] {
    background: #fafafa;
    border-bottom: 1px solid #f0f0f0;
    padding: 1.1rem 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.rank-avatar[b-178sazr6jl] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.85rem;
}

.rank-1[b-178sazr6jl] {
    background: linear-gradient(135deg, #ffd700 0%, #ffa500 100%) !important;
    color: #ffffff !important;
}

.rank-2[b-178sazr6jl] {
    background: linear-gradient(135deg, #c0c0c0 0%, #808080 100%) !important;
    color: #ffffff !important;
}

.rank-3[b-178sazr6jl] {
    background: linear-gradient(135deg, #cd7f32 0%, #8b4513 100%) !important;
    color: #ffffff !important;
}

.rank-default[b-178sazr6jl] {
    background-color: #f1f3f5;
    color: #6c757d;
}

.leaderboard-item[b-178sazr6jl] {
    transition: background-color 0.2s ease, transform 0.2s ease;
    border-radius: 8px;
    padding: 0.5rem;
}

.leaderboard-item:hover[b-178sazr6jl] {
    background-color: #f8fafc;
    transform: translateX(4px);
}

.geo-header-icon-wrapper[b-178sazr6jl] {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background-color: #f0fdf4;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #10b981;
}

.geo-header-icon-wrapper[b-178sazr6jl]  svg {
    width: 24px;
    height: 24px;
}

.geo-progress-container[b-178sazr6jl] {
    width: 100%;
}

.geo-progress-bar-thick[b-178sazr6jl] {
    height: 12px;
    background-color: #e2e8f0;
    border-radius: 999px;
    overflow: hidden;
    flex-grow: 1;
}

.geo-progress-bar-fill[b-178sazr6jl] {
    height: 100%;
    background-color: #10b981;
    border-radius: 999px;
    transition: width 0.6s ease;
}

.geo-highlight-box[b-178sazr6jl] {
    background-color: #f8fafc;
    border: 1px solid #f1f5f9;
    border-radius: 16px;
    padding: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 180px;
    position: relative;
}

.geo-highlight-left[b-178sazr6jl] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    flex: 1;
}

.geo-highlight-icon[b-178sazr6jl] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background-color: #10b981;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.geo-highlight-icon[b-178sazr6jl]  svg {
    width: 24px;
    height: 24px;
}

.geo-map-right[b-178sazr6jl] {
    width: 220px;
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    flex-shrink: 0;
}

.geo-map-right .map-svg-bg[b-178sazr6jl] {
    width: 100%;
    height: 100%;
    opacity: 1;
}

.geo-map-right .map-svg-bg path[b-178sazr6jl] {
    fill: #10b981;
    fill-opacity: 0.85;
    stroke: #ffffff;
    stroke-width: 1.2;
}

.geo-map-right .map-svg-bg-world path[b-178sazr6jl] {
    fill: #cbd5e1;
    fill-opacity: 0.5;
}

.geo-map-right .map-svg-bg-world path.highlight-world[b-178sazr6jl] {
    fill: #10b981;
    fill-opacity: 0.85;
}
/* /Components/SuperAdmin/Reports/LimitUsageMasterDetail.razor.rz.scp.css */
/* BaseGrid.razor.css direct visual replica for LimitUsageMasterDetail */

.base-grid-container[b-dfeow5n8lv] {
    --base-grid-primary-color: var(--grid-primary-color, var(--primary-color, #0d6efd));
    --base-grid-hover-bg: var(--grid-hover-bg, color-mix(in srgb, var(--base-grid-primary-color) 8%, #ffffff));
    --base-grid-selected-bg: var(--grid-selected-bg, color-mix(in srgb, var(--base-grid-primary-color) 16%, #ffffff));
    --base-grid-selected-hover-bg: var(--grid-selected-hover-bg, color-mix(in srgb, var(--base-grid-primary-color) 22%, #ffffff));
    --base-grid-selected-text: var(--grid-selected-text, #1f2937);
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.01);
    border: none !important;
    outline: 1px solid transparent;
    background-clip: padding-box;
    height: 100% !important;
    position: relative;
    width: 100%;
    max-width: 100%;
}

[b-dfeow5n8lv] .custom-base-grid {
    overflow: hidden;
    border: 1px solid #e6e8eb !important;
    background: white !important;
    width: 100% !important;
    max-width: 100% !important;
}

[b-dfeow5n8lv] .custom-base-grid .k-grid {
    width: 100% !important;
    border: none !important;
}

[b-dfeow5n8lv] .custom-base-grid .k-grid-header {
    background: #f8f9fb !important;
    border-bottom: 1px solid #e6e8eb !important;
}

[b-dfeow5n8lv] .custom-base-grid .k-grid-header th {
    font-weight: 600 !important;
    color: #344054 !important;
    padding: 12px 14px !important;
    font-size: 0.875rem !important;
    text-transform: none !important;
    letter-spacing: 0.5px !important;
    border-right: none !important;
    border-left: none !important;
    background: #f8f9fb !important;
}

[b-dfeow5n8lv] .custom-base-grid tbody tr {
    border-bottom: 1px solid #f1f2f4 !important;
    transition: all 0.15s ease !important;
}

[b-dfeow5n8lv] .custom-base-grid tbody tr:hover {
    background: #f9fafb !important;
}

[b-dfeow5n8lv] .custom-base-grid td {
    padding: 12px 14px !important;
    color: #344054 !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
}

[b-dfeow5n8lv] .custom-base-grid td,
[b-dfeow5n8lv] .custom-base-grid th {
    border-right: none !important;
    border-left: none !important;
}

[b-dfeow5n8lv] .custom-base-grid .k-grid-content,
[b-dfeow5n8lv] .custom-base-grid .k-table-tbody,
[b-dfeow5n8lv] .custom-base-grid .k-table-td,
[b-dfeow5n8lv] .custom-base-grid .k-master-row,
[b-dfeow5n8lv] .custom-base-grid .k-alt {
    background: transparent !important;
    color: #101828 !important;
}

[b-dfeow5n8lv] .custom-base-grid tbody tr:hover,
[b-dfeow5n8lv] .k-grid tbody tr:hover,
[b-dfeow5n8lv] .k-grid tbody tr.k-table-row:hover {
    background: var(--RgbaColor01) !important;
}

.base-grid-container[b-dfeow5n8lv]  .custom-base-grid .k-pager-wrap,
.base-grid-container[b-dfeow5n8lv]  .custom-base-grid .k-grid-pager {
    border-top: 2px solid #e0e6ed !important;
    border-bottom: 2px solid #e0e6ed !important;
    background: linear-gradient(135deg, #f8f9fa 0%, #ffffff 100%) !important;
}

[b-dfeow5n8lv] .custom-base-grid .k-pager {
    background: transparent !important;
    border: none !important;
    padding: 16px 20px !important;
}

[b-dfeow5n8lv] .custom-base-grid .k-pager .k-pager-info {
    color: #495057 !important;
    font-size: 0.875rem !important;
    font-weight: 600 !important;
}

[b-dfeow5n8lv] .custom-base-grid .k-pager .k-button {
    border-radius: 8px !important;
    transition: all 0.15s ease !important;
    font-weight: 600 !important;
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

[b-dfeow5n8lv] .custom-base-grid .k-pager .k-button:hover,
[b-dfeow5n8lv] .custom-base-grid .k-grid-pager .k-link:hover,
[b-dfeow5n8lv] .custom-base-grid .k-grid-pager .k-pager-nav:hover,
[b-dfeow5n8lv] .custom-base-grid .k-grid-pager .k-pager-numbers .k-button:hover {
    background: var(--RgbaColor03) !important;
}

/* Detail row spacing & background */
[b-dfeow5n8lv] .custom-base-grid .k-detail-row {
    background-color: #f9fafb !important;
}

[b-dfeow5n8lv] .custom-base-grid .k-detail-cell {
    padding: 16px 24px !important;
    border-bottom: 1px solid #e5e7eb !important;
}

/* Scoped table for TenantLimitDetailsView.razor inside details */
[b-dfeow5n8lv] .custom-base-grid tbody tr.k-detail-row td.k-detail-cell table {
    border-collapse: collapse !important;
    border: none !important;
    width: 100% !important;
    background: #ffffff !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
}

[b-dfeow5n8lv] .custom-base-grid tbody tr.k-detail-row td.k-detail-cell table th {
    background: #f8f9fb !important;
    color: #344054 !important;
    font-weight: 600 !important;
    text-transform: none !important;
    font-size: 0.75rem !important;
    letter-spacing: 0.5px !important;
    padding: 10px 14px !important;
    border-bottom: 1px solid #e6e8eb !important;
    border-right: none !important;
    border-left: none !important;
}

[b-dfeow5n8lv] .custom-base-grid tbody tr.k-detail-row td.k-detail-cell table td {
    padding: 10px 14px !important;
    border-bottom: 1px solid #f1f2f4 !important;
    border-right: none !important;
    border-left: none !important;
    font-size: 0.825rem !important;
    color: #344054 !important;
}

[b-dfeow5n8lv] .custom-base-grid tbody tr.k-detail-row td.k-detail-cell table tbody tr:hover {
    background: #f9fafb !important;
}

/* Estilos para TelerikProgressBar con variables del tema */
[b-dfeow5n8lv] .custom-base-grid .k-progressbar,
[b-dfeow5n8lv] .k-progressbar {
    height: 8px !important;
    border-radius: 999px !important;
    background-color: #e5e7eb !important;
    border: none !important;
    overflow: hidden !important;
}

[b-dfeow5n8lv] .custom-base-grid .k-progressbar .k-selected,
[b-dfeow5n8lv] .k-progressbar .k-selected {
    background: var(--primary-color, #0d6efd) !important;
    border-color: var(--primary-color, #0d6efd) !important;
}

[b-dfeow5n8lv] .custom-base-grid .k-progressbar .k-progress-status,
[b-dfeow5n8lv] .custom-base-grid .k-progressbar .k-progressbar-text,
[b-dfeow5n8lv] .custom-base-grid .k-progressbar .k-label,
[b-dfeow5n8lv] .k-progressbar .k-progress-status,
[b-dfeow5n8lv] .k-progressbar .k-progressbar-text,
[b-dfeow5n8lv] .k-progressbar .k-label {
    display: none !important;
}

/* Ocultar columna y espacio reservado para scrollbar vertical */
[b-dfeow5n8lv] .custom-base-grid .k-grid-header,
[b-dfeow5n8lv] .custom-base-grid .k-grid-header-wrap,
[b-dfeow5n8lv] .custom-base-grid .k-grid-header-canvas {
    padding-right: 0px !important;
}

[b-dfeow5n8lv] .custom-base-grid .k-grid-content {
    overflow-y: visible !important;
    overflow-x: auto !important;
}

/* Badges estilizados para Recursos Críticos y Estados de Límites (con cascada profunda) */
[b-dfeow5n8lv] .badge-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    border-width: 1px;
    border-style: solid;
    line-height: 1.2;
    text-transform: none;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

[b-dfeow5n8lv] .badge-status-danger {
    background-color: #fee2e2 !important;
    color: #dc2626 !important;
    border-color: #fecaca !important;
}

[b-dfeow5n8lv] .badge-status-success {
    background-color: #dcfce7 !important;
    color: #15803d !important;
    border-color: #bbf7d0 !important;
}

[b-dfeow5n8lv] .badge-status-warning {
    background-color: #fef3c7 !important;
    color: #d97706 !important;
    border-color: #fde68a !important;
}

[b-dfeow5n8lv] .status-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    display: inline-block;
}

[b-dfeow5n8lv] .status-dot-danger {
    background-color: #dc2626;
    box-shadow: 0 0 0 2px rgba(220, 38, 38, 0.2);
    animation: pulse-dot-red-b-dfeow5n8lv 2s infinite;
}

[b-dfeow5n8lv] .status-dot-warning {
    background-color: #d97706;
}

[b-dfeow5n8lv] .status-dot-success {
    background-color: #15803d;
}

@keyframes pulse-dot-red-b-dfeow5n8lv {
    0% {
        box-shadow: 0 0 0 0 rgba(220, 38, 38, 0.4);
    }
    70% {
        box-shadow: 0 0 0 5px rgba(220, 38, 38, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(220, 38, 38, 0);
    }
}
/* /Components/SuperAdmin/Subscriptions/PurchaseAddonModal/PurchaseAddonModal.razor.rz.scp.css */
.form-select:focus[b-oh6n8xeylj] {
    border-color: #3b82f6;
    box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.2);
}
/* /Components/SuperAdmin/Subscriptions/TenantAddonsTab/TenantAddonsTab.razor.rz.scp.css */
/* Estilos Arregly para Tabla Desktop */
[b-arfr069leo] .table-arregly {
    width: 100%;
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
}

[b-arfr069leo] .table-arregly thead th {
    background-color: #f8fafc;
    color: #475569;
    font-weight: 700;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 10px 14px;
    border-bottom: 2px solid #e2e8f0;
}

[b-arfr069leo] .table-arregly tbody td {
    padding: 12px 14px;
    border-bottom: 1px solid #f1f5f9;
    color: #1e293b;
    vertical-align: middle;
    transition: background-color 0.15s ease;
}

[b-arfr069leo] .table-arregly tbody tr:hover td {
    background-color: #f8fafc;
}

[b-arfr069leo] .table-arregly tbody tr:last-child td {
    border-bottom: none;
}

/* Tarjeta Móvil */
.addon-card-mobile[b-arfr069leo] {
    border-left: 4px solid var(--primary-color, #093d93) !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.addon-card-mobile:hover[b-arfr069leo] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
}
/* /Components/SuperAdmin/Subscriptions/TenantConfigModal/TenantConfigModal.razor.rz.scp.css */
.tenant-modal-header[b-63olvjyqsy] {
    background-color: var(--bs-light, #f8f9fa);
    border-radius: 8px;
}

.tenant-avatar-circle[b-63olvjyqsy] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background-color: var(--bs-primary-bg-subtle, #e7f1ff);
    color: var(--bs-primary, #0d6efd);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* Permitir scroll horizontal en las pestañas en pantallas móviles */
[b-63olvjyqsy] .k-tabstrip-items-wrapper {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
}

[b-63olvjyqsy] .k-tabstrip-items {
    display: flex !important;
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
    width: auto !important;
}

[b-63olvjyqsy] .k-tabstrip-items .k-item {
    flex-shrink: 0 !important;
}

/* Dimensiones adaptables para el contenido de las pestañas */
.tenant-tab-content[b-63olvjyqsy] {
    min-height: 340px;
    max-height: 520px;
    overflow-y: auto;
}

@media (max-width: 576px) {
    .tenant-tab-content[b-63olvjyqsy] {
        height: auto;
        max-height: 60vh;
    }

    .tenant-modal-header[b-63olvjyqsy] {
        flex-direction: row;
        align-items: center;
        padding: 0.75rem !important;
    }

    .modal-footer-buttons[b-63olvjyqsy] {
        display: flex !important;
        flex-direction: row !important;
        gap: 0.5rem !important;
    }
    
    .modal-footer-buttons .btn-arregly[b-63olvjyqsy] {
        flex: 1 1 0px !important;
        width: 100% !important;
        min-width: unset !important;
    }
}

.plan-info-card[b-63olvjyqsy] {
    background-color: #ffffff;
    border-color: var(--bs-border-color, #e5e7eb) !important;
}

.plan-change-panel[b-63olvjyqsy] {
    background-color: var(--bs-light, #f8fafc) !important;
    border-color: var(--bs-border-color, #e2e8f0) !important;
}

.cycle-radio-card[b-63olvjyqsy] {
    background-color: #ffffff;
    border-color: var(--bs-border-color, #cbd5e1) !important;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

.cycle-radio-card:hover[b-63olvjyqsy] {
    border-color: var(--primary-color, #4f46e5) !important;
    background-color: var(--RgbaColor01, rgba(99, 102, 241, 0.05));
}

.cycle-radio-card.selected[b-63olvjyqsy] {
    border-color: var(--primary-color, #4f46e5) !important;
    background-color: var(--RgbaColor01, rgba(99, 102, 241, 0.1)) !important;
    box-shadow: 0 0 0 1px var(--primary-color, #4f46e5);
}

.pointer-events-none[b-63olvjyqsy] {
    pointer-events: none;
}

.text-xxs[b-63olvjyqsy] {
    font-size: 0.65rem;
}

.booking-url-banner[b-63olvjyqsy] {
    background-color: #f8fafc;
    border-color: #e2e8f0;
}

.booking-url-banner code[b-63olvjyqsy] {
    font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    letter-spacing: -0.01em;
}


/* /Components/SuperAdmin/Subscriptions/TenantInvoicesTab/TenantInvoicesTab.razor.rz.scp.css */
/* Estilos Arregly para Tabla Desktop */
[b-xzah9wywse] .table-arregly {
    width: 100%;
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
}

[b-xzah9wywse] .table-arregly thead th {
    background-color: #f8fafc;
    color: #475569;
    font-weight: 700;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 10px 14px;
    border-bottom: 2px solid #e2e8f0;
}

[b-xzah9wywse] .table-arregly tbody td {
    padding: 12px 14px;
    border-bottom: 1px solid #f1f5f9;
    color: #1e293b;
    vertical-align: middle;
    transition: background-color 0.15s ease;
}

[b-xzah9wywse] .table-arregly tbody tr:hover td {
    background-color: #f8fafc;
}

[b-xzah9wywse] .table-arregly tbody tr:last-child td {
    border-bottom: none;
}

/* Tarjeta Móvil */
.invoice-card-mobile[b-xzah9wywse] {
    border-left: 4px solid var(--primary-color, #093d93) !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.invoice-card-mobile:hover[b-xzah9wywse] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
}

.max-w-100[b-xzah9wywse] {
    max-width: 100%;
}

/* Botones de acción circulares */
[b-xzah9wywse] .btn-action-circle {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
    padding: 0;
}

[b-xzah9wywse] .btn-action-circle .k-svg-icon,
[b-xzah9wywse] .btn-action-circle svg {
    width: 16px;
    height: 16px;
}

[b-xzah9wywse] .btn-action-view {
    color: #2563eb;
    background-color: #eff6ff;
    border-color: #bfdbfe;
}

[b-xzah9wywse] .btn-action-view:hover {
    background-color: #dbeafe;
    color: #1d4ed8;
    transform: scale(1.05);
}

[b-xzah9wywse] .btn-action-pay {
    color: #2563eb;
    background-color: #eff6ff;
    border-color: #bfdbfe;
}

[b-xzah9wywse] .btn-action-pay:hover {
    background-color: #dbeafe;
    color: #1d4ed8;
    transform: scale(1.05);
}
/* /Components/SuperAdmin/Subscriptions/TenantPlanAddonHistoryTab/TenantPlanAddonHistoryTab.razor.rz.scp.css */
/* Estilos Scoped para Historial de Planes y Adicionales (Sin tocar app.css) */
[b-j38o3aly0g] .table-arregly {
    width: 100%;
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
}

[b-j38o3aly0g] .table-arregly thead th {
    background-color: #f8fafc;
    color: #475569;
    font-weight: 700;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 10px 14px;
    border-bottom: 2px solid #e2e8f0;
}

[b-j38o3aly0g] .table-arregly tbody td {
    padding: 12px 14px;
    border-bottom: 1px solid #f1f5f9;
    color: #1e293b;
    vertical-align: middle;
    transition: background-color 0.15s ease;
}

[b-j38o3aly0g] .table-arregly tbody tr:hover td {
    background-color: #f8fafc;
}

[b-j38o3aly0g] .table-arregly tbody tr:last-child td {
    border-bottom: none;
}

/* Tarjetas Móviles Responsive */
.history-card-mobile[b-j38o3aly0g] {
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.history-card-mobile.border-plan[b-j38o3aly0g] {
    border-left: 4px solid var(--primary-color, #4f46e5) !important;
}

.history-card-mobile.border-addon[b-j38o3aly0g] {
    border-left: 4px solid #06b6d4 !important;
}

.history-card-mobile:hover[b-j38o3aly0g] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
}

/* Filtros Pills */
.filter-pill-btn[b-j38o3aly0g] {
    border-radius: 20px;
    padding: 4px 14px;
    font-size: 0.75rem;
    font-weight: 600;
    transition: all 0.2s ease;
    border: 1px solid #e2e8f0;
    background-color: #f8fafc;
    color: #64748b;
    cursor: pointer;
}

.filter-pill-btn:hover[b-j38o3aly0g] {
    background-color: #f1f5f9;
    color: #334155;
}

.filter-pill-btn.active[b-j38o3aly0g] {
    background-color: var(--primary-color, #4f46e5);
    color: #ffffff;
    border-color: var(--primary-color, #4f46e5);
}
/* /Components/Tabs/EmployeeTab.razor.rz.scp.css */
/* Mantiene la altura del contenido de los tabs estable
   para evitar saltos visuales al cambiar entre Personal, Laboral y Roles. */
.employee-tab-content[b-enor5vw0n0] {
    min-height: 360px;
    padding-top: 16px;
}

@media (min-width: 992px) {
    .employee-tab-content[b-enor5vw0n0] {
        min-height: 320px;
    }
}
/* /Components/Theme/ThemeProvider.razor.rz.scp.css */
/* /Components/Toast/ToastContainer.razor.rz.scp.css */
.toast-container[b-obw95kfzww] {
    position: fixed !important;
    bottom: 20px !important;
    right: 20px !important;
    z-index: 2147483647 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 10px !important;
    align-items: flex-end !important;
    max-width: calc(100vw - 40px) !important;
}

.toast[b-obw95kfzww] {
    width: min(550px, calc(100vw - 40px)) !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 12px 14px !important;
    border-radius: 14px !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    gap: 10px !important;
    transition: opacity 0.3s ease !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    will-change: transform, opacity !important;
}

.toast-content[b-obw95kfzww] {
    display: flex !important;
    flex: 1 1 auto !important;
    width: 100% !important;
    min-width: 0 !important;
    align-items: flex-start !important;
    gap: 8px !important;
    overflow: hidden !important;
}

.toast-message[b-obw95kfzww] {
    display: block !important;
    flex: 1 1 auto !important;
    min-width: 0 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
    line-height: 1.4 !important;
}

.toast-lines[b-obw95kfzww] {
    list-style: none !important;
    margin: 6px 0 0 0 !important;
    padding: 0 !important;
}

.toast-lines li[b-obw95kfzww] {
    padding: 2px 0 !important;
    font-size: 0.88em !important;
    opacity: 0.95 !important;
}

.toast-lines li[b-obw95kfzww]::before {
    content: "• " !important;
    font-weight: bold !important;
}

.toast-icon[b-obw95kfzww] {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
}

.toast-icon .k-svg-icon[b-obw95kfzww] {
    width: 20px !important;
    height: 20px !important;
}

.toast-title[b-obw95kfzww] {
    font-weight: 700 !important;
    font-size: 0.95rem !important;
    line-height: 1.3 !important;
    margin-bottom: 2px !important;
}

.toast-description[b-obw95kfzww] {
    font-size: 0.875rem !important;
    line-height: 1.4 !important;
    font-weight: 500 !important;
}

/* ==========================================================================
   LAYOUT MODES: Compact (sin título) vs With-Title (con título/detalles)
   ========================================================================== */

/* Toast compacto sin título: reduce altura y alinea verticalmente al centro */
.toast.toast-compact[b-obw95kfzww] {
    padding: 7px 14px !important;
    align-items: center !important;
}

.toast.toast-compact .toast-content[b-obw95kfzww] {
    align-items: center !important;
}

.toast.toast-compact .toast-icon[b-obw95kfzww] {
    width: 30px !important;
    height: 30px !important;
    min-width: 30px !important;
    min-height: 30px !important;
}

.toast.toast-compact .toast-icon .k-svg-icon[b-obw95kfzww] {
    width: 17px !important;
    height: 17px !important;
}

.toast.toast-compact .toast-description[b-obw95kfzww] {
    margin: 0 !important;
    line-height: 1.3 !important;
}

.toast.toast-compact .toast-close[b-obw95kfzww] {
    align-self: center !important;
    margin-top: 0 !important;
}

/* Toast con título o recomendaciones */
.toast.toast-with-title[b-obw95kfzww] {
    padding: 12px 14px !important;
    align-items: flex-start !important;
}

.toast.toast-with-title .toast-content[b-obw95kfzww] {
    align-items: flex-start !important;
}

.toast.toast-with-title .toast-icon[b-obw95kfzww] {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
}

.toast.toast-with-title .toast-close[b-obw95kfzww] {
    align-self: flex-start !important;
    margin-top: 1px !important;
}

/* ==========================================================================
   TOAST TYPES (Tailwind-inspired palettes)
   ========================================================================== */

/* Toast Success (Verde - Emerald) */
.toast-success[b-obw95kfzww] {
    background-color: #f0fdf4 !important;
    border: 1px solid #bbf7d0 !important;
    color: #064e3b !important;
    box-shadow: 0 4px 14px rgba(22, 163, 74, 0.12), 0 2px 6px rgba(0, 0, 0, 0.04) !important;
}
.toast-success .toast-icon[b-obw95kfzww] {
    background-color: #dcfce7 !important;
    color: #16a34a !important;
}
.toast-success .toast-icon .k-svg-icon[b-obw95kfzww] {
    fill: #16a34a !important;
    color: #16a34a !important;
}
.toast-success .toast-title[b-obw95kfzww] {
    color: #064e3b !important;
}
.toast-success .toast-description[b-obw95kfzww] {
    color: rgba(6, 78, 59, 0.85) !important;
}
.toast-success .toast-close[b-obw95kfzww] {
    color: #22c55e !important;
}
.toast-success .toast-close:hover[b-obw95kfzww] {
    color: #15803d !important;
    background-color: #dcfce7 !important;
}

/* Toast Warning (Amber) */
.toast-warning[b-obw95kfzww] {
    background-color: #fffbeb !important;
    border: 1px solid #fde68a !important;
    color: #78350f !important;
    box-shadow: 0 4px 14px rgba(217, 119, 6, 0.12), 0 2px 6px rgba(0, 0, 0, 0.04) !important;
}
.toast-warning .toast-icon[b-obw95kfzww] {
    background-color: #fef3c7 !important;
    color: #d97706 !important;
}
.toast-warning .toast-icon .k-svg-icon[b-obw95kfzww] {
    fill: #d97706 !important;
    color: #d97706 !important;
}
.toast-warning .toast-title[b-obw95kfzww] {
    color: #78350f !important;
}
.toast-warning .toast-description[b-obw95kfzww] {
    color: rgba(146, 64, 14, 0.8) !important;
}
.toast-warning .toast-close[b-obw95kfzww] {
    color: #f59e0b !important;
}
.toast-warning .toast-close:hover[b-obw95kfzww] {
    color: #b45309 !important;
    background-color: #fef3c7 !important;
}

/* Toast Danger / Error (Rojo - Red) */
.toast-danger[b-obw95kfzww] {
    background-color: #fef2f2 !important;
    border: 1px solid #fecaca !important;
    color: #7f1d1d !important;
    box-shadow: 0 4px 14px rgba(220, 38, 38, 0.12), 0 2px 6px rgba(0, 0, 0, 0.04) !important;
}
.toast-danger .toast-icon[b-obw95kfzww] {
    background-color: #fee2e2 !important;
    color: #dc2626 !important;
}
.toast-danger .toast-icon .k-svg-icon[b-obw95kfzww] {
    fill: #dc2626 !important;
    color: #dc2626 !important;
}
.toast-danger .toast-title[b-obw95kfzww] {
    color: #7f1d1d !important;
}
.toast-danger .toast-description[b-obw95kfzww] {
    color: rgba(127, 29, 29, 0.85) !important;
}
.toast-danger .toast-close[b-obw95kfzww] {
    color: #ef4444 !important;
}
.toast-danger .toast-close:hover[b-obw95kfzww] {
    color: #b91c1c !important;
    background-color: #fee2e2 !important;
}

/* Toast Info (Azul - Sky) */
.toast-info[b-obw95kfzww] {
    background-color: #f0f9ff !important;
    border: 1px solid #bae6fd !important;
    color: #0c4a6e !important;
    box-shadow: 0 4px 14px rgba(2, 132, 199, 0.12), 0 2px 6px rgba(0, 0, 0, 0.04) !important;
}
.toast-info .toast-icon[b-obw95kfzww] {
    background-color: #e0f2fe !important;
    color: #0284c7 !important;
}
.toast-info .toast-icon .k-svg-icon[b-obw95kfzww] {
    fill: #0284c7 !important;
    color: #0284c7 !important;
}
.toast-info .toast-title[b-obw95kfzww] {
    color: #0c4a6e !important;
}
.toast-info .toast-description[b-obw95kfzww] {
    color: rgba(12, 74, 110, 0.85) !important;
}
.toast-info .toast-close[b-obw95kfzww] {
    color: #0ea5e9 !important;
}
.toast-info .toast-close:hover[b-obw95kfzww] {
    color: #0369a1 !important;
    background-color: #e0f2fe !important;
}

.toast button[b-obw95kfzww] {
    background: transparent !important;
    border: none !important;
    color: inherit !important;
    cursor: pointer !important;
    font-weight: bold !important;
}

.toast-close[b-obw95kfzww] {
    flex-shrink: 0 !important;
    align-self: flex-start !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
    padding: 0 !important;
    line-height: 1 !important;
    margin-top: 1px !important;
    background: transparent !important;
    border: none !important;
    border-radius: 50% !important;
    font-size: 13px !important;
    cursor: pointer !important;
    font-weight: bold !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
}

@keyframes slideInUp-b-obw95kfzww {
    from {
        transform: translateY(calc(100% + 24px)) !important;
        opacity: 0 !important;
    }

    to {
        transform: translateY(0) !important;
        opacity: 1 !important;
    }
}

@keyframes slideOut-b-obw95kfzww {
    from {
        transform: translateX(0);
        opacity: 1
    }

    to {
        transform: translateX(100%);
        opacity: 0;
    }
}

.toast.removing[b-obw95kfzww] {
    animation: slideOut-b-obw95kfzww 0.3s ease-in forwards, toastCollapse-b-obw95kfzww 0.3s ease-in forwards !important;
}

.toast.entering[b-obw95kfzww] {
    animation: slideInUp-b-obw95kfzww 0.3s ease-out forwards, toastExpand-b-obw95kfzww 0.3s ease-out forwards !important;
}

@keyframes toastExpand-b-obw95kfzww {
    from {
        max-height: 0;
        margin-top: 0;
        padding-top: 0;
        padding-bottom: 0;
        opacity: 0;
    }

    to {
        max-height: 120px;
        margin-top: 0;
        padding-top: 10px;
        padding-bottom: 10px;
        opacity: 1;
    }
}

@keyframes toastCollapse-b-obw95kfzww {
    from {
        max-height: 120px;
        margin-top: 0;
        padding-top: 10px;
        padding-bottom: 10px;
        opacity: 1;
    }

    to {
        max-height: 0;
        margin-top: 0;
        padding-top: 0;
        padding-bottom: 0;
        opacity: 0;
    }
}

@media (max-width: 576px) {
    .toast-container[b-obw95kfzww] {
        left: 10px !important;
        right: 10px !important;
        bottom: calc(10px + env(safe-area-inset-bottom)) !important;
        width: auto !important;
        max-width: calc(100vw - 20px) !important;
        align-items: stretch !important;
    }

    .toast[b-obw95kfzww] {
        width: 100% !important;
        max-width: 100% !important;
        align-items: flex-start !important;
        padding: 9px 12px !important;
        gap: 8px !important;
    }

    .toast-content[b-obw95kfzww] {
        gap: 6px !important;
    }

    .toast-icon .k-svg-icon[b-obw95kfzww] {
        width: 16px !important;
        height: 16px !important;
    }

    .toast-close[b-obw95kfzww] {
        width: 18px !important;
        height: 18px !important;
    }
}
    
/* /Components/TrackOrder/BtnReturnedOrder.razor.rz.scp.css */
/* ── Acciones de cabecera ── */
.page-actions[b-r20hvtwng1] {
    width: 100%;
    max-width: 1120px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0px;
    box-sizing: border-box;
}

.page-actions .back-link[b-r20hvtwng1] {
    width: auto;
    max-width: none;
    margin: 0;
}

.page-actions .btn-outline-primary-arregly.animated-btn[b-r20hvtwng1] {
    width: 130px;
    font-size: 0.85rem;
    padding: 6px 12px;
}

/* ── Volver al inicio ── */
.back-link[b-r20hvtwng1] {
    border: none;
    background: transparent;
    /*color: #6b7280;*/
    color: var(--primary-color);
    display: inline-flex;
    gap: 8px;
    align-items: center;
    cursor: pointer;
    /*font-size: 0.9rem;*/
    transition: color 0.2s ease;
    padding: 0;
}

.back-link:hover[b-r20hvtwng1] {
    color: #465395;
}

.btn-returned[b-r20hvtwng1] {
    background: transparent;
    border: none;
    color: var(--primary-color);
    font-weight: 500;
    padding: .5rem .75rem;
}

.btn-returned:hover[b-r20hvtwng1] {
    color: #465395;
}

.btn-refresh[b-r20hvtwng1] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.btn-refresh.is-loading[b-r20hvtwng1]  svg {
    animation: spin-refresh-b-r20hvtwng1 1s linear infinite;
}

@keyframes spin-refresh-b-r20hvtwng1 {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

@media (min-width: 768px) {

    /*.page-actions {
        margin-bottom: 20px;
    }*/

    .page-actions .btn-outline-primary-arregly.animated-btn[b-r20hvtwng1] {
        width: 140px;
        font-size: 0.9rem;
    }
}
/* /Components/TrackOrder/OrderStepTracker.razor.rz.scp.css */
/* ── Step Tracker (Base para Móvil: Horizontal Compacto sin etiquetas) ── */
.step-tracker[b-ear4fjmyhw] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0;
    width: 100%;
    padding: 12px 0;
    box-sizing: border-box;
}

.step-tracker__stage[b-ear4fjmyhw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.step-tracker__circle[b-ear4fjmyhw] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    transition: all 0.3s ease;
    flex-shrink: 0;
}

.step-tracker__stage.completed .step-tracker__circle[b-ear4fjmyhw] {
    background: var(--primary-color, #16a34a);
    border: 2px solid var(--primary-color, #16a34a);
}

[b-ear4fjmyhw] .step-tracker__stage.completed .step-tracker__circle .k-svg-icon {
    width: 11px !important;
    height: 11px !important;
    color: #ffffff !important;
}

.step-tracker__stage.current .step-tracker__circle[b-ear4fjmyhw] {
    background: #ffffff;
    border: 2.5px solid var(--primary-color, #16a34a);
}

.step-tracker__pulse[b-ear4fjmyhw] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--primary-color, #16a34a);
    animation: stepPulse-b-ear4fjmyhw 1.6s ease-in-out infinite;
}

@keyframes stepPulse-b-ear4fjmyhw {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.6; transform: scale(0.8); }
}

.step-tracker__stage.pending .step-tracker__circle[b-ear4fjmyhw] {
    background: #f3f4f6;
    border: 2px solid #d1d5db;
}

/* Ocultar etiquetas en móvil (Mockup responsivo) */
.step-tracker__label[b-ear4fjmyhw] {
    display: none;
}

.step-tracker__line[b-ear4fjmyhw] {
    flex: 1;
    max-width: 48px; /* Líneas conectoras más cortas en móvil */
    height: 2px;
    min-width: 10px;
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
    border-radius: 1px;
    transition: background 0.3s ease;
}

@media (max-width: 480px) {
    .step-tracker[b-ear4fjmyhw] {
        padding: 8px 0;
    }
    .step-tracker__circle[b-ear4fjmyhw] {
        width: 20px;
        height: 20px;
    }
    .step-tracker__pulse[b-ear4fjmyhw] {
        width: 6px;
        height: 6px;
    }
    .step-tracker__line[b-ear4fjmyhw] {
        max-width: 24px;
        min-width: 4px;
    }
}

.step-tracker__line.completed[b-ear4fjmyhw] {
    background: var(--primary-color, #16a34a);
}

.step-tracker__line.pending[b-ear4fjmyhw] {
    background-color: #d1d5db;
}

/* ── Tablet/Desktop (Escalado Progresivo) ── */
@media (min-width: 768px) {
    .step-tracker[b-ear4fjmyhw] {
        align-items: flex-start;
        justify-content: space-between;
        padding: 8px 0;
    }

    .step-tracker__stage[b-ear4fjmyhw] {
        justify-content: flex-start;
        gap: 8px;
        width: auto;
    }

    .step-tracker__circle[b-ear4fjmyhw] {
        width: 32px;
        height: 32px;
    }

    .step-tracker__pulse[b-ear4fjmyhw] {
        width: 10px;
        height: 10px;
    }

    /* Mostrar etiquetas en pantallas grandes */
    .step-tracker__label[b-ear4fjmyhw] {
        display: block;
        font-size: 0.7rem;
        color: #6b7280;
        text-align: center;
        max-width: 80px;
        line-height: 1.3;
        word-break: break-word;
    }

    .step-tracker__stage.completed .step-tracker__label[b-ear4fjmyhw] {
        color: var(--primary-color, #16a34a);
        font-weight: 600;
    }

    .step-tracker__stage.current .step-tracker__label[b-ear4fjmyhw] {
        color: #111827;
        font-weight: 700;
    }

    .step-tracker__line[b-ear4fjmyhw] {
        max-width: none;
        height: 2.5px;
        min-width: 20px;
        margin-top: 15px; /* Centrado vertical con el círculo de 32px */
    }
}
/* /Components/Warranties/ApproveWarrantyModal.razor.rz.scp.css */
.custom-photo-upload-dropzone-wrapper[b-vh9mdi30jp] {
    position: relative;
    border-radius: 18px;
    background: #edf4fc;
    padding: 14px;
    overflow: hidden;
}

.custom-photo-mobile-capture[b-vh9mdi30jp] {
    margin-top: 10px;
}

.custom-photo-mobile-capture-btn[b-vh9mdi30jp] {
    display: inline-flex;
    align-items: center;
}

[b-vh9mdi30jp] .custom-photo-upload,
[b-vh9mdi30jp] .custom-photo-upload.k-upload,
[b-vh9mdi30jp] .custom-photo-upload .k-upload-dropzone,
[b-vh9mdi30jp] .custom-photo-upload .k-dropzone {
    width: 100% !important;
    display: block !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

[b-vh9mdi30jp] .custom-photo-upload .k-upload-button {
    width: 100% !important;
    min-height: 120px;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

[b-vh9mdi30jp] .custom-photo-upload .k-upload-button::before,
[b-vh9mdi30jp] .custom-photo-upload .k-dropzone-hint,
[b-vh9mdi30jp] .custom-photo-upload .k-upload-status,
[b-vh9mdi30jp] .custom-photo-upload .k-button-text,
[b-vh9mdi30jp] .custom-photo-upload .k-upload-files {
    display: none !important;
}

.custom-photo-upload-overlay[b-vh9mdi30jp] {
    position: absolute;
    inset: 14px;
    border: 1.5px dashed #c1d2e6;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    pointer-events: none;
}

.custom-photo-upload-overlay-icon[b-vh9mdi30jp] {
    width: 46px;
    height: 46px;
    border-radius: 8px;
    margin-bottom: 10px;
    background: linear-gradient(145deg, #dbeafe, #93c5fd);
    -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 16 16"><path fill="black" d="M6.002 5.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z"/><path fill="black" d="M2.002 1a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2h-12zm12 1a1 1 0 0 1 1 1v6.5l-3.777-1.947a.5.5 0 0 0-.577.093l-3.71 3.71-2.66-1.772a.5.5 0 0 0-.63.062L1.002 12V3a1 1 0 0 1 1-1h12z"/></svg>') center / 24px 24px no-repeat;
    mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 16 16"><path fill="black" d="M6.002 5.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z"/><path fill="black" d="M2.002 1a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2h-12zm12 1a1 1 0 0 1 1 1v6.5l-3.777-1.947a.5.5 0 0 0-.577.093l-3.71 3.71-2.66-1.772a.5.5 0 0 0-.63.062L1.002 12V3a1 1 0 0 1 1-1h12z"/></svg>') center / 24px 24px no-repeat;
}

.custom-photo-upload-overlay-title[b-vh9mdi30jp] {
    color: #1e3a63;
    font-size: 0.98rem;
    font-weight: 600;
}

.custom-photo-upload-overlay-title span[b-vh9mdi30jp] {
    color: #1665d8;
}

.custom-photo-upload-overlay-subtitle[b-vh9mdi30jp] {
    color: #9caec4;
    font-size: 0.74rem;
    font-weight: 500;
    margin-top: 0.25rem;
}

.custom-photo-upload-filled-layout[b-vh9mdi30jp] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
    align-items: start;
}

.custom-photo-file-card[b-vh9mdi30jp] {
    border: 1px solid #d7e2f0;
    border-radius: 12px;
    background: #ffffffcc;
    padding: 10px;
    height: 120px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.custom-photo-thumbnail-btn[b-vh9mdi30jp] {
    border: none;
    background: transparent;
    padding: 0;
    border-radius: 8px;
    cursor: zoom-in;
    width: 86px;
    height: 86px;
    overflow: hidden;
    flex-shrink: 0;
}

.custom-photo-upload-preview-image[b-vh9mdi30jp] {
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: cover;
    border-radius: 8px;
}

.custom-photo-file-info[b-vh9mdi30jp] {
    min-width: 0;
    flex: 1;
}

.custom-photo-file-name[b-vh9mdi30jp] {
    font-size: 1.05rem;
    color: #28456f;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.custom-photo-file-size[b-vh9mdi30jp] {
    font-size: 0.95rem;
    color: #6b87ac;
}

.custom-photo-file-actions[b-vh9mdi30jp] {
    display: flex;
    gap: 6px;
}

.custom-photo-action-btn[b-vh9mdi30jp] {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    border: 1px solid #d7e2f0;
    background: #f8fbff;
    color: #355f93;
    align-items: center;
    justify-content: center;
    display: inline-flex;
    padding: 0;
}

.custom-photo-action-btn-danger[b-vh9mdi30jp] {
    color: #b42318;
    background: #fff5f4;
    border-color: #f3c2bd;
}

.custom-photo-change-panel[b-vh9mdi30jp] {
    position: relative;
    border: 1.5px dashed #c1d2e6;
    border-radius: 12px;
    height: 120px;
    background: #ffffff;
    padding: 8px;
}

[b-vh9mdi30jp] .custom-photo-upload-change,
[b-vh9mdi30jp] .custom-photo-upload-change.k-upload,
[b-vh9mdi30jp] .custom-photo-upload-change .k-upload-dropzone,
[b-vh9mdi30jp] .custom-photo-upload-change .k-dropzone,
[b-vh9mdi30jp] .custom-photo-upload-change .k-upload-button {
    min-height: 102px !important;
    width: 100% !important;
}

.custom-photo-change-overlay[b-vh9mdi30jp] {
    position: absolute;
    inset: 8px;
    border: 1.5px dashed #c1d2e6;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    pointer-events: none;
}

.refinance-preview-container[b-vh9mdi30jp] {
    border: 1px solid #e6eef8;
    border-radius: 12px;
    background: #f8fbff;
    padding: 12px;
}

.refinance-summary-row[b-vh9mdi30jp] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.refinance-summary-item[b-vh9mdi30jp] {
    border-radius: 10px;
    padding: 8px 10px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.refinance-summary-item--current[b-vh9mdi30jp] {
    background: #fff5f5;
    border: 1px solid #ffd7d7;
}

.refinance-summary-item--new[b-vh9mdi30jp] {
    background: #f2fff7;
    border: 1px solid #c8f0d8;
}

.refinance-summary-label[b-vh9mdi30jp] {
    font-size: 0.75rem;
    color: #5d728e;
    font-weight: 600;
}

.refinance-summary-value[b-vh9mdi30jp] {
    font-size: 0.9rem;
    color: #253f63;
    font-weight: 700;
}

.refinance-preview-table thead th[b-vh9mdi30jp] {
    font-size: 0.78rem;
    color: #516d92;
    font-weight: 700;
    border-bottom-width: 1px;
}

.refinance-preview-table td[b-vh9mdi30jp] {
    vertical-align: middle;
    font-size: 0.82rem;
    color: #334f74;
}

.refinance-old-installment[b-vh9mdi30jp] {
    color: #b42318;
    text-decoration: line-through;
    font-weight: 600;
}

.refinance-new-installment[b-vh9mdi30jp] {
    color: #067647;
    font-weight: 700;
}

@media (max-width: 768px) {
    .custom-photo-upload-filled-layout[b-vh9mdi30jp] {
        grid-template-columns: 1fr;
    }

    .refinance-summary-row[b-vh9mdi30jp] {
        grid-template-columns: 1fr;
    }

    .custom-photo-file-card[b-vh9mdi30jp],
    .custom-photo-change-panel[b-vh9mdi30jp],
    [b-vh9mdi30jp] .custom-photo-upload-change .k-upload-button {
        min-height: 110px;
    }
}

/* Ocultar barra de desplazamiento manteniendo la funcionalidad de scroll */
.hide-scrollbar[b-vh9mdi30jp] {
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE y Edge */
}

.hide-scrollbar[b-vh9mdi30jp]::-webkit-scrollbar {
    display: none; /* Chrome, Safari y Opera */
    width: 0 !important;
    height: 0 !important;
    background: transparent !important;
}

.amount-group-card[b-vh9mdi30jp] {
    border: 1px solid #bae6fd;
    background-color: #f8fafc;
    border-radius: 12px;
    padding: 1rem !important;
}

.amount-group-card > .row[b-vh9mdi30jp] {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
/* /Components/Warranties/RejectWarrantyModal.razor.rz.scp.css */
.custom-photo-upload-dropzone-wrapper[b-znfio419hu] {
    position: relative;
    border-radius: 18px;
    background: #edf4fc;
    padding: 14px;
    overflow: hidden;
}

.reject-negative-btn[b-znfio419hu],
.reject-negative-btn .k-button-text[b-znfio419hu],
.reject-negative-btn .k-svg-icon[b-znfio419hu],
.reject-negative-btn i[b-znfio419hu],
.reject-negative-btn svg[b-znfio419hu] {
    color: var(--danger-color, #dc2626) !important;
    fill: var(--danger-color, #dc2626) !important;
    border-color: var(--danger-color, #dc2626) !important;
}

.reject-negative-btn:hover[b-znfio419hu],
.reject-negative-btn:hover .k-button-text[b-znfio419hu],
.reject-negative-btn:hover .k-svg-icon[b-znfio419hu],
.reject-negative-btn:hover i[b-znfio419hu],
.reject-negative-btn:hover svg[b-znfio419hu] {
    background-color: var(--danger-color, #dc2626) !important;
    color: #fff !important;
    fill: #fff !important;
    border-color: var(--danger-color, #dc2626) !important;
}

[b-znfio419hu] .custom-photo-upload,
[b-znfio419hu] .custom-photo-upload.k-upload,
[b-znfio419hu] .custom-photo-upload .k-upload-dropzone,
[b-znfio419hu] .custom-photo-upload .k-dropzone {
    width: 100% !important;
    display: block !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

[b-znfio419hu] .custom-photo-upload .k-upload-button {
    width: 100% !important;
    min-height: 120px;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

[b-znfio419hu] .custom-photo-upload .k-upload-button::before,
[b-znfio419hu] .custom-photo-upload .k-dropzone-hint,
[b-znfio419hu] .custom-photo-upload .k-upload-status,
[b-znfio419hu] .custom-photo-upload .k-button-text,
[b-znfio419hu] .custom-photo-upload .k-upload-files {
    display: none !important;
}

.custom-photo-upload-overlay[b-znfio419hu] {
    position: absolute;
    inset: 14px;
    border: 1.5px dashed #c1d2e6;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    pointer-events: none;
}

.custom-photo-upload-overlay-title[b-znfio419hu] {
    color: #1e3a63;
    font-size: 0.98rem;
    font-weight: 600;
}

.custom-photo-upload-overlay-title span[b-znfio419hu] {
    color: #1665d8;
}

.custom-photo-upload-overlay-subtitle[b-znfio419hu] {
    color: #9caec4;
    font-size: 0.74rem;
    font-weight: 500;
    margin-top: 0.25rem;
}

.custom-photo-upload-filled-layout[b-znfio419hu] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
    align-items: start;
}

.custom-photo-file-card[b-znfio419hu] {
    border: 1px solid #d7e2f0;
    border-radius: 12px;
    background: #ffffffcc;
    padding: 10px;
    height: 120px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.custom-photo-thumbnail-btn[b-znfio419hu] {
    border: none;
    background: transparent;
    padding: 0;
    border-radius: 8px;
    cursor: zoom-in;
    width: 86px;
    height: 86px;
    overflow: hidden;
    flex-shrink: 0;
}

.custom-photo-upload-preview-image[b-znfio419hu] {
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: cover;
    border-radius: 8px;
}

.custom-photo-file-info[b-znfio419hu] {
    min-width: 0;
    flex: 1;
}

.custom-photo-file-name[b-znfio419hu] {
    font-size: 1.05rem;
    color: #28456f;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.custom-photo-file-size[b-znfio419hu] {
    font-size: 0.95rem;
    color: #6b87ac;
}

.custom-photo-file-actions[b-znfio419hu] {
    display: flex;
    gap: 6px;
}

.custom-photo-action-btn[b-znfio419hu] {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    border: 1px solid #d7e2f0;
    background: #f8fbff;
    color: #355f93;
    align-items: center;
    justify-content: center;
    display: inline-flex;
    padding: 0;
}

.custom-photo-action-btn-danger[b-znfio419hu] {
    color: #b42318;
    background: #fff5f4;
    border-color: #f3c2bd;
}

.custom-photo-change-panel[b-znfio419hu] {
    position: relative;
    border: 1.5px dashed #c1d2e6;
    border-radius: 12px;
    height: 120px;
    background: #ffffff;
    padding: 8px;
}

[b-znfio419hu] .custom-photo-upload-change,
[b-znfio419hu] .custom-photo-upload-change.k-upload,
[b-znfio419hu] .custom-photo-upload-change .k-upload-dropzone,
[b-znfio419hu] .custom-photo-upload-change .k-dropzone,
[b-znfio419hu] .custom-photo-upload-change .k-upload-button {
    min-height: 102px !important;
    width: 100% !important;
}

.custom-photo-change-overlay[b-znfio419hu] {
    position: absolute;
    inset: 8px;
    border: 1.5px dashed #c1d2e6;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    pointer-events: none;
}

.custom-photo-preview-modal-image[b-znfio419hu] {
    max-width: 100%;
    max-height: 70vh;
    object-fit: contain;
    border-radius: 8px;
}

@media (max-width: 768px) {
    .custom-photo-upload-filled-layout[b-znfio419hu] {
        grid-template-columns: 1fr;
    }

    .custom-photo-file-card[b-znfio419hu],
    .custom-photo-change-panel[b-znfio419hu],
    [b-znfio419hu] .custom-photo-upload-change .k-upload-button {
        min-height: 110px;
    }
}
/* /Components/Warranties/Tabs/WarrantyNotesTab.razor.rz.scp.css */
/* Pestaña de Notas de la Garantía */
.order-notes-filters-container[b-qoaagufxaw] {
    box-shadow: rgba(99, 99, 99, 0.1) 0px 2px 8px 0px;
    border: none !important;
    border-radius: 12px;
}

.filter-label[b-qoaagufxaw] {
    font-size: 0.85rem;
    color: #4b5563;
}

.chip-filter[b-qoaagufxaw] {
    border: 1px solid #e5e7eb;
    background-color: #f9fafb;
    color: #4b5563;
    font-size: 0.8rem;
    font-weight: 600;
    padding: 6px 14px;
    border-radius: 20px;
    transition: all 0.2s ease-in-out;
    cursor: pointer;
    outline: none;
}

.chip-filter:hover[b-qoaagufxaw] {
    background-color: #f3f4f6;
    border-color: #d1d5db;
    transform: translateY(-1px);
}

.chip-filter.chip-active[b-qoaagufxaw] {
    background-color: #0b593f;
    color: #ffffff;
    border-color: #0b593f;
    box-shadow: 0 4px 6px -1px rgba(11, 89, 63, 0.2);
}

/* Tarjetas de Nota */
.note-card[b-qoaagufxaw] {
    background-color: #ffffff;
    border-radius: 14px;
    border-top: none !important;
    border-right: none !important;
    border-bottom: none !important;
    border-left: 5px solid transparent;
    padding: 14px 16px;
    box-shadow: rgba(99, 99, 99, 0.08) 0px 2px 8px 0px;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

.note-card:hover[b-qoaagufxaw] {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.02);
    transform: translateY(-2px);
}

/* Variaciones de Tarjeta según Tipo */
.note-card-blue[b-qoaagufxaw] { border-left-color: #3b82f6; }
.note-card-purple[b-qoaagufxaw] { border-left-color: #8b5cf6; }
.note-card-green[b-qoaagufxaw] { border-left-color: #10b981; }
.note-card-red[b-qoaagufxaw] { border-left-color: #f43f5e; }
.note-card-default[b-qoaagufxaw] { border-left-color: #9ca3af; }

/* Contenedor de Iconos Circulares */
.note-icon-container[b-qoaagufxaw] {
    display: flex;
    align-items: flex-start;
}

.note-circle-icon[b-qoaagufxaw] {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    transition: transform 0.2s ease;
}

.note-card:hover .note-circle-icon[b-qoaagufxaw] {
    transform: scale(1.05);
}

.note-circle-icon-small[b-qoaagufxaw] {
    width: 38px;
    height: 38px;
    font-size: 1.05rem;
    flex-shrink: 0;
}

/* Colores de Icono por Tipo */
.circle-icon-blue[b-qoaagufxaw] { background-color: #eff6ff; color: #1d4ed8; }
.circle-icon-purple[b-qoaagufxaw] { background-color: #f5f3ff; color: #6d28d9; }
.circle-icon-green[b-qoaagufxaw] { background-color: #ecfdf5; color: #047857; }
.circle-icon-red[b-qoaagufxaw] { background-color: #fff5f5; color: #e11d48; }
.circle-icon-default[b-qoaagufxaw] { background-color: #f3f4f6; color: #4b5563; }

/* Detalles de Nota */
.note-title[b-qoaagufxaw] {
    font-size: 0.95rem;
    letter-spacing: -0.01em;
}

.note-content-text[b-qoaagufxaw] {
    font-size: 0.875rem;
    line-height: 1.5;
    word-break: break-word;
}

.note-metadata[b-qoaagufxaw] {
    font-size: 0.775rem;
    font-weight: 500;
}

.note-metadata span[b-qoaagufxaw] {
    display: inline-flex;
    align-items: center;
}

.note-card-action[b-qoaagufxaw] {
    opacity: 0.5;
    transition: opacity 0.2s ease;
}

.note-card:hover .note-card-action[b-qoaagufxaw] {
    opacity: 1;
}

/* Badges */
.badge-note[b-qoaagufxaw] {
    padding: 3px 9px;
    font-size: 0.725rem;
    font-weight: 700;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
}

.badge-visibility[b-qoaagufxaw] {
    padding: 3px 9px;
    font-size: 0.725rem;
    font-weight: 700;
    border-radius: 12px;
}

/* Colores de Badges por Tipo */
.badge-note-blue[b-qoaagufxaw] { background-color: #eff6ff; color: #1e40af; }
.badge-note-purple[b-qoaagufxaw] { background-color: #f5f3ff; color: #5b21b6; }
.badge-note-green[b-qoaagufxaw] { background-color: #ecfdf5; color: #065f46; }
.badge-note-red[b-qoaagufxaw] { background-color: #fff1f2; color: #9f1239; }
.badge-note-default[b-qoaagufxaw] { background-color: #f3f4f6; color: #374151; }

.badge-visibility-visible[b-qoaagufxaw] {
    background-color: #e6f4ea;
    color: #137333;
}

.badge-visibility-internal[b-qoaagufxaw] {
    background-color: #f3e8ff;
    color: #6b21a8;
}

/* Estado Vacío */
.empty-notes-state[b-qoaagufxaw] {
    padding: 50px;
    border-style: dashed !important;
}

/* Elementos del Modal */
.note-type-description-box[b-qoaagufxaw] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0 !important;
}

.note-visibility-toggle-panel[b-qoaagufxaw] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0 !important;
}

.note-visibility-icon-box[b-qoaagufxaw] {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #eff6ff;
    color: #2563eb;
    flex-shrink: 0;
}

/* TelerikSwitch corporativo Arregly */
[b-qoaagufxaw] .switch-arregly.k-switch {
    width: 66px !important;
    border-radius: 9999px !important;
    outline: none !important;
    box-shadow: none !important;
    flex-shrink: 0;
}

[b-qoaagufxaw] .switch-arregly .k-switch-track {
    border-radius: 9999px !important;
    transition: background-color 0.2s ease, border-color 0.2s ease !important;
}

[b-qoaagufxaw] .switch-arregly.k-switch-on .k-switch-track {
    background-color: var(--primary-color, #0b593f) !important;
    border-color: var(--primary-color, #0b593f) !important;
}

[b-qoaagufxaw] .switch-arregly.k-switch-off .k-switch-track {
    background-color: #cbd5e1 !important;
    border-color: #cbd5e1 !important;
}

[b-qoaagufxaw] .switch-arregly .k-switch-thumb {
    background-color: #ffffff !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25) !important;
    border: none !important;
}

[b-qoaagufxaw] .switch-arregly .k-switch-label-on,
[b-qoaagufxaw] .switch-arregly .k-switch-label-off {
    font-size: 0.72rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    padding: 0 6px !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

/* Botón de ver detalle de nota */
.btn-note-view-detail[b-qoaagufxaw] {
    background: transparent;
    border: none;
    cursor: pointer;
    color: #9ca3af;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px;
    border-radius: 50%;
    transition: all 0.2s ease;
    outline: none;
}

.btn-note-view-detail:hover[b-qoaagufxaw] {
    background-color: #f3f4f6;
    color: #111827;
    transform: scale(1.1);
}

/* Panel de detalle de nota */
.note-detail-title-panel[b-qoaagufxaw] {
    border-left: 5px solid transparent;
}

.detail-panel-blue[b-qoaagufxaw] { background-color: #eff6ff; border: 1px solid #bfdbfe; border-left: 5px solid #3b82f6; }
.detail-panel-purple[b-qoaagufxaw] { background-color: #f5f3ff; border: 1px solid #ddd6fe; border-left: 5px solid #8b5cf6; }
.detail-panel-green[b-qoaagufxaw] { background-color: #ecfdf5; border: 1px solid #a7f3d0; border-left: 5px solid #10b981; }
.detail-panel-red[b-qoaagufxaw] { background-color: #fff5f5; border: 1px solid #fecaca; border-left: 5px solid #f43f5e; }
.detail-panel-default[b-qoaagufxaw] { background-color: #f3f4f6; border: 1px solid #d1d5db; border-left: 5px solid #9ca3af; }

/* Responsive */
@media (max-width: 768px) {
    .order-section-card__body[b-qoaagufxaw],
    .order-aside-card__body[b-qoaagufxaw] {
        padding: 12px 14px !important;
    }

    .note-card[b-qoaagufxaw] {
        padding: 10px 12px;
        border-radius: 12px;
    }

    .note-circle-icon[b-qoaagufxaw] {
        width: 36px;
        height: 36px;
        font-size: 1rem;
    }

    .note-card-action[b-qoaagufxaw] {
        opacity: 1;
    }
}

@media (max-width: 576px) {
    .order-section-card__body[b-qoaagufxaw],
    .order-aside-card__body[b-qoaagufxaw] {
        padding: 8px !important;
    }
}

.order-section-card__body.p-0[b-qoaagufxaw] {
    padding: 0 !important;
}

/* /Components/Warranties/WarrantyDetailTab.razor.rz.scp.css */
.quote-code-highlight[b-atklma0tkl] {
    color: var(--primary-color, #667eea) !important;
    font-weight: 700;
    text-decoration: none;
}

.quote-code-highlight:hover[b-atklma0tkl] {
    text-decoration: underline;
    opacity: 0.85;
}

[b-atklma0tkl] .header-icon-dark,
[b-atklma0tkl] .header-icon-dark.k-svg-icon {
    color: #111827 !important;
    font-size: 1rem !important;
    vertical-align: middle;
}

.order-section-card[b-atklma0tkl],
.order-aside-card[b-atklma0tkl] {
    border: none;
    border-radius: 14px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    background-color: #fff;
    overflow: hidden;
}

.order-section-card__header[b-atklma0tkl],
.order-aside-card__header[b-atklma0tkl] {
    background-color: #fff;
    border-bottom: 1px solid #eef2f7;
    padding: 16px 18px;
}

.order-section-card__body[b-atklma0tkl],
.order-aside-card__body[b-atklma0tkl] {
    padding: 16px 18px;
    font-size: 14px;
    color: #4b5563;
}

.order-aside-card__body[b-atklma0tkl] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.order-aside-data-row[b-atklma0tkl] {
    font-size: 1rem;
}

.order-aside-data-label[b-atklma0tkl] {
    color: #6b7280;
    margin-right: 12px;
}

.order-aside-card .order-aside-data-value[b-atklma0tkl] {
    font-weight: 600 !important;
    color: #111827 !important;
    text-align: right !important;
    letter-spacing: -0.015em !important;
    line-height: 1.25 !important;
}

.reason-text[b-atklma0tkl] {
    line-height: 1.6;
    font-size: 14px;
}

.quantity-column[b-atklma0tkl] {
    width: 80px;
}

.value-column[b-atklma0tkl] {
    width: 140px;
}

.item-type-caption[b-atklma0tkl] {
    font-size: 11px;
}

.item-reason-text[b-atklma0tkl] {
    font-size: 13px;
}

.items-total-value[b-atklma0tkl] {
    font-size: 15px;
}

.signature-hint-text[b-atklma0tkl] {
    font-size: 12px;
}

.items-table[b-atklma0tkl] {
    border-collapse: collapse;
}

.items-table th[b-atklma0tkl] {
    background-color: #f9fafb;
    color: #374151;
    font-weight: 600;
    font-size: 13px;
    border-bottom: 1px solid #e5e7eb;
}

.items-table td[b-atklma0tkl] {
    vertical-align: middle;
    border-bottom: 1px solid #f3f4f6;
}

[b-atklma0tkl] .text-success-green,
[b-atklma0tkl] .text-success-green.k-svg-icon {
    color: #10b981 !important;
}

.signature-display-container[b-atklma0tkl] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.signature-canvas-mock[b-atklma0tkl] {
    background-color: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: 32px 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 180px;
}

.signature-img[b-atklma0tkl] {
    max-height: 100px;
    max-width: 100%;
    object-fit: contain;
    background-color: transparent;
}

.signature-font[b-atklma0tkl] {
    font-family: 'Great Vibes', 'Playball', 'Georgia', 'Times New Roman', serif;
    font-style: italic;
    font-size: 40px;
    color: #111827;
    text-align: center;
    user-select: none;
}

.signature-line[b-atklma0tkl] {
    border-top: 1px dashed #d1d5db;
    width: 100%;
    max-width: 320px;
    margin: 16px 0;
}

.signature-metadata[b-atklma0tkl] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.signature-signer-name[b-atklma0tkl] {
    font-size: 15px;
    font-weight: 700;
    color: #111827;
}

.signature-details[b-atklma0tkl] {
    font-size: 12px;
    color: #6b7280;
}

.client-notes-box[b-atklma0tkl] {
    background-color: #f3f4f6;
    border-radius: 8px;
    padding: 12px 16px;
    border-left: 4px solid #d1d5db;
}

.client-notes-label[b-atklma0tkl] {
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #6b7280;
    display: block;
}

.client-notes-text[b-atklma0tkl] {
    font-size: 14px;
    color: #1f2937;
    margin: 4px 0 0 0;
}

.covered-item-mobile-card[b-atklma0tkl] {
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    box-sizing: border-box;
}

.reason-text[b-atklma0tkl],
.item-reason-text[b-atklma0tkl],
.order-aside-data-value[b-atklma0tkl] {
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
}

/* Override global app.css padding for p-0 card bodies */
.order-section-card__body.p-0[b-atklma0tkl] {
    padding: 0 !important;
}

/* Mobile covered items container: single integrated list inside the card */
.covered-items-mobile-container[b-atklma0tkl] {
    padding: 0 !important;
    display: flex;
    flex-direction: column;
    gap: 0;
    background-color: transparent;
}

.covered-item-row[b-atklma0tkl] {
    padding: 14px 16px;
    border-bottom: 1px solid #f1f5f9;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

.covered-item-mobile-total[b-atklma0tkl] {
    background-color: #f8fafc;
    padding: 12px 16px;
    border-top: 1px solid #e2e8f0;
    border-radius: 0 0 14px 14px;
}

@media (max-width: 576px) {
    .covered-item-row[b-atklma0tkl] {
        padding: 12px 14px;
    }

    .covered-item-mobile-total[b-atklma0tkl] {
        padding: 12px 14px;
    }
}

/* /Components/Warranties/WarrantyHistoryTab.razor.rz.scp.css */
/* History tab (Timeline Card) */
.history-outer-card[b-jw8rfyaul2] {
    background-color: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05);
    overflow: hidden;
    min-width: 0;
}

.history-card-header[b-jw8rfyaul2] {
    margin-bottom: 16px;
    border-bottom: 1px solid #f3f4f6;
    padding-bottom: 16px;
}

.history-card-title[b-jw8rfyaul2] {
    font-size: 16px;
    font-weight: 700;
    color: #111827 !important;
    margin: 0;
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Vertical Timeline */
.new-timeline-container[b-jw8rfyaul2] {
    position: relative;
    padding-left: 56px;
    display: flex;
    flex-direction: column;
    gap: 32px;
    min-width: 0;
    width: 100%;
}

.new-timeline-line[b-jw8rfyaul2] {
    position: absolute;
    left: 20px;
    top: 20px;
    bottom: 20px;
    width: 2px;
    background-color: #e5e7eb;
    z-index: 1;
}

.new-timeline-item[b-jw8rfyaul2] {
    position: relative;
    min-width: 0;
}

.new-timeline-icon-badge[b-jw8rfyaul2] {
    position: absolute;
    left: -56px;
    top: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
    border: 2px solid #ffffff;
}

.new-timeline-icon-badge[b-jw8rfyaul2]  .k-svg-icon {
    color: inherit !important;
}

.new-timeline-icon-badge--requested[b-jw8rfyaul2] { background-color: #dbeafe; color: #1e40af; }
.new-timeline-icon-badge--approved[b-jw8rfyaul2] { background-color: #ecfeff; color: #0891b2; }
.new-timeline-icon-badge--inprogress[b-jw8rfyaul2] { background-color: #fef3c7; color: #b45309; }
.new-timeline-icon-badge--waitingcustomersignature[b-jw8rfyaul2],
.new-timeline-icon-badge--deliveredtocustomer[b-jw8rfyaul2] { background-color: #ffedd5; color: #c2410c; }
.new-timeline-icon-badge--closed[b-jw8rfyaul2] { background-color: #dcfce7; color: #15803d; }
.new-timeline-icon-badge--rejected[b-jw8rfyaul2] { background-color: #fee2e2; color: #b91c1c; }
.new-timeline-icon-badge--invoiced[b-jw8rfyaul2] { background-color: #ede9fe; color: #6d28d9; }

.new-timeline-content[b-jw8rfyaul2] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
    width: 100%;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.new-timeline-meta-row[b-jw8rfyaul2] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.new-timeline-status-badge[b-jw8rfyaul2] {
    font-size: 12px;
    font-weight: 600;
    padding: 2px 10px;
    border-radius: 9999px;
}

.new-timeline-status-badge--requested[b-jw8rfyaul2] { background-color: #dbeafe; color: #1e40af; }
.new-timeline-status-badge--approved[b-jw8rfyaul2] { background-color: #ecfeff; color: #0891b2; }
.new-timeline-status-badge--inprogress[b-jw8rfyaul2] { background-color: #fef3c7; color: #b45309; }
.new-timeline-status-badge--waitingcustomersignature[b-jw8rfyaul2],
.new-timeline-status-badge--deliveredtocustomer[b-jw8rfyaul2] { background-color: #ffedd5; color: #c2410c; }
.new-timeline-status-badge--closed[b-jw8rfyaul2] { background-color: #dcfce7; color: #15803d; }
.new-timeline-status-badge--rejected[b-jw8rfyaul2] { background-color: #fee2e2; color: #b91c1c; }
.new-timeline-status-badge--invoiced[b-jw8rfyaul2] { background-color: #ede9fe; color: #6d28d9; }

.new-timeline-date[b-jw8rfyaul2] {
    font-size: 13px;
    color: #6b7280;
}

.new-timeline-text[b-jw8rfyaul2] {
    font-size: 14px;
    color: #111827;
    margin: 0;
    line-height: 1.5;
    word-break: break-word;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

.new-timeline-user[b-jw8rfyaul2] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: #4b5563;
    margin-top: 4px;
}

.new-timeline-user[b-jw8rfyaul2]  .k-svg-icon {
    color: #9ca3af !important;
}
/* /Helpers/Notifications/NotificationCountBadge.razor.rz.scp.css */
.notification-count-badge[b-02imzx0oqp] {
    position: absolute;
    top: -2px;
    right: -2px;
    min-width: 18px;
    height: 18px;
    border-radius: 999px;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 5px;
}
/* /Layout/LandingLayout.razor.rz.scp.css */
.landing-layout-wrapper[b-9a4km60089] {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    width: 100%;
    margin: 0;
    padding: 0;
    background-color: transparent;
}

.landing-layout-content[b-9a4km60089] {
    flex: 1 0 auto;
    width: 100%;
    margin: 0;
    padding: 0;
}
/* /Layout/MainLayout.razor.rz.scp.css */
.global-loader[b-pfucypd37e] {
    position: fixed;
    inset: 0;
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(8px);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    transition: all 0.3s ease;
}

.header-btn-wrapper[b-pfucypd37e] {
    position: relative;
    overflow: visible;
}

.submenu-toggle[b-pfucypd37e] {
    cursor: pointer;
}

[b-pfucypd37e] .app-header,
[b-pfucypd37e] .k-appbar {
    overflow: visible !important;
    z-index: 3 !important;
    position: relative;
    flex-wrap: nowrap !important;
}

[b-pfucypd37e] .k-appbar-section {
    display: flex;
    align-items: center;
    min-width: 0;
    flex-shrink: 0;
}

.header-actions[b-pfucypd37e] {
    position: relative;
    overflow: visible;
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

.tenant-plan-btn[b-pfucypd37e] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-left: 6px;
    cursor: pointer;
    text-decoration: none !important;
}

.tenant-plan-divider[b-pfucypd37e] {
    color: rgba(255, 255, 255, 0.4);
    font-size: 0.9rem;
    font-weight: 300;
    user-select: none;
}

.tenant-plan-badge[b-pfucypd37e] {
    font-size: 0.82rem;
    font-weight: 500;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.28);
    padding: 4px 12px;
    border-radius: 20px;
    line-height: 1.2;
    letter-spacing: 0.2px;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    display: inline-block;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.tenant-plan-btn:hover .tenant-plan-badge[b-pfucypd37e] {
    background: #ffffff;
    color: #059669;
    border-color: #ffffff;
    transform: translateY(-1px) scale(1.03);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18);
}

@media (max-width: 400px) {
    [b-pfucypd37e] .tenant-plan-btn,
    .tenant-plan-btn[b-pfucypd37e],
    [b-pfucypd37e] .tenant-plan-text,
    .tenant-plan-text[b-pfucypd37e] {
        display: none !important;
    }
    .header-actions[b-pfucypd37e] {
        gap: 6px;
    }
}


.notification-count-badge[b-pfucypd37e] {
    position: absolute;
    top: -2px;
    right: -2px;
    min-width: 18px;
    height: 18px;
    border-radius: 999px;
    background: #ef4444;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 5px;
}

.notifications-dropdown-menu[b-pfucypd37e] {
    position: absolute;
    right: 0;
    top: calc(100% + 8px);
    width: 380px;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.18);
    z-index: 2000;
    overflow: hidden;
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.notifications-dropdown-menu.closing[b-pfucypd37e] {
    opacity: 0;
    transform: translateY(-10px);
    pointer-events: none;
}

.notifications-dropdown-header[b-pfucypd37e] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 12px 14px 8px;
}

.notifications-dropdown-title[b-pfucypd37e] {
    font-size: 22px;
    font-weight: 700;
    color: #111827;
}

.notifications-dropdown-count[b-pfucypd37e] {
    font-size: 12px;
    font-weight: 700;
    color: #ef4444;
    background: #fee2e2;
    border-radius: 999px;
    padding: 2px 8px;
}

.notifications-mark-all[b-pfucypd37e],
.notifications-view-all[b-pfucypd37e] {
    width: 100%;
    border: 0;
    background: transparent;
    padding: 10px 14px;
    text-align: left;
    font-weight: 600;
    color: #059669;
}

.notifications-mark-all:hover[b-pfucypd37e],
.notifications-view-all:hover[b-pfucypd37e] {
    background: #f8fafc;
}

.notifications-dropdown-list[b-pfucypd37e] {
    max-height: 320px;
    overflow-y: auto;
    border-top: 1px solid #e5e7eb;
    border-bottom: 1px solid #e5e7eb;
}

.notifications-dropdown-item[b-pfucypd37e] {
    padding: 12px 14px;
    border-bottom: 1px solid #eef2f7;
    cursor: pointer;
    background: #f4fbf7;
}

.notifications-read-item[b-pfucypd37e] {
    background: #f8fafc;
}

.notifications-section-title[b-pfucypd37e] {
    padding: 8px 14px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: #6b7280;
    background: #f9fafb;
    border-bottom: 1px solid #eef2f7;
}

.notifications-dropdown-item:hover[b-pfucypd37e] {
    background: #ecfdf5;
}

.notifications-item-title-row[b-pfucypd37e] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.notifications-item-title[b-pfucypd37e] {
    font-weight: 700;
    font-size: 13px;
    color: #111827;
}

.notifications-unread-dot[b-pfucypd37e] {
    color: #059669;
    font-size: 11px;
}

.notifications-item-subtitle[b-pfucypd37e] {
    font-size: 13px;
    color: #4b5563;
    margin-top: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.notifications-item-time[b-pfucypd37e] {
    font-size: 11px;
    color: #6b7280;
    margin-top: 4px;
}

.notifications-empty-state[b-pfucypd37e] {
    padding: 14px;
    color: #6b7280;
    font-size: 13px;
}

.sidebar-mobile-backdrop[b-pfucypd37e] {
    display: block;
    position: fixed;
    inset: 64px 0 0 0;
    background: rgba(0, 0, 0, 0.35);
    z-index: 5;
}

@media (max-width: 768px) {

    [b-pfucypd37e] .dashboard-container {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 auto !important;
        padding: 0 !important;
    }

    .custom-sidebar[b-pfucypd37e],
    .custom-sidebar .sidebar-content[b-pfucypd37e] {
        scrollbar-width: none;
        -ms-overflow-style: none;
    }

    .custom-sidebar[b-pfucypd37e]::-webkit-scrollbar,
    .custom-sidebar .sidebar-content[b-pfucypd37e]::-webkit-scrollbar {
        width: 0;
        height: 0;
        display: none;
    }
}

@media (max-width: 480px) {
    .sidebar-mobile-backdrop[b-pfucypd37e] {
        inset: 56px 0 0 0;
    }
}

.top-loader[b-pfucypd37e] {
    position: fixed;
    top: 0;
    left: 0;
    height: 3px;
    width: 100%;
    z-index: 9999;
    overflow: hidden;
    background: transparent;
}

.top-loader[b-pfucypd37e]::before {
    content: '';
    position: absolute;
    height: 100%;
    width: 40%;
    background: linear-gradient(90deg, #ff0000, #ff4d4d);
    animation: loading-bar-b-pfucypd37e 1.2s infinite ease-in-out;
}

@keyframes loading-bar-b-pfucypd37e {
    0% {
        left: 0%;
    }

    50% {
        left: 60%;
    }

    100% {
        left: 100%;
    }
}
/* /Layout/NavMenu.razor.rz.scp.css */
.submenu-toggle[b-dcae46jjo4] {
    cursor: pointer;
    user-select: none;
}

/* ==========================================================================
   1. Línea de tiempo / Guía jerárquica vertical en submenús
   ========================================================================== */
.submenu-inner[b-dcae46jjo4] {
    position: relative !important;
}

.submenu.submenu-open .submenu-inner[b-dcae46jjo4] {
    overflow: visible !important;
}

.submenu-inner[b-dcae46jjo4]::before {
    content: '' !important;
    position: absolute !important;
    left: 16px !important;
    top: 4px !important;
    bottom: 8px !important;
    width: 1.5px !important;
    background: #cbd5e1 !important;
    border-radius: 1px !important;
    z-index: 1 !important;
}

/* ==========================================================================
   2. Hover con escala, fondo y resaltado para los submenús
   ========================================================================== */
.submenu-item[b-dcae46jjo4] {
    position: relative !important;
    z-index: 2 !important;
    margin: 2px 4px 2px 24px !important;
}

[b-dcae46jjo4] .submenu-link {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 7px 10px !important;
    border-radius: 8px !important;
    color: #4b5563 !important;
    text-decoration: none !important;
    font-weight: 400 !important;
    font-size: 0.87rem !important;
    transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1),
                background-color 0.2s ease,
                color 0.2s ease,
                box-shadow 0.2s ease !important;
    transform-origin: left center !important;
    position: relative !important;
    width: 100% !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
    overflow: hidden !important;
}

[b-dcae46jjo4] .submenu-text {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    font-size: 0.87rem !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.nav-text[b-dcae46jjo4] {
    min-width: 0 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

[b-dcae46jjo4] .submenu-link:hover {
    background-color: #f1f5f9 !important;
    color: #1e293b !important;
    transform: scale(1.02) translateX(2px) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
    text-decoration: none !important;
    border-radius: 8px !important;
}

[b-dcae46jjo4] .submenu-link:hover .submenu-icon {
    transform: scale(1.1) !important;
    color: #1e293b !important;
}

[b-dcae46jjo4] .submenu-link:hover .submenu-text {
    font-weight: 500 !important;
    color: #1e293b !important;
}

[b-dcae46jjo4] .submenu-link.active {
    background: var(--primary-gradient) !important;
    color: var(--primary-text-color) !important;
    font-weight: 600 !important;
    box-shadow: 0 3px 10px rgba(102, 126, 234, 0.28) !important;
    transform: none !important;
}

[b-dcae46jjo4] .submenu-link.active .submenu-icon,
[b-dcae46jjo4] .submenu-link.active .submenu-text {
    color: var(--primary-text-color) !important;
}

[b-dcae46jjo4] .submenu-icon {
    width: 16px !important;
    height: 16px !important;
    flex-shrink: 0 !important;
    transition: transform 0.2s ease, color 0.2s ease !important;
}

/* ==========================================================================
   3. Menú padre en negrilla al pasar el cursor o cuando un submenú está activo
   ========================================================================== */
.nav-item.has-submenu:hover > .submenu-toggle .nav-text[b-dcae46jjo4],
.nav-item.has-submenu .submenu-toggle:hover .nav-text[b-dcae46jjo4] {
    font-weight: 700 !important;
    color: #0f172a !important;
}

.nav-item.has-submenu:hover > .submenu-toggle[b-dcae46jjo4]  .nav-icon,
.nav-item.has-submenu .submenu-toggle:hover[b-dcae46jjo4]  .nav-icon {
    color: #0f172a !important;
}

.nav-item.has-submenu.has-active-child > .submenu-toggle[b-dcae46jjo4] {
    background: color-mix(in srgb, var(--primary-color, #034C48) 8%, transparent) !important;
    border-left: 3.5px solid var(--primary-color, #034C48) !important;
    border-radius: 4px 8px 8px 4px !important;
}

.nav-item.has-submenu.has-active-child > .submenu-toggle .nav-text[b-dcae46jjo4] {
    font-weight: 700 !important;
    color: var(--primary-color, #034C48) !important;
}

.nav-item.has-submenu.has-active-child > .submenu-toggle[b-dcae46jjo4]  .nav-icon {
    color: var(--primary-color, #034C48) !important;
}

.nav-item.has-submenu.has-active-child > .submenu-toggle[b-dcae46jjo4]  .nav-arrow {
    color: var(--primary-color, #034C48) !important;
}

.nav-item.has-submenu.submenu-open > .submenu-toggle .nav-text[b-dcae46jjo4] {
    font-weight: 600 !important;
}

/* ==========================================================================
   4. Responsividad (Mobile y pantallas reducidas)
   ========================================================================== */
@media (max-width: 768px) {
    .submenu-inner[b-dcae46jjo4]::before {
        left: 25px !important;
        top: 4px !important;
        bottom: 8px !important;
    }

    .submenu-item[b-dcae46jjo4] {
        margin: 2px 6px 2px 36px !important;
    }

    [b-dcae46jjo4] .submenu-link {
        padding: 8px 10px !important;
        border-radius: 8px !important;
    }

    [b-dcae46jjo4] .submenu-link:hover {
        transform: scale(1.015) translateX(1px) !important;
        border-radius: 8px !important;
    }
}

/* ==========================================================================
   5. Sidebar Skeleton Loading & Shimmer
   ========================================================================== */
.sidebar-skeleton[b-dcae46jjo4] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px 10px;
    width: 100%;
    box-sizing: border-box;
}

.sidebar-skeleton-row[b-dcae46jjo4] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px 10px;
    border-radius: 8px;
    min-height: 40px;
    box-sizing: border-box;
}

.sidebar-skeleton--collapsed .sidebar-skeleton-row[b-dcae46jjo4] {
    justify-content: center;
    padding: 8px 0;
}

.sidebar-skeleton-icon[b-dcae46jjo4] {
    width: 24px;
    height: 24px;
    border-radius: 6px;
    flex-shrink: 0;
    background: linear-gradient(90deg, #e2e8f0 0%, #cbd5e1 50%, #e2e8f0 100%);
    background-size: 200% 100%;
    animation: sidebar-shimmer-b-dcae46jjo4 1.6s infinite ease-in-out;
}

.sidebar-skeleton-text[b-dcae46jjo4] {
    height: 12px;
    border-radius: 6px;
    background: linear-gradient(90deg, #f1f5f9 0%, #e2e8f0 50%, #f1f5f9 100%);
    background-size: 200% 100%;
    animation: sidebar-shimmer-b-dcae46jjo4 1.6s infinite ease-in-out;
}

.sidebar-skeleton-arrow[b-dcae46jjo4] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    margin-left: auto;
    background: #cbd5e1;
    opacity: 0.6;
    flex-shrink: 0;
}

@keyframes sidebar-shimmer-b-dcae46jjo4 {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

.sidebar-error-placeholder[b-dcae46jjo4],
.sidebar-empty-placeholder[b-dcae46jjo4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    text-align: center;
    color: #64748b;
    font-size: 0.85rem;
}

.sidebar-error-text[b-dcae46jjo4] {
    font-size: 0.82rem;
    line-height: 1.4;
    max-width: 180px;
}
/* /Pages/AboutUs/AboutUs.razor.rz.scp.css */
/* ==========================================================================
   Aurocore - "Sobre Nosotros" Next-Gen Liquid Glass & Calm UX (Corporate AuroTech)
   Apple-grade Glassmorphism, 120 FPS GPU Compositing, Human-Centered SaaS
   ========================================================================== */

/* --------------------------------------------------------------------------
   0. DESIGN TOKENS & LIQUID GLASS ENGINE
   -------------------------------------------------------------------------- */
:root[b-cg8yvg6bex] {
    --glass-bg-primary: rgba(255, 255, 255, 0.72);
    --glass-bg-hover: rgba(255, 255, 255, 0.88);
    --glass-border-light: rgba(255, 255, 255, 0.65);
    --glass-specular: inset 0 1px 1.5px 0 rgba(255, 255, 255, 0.85), inset 0 -1px 2px 0 rgba(0, 0, 0, 0.03);
    --glass-shadow-soft: 0 20px 45px -12px rgba(9, 61, 147, 0.08);
    --glass-shadow-hover: 0 25px 50px -10px rgba(9, 61, 147, 0.14);
    
    --brand-blue: #093d93;
    --brand-blue-glow: rgba(9, 61, 147, 0.25);
    --brand-orange: #ed7024;
    --brand-orange-light: #fd8c1d;
    --brand-orange-glow: rgba(237, 112, 36, 0.35);

    --slate-900: #09224f;
    --slate-800: #13376b;
    --slate-600: #2c4d75;
    --slate-500: #476487;
    --slate-200: #e2e8f0;
    --slate-100: #f1f5f9;
    --slate-50: #f8fafc;

    --ease-out-spring: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);
}

.about-us-page[b-cg8yvg6bex] {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: #f8fafc;
    color: #09224f;
    font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    margin: 0;
    padding: 0;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow: visible;
}

.about-main[b-cg8yvg6bex] {
    flex: 1 0 auto;
    width: 100%;
    margin: 0;
    padding: 0;
}

.about-container[b-cg8yvg6bex] {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 clamp(1rem, 3vw, 2rem);
}

/* ==========================================================================
   1. HERO SECTION: Liquid Aurora Mesh & Hero Showcase
   ========================================================================== */
.about-hero[b-cg8yvg6bex] {
    position: relative;
    padding: clamp(6.5rem, 12vw, 8.5rem) 0 clamp(3.5rem, 6vw, 5rem);
    background-color: #f8fafc;
    overflow: hidden;
}

/* Malla de Luz Ambiental Orgánica (Aurora Orbs) */
.hero-ambient-mesh[b-cg8yvg6bex] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

.mesh-orb[b-cg8yvg6bex] {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.65;
    will-change: transform;
}

.orb-blue[b-cg8yvg6bex] {
    top: -10%;
    left: 15%;
    width: clamp(350px, 45vw, 650px);
    height: clamp(350px, 45vw, 650px);
    background: radial-gradient(circle, rgba(9, 61, 147, 0.14) 0%, rgba(9, 61, 147, 0.02) 65%, transparent 80%);
    animation: floatOrbBlue-b-cg8yvg6bex 18s cubic-bezier(0.4, 0, 0.2, 1) infinite alternate;
}

.orb-orange[b-cg8yvg6bex] {
    top: 25%;
    right: 5%;
    width: clamp(300px, 40vw, 550px);
    height: clamp(300px, 40vw, 550px);
    background: radial-gradient(circle, rgba(237, 112, 36, 0.10) 0%, rgba(253, 140, 29, 0.02) 65%, transparent 80%);
    animation: floatOrbOrange-b-cg8yvg6bex 22s cubic-bezier(0.4, 0, 0.2, 1) infinite alternate;
}

.orb-azure[b-cg8yvg6bex] {
    bottom: -10%;
    left: 35%;
    width: clamp(300px, 35vw, 500px);
    height: clamp(300px, 35vw, 500px);
    background: radial-gradient(circle, rgba(56, 189, 248, 0.08) 0%, transparent 70%);
    animation: floatOrbAzure-b-cg8yvg6bex 20s cubic-bezier(0.4, 0, 0.2, 1) infinite alternate;
}

@keyframes floatOrbBlue-b-cg8yvg6bex {
    0% { transform: translate3d(0, 0, 0) scale(1); }
    50% { transform: translate3d(60px, 40px, 0) scale(1.08); }
    100% { transform: translate3d(-30px, -20px, 0) scale(0.95); }
}

@keyframes floatOrbOrange-b-cg8yvg6bex {
    0% { transform: translate3d(0, 0, 0) scale(1); }
    50% { transform: translate3d(-50px, -40px, 0) scale(1.12); }
    100% { transform: translate3d(40px, 30px, 0) scale(0.92); }
}

@keyframes floatOrbAzure-b-cg8yvg6bex {
    0% { transform: translate3d(0, 0, 0) scale(1); }
    50% { transform: translate3d(30px, -30px, 0) scale(1.05); }
    100% { transform: translate3d(-40px, 20px, 0) scale(0.98); }
}

/* Patrón Blueprint Suave */
.hero-grid-pattern[b-cg8yvg6bex] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: radial-gradient(#94a3b8 1.1px, transparent 1.1px);
    background-size: 32px 32px;
    opacity: 0.28;
    mask-image: radial-gradient(ellipse at 50% 35%, black 40%, transparent 80%);
    -webkit-mask-image: radial-gradient(ellipse at 50% 35%, black 40%, transparent 80%);
    pointer-events: none;
    z-index: 0;
}

/* Cabecera del Hero */
.hero-header[b-cg8yvg6bex] {
    position: relative;
    z-index: 1;
    max-width: 980px;
    margin: 0 auto clamp(2.5rem, 5vw, 3.5rem);
}

.hero-badge[b-cg8yvg6bex] {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.45rem 1.25rem;
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    border: 1px solid rgba(9, 61, 147, 0.18);
    border-radius: 9999px;
    font-size: 0.825rem;
    font-weight: 600;
    color: #093d93;
    margin-bottom: 1.5rem;
    box-shadow: 0 4px 20px rgba(9, 61, 147, 0.06), inset 0 1px 1px rgba(255, 255, 255, 0.8);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.hero-badge:hover[b-cg8yvg6bex] {
    transform: translateY(-2px);
}

.badge-dot-orange[b-cg8yvg6bex] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #ed7024;
    box-shadow: 0 0 10px #ed7024;
    animation: statusPulseOrange-b-cg8yvg6bex 2.5s infinite;
}

@keyframes statusPulseOrange-b-cg8yvg6bex {
    0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(237, 112, 36, 0.7); }
    70% { transform: scale(1); box-shadow: 0 0 0 7px rgba(237, 112, 36, 0); }
    100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(237, 112, 36, 0); }
}

.badge-separator[b-cg8yvg6bex] {
    color: #cbd5e1;
    font-weight: 300;
}

.badge-subtext[b-cg8yvg6bex] {
    color: #ed7024;
    font-weight: 700;
}

.hero-title[b-cg8yvg6bex] {
    font-size: clamp(2rem, 4.5vw, 3.4rem);
    font-weight: 800;
    line-height: 1.18;
    color: #0f172a;
    letter-spacing: -0.03em;
    margin-bottom: 1.25rem;
    font-family: 'Poppins', sans-serif !important;
}

.highlight-orange[b-cg8yvg6bex] {
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.hero-lead[b-cg8yvg6bex] {
    font-size: clamp(1rem, 2vw, 1.2rem);
    font-weight: 500;
    line-height: 1.7;
    color: #475569;
    max-width: 820px;
    margin: 0 auto 2rem;
    font-family: 'Inter', sans-serif;
}

.hero-actions-row[b-cg8yvg6bex] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem;
    margin-top: 1.5rem;
}

/* --------------------------------------------------------------------------
   ELEMENTO VISUAL HERO: Showcase Card con Imagen & Floating Badges
   -------------------------------------------------------------------------- */
.hero-visual-card[b-cg8yvg6bex] {
    position: relative;
    z-index: 1;
    border-radius: clamp(1.5rem, 3vw, 2.25rem);
    padding: clamp(0.5rem, 1.5vw, 1rem);
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.85) 0%, rgba(248, 250, 252, 0.95) 100%);
    backdrop-filter: blur(28px) saturate(190%);
    -webkit-backdrop-filter: blur(28px) saturate(190%);
    border: 1px solid rgba(255, 255, 255, 0.95);
    box-shadow: 0 30px 70px -15px rgba(9, 61, 147, 0.12), inset 0 1.5px 2px rgba(255, 255, 255, 1);
}

.hero-image-container[b-cg8yvg6bex] {
    position: relative;
    border-radius: clamp(1.25rem, 2.5vw, 1.85rem);
    overflow: hidden;
    max-height: 580px;
    box-shadow: 0 10px 30px rgba(9, 61, 147, 0.08);
}

.hero-img-showcase[b-cg8yvg6bex] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform: scale(1.01);
    transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.hero-visual-card:hover .hero-img-showcase[b-cg8yvg6bex] {
    transform: scale(1.03);
}

.hero-img-gradient-overlay[b-cg8yvg6bex] {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(9, 34, 79, 0.15) 0%, rgba(9, 34, 79, 0.05) 50%, rgba(9, 34, 79, 0.45) 100%);
    pointer-events: none;
}

/* Floating Glass Badges on Hero Image */
.floating-glass-pill[b-cg8yvg6bex] {
    position: absolute;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.65rem 1.15rem;
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.95);
    border-radius: 1.15rem;
    box-shadow: 0 12px 30px rgba(9, 61, 147, 0.16), inset 0 1px 1px #ffffff;
    z-index: 3;
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.floating-glass-pill:hover[b-cg8yvg6bex] {
    transform: translateY(-4px) scale(1.02);
    box-shadow: 0 18px 40px rgba(9, 61, 147, 0.22);
}

.pill-top-left[b-cg8yvg6bex] {
    top: clamp(1rem, 3vw, 2rem);
    left: clamp(1rem, 3vw, 2rem);
}

.pill-bottom-right[b-cg8yvg6bex] {
    bottom: clamp(1rem, 3vw, 2rem);
    right: clamp(1rem, 3vw, 2rem);
}

.pill-bottom-left[b-cg8yvg6bex] {
    bottom: clamp(1rem, 3vw, 2rem);
    left: clamp(1rem, 3vw, 2rem);
    display: none;
}

@media (min-width: 992px) {
    .pill-bottom-left[b-cg8yvg6bex] {
        display: flex;
    }
}

.pill-icon-circle[b-cg8yvg6bex] {
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 0.65rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.bg-blue-subtle[b-cg8yvg6bex] {
    background: rgba(9, 61, 147, 0.1);
    color: #093d93;
    border: 1px solid rgba(9, 61, 147, 0.15);
}

.bg-orange-subtle[b-cg8yvg6bex] {
    background: rgba(237, 112, 36, 0.12);
    color: #ed7024;
    border: 1px solid rgba(237, 112, 36, 0.2);
}

.bg-emerald-subtle[b-cg8yvg6bex] {
    background: rgba(5, 150, 105, 0.12);
    color: #059669;
    border: 1px solid rgba(5, 150, 105, 0.2);
}

.pill-text-block[b-cg8yvg6bex] {
    display: flex;
    flex-direction: column;
}

.pill-title[b-cg8yvg6bex] {
    font-size: 0.825rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
}

.pill-caption[b-cg8yvg6bex] {
    font-size: 0.7rem;
    color: #64748b;
    font-family: 'Inter', sans-serif;
}

/* ==========================================================================
   2. SECCIÓN HISTORIA DE ORIGEN
   ========================================================================== */
.about-section[b-cg8yvg6bex] {
    position: relative;
    padding: clamp(4rem, 8vw, 6rem) 0;
}

.section-header[b-cg8yvg6bex] {
    max-width: 860px;
    margin: 0 auto clamp(2.5rem, 5vw, 3.5rem);
}

.section-kicker[b-cg8yvg6bex] {
    display: inline-block;
    font-size: 0.775rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #ed7024;
    margin-bottom: 0.6rem;
    font-family: 'Poppins', sans-serif;
}

.section-title[b-cg8yvg6bex] {
    font-size: clamp(1.85rem, 3.5vw, 2.65rem);
    font-weight: 800;
    line-height: 1.22;
    color: #09224f !important;
    letter-spacing: -0.02em;
    margin-bottom: 0.95rem;
    font-family: 'Poppins', sans-serif !important;
}

.section-subtitle[b-cg8yvg6bex] {
    font-size: clamp(0.95rem, 1.8vw, 1.1rem);
    line-height: 1.7;
    color: #2c4d75 !important;
    margin: 0;
    font-family: 'Inter', sans-serif;
}

.growth-split-grid[b-cg8yvg6bex] {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(2rem, 4vw, 3.5rem);
    align-items: center;
}

.growth-text-col .lead-text[b-cg8yvg6bex] {
    font-size: clamp(1.05rem, 2vw, 1.15rem);
    font-weight: 500;
    color: #334155;
    line-height: 1.75;
    margin-bottom: 1.35rem;
    font-family: 'Inter', sans-serif;
}

/* Cajas de Desafío y Solución */
.origin-problem-card[b-cg8yvg6bex] {
    background: #ffffff;
    border: 1px solid rgba(226, 232, 240, 0.9);
    border-left: 4px solid #f59e0b;
    padding: 1.25rem 1.45rem;
    border-radius: 0.5rem 1.25rem 1.25rem 0.5rem;
    margin-bottom: 1.15rem;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.03);
}

.origin-solution-card[b-cg8yvg6bex] {
    background: #ffffff;
    border: 1px solid rgba(226, 232, 240, 0.9);
    border-left: 4px solid #093d93;
    padding: 1.25rem 1.45rem;
    border-radius: 0.5rem 1.25rem 1.25rem 0.5rem;
    margin-bottom: 1.5rem;
    box-shadow: 0 4px 18px rgba(9, 61, 147, 0.04);
}

.origin-card-badge[b-cg8yvg6bex] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.775rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 0.5rem;
}

.text-warning-badge[b-cg8yvg6bex] {
    color: #b45309;
}

.text-solution-badge[b-cg8yvg6bex] {
    color: #093d93;
}

.origin-card-text[b-cg8yvg6bex] {
    font-size: 0.9375rem;
    line-height: 1.75;
    color: #334155;
    font-family: 'Inter', sans-serif;
    margin: 0;
}

.hero-badges-row[b-cg8yvg6bex] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(226, 232, 240, 0.8);
}

.pill-tag[b-cg8yvg6bex] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    padding: 0.45rem 1rem;
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(226, 232, 240, 0.9);
    border-radius: 9999px;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #334155;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02), inset 0 1px 1px #ffffff;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.pill-tag:hover[b-cg8yvg6bex] {
    background: #eff6ff;
    border-color: #93c5fd;
    color: #093d93;
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(9, 61, 147, 0.12);
}

/* Columna Derecha: Tarjeta de Etapas de Evolución */
.stages-card[b-cg8yvg6bex] {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.85) 0%, rgba(248, 250, 252, 0.92) 100%);
    backdrop-filter: blur(24px) saturate(180%);
    -webkit-backdrop-filter: blur(24px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.95);
    border-radius: clamp(1.5rem, 3vw, 2.25rem);
    padding: clamp(1.75rem, 4vw, 2.75rem);
    box-shadow: 0 25px 60px -15px rgba(9, 61, 147, 0.08), inset 0 1.5px 2px rgba(255, 255, 255, 1);
}

.stages-card-header[b-cg8yvg6bex] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding-bottom: 1.35rem;
    margin-bottom: 1.85rem;
    border-bottom: 1px solid rgba(226, 232, 240, 0.8);
}

.stages-header-icon[b-cg8yvg6bex] {
    width: 3.35rem;
    height: 3.35rem;
    border-radius: 1.15rem;
    background: linear-gradient(135deg, #093d93 0%, #1d4ed8 100%);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    flex-shrink: 0;
    box-shadow: 0 8px 24px -4px rgba(9, 61, 147, 0.35);
}

.stages-title[b-cg8yvg6bex] {
    font-size: 1.25rem;
    font-weight: 800;
    color: #0f172a;
    margin: 0;
    font-family: 'Poppins', sans-serif;
}

.stages-subtitle[b-cg8yvg6bex] {
    font-size: 0.85rem;
    color: #64748b;
}

.stages-timeline[b-cg8yvg6bex] {
    display: flex;
    flex-direction: column;
    gap: 1.75rem;
}

.stage-item[b-cg8yvg6bex] {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
    padding-left: 1.25rem;
    border-left: 2px solid #e2e8f0;
    position: relative;
    transition: border-color 0.3s ease;
}

.stage-item-active[b-cg8yvg6bex] {
    border-left-color: #ed7024;
}

.stage-step-badge[b-cg8yvg6bex] {
    display: inline-block;
    width: fit-content;
    font-size: 0.725rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.3rem 0.85rem;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(226, 232, 240, 0.9);
    color: #64748b;
    border-radius: 9999px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02);
}

.stage-step-badge.active-step[b-cg8yvg6bex] {
    background: #fff7ed;
    color: #ed7024;
    border: 1px solid rgba(237, 112, 36, 0.3);
    box-shadow: 0 2px 8px rgba(237, 112, 36, 0.15);
}

.stage-info h4[b-cg8yvg6bex] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0.2rem 0 0.25rem;
    font-family: 'Poppins', sans-serif;
}

.stage-info p[b-cg8yvg6bex] {
    font-size: 0.8875rem;
    color: #64748b;
    line-height: 1.6;
    margin: 0;
}

/* ==========================================================================
   3. SECCIÓN RESPALDO INSTITUCIONAL (AuroTech y Grupo Auropaq)
   ========================================================================== */
.corporate-backing-section[b-cg8yvg6bex] {
    background: #ffffff;
    border-top: 1px solid rgba(226, 232, 240, 0.8);
    border-bottom: 1px solid rgba(226, 232, 240, 0.8);
}

.credentials-grid[b-cg8yvg6bex] {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(1.25rem, 2.5vw, 1.75rem);
}

.credential-card[b-cg8yvg6bex] {
    position: relative;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.85) 0%, rgba(248, 250, 252, 0.95) 100%);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border: 1px solid rgba(226, 232, 240, 0.9);
    border-radius: 1.75rem;
    padding: clamp(1.75rem, 3vw, 2.25rem);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: 0 10px 30px -8px rgba(9, 61, 147, 0.06), inset 0 1px 1.5px #ffffff;
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.credential-card:hover[b-cg8yvg6bex] {
    transform: translateY(-6px);
    border-color: rgba(9, 61, 147, 0.3);
    box-shadow: 0 20px 45px -10px rgba(9, 61, 147, 0.12);
}

.credential-content[b-cg8yvg6bex] {
    display: flex;
    flex-direction: column;
}

.credential-header[b-cg8yvg6bex] {
    display: flex;
    align-items: center;
    margin-bottom: 0.65rem;
}

.credential-metric[b-cg8yvg6bex] {
    font-size: clamp(2rem, 3.5vw, 2.5rem);
    font-weight: 900;
    color: #093d93;
    font-family: 'Poppins', sans-serif;
    line-height: 1;
}

.text-orange-gradient[b-cg8yvg6bex] {
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.credential-title[b-cg8yvg6bex] {
    font-size: 1.2rem;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 0.35rem;
    font-family: 'Poppins', sans-serif;
    letter-spacing: -0.01em;
    line-height: 1.25;
}

.credential-badge-pill[b-cg8yvg6bex] {
    display: inline-block;
    width: fit-content;
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.2rem 0.65rem;
    background: #eff6ff;
    color: #093d93;
    border-radius: 9999px;
    border: 1px solid rgba(147, 197, 253, 0.5);
    margin-bottom: 0.75rem;
}

.credential-text[b-cg8yvg6bex] {
    margin-top: 0.75rem;
    font-size: 0.925rem;
    line-height: 1.7;
    color: #475569;
    margin-bottom: 1.35rem;
    font-family: 'Inter', sans-serif;
}

.credential-footer-tag[b-cg8yvg6bex] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.775rem;
    font-weight: 600;
    color: #093d93;
    background: rgba(9, 61, 147, 0.05);
    padding: 0.4rem 0.85rem;
    border-radius: 0.5rem;
    border: 1px solid rgba(9, 61, 147, 0.1);
    margin-top: auto;
}

/* ==========================================================================
   4. SECCIÓN VALORES FUNDAMENTALES
   ========================================================================== */
.connection-grid[b-cg8yvg6bex] {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(1.5rem, 3vw, 2rem);
}

.connection-card[b-cg8yvg6bex] {
    position: relative;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.85) 0%, rgba(248, 250, 252, 0.95) 100%);
    backdrop-filter: blur(24px) saturate(180%);
    -webkit-backdrop-filter: blur(24px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.95);
    border-radius: 1.75rem;
    padding: clamp(2rem, 4vw, 2.75rem) clamp(1.5rem, 3vw, 2rem) clamp(1.75rem, 3vw, 2.25rem);
    overflow: hidden;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.4s ease, border-color 0.3s ease;
    box-shadow: 0 15px 40px -10px rgba(9, 61, 147, 0.07), inset 0 1.5px 2px rgba(255, 255, 255, 1);
}

.connection-card:hover[b-cg8yvg6bex] {
    transform: translateY(-8px) scale(1.01);
    box-shadow: 0 25px 55px -10px rgba(9, 61, 147, 0.13), inset 0 1.5px 2px rgba(255, 255, 255, 1);
    border-color: rgba(9, 61, 147, 0.25);
}

.card-glow-bar[b-cg8yvg6bex] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
}

.process-card .card-glow-bar[b-cg8yvg6bex] { background: linear-gradient(90deg, #093d93, #3b82f6); }
.team-card .card-glow-bar[b-cg8yvg6bex] { background: linear-gradient(90deg, #059669, #10b981); }
.client-card .card-glow-bar[b-cg8yvg6bex] { background: linear-gradient(90deg, #ed7024, #fd8c1d); }

.card-icon-wrapper[b-cg8yvg6bex] {
    width: 3.75rem;
    height: 3.75rem;
    border-radius: 1.15rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.45rem;
    margin-bottom: 1.5rem;
    transition: transform 0.3s ease;
}

.connection-card:hover .card-icon-wrapper[b-cg8yvg6bex] {
    transform: scale(1.08);
}

.process-icon[b-cg8yvg6bex] { background: #eff6ff; color: #093d93; box-shadow: 0 6px 15px rgba(9, 61, 147, 0.12); }
.team-icon[b-cg8yvg6bex] { background: #ecfdf5; color: #059669; box-shadow: 0 6px 15px rgba(5, 150, 105, 0.12); }
.client-icon[b-cg8yvg6bex] { background: #fff7ed; color: #ed7024; box-shadow: 0 6px 15px rgba(237, 112, 36, 0.15); }

.card-title[b-cg8yvg6bex] {
    font-size: 1.3rem;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 0.85rem;
    font-family: 'Poppins', sans-serif;
    letter-spacing: -0.02em;
}

.card-text[b-cg8yvg6bex] {
    font-size: 0.95rem;
    line-height: 1.75;
    color: #475569;
    margin-bottom: 1.5rem;
    font-family: 'Inter', sans-serif;
}

.card-footer-pill[b-cg8yvg6bex] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.775rem;
    font-weight: 700;
    color: #334155;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid rgba(226, 232, 240, 0.9);
    padding: 0.45rem 1rem;
    border-radius: 9999px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02);
}

.dot-blue[b-cg8yvg6bex] { width: 7px; height: 7px; border-radius: 50%; background: #093d93; }
.dot-emerald[b-cg8yvg6bex] { width: 7px; height: 7px; border-radius: 50%; background: #059669; }
.dot-orange[b-cg8yvg6bex] { width: 7px; height: 7px; border-radius: 50%; background: #ed7024; }


/* ==========================================================================
   6. SECCIÓN TRANSPARENCIA Y PRESENCIA FÍSICA (Confianza Local y Legal)
   ========================================================================== */
.transparency-section[b-cg8yvg6bex] {
    background: #ffffff;
    border-top: 1px solid rgba(226, 232, 240, 0.8);
    border-bottom: 1px solid rgba(226, 232, 240, 0.8);
}

.presence-showcase-card[b-cg8yvg6bex] {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.88) 0%, rgba(248, 250, 252, 0.95) 100%);
    backdrop-filter: blur(28px) saturate(180%);
    -webkit-backdrop-filter: blur(28px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.95);
    border-radius: clamp(1.75rem, 3.5vw, 2.5rem);
    padding: clamp(2.5rem, 5vw, 4.5rem) clamp(1.5rem, 4vw, 3.5rem);
    box-shadow: 0 25px 65px -15px rgba(9, 61, 147, 0.08), inset 0 1.5px 2px rgba(255, 255, 255, 1);
}

.presence-split-layout[b-cg8yvg6bex] {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(2.5rem, 4vw, 4rem);
    align-items: flex-start;
}

.presence-info-column[b-cg8yvg6bex] {
    text-align: left;
}

.presence-badge[b-cg8yvg6bex] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 1.15rem;
    background: rgba(9, 61, 147, 0.07);
    border: 1px solid rgba(9, 61, 147, 0.18);
    border-radius: 9999px;
    font-size: 0.8rem;
    font-weight: 600;
    color: #093d93;
    margin-bottom: 1.35rem;
}

.presence-headline[b-cg8yvg6bex] {
    font-size: clamp(1.5rem, 3vw, 2.1rem);
    font-weight: 800;
    color: #0f172a;
    line-height: 1.25;
    margin-bottom: 1rem;
    font-family: 'Poppins', sans-serif;
    letter-spacing: -0.02em;
}

.presence-subtext[b-cg8yvg6bex] {
    font-size: 0.975rem;
    line-height: 1.8;
    color: #475569;
    margin-bottom: 2rem;
    font-family: 'Inter', sans-serif;
}

.contact-details-grid[b-cg8yvg6bex] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1rem;
}

.contact-detail-box[b-cg8yvg6bex] {
    background: #ffffff;
    border: 1px solid rgba(226, 232, 240, 0.9);
    border-radius: 1.15rem;
    padding: 1.1rem 1.25rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02);
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.contact-detail-box:hover[b-cg8yvg6bex] {
    border-color: rgba(9, 61, 147, 0.3);
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(9, 61, 147, 0.08);
}

.detail-icon-circle[b-cg8yvg6bex] {
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 0.85rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    flex-shrink: 0;
}

.detail-content[b-cg8yvg6bex] {
    display: flex;
    flex-direction: column;
}

.detail-label[b-cg8yvg6bex] {
    font-size: 0.725rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #64748b;
    margin-bottom: 0.15rem;
}

.detail-value[b-cg8yvg6bex] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.3;
}

.detail-caption[b-cg8yvg6bex] {
    font-size: 0.8rem;
    color: #64748b;
}

.detail-link[b-cg8yvg6bex] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #093d93;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    transition: color 0.2s ease;
}

.detail-link:hover[b-cg8yvg6bex] {
    color: #ed7024;
    text-decoration: underline;
}

/* Columna Derecha: Canales Sociales y Tarjeta de Confianza */
.social-trust-card[b-cg8yvg6bex] {
    background: linear-gradient(135deg, rgba(248, 250, 252, 0.85) 0%, rgba(241, 245, 249, 0.95) 100%);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    border: 1px solid rgba(255, 255, 255, 0.95);
    border-radius: 1.85rem;
    padding: clamp(1.75rem, 3.5vw, 2.5rem);
    text-align: left;
    box-shadow: inset 0 1.5px 2px rgba(255, 255, 255, 1), 0 8px 25px rgba(9, 61, 147, 0.04);
}

.trust-badge-header[b-cg8yvg6bex] {
    display: flex;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.35rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid rgba(226, 232, 240, 0.8);
}

.trust-icon-box[b-cg8yvg6bex] {
    width: 3.35rem;
    height: 3.35rem;
    border-radius: 1.15rem;
    background: #093d93;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    flex-shrink: 0;
    box-shadow: 0 8px 24px -4px rgba(9, 61, 147, 0.35);
}

.trust-title[b-cg8yvg6bex] {
    font-size: 1.2rem;
    font-weight: 800;
    color: #0f172a;
    margin: 0;
    font-family: 'Poppins', sans-serif;
}

.trust-subtitle[b-cg8yvg6bex] {
    font-size: 0.825rem;
    color: #64748b;
}

.trust-description[b-cg8yvg6bex] {
    font-size: 0.925rem;
    line-height: 1.7;
    color: #475569;
    margin-bottom: 1.5rem;
    font-family: 'Inter', sans-serif;
}

.social-links-list[b-cg8yvg6bex] {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    margin-bottom: 1.75rem;
}

.social-item-row[b-cg8yvg6bex] {
    background: #ffffff;
    border: 1px solid rgba(226, 232, 240, 0.9);
    border-radius: 1.15rem;
    padding: 0.85rem 1.15rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    text-decoration: none;
    color: #0f172a;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}

.social-item-row:hover[b-cg8yvg6bex] {
    border-color: rgba(9, 61, 147, 0.3);
    transform: translateX(4px);
    box-shadow: 0 6px 18px rgba(9, 61, 147, 0.08);
    color: #093d93;
}

.social-item-icon[b-cg8yvg6bex] {
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 0.65rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.instagram-bg[b-cg8yvg6bex] {
    background: linear-gradient(135deg, #833ab4, #fd1d1d, #fcb045);
}

.linkedin-bg[b-cg8yvg6bex] {
    background: #0077b5;
}

.facebook-bg[b-cg8yvg6bex] {
    background: #1877f2;
}

.social-item-info[b-cg8yvg6bex] {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.social-network-name[b-cg8yvg6bex] {
    font-size: 0.875rem;
    font-weight: 700;
    line-height: 1.2;
}

.social-network-handle[b-cg8yvg6bex] {
    font-size: 0.775rem;
    color: #64748b;
}

.trust-guarantee-footer[b-cg8yvg6bex] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #059669;
    padding-top: 1.25rem;
    border-top: 1px solid rgba(226, 232, 240, 0.8);
}

/* ==========================================================================
   7. SECCIÓN CTA FINAL (Llamado a la Acción)
   ========================================================================== */
.about-cta-card[b-cg8yvg6bex] {
    position: relative;
    background: linear-gradient(135deg, #09224f 0%, #093d93 50%, #13376b 100%);
    border-radius: clamp(1.75rem, 3.5vw, 2.5rem);
    padding: clamp(3rem, 6vw, 5rem) clamp(1.5rem, 4vw, 3.5rem);
    overflow: hidden;
    box-shadow: 0 30px 80px -15px rgba(9, 61, 147, 0.35);
}

.cta-mesh-ambient[b-cg8yvg6bex] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
}

.cta-orb[b-cg8yvg6bex] {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.45;
}

.orb-orange-glow[b-cg8yvg6bex] {
    top: -20%;
    right: -10%;
    width: 450px;
    height: 450px;
    background: radial-gradient(circle, rgba(237, 112, 36, 0.4) 0%, transparent 70%);
}

.orb-blue-glow[b-cg8yvg6bex] {
    bottom: -20%;
    left: -10%;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(56, 189, 248, 0.3) 0%, transparent 70%);
}

.cta-card-content[b-cg8yvg6bex] {
    position: relative;
    z-index: 1;
    max-width: 860px;
    margin: 0 auto;
}

.cta-kicker-badge[b-cg8yvg6bex] {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.45rem 1.25rem;
    background: rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 9999px;
    font-size: 0.825rem;
    font-weight: 700;
    color: #ffffff;
    margin-bottom: 1.5rem;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.cta-headline[b-cg8yvg6bex] {
    font-size: clamp(2rem, 4vw, 3.1rem);
    font-weight: 800;
    line-height: 1.2;
    color: #ffffff !important;
    margin-bottom: 1.25rem;
    font-family: 'Poppins', sans-serif !important;
    letter-spacing: -0.02em;
}

.cta-subhead[b-cg8yvg6bex] {
    font-size: clamp(1rem, 2vw, 1.18rem);
    line-height: 1.75;
    color: rgba(255, 255, 255, 0.88);
    max-width: 720px;
    margin: 0 auto 2.25rem;
    font-family: 'Inter', sans-serif;
}

.cta-buttons-row[b-cg8yvg6bex] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem;
    margin-bottom: 2rem;
}

.btn-cta-primary[b-cg8yvg6bex] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    padding: 1rem 2.25rem;
    background: #ed7024;
    color: #ffffff !important;
    font-weight: 700;
    font-size: 1rem;
    border-radius: 9999px;
    text-decoration: none;
    border: 1px solid #ed7024;
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    box-shadow: 0 8px 25px rgba(237, 112, 36, 0.45);
    min-height: 54px;
    font-family: 'Poppins', sans-serif;
}

.btn-cta-primary:hover[b-cg8yvg6bex] {
    background: #fd8c1d;
    border-color: #fd8c1d;
    color: #ffffff !important;
    transform: translateY(-3px);
    box-shadow: 0 14px 35px rgba(237, 112, 36, 0.6);
}

.btn-cta-secondary[b-cg8yvg6bex] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    padding: 1rem 2.25rem;
    background: rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    color: #ffffff !important;
    font-weight: 600;
    font-size: 1rem;
    border: 1.5px solid rgba(255, 255, 255, 0.35);
    border-radius: 9999px;
    text-decoration: none;
    transition: all 0.3s ease;
    min-height: 54px;
    font-family: 'Poppins', sans-serif;
}

.btn-cta-secondary:hover[b-cg8yvg6bex] {
    background: rgba(255, 255, 255, 0.22);
    border-color: #ffffff;
    color: #ffffff !important;
    transform: translateY(-2px);
}

.cta-trust-indicators[b-cg8yvg6bex] {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 0.85rem;
    color: rgba(255, 255, 255, 0.8);
    font-size: 0.825rem;
    font-weight: 500;
}

.indicator-item[b-cg8yvg6bex] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.indicator-item .telerik-svg-icon[b-cg8yvg6bex] {
    color: #34d399;
}

.indicator-dot[b-cg8yvg6bex] {
    opacity: 0.4;
}

/* --------------------------------------------------------------------------
   BOTONES COMPARTIDOS
   -------------------------------------------------------------------------- */
.btn-about-primary[b-cg8yvg6bex] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    padding: 0.95rem 2.25rem;
    background: #093d93;
    color: #ffffff !important;
    font-weight: 700;
    font-size: 0.975rem;
    border-radius: 9999px;
    text-decoration: none;
    border: 1px solid #093d93;
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    box-shadow: 0 6px 20px rgba(9, 61, 147, 0.25);
    min-height: 52px;
    font-family: 'Poppins', sans-serif;
}

.btn-about-primary:hover[b-cg8yvg6bex] {
    background: #ed7024;
    border-color: #ed7024;
    color: #ffffff !important;
    transform: translateY(-3px);
    box-shadow: 0 14px 30px rgba(237, 112, 36, 0.45);
}

.btn-about-outline[b-cg8yvg6bex] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    padding: 0.95rem 2.25rem;
    background: #ffffff;
    color: #0f172a !important;
    font-weight: 600;
    font-size: 0.975rem;
    border: 1.5px solid #cbd5e1;
    border-radius: 9999px;
    text-decoration: none;
    transition: all 0.3s ease;
    min-height: 52px;
    font-family: 'Poppins', sans-serif;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
}

.btn-about-outline:hover[b-cg8yvg6bex] {
    background: #f8fafc;
    border-color: #093d93;
    color: #093d93 !important;
    transform: translateY(-2px);
}

/* ==========================================================================
   MEDIA QUERIES (Mobile-First ➔ Tablet ➔ Desktop)
   ========================================================================== */
@media (min-width: 640px) {
    .credentials-grid[b-cg8yvg6bex] {
        grid-template-columns: repeat(2, 1fr);
    }

    .connection-grid[b-cg8yvg6bex] {
        grid-template-columns: repeat(2, 1fr);
    }

    .contact-details-grid[b-cg8yvg6bex] {
        grid-template-columns: repeat(2, 1fr);
    }

    .contact-detail-span[b-cg8yvg6bex] {
        grid-column: span 2;
    }
}

@media (min-width: 1024px) {
    .growth-split-grid[b-cg8yvg6bex] {
        grid-template-columns: 1.15fr 0.85fr;
        gap: 4rem;
    }

    .credentials-grid[b-cg8yvg6bex] {
        grid-template-columns: repeat(4, 1fr);
    }

    .connection-grid[b-cg8yvg6bex] {
        grid-template-columns: repeat(3, 1fr);
    }

    .presence-split-layout[b-cg8yvg6bex] {
        grid-template-columns: 1.2fr 0.8fr;
        gap: 4rem;
    }
}
/* /Pages/Agendamientos/Agendamientos.razor.rz.scp.css */
.booking-status-actions[b-aei9okl3b7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    vertical-align: middle;
}

.booking-status-action-btn[b-aei9okl3b7] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    border-radius: 999px;
    border: 1px solid #e5e7eb;
    background: #ffffff;
    color: #4b5563;
    cursor: pointer;
    transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.12s ease;
}

.booking-status-action-btn:hover[b-aei9okl3b7] {
    transform: translateY(-1px);
    background: #f9fafb;
}

.booking-status-action-btn:disabled[b-aei9okl3b7] {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

.booking-status-action-btn.is-view[b-aei9okl3b7] {
    color: #4b5563;
    border-color: #e5e7eb;
    background: #ffffff;
}

.booking-status-action-btn.is-view:hover[b-aei9okl3b7] {
    background: #f3f4f6;
    border-color: #d1d5db;
    color: #374151;
}

.booking-status-action-btn.is-accept[b-aei9okl3b7] {
    color: #15803d;
    border-color: #bbf7d0;
    background: #f0fdf4;
}

.booking-status-action-btn.is-accept:hover[b-aei9okl3b7] {
    background: #dcfce7;
    border-color: #86efac;
}

.booking-status-action-btn.is-reject[b-aei9okl3b7] {
    color: #b91c1c;
    border-color: #fecaca;
    background: #fef2f2;
}

.booking-status-action-btn.is-reject:hover[b-aei9okl3b7] {
    background: #fee2e2;
    border-color: #fca5a5;
}

.booking-status-action-btn.is-convert[b-aei9okl3b7] {
    color: #1d4ed8;
    border-color: #bfdbfe;
    background: #eff6ff;
}

.booking-status-action-btn.is-convert:hover[b-aei9okl3b7] {
    background: #dbeafe;
    border-color: #93c5fd;
}
/* /Pages/Agendamientos/Components/BookingDetailsModal.razor.rz.scp.css */
.booking-detail-modal[b-sd2hdip8hz] {
    font-family: 'Poppins', sans-serif !important;
}

.booking-detail-section[b-sd2hdip8hz] {
    padding: 0.9rem 0;
    border-bottom: 1px solid #e5e7eb;
}

.booking-detail-section:last-child[b-sd2hdip8hz] {
    border-bottom: none;
    padding-bottom: 0.2rem;
}

.booking-detail-status-row[b-sd2hdip8hz] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.booking-detail-label[b-sd2hdip8hz] {
    display: block;
    font-size: 0.78rem;
    font-weight: 500;
    color: #6b7280;
    margin-bottom: 0.2rem;
}

.booking-detail-status-name[b-sd2hdip8hz] {
    margin: 0;
    font-size: 1.03rem;
    font-weight: 700;
    color: #111827;
}

.booking-detail-code[b-sd2hdip8hz] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    font-weight: 700;
    color: #2563eb;
    border: 1px solid #bfdbfe;
    background: #eff6ff;
    border-radius: 999px;
    padding: 0.22rem 0.72rem;
    text-transform: uppercase;
}

.booking-detail-section-title[b-sd2hdip8hz] {
    margin: 0 0 0.75rem 0;
    font-size: 0.95rem;
    font-weight: 700;
    color: #111827;
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
}

.booking-detail-subsection-title[b-sd2hdip8hz] {
    margin: 0.15rem 0 0.55rem 0;
    font-size: 0.82rem;
    font-weight: 700;
    color: #374151;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.booking-detail-subsection-spaced[b-sd2hdip8hz] {
    margin-top: 0.9rem;
}

.booking-detail-info-grid[b-sd2hdip8hz] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem 1.5rem;
}

.booking-detail-field[b-sd2hdip8hz] {
    min-width: 0;
}

.booking-detail-value[b-sd2hdip8hz] {
    display: block;
    font-size: 0.9rem;
    font-weight: 600;
    color: #111827;
    line-height: 1.35;
    word-break: break-word;
}

.booking-detail-total[b-sd2hdip8hz] {
    color: #059669;
}

.booking-detail-notes[b-sd2hdip8hz] {
    margin: 0;
    font-size: 0.9rem;
    color: #1f2937;
    line-height: 1.5;
    white-space: pre-line;
}

.booking-detail-conversion-list[b-sd2hdip8hz] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.booking-detail-conversion-item[b-sd2hdip8hz] {
    font-size: 0.88rem;
    color: #1f2937;
}

.booking-detail-table[b-sd2hdip8hz] {
    border-collapse: collapse;
}

.booking-detail-table th[b-sd2hdip8hz] {
    background-color: #f9fafb;
    color: #374151;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    border-bottom: 1px solid #e5e7eb;
    padding: 0.62rem 0.5rem;
}

.booking-detail-table td[b-sd2hdip8hz] {
    border-bottom: 1px solid #f1f5f9;
    padding: 0.58rem 0.5rem;
    color: #111827;
    font-size: 0.88rem;
}

.booking-detail-table tbody tr:last-child td[b-sd2hdip8hz] {
    border-bottom: none;
}

.booking-detail-totals[b-sd2hdip8hz] {
    margin-top: 0.85rem;
    margin-left: auto;
    max-width: 280px;
    border-top: 1px solid #d1d5db;
    padding-top: 0.55rem;
}

.booking-detail-total-row[b-sd2hdip8hz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    font-size: 0.86rem;
    color: #374151;
    padding: 0.22rem 0;
}

.booking-detail-total-row.is-grand-total[b-sd2hdip8hz] {
    margin-top: 0.25rem;
    padding-top: 0.5rem;
    border-top: 1px solid #e5e7eb;
    font-size: 0.95rem;
    font-weight: 700;
    color: #111827;
}

.booking-detail-service-name[b-sd2hdip8hz] {
    font-weight: 600;
}

.booking-detail-item-main[b-sd2hdip8hz] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.booking-detail-item-image[b-sd2hdip8hz] {
    width: 34px;
    height: 34px;
    border-radius: 0.45rem;
    object-fit: cover;
    border: 1px solid #e5e7eb;
}

.booking-detail-employee-name[b-sd2hdip8hz] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-weight: 500;
    color: #111827;
}

.booking-detail-employee-image[b-sd2hdip8hz] {
    width: 20px;
    height: 20px;
    border-radius: 999px;
    object-fit: cover;
    border: 1px solid #d1d5db;
}

.booking-detail-time[b-sd2hdip8hz] {
    color: #374151;
}

.booking-detail-price[b-sd2hdip8hz] {
    font-weight: 700;
    color: #059669;
}

.booking-detail-muted[b-sd2hdip8hz] {
    color: #6b7280;
    font-size: 0.82rem;
}

@media (max-width: 768px) {
    .booking-detail-status-row[b-sd2hdip8hz] {
        flex-direction: column;
        align-items: flex-start;
    }

    .booking-detail-info-grid[b-sd2hdip8hz] {
        grid-template-columns: 1fr;
        gap: 0.65rem;
    }
}
/* /Pages/Agendamientos/Components/ConvertBookingModal.razor.rz.scp.css */
.convert-booking-modal[b-rc3m109ger] {
    font-family: 'Poppins', sans-serif !important;
}

.convert-booking-footer-buttons[b-rc3m109ger] {
    justify-content: space-between;
    gap: 0.75rem;
}

.convert-booking-summary-card[b-rc3m109ger] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    padding: 0.85rem 0.95rem;
    border: 1px solid #cdeaf3;
    border-radius: 10px;
    background: #f1fbff;
    margin-bottom: 0.95rem;
}

.convert-booking-summary-title[b-rc3m109ger] {
    font-size: 1rem;
    font-weight: 700;
    color: #0f172a;
}

.convert-booking-summary-meta[b-rc3m109ger] {
    font-size: 0.82rem;
    color: #334155;
    font-weight: 500;
}

.convert-booking-section[b-rc3m109ger] {
    border-top: 1px solid #e5e7eb;
    padding-top: 0.95rem;
}

.convert-booking-section-label[b-rc3m109ger] {
    display: block;
    font-size: 0.94rem;
    font-weight: 700;
    color: #111827;
    margin-bottom: 0.65rem;
}

.convert-booking-option-grid[b-rc3m109ger] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.convert-booking-option-card[b-rc3m109ger] {
    width: 100%;
    border: 1px solid #d1d5db;
    background: #ffffff;
    border-radius: 12px;
    padding: 0.9rem;
    text-align: left;
    min-height: 132px;
    display: flex;
    flex-direction: column;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease, transform 0.12s ease;
}

.convert-booking-option-card:hover[b-rc3m109ger] {
    border-color: #9ca3af;
    background: #f9fafb;
    transform: translateY(-1px);
}

.convert-booking-option-card.active[b-rc3m109ger] {
    border-color: #2563eb;
    background: #eff6ff;
    box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.18);
}

.convert-booking-option-title-row[b-rc3m109ger] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.4rem;
}

.convert-booking-option-title[b-rc3m109ger] {
    font-size: 1rem;
    font-weight: 700;
    color: #1f2937;
    min-height: 2.5rem;
}

.convert-booking-option-description[b-rc3m109ger] {
    font-size: 0.83rem;
    line-height: 1.45;
    color: #4b5563;
}

.convert-booking-selected-pill[b-rc3m109ger] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 94px;
    border: 1px solid #bfdbfe;
    background: #dbeafe;
    color: #1d4ed8;
    border-radius: 999px;
    padding: 0.12rem 0.45rem;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.convert-booking-selected-pill.is-hidden[b-rc3m109ger] {
    visibility: hidden;
}

.convert-booking-selected-pill.is-visible[b-rc3m109ger] {
    visibility: visible;
}

[b-rc3m109ger] .convert-booking-notes-input.k-textarea {
    border-radius: 12px;
}

[b-rc3m109ger] .convert-booking-notes-input .k-input-inner {
    border-radius: 12px;
}

@media (max-width: 768px) {
    .convert-booking-option-grid[b-rc3m109ger] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Analitycs/Analytics.razor.rz.scp.css */
/* Aurotech.Arregly.Web.Client/Pages/Analitycs/Analytics.razor.css */

[b-lu5tjggszy] .btn-new-order {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 28px;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 12px;
    color: var(--primary-text-color);
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    backdrop-filter: blur(10px);
    text-decoration: none;
}

    [b-lu5tjggszy] .btn-new-order:hover {
        background: rgba(255, 255, 255, 0.25);
        border-color: rgba(255, 255, 255, 0.3);
        transform: translateY(-2px);
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
        color: var(--primary-text-color);
    }

    [b-lu5tjggszy] .btn-new-order:active {
        transform: translateY(0);
    }

.analytics-page[b-lu5tjggszy] {
    padding-bottom: 2rem;
}

/* Sidebar & Content Layout */
.analytics-layout[b-lu5tjggszy] {
    display: flex;
    gap: 1.5rem;
    margin-top: 1.5rem;
    align-items: flex-start;
    width: 100%;
}

@media (max-width: 992px) {
    .analytics-layout[b-lu5tjggszy] {
        flex-direction: column;
    }
}

/* Sidebar selector list */
.analytics-sidebar[b-lu5tjggszy] {
    width: 240px;
    min-width: 240px;
    max-width: 240px;
    flex-shrink: 0;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    height: fit-content;
    overflow: hidden;
    white-space: nowrap;
    opacity: 1;
    transform: translateX(0);
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                min-width 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                max-width 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                padding 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                margin 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                opacity 0.2s ease,
                transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                border-color 0.3s ease;
}

.analytics-sidebar.analytics-sidebar-collapsed[b-lu5tjggszy] {
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    padding: 0 !important;
    margin-right: -1.5rem !important;
    border-width: 0 !important;
    border-color: transparent !important;
    box-shadow: none !important;
    opacity: 0 !important;
    transform: translateX(-15px);
    pointer-events: none;
    visibility: hidden;
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                min-width 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                max-width 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                padding 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                margin 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                opacity 0.2s ease,
                transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
                border-color 0.3s ease,
                visibility 0s linear 0.3s;
}

@media (max-width: 992px) {
    .analytics-sidebar[b-lu5tjggszy] {
        width: 100%;
        min-width: unset;
        max-width: unset;
        flex-direction: row;
        overflow-x: auto;
        padding: 0.5rem;
        white-space: nowrap;
        max-height: 80px;
        transition: max-height 0.3s ease, opacity 0.2s ease, padding 0.3s ease, margin 0.3s ease;
    }

    .analytics-sidebar.analytics-sidebar-collapsed[b-lu5tjggszy] {
        max-height: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        margin-right: 0 !important;
        margin-bottom: -1.5rem !important;
        opacity: 0 !important;
        visibility: hidden;
    }
}

.sidebar-item[b-lu5tjggszy] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    border-radius: 8px;
    color: #4b5563;
    font-weight: 500;
    text-decoration: none;
    border: none;
    background: transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: left;
    width: 100%;
}

@media (max-width: 992px) {
    .sidebar-item[b-lu5tjggszy] {
        width: auto;
        padding: 0.5rem 1rem;
    }
}

.sidebar-item:hover[b-lu5tjggszy] {
    background: #f3f4f6;
    color: #111827;
}

.sidebar-item.active[b-lu5tjggszy] {
    background: #eff6ff;
    color: #2563eb;
    font-weight: 600;
}

.sidebar-item-icon[b-lu5tjggszy] {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
}

/* Filters panel styling */
.analytics-filters-panel[b-lu5tjggszy] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.25rem;
    display: flex;
    gap: 1rem;
    align-items: center;
    flex-wrap: wrap;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

/* Toggle sidebar button */
.btn-toggle-sidebar[b-lu5tjggszy] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    color: #4b5563;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
    flex-shrink: 0;
}

.btn-toggle-sidebar:hover[b-lu5tjggszy] {
    background: #f8fafc;
    border-color: #cbd5e1;
    color: #1e293b;
    transform: translateY(-1px);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.08);
}

.btn-toggle-sidebar:active[b-lu5tjggszy] {
    transform: translateY(0);
}

.btn-toggle-sidebar.collapsed[b-lu5tjggszy] {
    background: #eff6ff;
    border-color: #bfdbfe;
    color: #2563eb;
}

.btn-toggle-sidebar.collapsed:hover[b-lu5tjggszy] {
    background: #dbeafe;
    border-color: #93c5fd;
    color: #1d4ed8;
}

.analytics-filters-divider[b-lu5tjggszy] {
    width: 1px;
    height: 24px;
    background-color: #e5e7eb;
    margin: 0 0.25rem;
    flex-shrink: 0;
}

.analytics-filters-label[b-lu5tjggszy] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-weight: 600;
    color: #374151;
}

.date-pickers-group[b-lu5tjggszy] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.compare-toggle-container[b-lu5tjggszy] {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    background: #f3f4f6;
    padding: 0.45rem 1rem;
    border-radius: 30px;
    font-size: 0.875rem;
    font-weight: 500;
    color: #4b5563;
    border: 1px solid #e5e7eb;
    margin-left: auto;
    transition: all 0.2s ease;
}

.compare-toggle-container:hover[b-lu5tjggszy] {
    background: #e5e7eb;
    border-color: #cbd5e1;
    color: #1f2937;
}

.compare-toggle-container[b-lu5tjggszy]  .theme-switch-container {
    display: inline-flex;
    align-items: center;
}

.compare-toggle-container[b-lu5tjggszy]  .k-switch {
    margin: 0;
}

@media (max-width: 768px) {
    .compare-toggle-container[b-lu5tjggszy] {
        margin-left: 0;
        width: 100%;
    }
}

/* Metric Cards */
.metrics-grid[b-lu5tjggszy] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.metric-card[b-lu5tjggszy] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.metric-card:hover[b-lu5tjggszy] {
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.metric-header[b-lu5tjggszy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #6b7280;
    font-size: 0.875rem;
    font-weight: 500;
}

.metric-value[b-lu5tjggszy] {
    font-size: 1.75rem;
    font-weight: 700;
    color: #111827;
    line-height: 1.2;
}

.metric-comparison[b-lu5tjggszy] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.775rem;
}

.metric-badge[b-lu5tjggszy] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    border-radius: 9999px;
    font-weight: 600;
}

.metric-badge.positive[b-lu5tjggszy] {
    background-color: #dcfce7;
    color: #15803d;
}

.metric-badge.negative[b-lu5tjggszy] {
    background-color: #fee2e2;
    color: #b91c1c;
}

.metric-badge.neutral[b-lu5tjggszy] {
    background-color: #f3f4f6;
    color: #4b5563;
}

.metric-label-compare[b-lu5tjggszy] {
    color: #9ca3af;
}

/* Charts Sections */
.chart-card[b-lu5tjggszy] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    margin-bottom: 1rem;
    height: 100%;
}

.chart-card-title[b-lu5tjggszy] {
    font-size: 1rem;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 0.25rem;
}

.chart-card-subtitle[b-lu5tjggszy] {
    font-size: 0.825rem;
    color: #6b7280;
    margin-bottom: 1.25rem;
}

/* Funnel Styling */
.funnel-container[b-lu5tjggszy] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-top: 1rem;
}

.funnel-stage-card[b-lu5tjggszy] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.85rem 1.25rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: all 0.2s ease;
}

.funnel-stage-card:hover[b-lu5tjggszy] {
    background: #f1f5f9;
}

.funnel-stage-info[b-lu5tjggszy] {
    display: flex;
    flex-direction: column;
}

.funnel-stage-title[b-lu5tjggszy] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #334155;
}

.funnel-stage-conversion[b-lu5tjggszy] {
    font-size: 0.775rem;
    color: #64748b;
}

.funnel-stage-value[b-lu5tjggszy] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #0f172a;
}

/* Restricción de desbordamiento en el contenedor principal */
.analytics-content-view[b-lu5tjggszy] {
    flex: 1 1 0%;
    min-width: 0;
    width: 100%;
    overflow: hidden;
    transition: width 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Las tarjetas de gráficas se acomodan solas uniformemente en la cuadrícula */
[b-lu5tjggszy] .row.g-3 > [class*="col-"] {
    display: flex;
    flex-direction: column;
}

[b-lu5tjggszy] .row.g-3 > [class*="col-"] > .chart-card {
    flex: 1;
    width: 100%;
}

/* Custom styles for Telerik items inside Razor deep selector */
[b-lu5tjggszy] .k-grid {
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #e5e7eb;
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
}

[b-lu5tjggszy] .k-grid-header {
    background-color: #f9fafb;
}

[b-lu5tjggszy] .k-grid td {
    padding: 10px 12px;
    font-size: 0.875rem;
}

/* Loading & Empty states */
.empty-state[b-lu5tjggszy] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 2rem;
    text-align: center;
    color: #9ca3af;
}

.empty-state-icon[b-lu5tjggszy] {
    font-size: 2.5rem;
    margin-bottom: 1rem;
    color: #cbd5e1;
}

.empty-state-text[b-lu5tjggszy] {
    font-size: 0.95rem;
    font-weight: 500;
}

/* Ocultar barra de scroll en navegación de pestañas (sidebar horizontal) */
@media (max-width: 992px) {
    .analytics-sidebar[b-lu5tjggszy] {
        -ms-overflow-style: none;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }
    .analytics-sidebar[b-lu5tjggszy]::-webkit-scrollbar {
        display: none;
    }
}

/* ==========================================
   BREAKPOINTS RESPONSIVOS MULTIDISPOSITIVO
   ========================================== */

/* ── TABLETS EN VERTICAL Y PANTALLAS MEDIANAS (<= 768px) ── */
@media (max-width: 768px) {
    .analytics-filters-panel[b-lu5tjggszy] {
        padding: 1rem;
        gap: 0.75rem;
    }

    /* Forzar dropdowns y comparadores a tomar 100% de ancho */
    .analytics-filters-panel[b-lu5tjggszy] >  .k-dropdownlist {
        width: 100% !important;
    }

    .compare-toggle-container[b-lu5tjggszy] {
        width: 100% !important;
        margin-left: 0 !important;
        justify-content: space-between;
    }
}

/* ── SMARTPHONES ESTÁNDAR Y GRANDES (<= 576px) ── */
@media (max-width: 576px) {
    /* Apilamiento de rango de fechas personalizado */
    .date-pickers-group[b-lu5tjggszy] {
        flex-direction: column;
        align-items: stretch;
        width: 100%;
        gap: 0.5rem;
    }

    .date-pickers-group[b-lu5tjggszy]  .k-datepicker {
        width: 100% !important;
    }

    .date-pickers-group span[b-lu5tjggszy] {
        text-align: center;
        font-weight: 600;
        font-size: 0.85rem;
    }

    /* Reducción de padding y optimización de textos de gráficas */
    .chart-card[b-lu5tjggszy] {
        padding: 1rem;
    }
    .chart-card-title[b-lu5tjggszy] {
        font-size: 0.95rem;
    }
    .chart-card-subtitle[b-lu5tjggszy] {
        font-size: 0.775rem;
        margin-bottom: 0.75rem;
    }
}

/* ── CELULARES MUY COMPACTOS (<= 375px, cubriendo 320x667) ── */
@media (max-width: 375px) {
    .analytics-filters-panel[b-lu5tjggszy] {
        padding: 0.75rem;
    }

    /* Fuentes y paddings compactos para 320px */
    .metric-card[b-lu5tjggszy] {
        padding: 0.75rem;
    }

    .metric-value[b-lu5tjggszy] {
        font-size: 1.45rem;
    }

    .chart-card[b-lu5tjggszy] {
        padding: 0.75rem;
    }

    /* Reducir padding de banner y botones de acción en pantallas muy angostas */
    [b-lu5tjggszy] .welcome-banner {
        padding: 12px 10px !important;
    }
    [b-lu5tjggszy] .btn-new-order {
        padding: 8px 12px !important;
        font-size: 0.75rem !important;
        gap: 6px !important;
    }
}
/* /Pages/Analitycs/Tabs/Customers/AnalyticsCustomersTab.razor.rz.scp.css */
.metrics-grid[b-rl8ow4e3bx] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.metric-card[b-rl8ow4e3bx] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.metric-card:hover[b-rl8ow4e3bx] {
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.metric-header[b-rl8ow4e3bx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #6b7280;
    font-size: 0.875rem;
    font-weight: 500;
}

.metric-value[b-rl8ow4e3bx] {
    font-size: 1.75rem;
    font-weight: 700;
    color: #111827;
    line-height: 1.2;
}

.metric-comparison[b-rl8ow4e3bx] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.775rem;
}

.metric-badge[b-rl8ow4e3bx] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    border-radius: 9999px;
    font-weight: 600;
}

.metric-badge.positive[b-rl8ow4e3bx] {
    background-color: #dcfce7;
    color: #15803d;
}

.metric-badge.negative[b-rl8ow4e3bx] {
    background-color: #fee2e2;
    color: #b91c1c;
}

.metric-badge.neutral[b-rl8ow4e3bx] {
    background-color: #f3f4f6;
    color: #4b5563;
}

.metric-label-compare[b-rl8ow4e3bx] {
    color: #9ca3af;
}

.chart-card[b-rl8ow4e3bx] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    margin-bottom: 1rem;
    height: 100%;
}

.chart-card-title[b-rl8ow4e3bx] {
    font-size: 1rem;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 0.25rem;
}

.chart-card-subtitle[b-rl8ow4e3bx] {
    font-size: 0.825rem;
    color: #6b7280;
    margin-bottom: 1.25rem;
}

.empty-state[b-rl8ow4e3bx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 2rem;
    text-align: center;
    color: #9ca3af;
}

.empty-state-icon[b-rl8ow4e3bx] {
    font-size: 2.5rem;
    margin-bottom: 1rem;
    color: #cbd5e1;
}

.empty-state-text[b-rl8ow4e3bx] {
    font-size: 0.95rem;
    font-weight: 500;
}

[b-rl8ow4e3bx] .k-grid {
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #e5e7eb;
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
}

[b-rl8ow4e3bx] .k-grid-header {
    background-color: #f9fafb;
}

[b-rl8ow4e3bx] .k-grid td {
    padding: 10px 12px;
    font-size: 0.875rem;
}
/* /Pages/Analitycs/Tabs/Employees/AnalyticsEmployeesTab.razor.rz.scp.css */
.metrics-grid[b-kn0qr13to2] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.metric-card[b-kn0qr13to2] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.metric-card:hover[b-kn0qr13to2] {
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.metric-header[b-kn0qr13to2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #6b7280;
    font-size: 0.875rem;
    font-weight: 500;
}

.metric-value[b-kn0qr13to2] {
    font-size: 1.75rem;
    font-weight: 700;
    color: #111827;
    line-height: 1.2;
}

.metric-comparison[b-kn0qr13to2] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.775rem;
}

.metric-badge[b-kn0qr13to2] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    border-radius: 9999px;
    font-weight: 600;
}

.metric-badge.positive[b-kn0qr13to2] {
    background-color: #dcfce7;
    color: #15803d;
}

.metric-badge.negative[b-kn0qr13to2] {
    background-color: #fee2e2;
    color: #b91c1c;
}

.metric-badge.neutral[b-kn0qr13to2] {
    background-color: #f3f4f6;
    color: #4b5563;
}

.metric-label-compare[b-kn0qr13to2] {
    color: #9ca3af;
}

.row.g-3 > [class*="col-"][b-kn0qr13to2] {
    display: flex;
    flex-direction: column;
}

.chart-card[b-kn0qr13to2] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    margin-bottom: 1rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    flex: 1;
}


.chart-card-title[b-kn0qr13to2] {
    font-size: 1rem;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 0.25rem;
}

.chart-card-subtitle[b-kn0qr13to2] {
    font-size: 0.825rem;
    color: #6b7280;
    margin-bottom: 1.25rem;
}

.empty-state[b-kn0qr13to2] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 2rem;
    text-align: center;
    color: #9ca3af;
}

.empty-state-icon[b-kn0qr13to2] {
    font-size: 2.5rem;
    margin-bottom: 1rem;
    color: #cbd5e1;
}

.empty-state-text[b-kn0qr13to2] {
    font-size: 0.95rem;
    font-weight: 500;
}

[b-kn0qr13to2] .k-grid {
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #e5e7eb;
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
}

[b-kn0qr13to2] .k-grid-header {
    background-color: #f9fafb;
}

[b-kn0qr13to2] .k-grid td {
    padding: 10px 12px;
    font-size: 0.875rem;
}
/* /Pages/Analitycs/Tabs/Inventory/AnalyticsInventoryTab.razor.rz.scp.css */
.metrics-grid[b-w7jvg87bhm] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.metric-card[b-w7jvg87bhm] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.metric-card:hover[b-w7jvg87bhm] {
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.metric-header[b-w7jvg87bhm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #6b7280;
    font-size: 0.875rem;
    font-weight: 500;
}

.metric-value[b-w7jvg87bhm] {
    font-size: 1.75rem;
    font-weight: 700;
    color: #111827;
    line-height: 1.2;
}

.metric-comparison[b-w7jvg87bhm] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.775rem;
}

.metric-badge[b-w7jvg87bhm] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    border-radius: 9999px;
    font-weight: 600;
}

.metric-badge.positive[b-w7jvg87bhm] {
    background-color: #dcfce7;
    color: #15803d;
}

.metric-badge.negative[b-w7jvg87bhm] {
    background-color: #fee2e2;
    color: #b91c1c;
}

.metric-badge.neutral[b-w7jvg87bhm] {
    background-color: #f3f4f6;
    color: #4b5563;
}

.metric-label-compare[b-w7jvg87bhm] {
    color: #9ca3af;
}

.row.g-3 > [class*="col-"][b-w7jvg87bhm] {
    display: flex;
    flex-direction: column;
}

.chart-card[b-w7jvg87bhm] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    margin-bottom: 1rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    flex: 1;
}


.chart-card-title[b-w7jvg87bhm] {
    font-size: 1rem;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 0.25rem;
}

.chart-card-subtitle[b-w7jvg87bhm] {
    font-size: 0.825rem;
    color: #6b7280;
    margin-bottom: 1.25rem;
}

.empty-state[b-w7jvg87bhm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 2rem;
    text-align: center;
    color: #9ca3af;
}

.empty-state-icon[b-w7jvg87bhm] {
    font-size: 2.5rem;
    margin-bottom: 1rem;
    color: #cbd5e1;
}

.empty-state-text[b-w7jvg87bhm] {
    font-size: 0.95rem;
    font-weight: 500;
}

[b-w7jvg87bhm] .k-grid {
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #e5e7eb;
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
}

[b-w7jvg87bhm] .k-grid-header {
    background-color: #f9fafb;
}

[b-w7jvg87bhm] .k-grid td {
    padding: 10px 12px;
    font-size: 0.875rem;
}
/* /Pages/Analitycs/Tabs/Orders/AnalyticsOrdersTab.razor.rz.scp.css */
.metrics-grid[b-vo337hgvrc] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.metric-card[b-vo337hgvrc] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.metric-card:hover[b-vo337hgvrc] {
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.metric-header[b-vo337hgvrc] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #6b7280;
    font-size: 0.875rem;
    font-weight: 500;
}

.metric-value[b-vo337hgvrc] {
    font-size: 1.75rem;
    font-weight: 700;
    color: #111827;
    line-height: 1.2;
}

.metric-comparison[b-vo337hgvrc] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.775rem;
}

.metric-badge[b-vo337hgvrc] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    border-radius: 9999px;
    font-weight: 600;
}

.metric-badge.positive[b-vo337hgvrc] {
    background-color: #dcfce7;
    color: #15803d;
}

.metric-badge.negative[b-vo337hgvrc] {
    background-color: #fee2e2;
    color: #b91c1c;
}

.metric-badge.neutral[b-vo337hgvrc] {
    background-color: #f3f4f6;
    color: #4b5563;
}

.metric-label-compare[b-vo337hgvrc] {
    color: #9ca3af;
}

.row.g-3 > [class*="col-"][b-vo337hgvrc] {
    display: flex;
    flex-direction: column;
}

.chart-card[b-vo337hgvrc] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    margin-bottom: 1rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    flex: 1;
}


.chart-card-title[b-vo337hgvrc] {
    font-size: 1rem;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 0.25rem;
}

.chart-card-subtitle[b-vo337hgvrc] {
    font-size: 0.825rem;
    color: #6b7280;
    margin-bottom: 1.25rem;
}

.funnel-container[b-vo337hgvrc] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    margin-top: 1rem;
}

.funnel-stage-card[b-vo337hgvrc] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.85rem 1.25rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: all 0.2s ease;
}

.funnel-stage-card:hover[b-vo337hgvrc] {
    background: #f1f5f9;
}

.funnel-stage-info[b-vo337hgvrc] {
    display: flex;
    flex-direction: column;
}

.funnel-stage-title[b-vo337hgvrc] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #334155;
}

.funnel-stage-conversion[b-vo337hgvrc] {
    font-size: 0.775rem;
    color: #64748b;
}

.funnel-stage-value[b-vo337hgvrc] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #0f172a;
}

.empty-state[b-vo337hgvrc] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 2rem;
    text-align: center;
    color: #9ca3af;
}

.empty-state-icon[b-vo337hgvrc] {
    font-size: 2.5rem;
    margin-bottom: 1rem;
    color: #cbd5e1;
}

.empty-state-text[b-vo337hgvrc] {
    font-size: 0.95rem;
    font-weight: 500;
}
/* /Pages/Analitycs/Tabs/Sales/AnalyticsSalesTab.razor.rz.scp.css */
.metrics-grid[b-hxqhj4ih09] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.metric-card[b-hxqhj4ih09] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.25rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.metric-card:hover[b-hxqhj4ih09] {
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.metric-header[b-hxqhj4ih09] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #6b7280;
    font-size: 0.875rem;
    font-weight: 500;
}

.metric-value[b-hxqhj4ih09] {
    font-size: 1.75rem;
    font-weight: 700;
    color: #111827;
    line-height: 1.2;
}

.metric-comparison[b-hxqhj4ih09] {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    font-size: 0.775rem;
}

.metric-badge[b-hxqhj4ih09] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    border-radius: 9999px;
    font-weight: 600;
}

.metric-badge.positive[b-hxqhj4ih09] {
    background-color: #dcfce7;
    color: #15803d;
}

.metric-badge.negative[b-hxqhj4ih09] {
    background-color: #fee2e2;
    color: #b91c1c;
}

.metric-badge.neutral[b-hxqhj4ih09] {
    background-color: #f3f4f6;
    color: #4b5563;
}

.metric-label-compare[b-hxqhj4ih09] {
    color: #9ca3af;
}

.row.g-3 > [class*="col-"][b-hxqhj4ih09] {
    display: flex;
    flex-direction: column;
}

.chart-card[b-hxqhj4ih09] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    margin-bottom: 1rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    flex: 1;
}


.chart-card-title[b-hxqhj4ih09] {
    font-size: 1rem;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 0.25rem;
}

.chart-card-subtitle[b-hxqhj4ih09] {
    font-size: 0.825rem;
    color: #6b7280;
    margin-bottom: 1.25rem;
}

.empty-state[b-hxqhj4ih09] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3rem 2rem;
    text-align: center;
    color: #9ca3af;
}

.empty-state-icon[b-hxqhj4ih09] {
    font-size: 2.5rem;
    margin-bottom: 1rem;
    color: #cbd5e1;
}

.empty-state-text[b-hxqhj4ih09] {
    font-size: 0.95rem;
    font-weight: 500;
}
/* /Pages/ApiReference/ApiReference.razor.rz.scp.css */
/* ==========================================================================
   Aurocore — API Reference: Dark Terminal & Liquid Glass
   ========================================================================== */

.api-page[b-nxfwbywctj] {
    --glass-bg: rgba(255, 255, 255, 0.85);
    --glass-border: rgba(226, 232, 240, 0.8);
    --glass-specular: inset 0 1px 1.5px 0 rgba(255, 255, 255, 0.9), inset 0 -1px 2px 0 rgba(0, 0, 0, 0.03);
    --glass-shadow: 0 12px 36px -8px rgba(9, 61, 147, 0.08);
    --glass-shadow-hover: 0 20px 45px -8px rgba(9, 61, 147, 0.14);

    --brand-blue: #093d93;
    --brand-blue-light: #1a5bc4;
    --brand-orange: #ed7024;
    --brand-orange-light: #fd8c1d;
    --brand-orange-glow: rgba(237, 112, 36, 0.35);

    --slate-900: #09224f;
    --slate-800: #13376b;
    --slate-700: #1e3a5f;
    --slate-600: #2c4d75;
    --slate-500: #476487;
    --slate-200: #e2e8f0;
    --slate-100: #f1f5f9;
    --slate-50: #f8fafc;

    --emerald: #10b981;
    --purple: #8b5cf6;

    --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);

    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: #f8fafc;
    color: var(--text-heading-primary, #09224f);
    font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

.api-main[b-nxfwbywctj] { flex: 1 0 auto; width: 100%; }

.api-container[b-nxfwbywctj] {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 clamp(1rem, 3vw, 2rem);
}

/* Hero */
.api-hero[b-nxfwbywctj] {
    position: relative;
    padding: clamp(7rem, 14vw, 9rem) 0 clamp(3rem, 5vw, 4rem);
    background-color: #f8fafc;
    overflow: hidden;
}

.hero-ambient-mesh[b-nxfwbywctj] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

.mesh-orb[b-nxfwbywctj] {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.6;
    will-change: transform;
}

.orb-blue[b-nxfwbywctj] {
    top: -15%;
    left: 10%;
    width: clamp(300px, 40vw, 600px);
    height: clamp(300px, 40vw, 600px);
    background: radial-gradient(circle, rgba(9, 61, 147, 0.15) 0%, transparent 70%);
}

.orb-purple[b-nxfwbywctj] {
    bottom: -15%;
    right: 5%;
    width: clamp(250px, 35vw, 500px);
    height: clamp(250px, 35vw, 500px);
    background: radial-gradient(circle, rgba(139, 92, 246, 0.15) 0%, transparent 70%);
}

.hero-grid-pattern[b-nxfwbywctj] {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(9, 61, 147, 0.04) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
    z-index: 0;
}

.hero-header[b-nxfwbywctj] {
    position: relative;
    z-index: 1;
    max-width: 800px;
    margin: 0 auto;
}

.hero-badge[b-nxfwbywctj] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 1rem;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 16px -4px rgba(9, 61, 147, 0.08);
    backdrop-filter: blur(16px);
    font-size: 0.82rem;
    font-weight: 500;
    color: #475569;
    margin-bottom: 1.5rem;
}

.badge-dot-orange[b-nxfwbywctj] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #ed7024;
    box-shadow: 0 0 6px rgba(237, 112, 36, 0.35);
}

.badge-separator[b-nxfwbywctj] { color: var(--slate-200); font-weight: 300; }
.badge-subtext[b-nxfwbywctj] { color: var(--brand-orange); font-weight: 600; }

.hero-title[b-nxfwbywctj] {
    font-size: clamp(2rem, 5vw, 3.25rem);
    font-weight: 800;
    line-height: 1.15;
    color: #0f172a;
    margin: 0 0 1.25rem;
    letter-spacing: -0.02em;
}

.highlight-orange[b-nxfwbywctj] {
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.hero-lead[b-nxfwbywctj] {
    font-size: clamp(1rem, 2vw, 1.18rem);
    color: var(--slate-600);
    line-height: 1.7;
    margin: 0 0 2rem;
}

.hero-actions[b-nxfwbywctj] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
}

.btn-api-primary[b-nxfwbywctj] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.85rem 2rem;
    border-radius: 12px;
    background: var(--brand-blue);
    color: white;
    font-weight: 700;
    font-size: 0.95rem;
    text-decoration: none;
    transition: all 0.3s var(--ease-spring);
    box-shadow: 0 4px 16px rgba(9, 61, 147, 0.25);
}

.btn-api-primary:hover[b-nxfwbywctj] {
    background: var(--brand-orange);
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(237, 112, 36, 0.35);
}

.btn-api-outline[b-nxfwbywctj] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.85rem 1.75rem;
    border-radius: 12px;
    background: var(--glass-bg);
    border: 1px solid var(--slate-200);
    color: var(--slate-700);
    font-weight: 600;
    font-size: 0.92rem;
    text-decoration: none;
    backdrop-filter: blur(12px);
    transition: all 0.3s var(--ease-spring);
}

.btn-api-outline:hover[b-nxfwbywctj] {
    border-color: var(--emerald);
    color: var(--emerald);
    transform: translateY(-2px);
}

/* API Explorer Section */
.api-explorer-section[b-nxfwbywctj] {
    padding: clamp(3rem, 6vw, 5rem) 0 clamp(4rem, 8vw, 6rem);
    background: white;
}

.api-grid[b-nxfwbywctj] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2.5rem;
    align-items: center;
    margin-bottom: 4rem;
}

@media (min-width: 992px) {
    .api-grid[b-nxfwbywctj] {
        grid-template-columns: 1fr 1.2fr;
    }
}

.section-kicker[b-nxfwbywctj] {
    display: inline-block;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--brand-orange);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 0.5rem;
}

.section-title[b-nxfwbywctj] {
    font-size: clamp(1.5rem, 3.5vw, 2.25rem);
    font-weight: 800;
    color: var(--slate-900);
    letter-spacing: -0.02em;
    margin: 0 0 1rem;
}

.section-subtitle[b-nxfwbywctj] {
    font-size: 0.95rem;
    color: var(--slate-600);
    line-height: 1.7;
    margin: 0 0 2rem;
}

.api-highlights[b-nxfwbywctj] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.highlight-item[b-nxfwbywctj] {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
}

.highlight-icon[b-nxfwbywctj] {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    flex-shrink: 0;
}

.highlight-icon.blue[b-nxfwbywctj] { background: rgba(9, 61, 147, 0.08); color: var(--brand-blue); border: 1px solid rgba(9, 61, 147, 0.15); }
.highlight-icon.orange[b-nxfwbywctj] { background: rgba(237, 112, 36, 0.08); color: var(--brand-orange); border: 1px solid rgba(237, 112, 36, 0.18); }
.highlight-icon.emerald[b-nxfwbywctj] { background: rgba(9, 61, 147, 0.08); color: var(--brand-blue); border: 1px solid rgba(9, 61, 147, 0.15); }

.highlight-item h4[b-nxfwbywctj] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--slate-900);
    margin: 0 0 0.25rem;
}

.highlight-item p[b-nxfwbywctj] {
    font-size: 0.85rem;
    color: var(--slate-500);
    line-height: 1.6;
    margin: 0;
}

/* Terminal Card */
.terminal-card[b-nxfwbywctj] {
    border-radius: 18px;
    background: #0d1117;
    border: 1px solid #30363d;
    box-shadow: 0 20px 50px -10px rgba(0, 0, 0, 0.35);
    overflow: hidden;
}

.terminal-header[b-nxfwbywctj] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1rem;
    background: #161b22;
    border-bottom: 1px solid #30363d;
}

.terminal-dots[b-nxfwbywctj] {
    display: flex;
    gap: 6px;
}

.dot[b-nxfwbywctj] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.dot.red[b-nxfwbywctj] { background: #ff5f57; }
.dot.yellow[b-nxfwbywctj] { background: #ffbd2e; }
.dot.green[b-nxfwbywctj] { background: #28c840; }

.terminal-tabs[b-nxfwbywctj] {
    display: flex;
    gap: 4px;
}

.tab-btn[b-nxfwbywctj] {
    padding: 0.3rem 0.75rem;
    border-radius: 6px;
    background: transparent;
    border: none;
    color: #8b949e;
    font-size: 0.75rem;
    font-weight: 600;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.2s ease;
}

.tab-btn.active[b-nxfwbywctj] {
    background: #21262d;
    color: #f0f6fc;
}

.terminal-body[b-nxfwbywctj] {
    padding: 1.25rem 1.5rem;
    overflow-x: auto;
}

.terminal-body pre[b-nxfwbywctj] {
    margin: 0;
    font-family: 'Fira Code', 'JetBrains Mono', Consolas, monospace;
    font-size: 0.85rem;
    line-height: 1.6;
    color: #c9d1d9;
}

.code-comment[b-nxfwbywctj] { color: #8b949e; font-style: italic; }
.code-kw[b-nxfwbywctj] { color: #ff7b72; }
.code-str[b-nxfwbywctj] { color: #a5d6ff; }
.code-key[b-nxfwbywctj] { color: #79c0ff; }
.code-num[b-nxfwbywctj] { color: #ffa657; }

.terminal-footer[b-nxfwbywctj] {
    display: flex;
    justify-content: flex-end;
    padding: 0.6rem 1.25rem;
    background: #161b22;
    border-top: 1px solid #30363d;
}

.response-badge[b-nxfwbywctj] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-family: monospace;
    font-size: 0.75rem;
}

.status-200[b-nxfwbywctj] {
    color: #3fb950;
    font-weight: 700;
    background: rgba(63, 185, 80, 0.15);
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
}

.response-time[b-nxfwbywctj] {
    color: #8b949e;
}

/* Endpoints Table */
.endpoints-summary[b-nxfwbywctj] {
    margin-top: 2rem;
}

.endpoints-title[b-nxfwbywctj] {
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--slate-900);
    margin-bottom: 1.25rem;
}

.endpoints-table-card[b-nxfwbywctj] {
    border-radius: 18px;
    background: var(--slate-50);
    border: 1px solid var(--slate-200);
    overflow: hidden;
}

.endpoint-row[b-nxfwbywctj] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--slate-200);
    font-size: 0.9rem;
}

.endpoint-row:last-child[b-nxfwbywctj] {
    border-bottom: none;
}

.http-badge[b-nxfwbywctj] {
    font-family: monospace;
    font-size: 0.72rem;
    font-weight: 800;
    padding: 0.2rem 0.5rem;
    border-radius: 6px;
    min-width: 50px;
    text-align: center;
}

.http-badge.get[b-nxfwbywctj] { background: rgba(9, 61, 147, 0.1); color: var(--brand-blue); }
.http-badge.post[b-nxfwbywctj] { background: rgba(16, 185, 129, 0.1); color: var(--emerald); }

.endpoint-path[b-nxfwbywctj] {
    font-family: monospace;
    font-weight: 700;
    color: var(--slate-900);
    min-width: 180px;
}

.endpoint-desc[b-nxfwbywctj] {
    color: var(--slate-600);
    font-size: 0.85rem;
    flex: 1;
}

@media (max-width: 767px) {
    .endpoint-row[b-nxfwbywctj] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.4rem;
    }
}
/* /Pages/Auth/Checkout/Checkout.razor.rz.scp.css */
.checkout-page-container[b-tkux6mofpa] {
    --primary-color: #093d93;
    --primary-hover: #072e70;
    --primary-gradient: linear-gradient(135deg, #093d93 0%, #1a5bc4 100%);
    --primary-rgba: rgba(9, 61, 147, 0.12);
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    background: radial-gradient(circle at 50% 0%, #f8fafc 0%, #e2e8f0 100%);
    padding: 40px 20px;
    box-sizing: border-box;
    overflow-x: hidden;
}

.checkout-content[b-tkux6mofpa] {
    background-color: #ffffff;
    border-radius: 20px;
    padding: 36px 40px;
    box-shadow: 0 20px 40px -15px rgba(15, 23, 42, 0.08), 0 0 1px 1px rgba(15, 23, 42, 0.04);
    width: 100%;
    max-width: 720px;
    margin: auto;
    box-sizing: border-box;
}

.checkout-loading-card[b-tkux6mofpa],
.checkout-loading-state[b-tkux6mofpa],
.checkout-error-state[b-tkux6mofpa] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 32px 16px;
}

.brand-loader-container[b-tkux6mofpa] {
    position: relative;
    width: 140px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.brand-loader-logo[b-tkux6mofpa] {
    max-width: 120px;
    max-height: 44px;
    object-fit: contain;
    animation: brand-pulse-b-tkux6mofpa 2s ease-in-out infinite;
}

.brand-loader-spinner[b-tkux6mofpa] {
    position: absolute;
    width: 68px;
    height: 68px;
    border-radius: 50%;
    border: 3px solid rgba(9, 61, 147, 0.12);
    border-top-color: #093d93;
    border-right-color: #ed7024;
    animation: rotateSlow-b-tkux6mofpa 1.5s linear infinite;
}

@keyframes brand-pulse-b-tkux6mofpa {
    0%, 100% {
        transform: scale(1);
        opacity: 0.95;
    }
    50% {
        transform: scale(1.05);
        opacity: 1;
    }
}

@keyframes rotateSlow-b-tkux6mofpa {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.brand-loader-title[b-tkux6mofpa] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #0f172a;
}

.loading-dots[b-tkux6mofpa] {
    font-size: 2rem;
    line-height: 1;
    color: #093d93;
    display: flex;
    justify-content: center;
    gap: 4px;
}

.loading-dots span[b-tkux6mofpa] {
    animation: dots-b-tkux6mofpa 1.4s infinite;
}

.loading-dots span:nth-child(1)[b-tkux6mofpa] { animation-delay: 0.2s; }
.loading-dots span:nth-child(2)[b-tkux6mofpa] { animation-delay: 0.4s; }
.loading-dots span:nth-child(3)[b-tkux6mofpa] { animation-delay: 0.6s; }

@keyframes dots-b-tkux6mofpa {
    0%, 20% { opacity: 0; transform: translateY(0); }
    50% { opacity: 1; transform: translateY(-4px); }
    80%, 100% { opacity: 0; transform: translateY(0); }
}

.checkout-header[b-tkux6mofpa] {
    text-align: center;
    margin-bottom: 24px;
}

.checkout-header h2[b-tkux6mofpa] {
    font-size: 24px;
    font-weight: 700;
    color: #0f172a;
    margin-bottom: 6px;
}

.checkout-header p[b-tkux6mofpa] {
    margin: 4px 0;
    color: #64748b;
}

.payment-icon-wrapper[b-tkux6mofpa] {
    width: 54px;
    height: 54px;
    margin: 0 auto 12px auto;
    border-radius: 50%;
    background: rgba(9, 61, 147, 0.08);
    color: #093d93;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.6rem;
}

.payment-summary-card[b-tkux6mofpa] {
    background: #f8fafc;
    border-radius: 12px;
    padding: 16px 20px;
    border: 1px solid #e2e8f0;
}

.payment-summary-header[b-tkux6mofpa] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.payment-summary-title[b-tkux6mofpa] {
    font-size: 1rem;
    color: #495057;
    font-weight: 600;
}

.periodicity-container[b-tkux6mofpa] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.periodicity-label[b-tkux6mofpa] {
    white-space: nowrap;
}

.plan-name-highlight[b-tkux6mofpa] {
    color: #093d93;
    font-size: 1.1rem;
    font-weight: 700;
}

.billing-cycle-selector[b-tkux6mofpa] {
    display: inline-flex;
    background: #f1f5f9;
    padding: 3px;
    border-radius: 20px;
    gap: 2px;
    user-select: none;
    box-sizing: border-box;
    border: 1px solid #e2e8f0;
}

.billing-cycle-btn[b-tkux6mofpa] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: none;
    background: transparent;
    padding: 5px 14px;
    border-radius: 16px;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #64748b;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    white-space: nowrap;
}

.billing-cycle-btn:hover:not(:disabled)[b-tkux6mofpa] {
    color: #093d93;
}

.billing-cycle-btn.active[b-tkux6mofpa] {
    background: #ffffff !important;
    color: #093d93 !important;
    font-weight: 700 !important;
    box-shadow: 0 1px 4px rgba(15, 23, 42, 0.12) !important;
}

.billing-cycle-btn:disabled[b-tkux6mofpa] {
    opacity: 0.6;
    cursor: not-allowed;
}

.badge-discount-subtle[b-tkux6mofpa] {
    font-size: 0.6875rem;
    font-weight: 700;
    color: #ed7024;
    background: rgba(237, 112, 36, 0.12);
    padding: 1px 6px;
    border-radius: 10px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.price-display[b-tkux6mofpa] {
    font-size: 32px !important;
    font-weight: 800 !important;
    color: #093d93 !important;
    margin-top: 16px !important;
}

.checkout-actions-row[b-tkux6mofpa] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.checkout-actions-row .btn-outline-primary-arregly[b-tkux6mofpa] {
    background: transparent !important;
    color: #093d93 !important;
    border: 1.5px solid #093d93 !important;
    box-shadow: none !important;
    min-height: 42px;
    padding: 8px 20px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

.checkout-actions-row .btn-outline-primary-arregly:hover[b-tkux6mofpa] {
    background: rgba(9, 61, 147, 0.08) !important;
    color: #093d93 !important;
}

@media (max-width: 768px) {
    .checkout-page-container[b-tkux6mofpa] {
        padding: 20px 12px;
    }

    .checkout-content[b-tkux6mofpa] {
        padding: 24px 16px;
        border-radius: 14px;
    }
}

@media (max-width: 576px) {
    .checkout-page-container[b-tkux6mofpa] {
        padding: 16px 8px;
    }

    .checkout-content[b-tkux6mofpa] {
        padding: 20px 14px;
        border-radius: 12px;
    }

    .payment-summary-card[b-tkux6mofpa] {
        padding: 14px 12px;
    }

    .payment-summary-header[b-tkux6mofpa] {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }

    .periodicity-container[b-tkux6mofpa] {
        width: 100%;
        justify-content: space-between;
        gap: 6px;
    }

    .billing-cycle-selector[b-tkux6mofpa] {
        flex: 1;
        display: flex;
        width: 100%;
    }

    .billing-cycle-btn[b-tkux6mofpa] {
        flex: 1;
        padding: 5px 6px;
        font-size: 0.75rem;
        gap: 4px;
    }

    .badge-discount-subtle[b-tkux6mofpa] {
        font-size: 0.625rem;
        padding: 1px 4px;
    }
}

@media (max-width: 360px) {
    .checkout-page-container[b-tkux6mofpa] {
        padding: 12px 6px;
    }

    .checkout-content[b-tkux6mofpa] {
        padding: 16px 10px;
    }

    .payment-summary-card[b-tkux6mofpa] {
        padding: 12px 8px;
    }

    .periodicity-container[b-tkux6mofpa] {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .billing-cycle-selector[b-tkux6mofpa] {
        width: 100%;
    }

    .billing-cycle-btn[b-tkux6mofpa] {
        padding: 5px 4px;
        font-size: 0.72rem;
    }
}
/* /Pages/Auth/Checkout/Components/CheckoutMercadoPagoSection.razor.rz.scp.css */
.mp-checkout-section[b-jncm2lzhlz] {
    padding: 4px 2px;
}

.mp-tabs-header[b-jncm2lzhlz] {
    display: flex;
    gap: 6px;
    margin-bottom: 24px;
    background: #f1f5f9;
    padding: 6px;
    border-radius: 12px;
    justify-content: center;
    overflow-x: auto;
    border: 1px solid #e2e8f0;
}

.mp-tab-btn[b-jncm2lzhlz] {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 14px;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 8px;
    font-size: 13.5px;
    font-weight: 500;
    color: #64748b;
    cursor: pointer;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
    white-space: nowrap;
}

.mp-tab-btn:hover[b-jncm2lzhlz] {
    color: #093d93;
    background: rgba(255, 255, 255, 0.7);
}

.mp-tab-btn.active[b-jncm2lzhlz] {
    color: #093d93 !important;
    background: #ffffff !important;
    font-weight: 600 !important;
    border-color: rgba(9, 61, 147, 0.12) !important;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.08) !important;
}

.mp-tab-btn .k-svg-icon[b-jncm2lzhlz] {
    font-size: 1.1rem;
    transition: transform 0.2s ease;
}

.mp-tab-btn.active .k-svg-icon[b-jncm2lzhlz] {
    transform: scale(1.08);
}

.form-label[b-jncm2lzhlz] {
    display: block;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #344054;
    margin-bottom: 4px;
}

/* Controles de Tarjeta (Mercado Pago CardForm) sincronizados con los tokens oficiales de Arregly */
.mp-card-control[b-jncm2lzhlz] {
    height: 30px;
    min-height: 30px;
    border-radius: 12px;
    border: 1px solid #d0d5dd;
    background-color: #ffffff;
    font-size: 13px;
    padding: 0 12px;
    box-sizing: border-box;
    color: #101828;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.mp-card-control[b-jncm2lzhlz]::placeholder {
    color: #98a2b3 !important;
}

.mp-card-control:hover[b-jncm2lzhlz] {
    border-color: var(--primary-color, #093d93) !important;
    box-shadow: 0 0 0 3px var(--primary-rgba-color, rgba(9, 61, 147, 0.15)) !important;
}

.mp-card-control:focus[b-jncm2lzhlz],
.mp-card-control:focus-within[b-jncm2lzhlz] {
    border-color: var(--primary-color, #093d93) !important;
    box-shadow: 0 0 0 3px var(--primary-rgba-color, rgba(9, 61, 147, 0.15)) !important;
    outline: none !important;
}

select.mp-card-control.mp-card-select[b-jncm2lzhlz] {
    padding: 0 28px 0 12px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 12px;
    cursor: pointer;
}

.mp-input-container[b-jncm2lzhlz] {
    display: flex;
    align-items: center;
    overflow: hidden;
}

/* Sincronización de iframes de Mercado Pago */
.mp-input-container iframe[b-jncm2lzhlz] {
    width: 100% !important;
    height: 100% !important;
    border: none !important;
}

.alert-pse-brand[b-jncm2lzhlz] {
    background-color: #f0f4fc;
    border: 1px solid #d0e1fd;
    color: #093d93;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 500;
}

.checkout-actions-row[b-jncm2lzhlz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    margin-top: 24px;
    padding-top: 18px;
    border-top: 1px solid #f1f5f9;
}

.checkout-actions-row .btn-arregly[b-jncm2lzhlz] {
    min-height: 42px;
    padding: 8px 22px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

.checkout-actions-row .btn-gradient-primary-arregly[b-jncm2lzhlz] {
    background: linear-gradient(135deg, #093d93 0%, #1a5bc4 100%) !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 2px 6px rgba(9, 61, 147, 0.25) !important;
}

.checkout-actions-row .btn-gradient-primary-arregly:hover:not(:disabled)[b-jncm2lzhlz] {
    opacity: 0.92;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(9, 61, 147, 0.35) !important;
}

.checkout-actions-row .btn-gradient-primary-arregly:disabled[b-jncm2lzhlz] {
    opacity: 0.65;
    cursor: not-allowed;
    transform: none;
}

.checkout-actions-row .btn-outline-primary-arregly[b-jncm2lzhlz] {
    background: transparent !important;
    color: #093d93 !important;
    border: 1.5px solid #093d93 !important;
    box-shadow: none !important;
}

.checkout-actions-row .btn-outline-primary-arregly:hover[b-jncm2lzhlz] {
    background: rgba(9, 61, 147, 0.08) !important;
    color: #093d93 !important;
    border-color: #093d93 !important;
}

.mp-wallet-brick-container[b-jncm2lzhlz] {
    min-width: 200px;
    display: flex;
    justify-content: flex-end;
}

@media (max-width: 576px) {
    .mp-tabs-header[b-jncm2lzhlz] {
        flex-direction: column;
        gap: 4px;
    }

    .mp-tab-btn[b-jncm2lzhlz] {
        width: 100%;
        justify-content: flex-start;
        padding: 10px 12px;
    }

    .checkout-actions-row[b-jncm2lzhlz] {
        flex-direction: column-reverse;
        gap: 12px;
    }

    .checkout-actions-row button[b-jncm2lzhlz],
    .checkout-actions-row .btn-arregly[b-jncm2lzhlz],
    .checkout-actions-row .mp-wallet-brick-container[b-jncm2lzhlz] {
        width: 100%;
        justify-content: center;
    }
}

@media (max-width: 360px) {
    .mp-checkout-section[b-jncm2lzhlz] {
        padding: 0;
    }

    .mp-tab-btn[b-jncm2lzhlz] {
        font-size: 12.5px;
        padding: 8px 10px;
    }
}
/* /Pages/Auth/Login/Login.razor.rz.scp.css */
/* ===== SOBRECARGAS DE LAYOUT TELERIK ===== */
/* TelerikStackLayout renderiza k-stacklayout con flex propio; se sobrecargan para mantener el dise�o original */

/* ===== TEMA BASE AUROCORE PARA LOGIN ===== */
.login-scope[b-w0zlg4ri7b] {
    --primary-color: #093d93 !important;
    --primary-dark: #09224f !important;
    --primary-gradient: linear-gradient(135deg, #093d93 0%, #1a5bc4 100%) !important;
    --primary-text-color: #ffffff !important;
    --primary-rgba-color: rgba(9, 61, 147, 0.15) !important;
    --RgbaColor01: rgba(9, 61, 147, 0.15) !important;
    --RgbaColor02: rgba(9, 61, 147, 0.25) !important;
    --RgbaColor03: rgba(9, 61, 147, 0.08) !important;
    --RgbaColor04: rgba(9, 61, 147, 0.40) !important;
    --RgbaColor05: rgba(9, 61, 147, 0.50) !important;
    width: 100%;
}

.login-scope[b-w0zlg4ri7b]  .btn-gradient-primary-arregly,
[b-w0zlg4ri7b] .login-scope .btn-gradient-primary-arregly,
[b-w0zlg4ri7b] .btn-gradient-primary-arregly,
.btn-gradient-primary-arregly[b-w0zlg4ri7b] {
    background: linear-gradient(135deg, #093d93 0%, #1a5bc4 100%) !important;
    color: #ffffff !important;
    border: none !important;
}

.login-scope[b-w0zlg4ri7b]  .btn-gradient-primary-arregly:hover,
[b-w0zlg4ri7b] .login-scope .btn-gradient-primary-arregly:hover,
[b-w0zlg4ri7b] .btn-gradient-primary-arregly:hover,
.btn-gradient-primary-arregly:hover[b-w0zlg4ri7b] {
    opacity: 0.9 !important;
}

.login-container-clean[b-w0zlg4ri7b] {
    display: flex;
    min-height: 100vh;
    width: 100%;
}

/* El contenedor ra�z de Telerik StackLayout no debe restringir a sus hijos */
[b-w0zlg4ri7b] .login-container-clean.k-stacklayout {
    display: flex !important;
    flex-direction: row !important;
    min-height: 100vh !important;
    width: 100% !important;
    gap: 0 !important;
}

.left-panel[b-w0zlg4ri7b] {
    flex: 1.5;
    background: var(--primary-gradient);
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 0;
    color: white;
    overflow: hidden;
    
}

.left-panel-content[b-w0zlg4ri7b] {
    width: 100%;
    height: 100vh;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

/* ===== PANEL IZQUIERDO - CARRUSEL ===== */
.carousel-container[b-w0zlg4ri7b] {
    width: 100%;
    position: relative;
    height: 100%;
}

.carousel-slide[b-w0zlg4ri7b] {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 0.45s ease-in-out;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    pointer-events: none;
}

.carousel-slide.active[b-w0zlg4ri7b] {
    opacity: 1;
    pointer-events: auto;
}

.slide-content[b-w0zlg4ri7b] {
    width: 100%;
    height: 100%;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.slide-image[b-w0zlg4ri7b] {
    position: absolute;
    inset: 0;
    margin: 0;
    text-align: center;
    display: flex;
    justify-content: center;
    z-index: 1;
}

.slide-image[b-w0zlg4ri7b]::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(15, 23, 42, 0.58) 0%, rgba(15, 23, 42, 0.42) 46%, rgba(15, 23, 42, 0.78) 100%);
}

.slide-image picture[b-w0zlg4ri7b] {
    display: block;
    width: 100%;
    height: 100%;
}

.slide-photo[b-w0zlg4ri7b] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0;
    border: 0;
    box-shadow: none;
    display: block;
}

.placeholder-image[b-w0zlg4ri7b] {
    width: 180px;
    height: 180px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.placeholder-icon[b-w0zlg4ri7b] {
    width: 80px !important;
    height: 80px !important;
    color: rgba(255, 255, 255, 0.8);
}

.slide-text[b-w0zlg4ri7b] {
    width: 100%;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 96px;
    z-index: 2;
    text-align: center;
    padding: 0 28px;
}

.slide-text h3[b-w0zlg4ri7b] {
    font-size: 2rem;
    font-weight: 900;
    margin: 0 0 20px;
    color: white;
}

.slide-text p[b-w0zlg4ri7b] {
    font-size: 1.2rem;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.9);
    width: 100%;
    margin: 0;
}

.carousel-indicators-wrap[b-w0zlg4ri7b] {
    position: absolute;
    bottom: 24px;
    left: 0;
    right: 0;
    display: flex;
    justify-content: center;
    width: 100%;
    z-index: 3;
}

.carousel-indicators[b-w0zlg4ri7b] {
    position: static;
    transform: none;
    left: auto;
    gap: 12px;
    width: max-content;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0;
}

.indicator[b-w0zlg4ri7b] {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: none;
    background: rgba(255, 255, 255, 0.46);
    cursor: pointer;
    transition: all 0.3s ease;
}

.indicator.active[b-w0zlg4ri7b] {
    background: #ed7024;
    transform: scale(1.15);
    box-shadow: 0 0 8px rgba(237, 112, 36, 0.5);
}

.indicator:hover[b-w0zlg4ri7b] {
    background: rgba(255, 255, 255, 0.6);
}

/* ===== PANEL DERECHO - FORMULARIO ===== */
.right-panel[b-w0zlg4ri7b] {
    flex: 2;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
    position: relative;
    overflow: hidden;
}

.right-panel[b-w0zlg4ri7b]::before {
    content: none;
    position: absolute;
    inset: 0;
    background: none;
    background-size: auto;
    background-repeat: no-repeat;
    opacity: 0;
    pointer-events: none;
    z-index: 0;
}

.page-actions-login[b-w0zlg4ri7b] {
    position: absolute;
    top: 32px;
    left: 15px;
    z-index: 2;
}

.page-actions-login .back-link[b-w0zlg4ri7b] {
    width: auto;
    max-width: none;
    margin: 0;
}

.page-actions-login .back-link[b-w0zlg4ri7b] {
    border: none;
    background: transparent;
    color: #6b7280;
    display: inline-flex;
    gap: 8px;
    align-items: center;
    cursor: pointer;
    font-size: 0.9rem;
    transition: color 0.2s ease;
    padding: 0;
}

.page-actions-login .back-link:hover[b-w0zlg4ri7b] {
    color: #111827;
}

.login-form-container[b-w0zlg4ri7b] {
    width: 100%;
    max-width: 400px;
    display: flex;
    flex-direction: column;
    position: relative;
    z-index: 1;
}

/* Logo */
.login-brand-logo[b-w0zlg4ri7b] {
    display: flex;
    text-align: center;
    margin-bottom: 10px;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.login-logo-icon[b-w0zlg4ri7b] {
    width: 50px;
    height: 50px;
    min-width: 50px;
    max-width: 50px;
    background: var(--primary-gradient);
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1px;
}

[b-w0zlg4ri7b] .login-logo-icon .k-svg-icon {
    color: white;
    width: 25px;
    height: 25px;
}

.login-brand-text[b-w0zlg4ri7b] {
    display: block;
    font-size: 2rem;
    font-weight: 700;
    color: #333;
    margin-bottom: 4px;
}

.login-brand-tagline[b-w0zlg4ri7b] {
    display: block;
    font-size: 1.1rem;
    color: #888;
    font-weight: 400;
}

.login-title[b-w0zlg4ri7b] {
    font-size: 2rem;
    font-weight: 700;
    color: #333;
    text-align: center;
    margin-bottom: 20px;
}

.modern-login-form[b-w0zlg4ri7b] {
    width: 100%;
}

[b-w0zlg4ri7b] .login-fields.k-stacklayout {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}

[b-w0zlg4ri7b] .login-field-group.k-stacklayout-item {
    width: 100%;

}
[b-w0zlg4ri7b] .login-password-container.k-stacklayout {
    gap: 0;
}

[b-w0zlg4ri7b] .login-password-container .k-stacklayout-item {
    width: 100%;
}

/* Mantiene inputs de login en blanco sin borde azul al escribir/enfocar */
[b-w0zlg4ri7b] .login-container-clean .textbox-arregly,
[b-w0zlg4ri7b] .login-container-clean .textbox-arregly:hover,
[b-w0zlg4ri7b] .login-container-clean .textbox-arregly.k-focus,
[b-w0zlg4ri7b] .login-container-clean .textbox-arregly:focus-within,
[b-w0zlg4ri7b] .login-container-clean .textbox-arregly.k-valid:not(.k-invalid) {
    background-color: #ffffff !important;
    border-color: #d0d5dd !important;
    box-shadow: none !important;
}

[b-w0zlg4ri7b] .login-container-clean .textbox-arregly .k-input-inner {
    background-color: #ffffff !important;
}

/* Evita fondo gris/azul por autocompletado del navegador */
[b-w0zlg4ri7b] .login-container-clean input:-webkit-autofill,
[b-w0zlg4ri7b] .login-container-clean input:-webkit-autofill:hover,
[b-w0zlg4ri7b] .login-container-clean input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
    box-shadow: 0 0 0 1000px #ffffff inset !important;
    -webkit-text-fill-color: #101828 !important;
}

/* Enlaces - deben verse como texto, no como botones */
.help-links[b-w0zlg4ri7b] {
    text-align: center;
    margin-top: 20px;
    margin-bottom: 30px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

.help-link[b-w0zlg4ri7b] {
    color: #093d93;
    text-decoration: none;
    font-size: 0.95rem;
    font-weight: 500;
}

.help-link:hover[b-w0zlg4ri7b] {
    color: #1a5bc4;
    text-decoration: underline;
}

.register-action[b-w0zlg4ri7b] {
    color: #b84700;
    text-decoration: none;
    font-size: 1rem;
    font-weight: 600;
    transition: color 0.2s ease;
}

.register-action:hover[b-w0zlg4ri7b] {
    color: #9a3412;
    text-decoration: underline;
}

.register-link[b-w0zlg4ri7b] {
    font-size: 1rem;
    color: #666;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

/* Footer */
.login-footer[b-w0zlg4ri7b] {
    display: flex;
    color: #595959;
    font-size: 0.85rem;
    justify-content: center;
    margin-top: auto;
    padding-top: 20px;
}

@media (max-width: 768px) {
    .login-container-clean[b-w0zlg4ri7b] {
        flex-direction: column;
    }

    .left-panel[b-w0zlg4ri7b] {
        display: none;
        min-height: 340px;
        padding: 0;
    }

    .left-panel-content[b-w0zlg4ri7b] {
        height: 340px;
    }

    .carousel-container[b-w0zlg4ri7b] {
        height: 100%;
    }

    .slide-text h3[b-w0zlg4ri7b] {
        font-size: 1.55rem;
    }

    .slide-text p[b-w0zlg4ri7b] {
        font-size: 1rem;
    }

    .slide-text[b-w0zlg4ri7b] {
        bottom: 62px;
        padding: 0 18px;
    }

    .placeholder-image[b-w0zlg4ri7b] {
        width: 120px;
        height: 120px;
    }

    .placeholder-icon[b-w0zlg4ri7b] {
        width: 60px !important;
        height: 60px !important;
    }

    .right-panel[b-w0zlg4ri7b] {
        padding: 20px;
    }

    .login-title[b-w0zlg4ri7b] {
        font-size: 1.3rem;
    }
}

@media (max-width: 480px) {
    .left-panel[b-w0zlg4ri7b] {
        display: none;
        min-height: 290px;
        padding: 0;
    }

    .left-panel-content[b-w0zlg4ri7b] {
        height: 290px;
    }

    .carousel-container[b-w0zlg4ri7b] {
        height: 100%;
    }

    .slide-text h3[b-w0zlg4ri7b] {
        font-size: 1.25rem;
    }

    .slide-text p[b-w0zlg4ri7b] {
        font-size: 0.86rem;
    }

    .slide-text[b-w0zlg4ri7b] {
        bottom: 54px;
        padding: 0 14px;
    }

    .placeholder-image[b-w0zlg4ri7b] {
        width: 100px;
        height: 100px;
    }

    .placeholder-icon[b-w0zlg4ri7b] {
        width: 50px !important;
        height: 50px !important;
    }
}


/* /Pages/Auth/PasswordRecovery/ForgotPassword.razor.rz.scp.css */
.verify-scope[b-gv4kuekerr] {
    --primary-color: #093d93;
    --primary-dark: #09224f;
    --primary-gradient: linear-gradient(135deg, #093d93 0%, #1a5bc4 100%);
    --primary-rgba-color: rgba(9, 61, 147, 0.12);
    min-height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle at 50% 0%, #f8fafc 0%, #e2e8f0 100%);
    padding: 2rem 1rem;
    box-sizing: border-box;
}

.verify-container[b-gv4kuekerr] {
    width: 100%;
    max-width: 514px;
    margin: 0 auto;
}

.verify-card[b-gv4kuekerr] {
    background: #ffffff;
    border-radius: 24px;
    padding: 2.5rem 2rem 1.75rem 2rem;
    box-shadow: 0 20px 40px -15px rgba(15, 23, 42, 0.08), 0 0 1px 1px rgba(15, 23, 42, 0.04);
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.verify-card:hover[b-gv4kuekerr] {
    box-shadow: 0 25px 50px -12px rgba(15, 23, 42, 0.12), 0 0 1px 1px rgba(15, 23, 42, 0.04);
}

.brand-header[b-gv4kuekerr] {
    margin-bottom: 1.75rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.brand-logo-img[b-gv4kuekerr] {
    height: 48px;
    max-width: 180px;
    object-fit: contain;
}

.status-state[b-gv4kuekerr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

/* Animación de Ondas Expansivas (Radar Wave) */
@keyframes radar-pulse-b-gv4kuekerr {
    0% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(9, 61, 147, 0.45);
    }
    70% {
        transform: scale(1.05);
        box-shadow: 0 0 0 16px rgba(9, 61, 147, 0);
    }
    100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(9, 61, 147, 0);
    }
}

.icon-badge[b-gv4kuekerr] {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem auto;
    transition: all 0.3s ease;
    background: rgba(9, 61, 147, 0.08);
    border: 1.5px solid rgba(9, 61, 147, 0.2);
    color: #093d93;
    animation: radar-pulse-b-gv4kuekerr 2s infinite ease-in-out;
}

.icon-badge[b-gv4kuekerr]  .k-icon,
.icon-badge[b-gv4kuekerr]  .k-svg-icon {
    width: 36px !important;
    height: 36px !important;
}

.status-title[b-gv4kuekerr] {
    font-size: 1.45rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 0.65rem 0;
    line-height: 1.3;
}

.status-description[b-gv4kuekerr] {
    font-size: 0.95rem;
    color: #475569;
    margin: 0 0 1.75rem 0;
    line-height: 1.55;
}

.recovery-form[b-gv4kuekerr] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    align-items: center;
    text-align: center;
}

.form-field[b-gv4kuekerr] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    width: 100%;
    align-items: center;
}

.field-label[b-gv4kuekerr] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #334155;
    text-align: center;
}

[b-gv4kuekerr] .textbox-arregly {
    width: 100% !important;
    border-radius: 999px !important;
    border: 1.5px solid #cbd5e1 !important;
    transition: all 0.2s ease-in-out !important;
    background-color: #ffffff !important;
}

[b-gv4kuekerr] .textbox-arregly:hover {
    border-color: #94a3b8 !important;
}

[b-gv4kuekerr] .textbox-arregly.k-focus,
[b-gv4kuekerr] .textbox-arregly:focus-within {
    border-color: #093d93 !important;
    box-shadow: 0 0 0 4px rgba(9, 61, 147, 0.15) !important;
}

[b-gv4kuekerr] .textbox-arregly .k-input-inner {
    text-align: center !important;
    padding: 0.65rem 1.25rem !important;
    font-size: 0.95rem !important;
    font-weight: 500 !important;
    color: #1e293b !important;
    border-radius: 999px !important;
}

[b-gv4kuekerr] .textbox-arregly .k-input-inner::placeholder {
    color: #94a3b8 !important;
    font-weight: 400 !important;
    text-align: center !important;
}

[b-gv4kuekerr] .validation-message {
    font-size: 0.8125rem;
    color: #ef4444;
    margin-top: 0.25rem;
    text-align: center;
}

/* Contenedor de Botones de Navegación */
.action-buttons[b-gv4kuekerr] {
    display: flex;
    flex-direction: row;
    gap: 12px;
    width: 100%;
    align-items: center;
    justify-content: center;
    margin-top: 1.5rem;
}

/* Base de botones idéntica a Crear Cuenta */
[b-gv4kuekerr] .action-buttons .register-step-btn,
[b-gv4kuekerr] .action-buttons .btn-arregly {
    min-width: 110px !important;
    width: auto !important;
    padding: 6px 16px !important;
    font-size: 13px !important;
    border-radius: 8px !important;
    font-weight: 500 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: all 0.2s ease-in-out !important;
    height: auto !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}

/* Botón Primario con Gradiente Corporativo */
[b-gv4kuekerr] .action-buttons .btn-gradient-primary-arregly {
    background: linear-gradient(135deg, #093d93 0%, #1a5bc4 100%) !important;
    color: #ffffff !important;
    border: none !important;
}

[b-gv4kuekerr] .action-buttons .btn-gradient-primary-arregly:hover {
    opacity: 0.9 !important;
}

[b-gv4kuekerr] .action-buttons .btn-gradient-primary-arregly .k-button-text,
[b-gv4kuekerr] .action-buttons .btn-gradient-primary-arregly span {
    color: #ffffff !important;
}

/* Botón Secundario Outline Corporativo */
[b-gv4kuekerr] .action-buttons .btn-outline-primary-arregly {
    background: transparent !important;
    color: #093d93 !important;
    border: 1px solid #093d93 !important;
    box-shadow: none !important;
}

[b-gv4kuekerr] .action-buttons .btn-outline-primary-arregly:hover {
    background: rgba(9, 61, 147, 0.08) !important;
    color: #093d93 !important;
    border-color: #093d93 !important;
}

[b-gv4kuekerr] .action-buttons .btn-outline-primary-arregly .k-button-text,
[b-gv4kuekerr] .action-buttons .btn-outline-primary-arregly span {
    color: #093d93 !important;
}

.card-footer[b-gv4kuekerr] {
    margin-top: 2rem;
    padding-top: 1.25rem;
    border-top: 1px solid #f1f5f9;
    text-align: center;
    color: #94a3b8;
    font-size: 0.8125rem;
}
/* /Pages/Auth/PasswordRecovery/NewPassword.razor.rz.scp.css */
.verify-scope[b-p884fdqqz1] {
    --primary-color: #093d93;
    --primary-dark: #09224f;
    --primary-gradient: linear-gradient(135deg, #093d93 0%, #1a5bc4 100%);
    --primary-rgba-color: rgba(9, 61, 147, 0.12);
    min-height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle at 50% 0%, #f8fafc 0%, #e2e8f0 100%);
    padding: 2rem 1rem;
    box-sizing: border-box;
}

.verify-container[b-p884fdqqz1] {
    width: 100%;
    max-width: 514px;
    margin: 0 auto;
}

.verify-card[b-p884fdqqz1] {
    background: #ffffff;
    border-radius: 24px;
    padding: 2.5rem 2rem 1.75rem 2rem;
    box-shadow: 0 20px 40px -15px rgba(15, 23, 42, 0.08), 0 0 1px 1px rgba(15, 23, 42, 0.04);
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.verify-card:hover[b-p884fdqqz1] {
    box-shadow: 0 25px 50px -12px rgba(15, 23, 42, 0.12), 0 0 1px 1px rgba(15, 23, 42, 0.04);
}

.brand-header[b-p884fdqqz1] {
    margin-bottom: 1.75rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.brand-logo-img[b-p884fdqqz1] {
    height: 48px;
    max-width: 180px;
    object-fit: contain;
}

.status-state[b-p884fdqqz1] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

/* Animación de Ondas Expansivas (Radar Wave) */
@keyframes radar-pulse-b-p884fdqqz1 {
    0% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(9, 61, 147, 0.45);
    }
    70% {
        transform: scale(1.05);
        box-shadow: 0 0 0 16px rgba(9, 61, 147, 0);
    }
    100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(9, 61, 147, 0);
    }
}

.icon-badge[b-p884fdqqz1] {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem auto;
    transition: all 0.3s ease;
    background: rgba(9, 61, 147, 0.08);
    border: 1.5px solid rgba(9, 61, 147, 0.2);
    color: #093d93;
    animation: radar-pulse-b-p884fdqqz1 2s infinite ease-in-out;
}

.icon-badge-success[b-p884fdqqz1] {
    background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
    border: 1px solid #a7f3d0;
    color: #059669;
    box-shadow: 0 10px 25px -5px rgba(16, 185, 129, 0.2);
    animation: none !important;
}

.icon-badge[b-p884fdqqz1]  .k-icon,
.icon-badge[b-p884fdqqz1]  .k-svg-icon {
    width: 42px !important;
    height: 42px !important;
}

.status-title[b-p884fdqqz1] {
    font-size: 1.45rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 0.65rem 0;
    line-height: 1.3;
}

.status-description[b-p884fdqqz1] {
    font-size: 0.95rem;
    color: #475569;
    margin: 0 0 1.75rem 0;
    line-height: 1.55;
}

.password-form[b-p884fdqqz1] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    text-align: left;
}

.form-field[b-p884fdqqz1] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    width: 100%;
}

.field-label[b-p884fdqqz1],
.form-label[b-p884fdqqz1] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #334155;
    text-align: left;
    display: block;
    width: 100%;
    margin-left: 0;
    margin-bottom: 0.35rem;
}

[b-p884fdqqz1] .textbox-arregly {
    width: 100% !important;
    border-radius: 12px !important;
    padding: 0.2rem 0.5rem !important;
}

/* Contenedor de Botones de Navegación */
.action-buttons[b-p884fdqqz1] {
    display: flex;
    flex-direction: row;
    gap: 12px;
    width: 100%;
    align-items: center;
    justify-content: center;
    margin-top: 1.5rem;
}

/* Base de botones idéntica a Crear Cuenta */
[b-p884fdqqz1] .action-buttons .register-step-btn,
[b-p884fdqqz1] .action-buttons .btn-arregly {
    min-width: 110px !important;
    width: auto !important;
    padding: 6px 16px !important;
    font-size: 13px !important;
    border-radius: 8px !important;
    font-weight: 500 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: all 0.2s ease-in-out !important;
    height: auto !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}

/* Botón Primario con Gradiente Corporativo */
[b-p884fdqqz1] .action-buttons .btn-gradient-primary-arregly {
    background: linear-gradient(135deg, #093d93 0%, #1a5bc4 100%) !important;
    color: #ffffff !important;
    border: none !important;
}

[b-p884fdqqz1] .action-buttons .btn-gradient-primary-arregly:hover {
    opacity: 0.9 !important;
}

[b-p884fdqqz1] .action-buttons .btn-gradient-primary-arregly .k-button-text,
[b-p884fdqqz1] .action-buttons .btn-gradient-primary-arregly span {
    color: #ffffff !important;
}

/* Botón Secundario Outline Corporativo */
[b-p884fdqqz1] .action-buttons .btn-outline-primary-arregly {
    background: transparent !important;
    color: #093d93 !important;
    border: 1px solid #093d93 !important;
    box-shadow: none !important;
}

[b-p884fdqqz1] .action-buttons .btn-outline-primary-arregly:hover {
    background: rgba(9, 61, 147, 0.08) !important;
    color: #093d93 !important;
    border-color: #093d93 !important;
}

[b-p884fdqqz1] .action-buttons .btn-outline-primary-arregly .k-button-text,
[b-p884fdqqz1] .action-buttons .btn-outline-primary-arregly span {
    color: #093d93 !important;
}

.card-footer[b-p884fdqqz1] {
    margin-top: 2rem;
    padding-top: 1.25rem;
    border-top: 1px solid #f1f5f9;
    text-align: center;
    color: #94a3b8;
    font-size: 0.8125rem;
}
/* /Pages/Auth/PasswordRecovery/RecoveryHero.razor.rz.scp.css */
.recovery-hero-header[b-aqem0jb8go] {
    text-align: center;
    margin-bottom: 30px;
    position: absolute;
    top: -104px;
    left: 50%;
    transform: translateX(-50%);
    color: white;
    width: calc(100% - 20px);
    max-width: 450px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 50;
}

.recovery-hero-brand-logo[b-aqem0jb8go] {
    display: block;
    margin-bottom: 2px;
    width: 100%;
    position: relative;
    isolation: isolate;
}

.recovery-hero-brand-logo[b-aqem0jb8go]::before,
.recovery-hero-brand-logo[b-aqem0jb8go]::after,
.recovery-hero-brand-text[b-aqem0jb8go]::before,
.recovery-hero-brand-text[b-aqem0jb8go]::after {
    content: none !important;
    display: none !important;
}

.recovery-hero-brand-text[b-aqem0jb8go] {
    display: block;
    font-size: 2.65rem;
    font-weight: 700;
    color: white !important;
    background: transparent !important;
    box-shadow: none !important;
    filter: none !important;
    text-shadow: none !important;
    -webkit-text-fill-color: white !important;
    text-align: center;
    position: relative;
    z-index: 2;
}

.recovery-hero-icon-block[b-aqem0jb8go] {
    text-align: center;
    margin: 20px 0 24px 0;
    width: 100%;
}

[b-aqem0jb8go] .recovery-hero-icon-block.k-stacklayout {
    gap: 0 !important;
    align-items: center !important;
}

[b-aqem0jb8go] .recovery-hero-icon-block > * {
    flex: 0 0 auto !important;
}

.recovery-hero-title-wrap[b-aqem0jb8go] {
    margin-bottom: 18px;
    width: 100%;
    text-align: center;
}

.recovery-hero-title[b-aqem0jb8go] {
    display: block;
    font-size: 2.15rem;
    font-weight: 700;
    color: #374151;
    line-height: 1.2;
    text-align: center;
}

.recovery-hero-subtitle[b-aqem0jb8go] {
    margin: 6px 0 0;
    color: #6b7280;
    font-size: 1rem;
    text-align: center;
}

.recovery-hero-icon-circle[b-aqem0jb8go] {
    width: 80px;
    height: 80px;
    min-width: 80px;
    max-width: 80px;
    min-height: 80px;
    max-height: 80px;
    background: rgba(9, 61, 147, 0.08);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 22px;
    border: 1px solid rgba(9, 61, 147, 0.2);
    position: relative;
    aspect-ratio: 1 / 1;
    flex: 0 0 80px;
}

.recovery-hero-icon-circle[b-aqem0jb8go]::before {
    content: '';
    position: absolute;
    top: -4px;
    left: -4px;
    right: -4px;
    bottom: -4px;
    border: 2px solid rgba(9, 61, 147, 0.4);
    border-radius: 50%;
    animation: pulse-ring-b-aqem0jb8go 1.8s infinite ease-in-out;
}

@keyframes pulse-ring-b-aqem0jb8go {
    0% {
        transform: scale(0.95);
        opacity: 0.8;
    }
    50% {
        transform: scale(1.18);
        opacity: 0.35;
    }
    100% {
        transform: scale(1.35);
        opacity: 0;
    }
}

.recovery-hero-icon-circle .k-svg-icon[b-aqem0jb8go] {
    font-size: 32px;
    color: #093d93;
}

@media (max-width: 768px) {
    .recovery-hero-header[b-aqem0jb8go] {
        top: -96px;
        max-width: calc(100% - 40px);
    }

    .recovery-hero-icon-circle[b-aqem0jb8go] {
        width: 60px;
        height: 60px;
        min-width: 60px;
        max-width: 60px;
        min-height: 60px;
        max-height: 60px;
        flex-basis: 60px;
    }

    .recovery-hero-icon-circle .k-svg-icon[b-aqem0jb8go] {
        font-size: 24px;
    }
}
/* /Pages/Auth/PasswordRecovery/VerifyCode.razor.rz.scp.css */
.verify-scope[b-h9ti2cubeo] {
    --primary-color: #093d93;
    --primary-dark: #09224f;
    --primary-gradient: linear-gradient(135deg, #093d93 0%, #1a5bc4 100%);
    --primary-rgba-color: rgba(9, 61, 147, 0.12);
    min-height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle at 50% 0%, #f8fafc 0%, #e2e8f0 100%);
    padding: 2rem 1rem;
    box-sizing: border-box;
}

.verify-container[b-h9ti2cubeo] {
    width: 100%;
    max-width: 514px;
    margin: 0 auto;
}

.verify-card[b-h9ti2cubeo] {
    background: #ffffff;
    border-radius: 24px;
    padding: 2.5rem 2rem 1.75rem 2rem;
    box-shadow: 0 20px 40px -15px rgba(15, 23, 42, 0.08), 0 0 1px 1px rgba(15, 23, 42, 0.04);
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.verify-card:hover[b-h9ti2cubeo] {
    box-shadow: 0 25px 50px -12px rgba(15, 23, 42, 0.12), 0 0 1px 1px rgba(15, 23, 42, 0.04);
}

.brand-header[b-h9ti2cubeo] {
    margin-bottom: 1.75rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.brand-logo-img[b-h9ti2cubeo] {
    height: 48px;
    max-width: 180px;
    object-fit: contain;
}

.status-state[b-h9ti2cubeo] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

/* Animación de Ondas Expansivas (Radar Wave) */
@keyframes radar-pulse-b-h9ti2cubeo {
    0% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(9, 61, 147, 0.45);
    }
    70% {
        transform: scale(1.05);
        box-shadow: 0 0 0 16px rgba(9, 61, 147, 0);
    }
    100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(9, 61, 147, 0);
    }
}

.icon-badge[b-h9ti2cubeo] {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem auto;
    transition: all 0.3s ease;
    background: rgba(9, 61, 147, 0.08);
    border: 1.5px solid rgba(9, 61, 147, 0.2);
    color: #093d93;
    animation: radar-pulse-b-h9ti2cubeo 2s infinite ease-in-out;
}

.icon-badge[b-h9ti2cubeo]  .k-icon,
.icon-badge[b-h9ti2cubeo]  .k-svg-icon {
    width: 36px !important;
    height: 36px !important;
}

.status-title[b-h9ti2cubeo] {
    font-size: 1.45rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 0.65rem 0;
    line-height: 1.3;
}

.status-description[b-h9ti2cubeo] {
    font-size: 0.95rem;
    color: #475569;
    margin: 0 0 1.75rem 0;
    line-height: 1.55;
}

.email-highlight[b-h9ti2cubeo] {
    color: #1e293b;
    font-weight: 600;
}

.code-form[b-h9ti2cubeo] {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5rem;
}

.code-inputs[b-h9ti2cubeo] {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    margin-bottom: 0.5rem;
}

.code-input[b-h9ti2cubeo] {
    width: 48px;
    height: 56px;
    font-size: 1.5rem;
    font-weight: 700;
    text-align: center;
    color: #0f172a;
    background: #f8fafc;
    border: 1.5px solid #cbd5e1;
    border-radius: 12px;
    transition: all 0.2s ease-in-out;
    outline: none;
}

.code-input:focus[b-h9ti2cubeo] {
    background: #ffffff;
    border-color: #093d93;
    box-shadow: 0 0 0 3px rgba(9, 61, 147, 0.15);
}

.code-input:disabled[b-h9ti2cubeo] {
    background: #f1f5f9;
    color: #94a3b8;
    cursor: not-allowed;
}

/* Contenedor de Botones de Navegación */
.action-buttons[b-h9ti2cubeo] {
    display: flex;
    flex-direction: row;
    gap: 12px;
    width: 100%;
    align-items: center;
    justify-content: center;
    margin-top: 1.5rem;
}

/* Base de botones idéntica a Crear Cuenta */
[b-h9ti2cubeo] .action-buttons .register-step-btn,
[b-h9ti2cubeo] .action-buttons .btn-arregly {
    min-width: 110px !important;
    width: auto !important;
    padding: 6px 16px !important;
    font-size: 13px !important;
    border-radius: 8px !important;
    font-weight: 500 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: all 0.2s ease-in-out !important;
    height: auto !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}

/* Botón Primario con Gradiente Corporativo */
[b-h9ti2cubeo] .action-buttons .btn-gradient-primary-arregly {
    background: linear-gradient(135deg, #093d93 0%, #1a5bc4 100%) !important;
    color: #ffffff !important;
    border: none !important;
}

[b-h9ti2cubeo] .action-buttons .btn-gradient-primary-arregly:hover {
    opacity: 0.9 !important;
}

[b-h9ti2cubeo] .action-buttons .btn-gradient-primary-arregly .k-button-text,
[b-h9ti2cubeo] .action-buttons .btn-gradient-primary-arregly span {
    color: #ffffff !important;
}

/* Botón Secundario Outline Corporativo */
[b-h9ti2cubeo] .action-buttons .btn-outline-primary-arregly {
    background: transparent !important;
    color: #093d93 !important;
    border: 1px solid #093d93 !important;
    box-shadow: none !important;
}

[b-h9ti2cubeo] .action-buttons .btn-outline-primary-arregly:hover {
    background: rgba(9, 61, 147, 0.08) !important;
    color: #093d93 !important;
    border-color: #093d93 !important;
}

[b-h9ti2cubeo] .action-buttons .btn-outline-primary-arregly .k-button-text,
[b-h9ti2cubeo] .action-buttons .btn-outline-primary-arregly span {
    color: #093d93 !important;
}

/* Enlace Hipervínculo de Reenviar Código */
.resend-container[b-h9ti2cubeo] {
    margin-top: 1.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}

.btn-link-resend[b-h9ti2cubeo] {
    background: none;
    border: none;
    color: #093d93;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    text-decoration: underline;
    transition: color 0.2s ease;
    padding: 0;
}

.btn-link-resend:hover:not(:disabled)[b-h9ti2cubeo] {
    color: #1a5bc4;
}

.btn-link-resend:disabled[b-h9ti2cubeo] {
    color: #94a3b8;
    cursor: not-allowed;
    text-decoration: none;
}

.resend-disabled-text[b-h9ti2cubeo] {
    font-size: 0.875rem;
    color: #64748b;
}

.resend-disabled-text strong[b-h9ti2cubeo] {
    color: #093d93;
    font-weight: 600;
}

.card-footer[b-h9ti2cubeo] {
    margin-top: 2rem;
    padding-top: 1.25rem;
    border-top: 1px solid #f1f5f9;
    text-align: center;
    color: #94a3b8;
    font-size: 0.8125rem;
}
/* /Pages/Auth/PasswordResetSuccess/PasswordResetSuccess.razor.rz.scp.css */
/* Contrase�a Restablecida - Estilo basado en dise�o de referencia */

.success-container[b-i14rijqeas] {
    min-height: 100vh;
    background-color: #e5e7eb;
    display: flex;
    flex-direction: column;
}

/* Header verde */
.success-container[b-i14rijqeas]::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 140px;
    background: linear-gradient(135deg, #059669 0%, #047857 100%);
    z-index: -1;
}

.success-card[b-i14rijqeas] {
    background: white;
    border-radius: 20px;
    padding: 50px 40px;
    max-width: 500px;
    width: 100%;
    margin: 180px auto 40px auto;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    position: relative;
    text-align: center;
    animation: slideInUp-b-i14rijqeas 0.8s ease-out;
}

@keyframes slideInUp-b-i14rijqeas {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.success-header[b-i14rijqeas] {
    text-align: center;
    margin-bottom: 30px;
    position: absolute;
    top: -140px;
    left: 50%;
    transform: translateX(-50%);
    color: white;
    width: 100%;
}

.brand-logo[b-i14rijqeas] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 20px;
    font-weight: 600;
    color: white;
}

.brand-logo .k-svg-icon[b-i14rijqeas] {
    color: white;
    font-size: 24px;
}

.success-icon[b-i14rijqeas] {
    margin-bottom: 30px;
    animation: scaleIn-b-i14rijqeas 0.6s ease-out 0.3s both;
}

@keyframes scaleIn-b-i14rijqeas {
    from {
        opacity: 0;
        transform: scale(0.5);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.icon-circle[b-i14rijqeas] {
    width: 120px;
    height: 120px;
    background: linear-gradient(135deg, #10b981, #059669);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    box-shadow: 0 15px 30px rgba(16, 185, 129, 0.3);
    position: relative;
}

.icon-circle[b-i14rijqeas]::before {
    content: '';
    position: absolute;
    top: -8px;
    left: -8px;
    right: -8px;
    bottom: -8px;
    border: 2px solid rgba(16, 185, 129, 0.2);
    border-radius: 50%;
    animation: pulse-b-i14rijqeas 2s ease-in-out infinite;
}

@keyframes pulse-b-i14rijqeas {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    100% {
        transform: scale(1.1);
        opacity: 0;
    }
}

.icon-circle .k-svg-icon[b-i14rijqeas] {
    font-size: 50px;
    color: white;
}

.success-content[b-i14rijqeas] {
    margin-bottom: 40px;
    animation: fadeInUp-b-i14rijqeas 0.8s ease-out 0.5s both;
}

@keyframes fadeInUp-b-i14rijqeas {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.success-title[b-i14rijqeas] {
    font-size: 32px;
    font-weight: 700;
    color: #374151;
    margin: 0 0 15px 0;
}

.success-description[b-i14rijqeas] {
    font-size: 16px;
    color: #6b7280;
    line-height: 1.6;
    margin: 0;
}

.success-actions[b-i14rijqeas] {
    margin-bottom: 40px;
    animation: slideInUp-b-i14rijqeas 0.8s ease-out 0.7s both;
}

.btn-arregly[b-i14rijqeas] {
    width: 100%;
    padding: 16px;
    border: none;
    border-radius: 8px;
    font-size: 18px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    background: #6b7280;
    color: white;
}

.btn-arregly:hover[b-i14rijqeas] {
    background: #4b5563;
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(107, 114, 128, 0.3);
}

.btn-arregly:active[b-i14rijqeas] {
    transform: translateY(0);
}

.success-footer[b-i14rijqeas] {
    animation: fadeIn-b-i14rijqeas 0.8s ease-out 1s both;
}

@keyframes fadeIn-b-i14rijqeas {
    from { opacity: 0; }
    to { opacity: 1; }
}

.success-footer p[b-i14rijqeas] {
    font-size: 14px;
    color: #9ca3af;
    margin: 0;
    font-weight: 500;
}

/* Elementos flotantes decorativos */
.floating-elements[b-i14rijqeas] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
}

.floating-circle[b-i14rijqeas] {
    position: absolute;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    animation: float-b-i14rijqeas 6s ease-in-out infinite;
}

.floating-1[b-i14rijqeas] {
    width: 60px;
    height: 60px;
    top: 15%;
    left: 10%;
    animation-delay: 0s;
}

.floating-2[b-i14rijqeas] {
    width: 40px;
    height: 40px;
    top: 70%;
    right: 15%;
    animation-delay: 2s;
}

.floating-3[b-i14rijqeas] {
    width: 80px;
    height: 80px;
    bottom: 20%;
    left: 20%;
    animation-delay: 4s;
}

.floating-4[b-i14rijqeas] {
    width: 30px;
    height: 30px;
    top: 30%;
    right: 25%;
    animation-delay: 1s;
}

@keyframes float-b-i14rijqeas {
    0%, 100% {
        transform: translateY(0px) rotate(0deg);
        opacity: 0.7;
    }
    33% {
        transform: translateY(-20px) rotate(120deg);
        opacity: 1;
    }
    66% {
        transform: translateY(-10px) rotate(240deg);
        opacity: 0.8;
    }
}

@media (max-width: 768px) {
    .success-card[b-i14rijqeas] {
        margin: 160px 20px 40px 20px;
        padding: 40px 30px;
    }

    .success-header[b-i14rijqeas] {
        top: -120px;
    }

    .success-title[b-i14rijqeas] {
        font-size: 28px;
    }

    .success-description[b-i14rijqeas] {
        font-size: 15px;
    }

    .icon-circle[b-i14rijqeas] {
        width: 100px;
        height: 100px;
    }

    .icon-circle .k-svg-icon[b-i14rijqeas] {
        font-size: 40px;
    }
}

@media (max-width: 480px) {
    .success-card[b-i14rijqeas] {
        padding: 30px 20px;
    }

    .success-title[b-i14rijqeas] {
        font-size: 24px;
    }

    .btn-arregly[b-i14rijqeas] {
        padding: 14px;
        font-size: 16px;
    }
}
/* /Pages/Auth/Register/Register.razor.rz.scp.css */
.progress-banner-fixed[b-h9e18frqlk] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 5;
    background: white;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
    padding: 1rem 2rem;
}

.progress-header-modern[b-h9e18frqlk] {
    max-width: 1200px;
    margin: 0 auto;
}

[b-h9e18frqlk] .progress-title-section {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.progress-title-section[b-h9e18frqlk] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.progress-title-info[b-h9e18frqlk] {
    display: flex;
    flex-direction: column;
}

.progress-main-title[b-h9e18frqlk] {
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0;
    color: #1e293b;
}

.progress-step-info[b-h9e18frqlk] {
    font-size: 0.875rem;
    color: #64748b;
}

.progress-percentage-modern[b-h9e18frqlk] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.percentage-number[b-h9e18frqlk] {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--brand-blue, #093d93);
}

.percentage-label[b-h9e18frqlk] {
    font-size: 0.75rem;
    color: #64748b;
}

[b-h9e18frqlk] .banner-wizard-steps {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 0.5rem;
}

.telerik-step[b-h9e18frqlk] {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 0 0 auto;
    position: relative;
}

[b-h9e18frqlk] .telerik-step-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #e2e8f0;
    color: #64748b;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    margin-bottom: 0.25rem;
    transition: all 0.2s;
    position: relative;
}

.telerik-step.active .telerik-step-icon[b-h9e18frqlk] {
    background-color: var(--primary-color, #093d93) !important;
    color: var(--primary-text-color, #ffffff) !important;
}

    .telerik-step.active .telerik-step-icon[b-h9e18frqlk]::before {
        content: '';
        position: absolute;
        top: -4px;
        left: -4px;
        right: -4px;
        bottom: -4px;
        border: 2px solid var(--brand-orange, #ed7024);
        border-radius: 50%;
        animation: pulse-ring-b-h9e18frqlk 1.5s infinite;
    }

.telerik-step.completed .telerik-step-icon[b-h9e18frqlk] {
    background-color: var(--primary-color, #093d93);
    color: var(--primary-text-color, #ffffff);
}

.telerik-step-title[b-h9e18frqlk] {
    font-size: 0.75rem;
    color: #334155;
    font-weight: 500;
}

.telerik-step.active .telerik-step-title[b-h9e18frqlk] {
    color: var(--primary-color, #093d93);
    font-weight: 600;
}

.telerik-step.completed .telerik-step-title[b-h9e18frqlk] {
    color: var(--primary-color, #093d93);
    font-weight: 600;
}

/* Animación del círculo pulsante */
@keyframes pulse-ring-b-h9e18frqlk {
    0% {
        transform: scale(1);
        opacity: 1;
    }

    50% {
        transform: scale(1.1);
        opacity: 0.7;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

.telerik-step-connector[b-h9e18frqlk] {
    flex: 1;
    height: 4px;
    background-color: #e2e8f0;
    margin: 0 8px;
    position: relative;
    border-radius: 2px;
    overflow: hidden;
}

.connector-progress-fill[b-h9e18frqlk] {
    height: 100%;
    width: calc(var(--progress-width, 0) * 1%);
    background-color: var(--brand-blue, #093d93);
    transition: width 0.3s ease;
}





/* Alinea título y porcentaje del encabezado de progreso */
[b-h9e18frqlk] .progress-title-section {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
    gap: 0 !important;
    margin-bottom: 1rem !important;
}

/* Tarjeta reutilizable dentro del modal de color */
.section-card[b-h9e18frqlk] {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px;
    background: #fff;
}

/* Distribución de botones del modal de color */
[b-h9e18frqlk] .register-color-modal-footer-actions {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

[b-h9e18frqlk] .register-color-modal-footer-actions .btn-arregly {
    min-width: 140px !important;
}

/* Tamaño y separación de la tarjeta principal del registro */
.card-register[b-h9e18frqlk] {
    display: flex !important;
    justify-content: center !important;
    margin: 40px auto 60px auto;
    width: 900px !important;
    max-width: 95vw;
}

@media (max-width: 768px) {
    /* Ajuste responsive para móviles */
    .card-register[b-h9e18frqlk] {
        margin: 20px auto 40px auto;
        padding: 16px;
        width: 100% !important;
    }

    .progress-main-title[b-h9e18frqlk] {
        font-size: 1.2rem;
    }
}

.register-loading-overlay[b-h9e18frqlk] {
    position: fixed;
    inset: 0;
    z-index: 1100;
    background: rgba(15, 23, 42, 0.35);
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(2px);
}

.register-loading-card[b-h9e18frqlk] {
    width: min(90vw, 460px);
    background: #ffffff;
    border-radius: 14px;
    box-shadow: 0 14px 36px rgba(15, 23, 42, 0.2);
    padding: 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    text-align: center;
}

.register-loading-title[b-h9e18frqlk] {
    color: #1f2937;
    font-size: 1.05rem;
    font-weight: 600;
}

.register-loading-subtitle[b-h9e18frqlk] {
    color: #64748b;
    font-size: 0.9rem;
}
/* /Pages/Auth/VerifyRegistration/VerifyRegistration.razor.rz.scp.css */
.verify-scope[b-qni4ulfmh7] {
    --primary-color: #093d93;
    --primary-dark: #09224f;
    --primary-gradient: linear-gradient(135deg, #093d93 0%, #1a5bc4 100%);
    --primary-rgba-color: rgba(9, 61, 147, 0.12);
    min-height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: radial-gradient(circle at 50% 0%, #f8fafc 0%, #e2e8f0 100%);
    padding: 2rem 1rem;
    box-sizing: border-box;
}

.verify-container[b-qni4ulfmh7] {
    width: 100%;
    max-width: 480px;
    margin: 0 auto;
}

.verify-card[b-qni4ulfmh7] {
    background: #ffffff;
    border-radius: 24px;
    padding: 2.5rem 2rem 1.75rem 2rem;
    box-shadow: 0 20px 40px -15px rgba(15, 23, 42, 0.08), 0 0 1px 1px rgba(15, 23, 42, 0.04);
    text-align: center;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.verify-card:hover[b-qni4ulfmh7] {
    box-shadow: 0 25px 50px -12px rgba(15, 23, 42, 0.12), 0 0 1px 1px rgba(15, 23, 42, 0.04);
}

.brand-header[b-qni4ulfmh7] {
    margin-bottom: 1.75rem;
    display: flex;
    justify-content: center;
    align-items: center;
}

.brand-logo-img[b-qni4ulfmh7] {
    height: 48px;
    max-width: 180px;
    object-fit: contain;
}

.status-state[b-qni4ulfmh7] {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
}

.loader-wrapper[b-qni4ulfmh7] {
    margin: 1.5rem 0 2rem 0;
    display: flex;
    justify-content: center;
}

.icon-badge[b-qni4ulfmh7] {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 1.5rem auto;
    transition: all 0.3s ease;
    position: relative;
}

.icon-badge[b-qni4ulfmh7]  .k-icon,
.icon-badge[b-qni4ulfmh7]  .k-svg-icon {
    width: 42px !important;
    height: 42px !important;
}

/* Animación de Ondas Expansivas (Radar Wave) para estado de Error */
@keyframes radar-pulse-b-qni4ulfmh7 {
    0% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.55);
    }
    70% {
        transform: scale(1.05);
        box-shadow: 0 0 0 18px rgba(239, 68, 68, 0);
    }
    100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(239, 68, 68, 0);
    }
}

.status-error .icon-badge[b-qni4ulfmh7] {
    background: #fef2f2;
    border: 2px solid #fecdd3;
    color: #ef4444;
    animation: radar-pulse-b-qni4ulfmh7 1.8s infinite ease-in-out;
}

.status-success .icon-badge[b-qni4ulfmh7] {
    background: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
    border: 1px solid #a7f3d0;
    color: #059669;
    box-shadow: 0 10px 25px -5px rgba(16, 185, 129, 0.2);
}

.status-loading .icon-badge[b-qni4ulfmh7] {
    background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%);
    border: 1px solid #bfdbfe;
    color: #2563eb;
    box-shadow: 0 10px 25px -5px rgba(37, 99, 235, 0.15);
}

.status-title[b-qni4ulfmh7] {
    font-size: 1.45rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 0.65rem 0;
    line-height: 1.3;
}

.status-description[b-qni4ulfmh7] {
    font-size: 0.95rem;
    color: #475569;
    margin: 0 0 1.5rem 0;
    line-height: 1.55;
}

.info-help-box[b-qni4ulfmh7] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 1rem 1.25rem;
    margin-bottom: 1.75rem;
    text-align: left;
    display: flex;
    gap: 0.875rem;
    align-items: flex-start;
    width: 100%;
    box-sizing: border-box;
}

.info-help-icon[b-qni4ulfmh7] {
    color: #0284c7;
    flex-shrink: 0;
    margin-top: 2px;
    display: flex;
    align-items: center;
}

.info-help-icon[b-qni4ulfmh7]  .k-svg-icon {
    width: 20px !important;
    height: 20px !important;
}

.info-help-text strong[b-qni4ulfmh7] {
    display: block;
    font-size: 0.875rem;
    color: #1e293b;
    margin-bottom: 0.25rem;
}

.info-help-text p[b-qni4ulfmh7] {
    font-size: 0.8125rem;
    color: #64748b;
    margin: 0;
    line-height: 1.45;
}

/* Contenedor de Botones de Navegación */
.action-buttons[b-qni4ulfmh7] {
    display: flex;
    flex-direction: row;
    gap: 12px;
    width: 100%;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 0.5rem;
}

/* Base de botones idéntica a Crear Cuenta */
[b-qni4ulfmh7] .action-buttons .register-step-btn,
[b-qni4ulfmh7] .action-buttons .btn-arregly {
    min-width: 110px !important;
    width: auto !important;
    padding: 6px 16px !important;
    font-size: 13px !important;
    border-radius: 8px !important;
    font-weight: 500 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    transition: all 0.2s ease-in-out !important;
    height: auto !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
}

/* Botón Primario con Gradiente Corporativo */
[b-qni4ulfmh7] .action-buttons .btn-gradient-primary-arregly {
    background: linear-gradient(135deg, #093d93 0%, #1a5bc4 100%) !important;
    color: #ffffff !important;
    border: none !important;
}

[b-qni4ulfmh7] .action-buttons .btn-gradient-primary-arregly:hover {
    opacity: 0.9 !important;
}

[b-qni4ulfmh7] .action-buttons .btn-gradient-primary-arregly .k-button-text,
[b-qni4ulfmh7] .action-buttons .btn-gradient-primary-arregly span {
    color: #ffffff !important;
}

/* Botón Secundario Outline Corporativo */
[b-qni4ulfmh7] .action-buttons .btn-outline-primary-arregly {
    background: transparent !important;
    color: #093d93 !important;
    border: 1px solid #093d93 !important;
    box-shadow: none !important;
}

[b-qni4ulfmh7] .action-buttons .btn-outline-primary-arregly:hover {
    background: rgba(9, 61, 147, 0.08) !important;
    color: #093d93 !important;
    border-color: #093d93 !important;
}

[b-qni4ulfmh7] .action-buttons .btn-outline-primary-arregly .k-button-text,
[b-qni4ulfmh7] .action-buttons .btn-outline-primary-arregly span {
    color: #093d93 !important;
}

.card-footer[b-qni4ulfmh7] {
    margin-top: 2rem;
    padding-top: 1.25rem;
    border-top: 1px solid #f1f5f9;
    text-align: center;
    color: #94a3b8;
    font-size: 0.8125rem;
}
/* /Pages/Calendar/OperationalCalendar.razor.rz.scp.css */
.calendar-page[b-mpkpkctwyu] {
    padding-bottom: 1rem;
}

[b-mpkpkctwyu] .calendar-page .welcome-banner {
    margin-bottom: .25rem !important;
}

.calendar-toolbar[b-mpkpkctwyu] {
    margin-bottom: .25rem;
}

.calendar-panel[b-mpkpkctwyu] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: .85rem;
}

.calendar-panel-title[b-mpkpkctwyu] {
    margin-bottom: .85rem;
    font-size: .9rem;
    font-weight: 700;
    color: #111827;
}

.calendar-badge[b-mpkpkctwyu] {
    background: #f8fafc;
    color: #1f2937;
    border: 1px solid #e2e8f0;
    border-radius: 999px;
    padding: .3rem .62rem;
    font-size: .74rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: .32rem;
    line-height: 1;
    box-shadow: 0 1px 2px rgba(15, 23, 42, .05);
}

[b-mpkpkctwyu] .calendar-badge .k-svg-icon {
    width: 12px;
    height: 12px;
    color: #64748b;
}

.calendar-badge-alert[b-mpkpkctwyu] {
    background: #fef2f2;
    color: #b91c1c;
    border-color: #fecaca;
}

[b-mpkpkctwyu] .calendar-badge-alert .k-svg-icon {
    color: #dc2626;
}

.calendar-filter-group[b-mpkpkctwyu] {
    margin-bottom: .65rem;
}

.calendar-filter-label[b-mpkpkctwyu] {
    display: block;
    font-size: .72rem;
    color: #6b7280;
    margin-bottom: .2rem;
    font-weight: 600;
}

.calendar-switch[b-mpkpkctwyu] {
    margin-top: .6rem;
    font-size: .8rem;
}

.calendar-switch .form-check-input:checked[b-mpkpkctwyu] {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.calendar-switch .form-check-input:focus[b-mpkpkctwyu] {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 .25rem rgba(99, 118, 228, .25);
}

/* Contenedor principal de navegación */
.calendar-nav-container[b-mpkpkctwyu] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    flex-wrap: wrap;
}

/* Grupo de botones segmentado */
.calendar-nav-group[b-mpkpkctwyu] {
    display: inline-flex;
    align-items: center;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05);
    overflow: hidden;
}

/* Botones individuales del grupo */
[b-mpkpkctwyu] .calendar-nav-group .k-button.nav-btn {
    border: none !important;
    border-radius: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    color: #4b5563 !important;
    font-size: 0.85rem !important;
    font-weight: 600 !important;
    height: 36px !important;
    padding: 0 12px !important;
    margin: 0 !important;
    box-shadow: none !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.15s ease, color 0.15s ease !important;
}

/* Divisor vertical entre botones */
[b-mpkpkctwyu] .calendar-nav-group .k-button.nav-btn:not(:last-child) {
    border-right: 1px solid #e2e8f0 !important;
}

/* Ajuste específico para botones de flechas para ser cuadrados perfectos */
[b-mpkpkctwyu] .calendar-nav-group .k-button.nav-btn-prev,
[b-mpkpkctwyu] .calendar-nav-group .k-button.nav-btn-next {
    width: 36px !important;
    padding: 0 !important;
}

/* Hover de botones */
[b-mpkpkctwyu] .calendar-nav-group .k-button.nav-btn:hover {
    background-color: #f8fafc !important;
    color: #667eea !important; /* Color de marca */
}

/* Efecto activo al hacer clic */
[b-mpkpkctwyu] .calendar-nav-group .k-button.nav-btn:active {
    background-color: #f1f5f9 !important;
}

/* Rango de fecha mejorado */
.calendar-current-range-label[b-mpkpkctwyu] {
    font-size: 1.05rem;
    font-weight: 650;
    color: #1f2937;
    text-transform: capitalize;
    letter-spacing: -0.01em;
}

/* Adaptabilidad móvil */
@media (max-width: 576px) {
    .calendar-nav-container[b-mpkpkctwyu] {
        width: 100%;
        justify-content: space-between;
        gap: 0.75rem;
    }
    
    .calendar-current-range-label[b-mpkpkctwyu] {
        font-size: 0.95rem;
        width: 100%;
        order: -1; /* Coloca la fecha arriba en pantallas muy pequeñas */
        margin-bottom: 0.25rem;
    }
}

.calendar-summary-date[b-mpkpkctwyu] {
    font-size: .75rem;
    color: #6b7280;
    margin-bottom: .75rem;
    text-transform: capitalize;
}

.calendar-summary-metrics[b-mpkpkctwyu] {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: .6rem;
    margin-bottom: .75rem;
    display: grid;
    gap: .45rem;
}

.metric-item[b-mpkpkctwyu] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: .8rem;
    color: #374151;
}

.metric-item strong[b-mpkpkctwyu] {
    color: #111827;
}

.calendar-summary-list[b-mpkpkctwyu] {
    display: grid;
    gap: .45rem;
    max-height: 520px;
    overflow-y: auto;
    padding: .15rem .3rem .45rem .1rem;
}

.summary-event-item[b-mpkpkctwyu] {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    text-align: left;
    padding: .5rem;
    background: #fff;
    cursor: pointer;
    transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
}

.summary-event-item-editable[b-mpkpkctwyu] {
    position: relative;
}

.summary-event-item-editable[b-mpkpkctwyu]::after {
    content: "";
    position: absolute;
    inset: 2px;
    border: 1px dashed transparent;
    border-radius: 8px;
    opacity: 0;
    pointer-events: none;
    transition: opacity .16s ease, border-color .16s ease;
}

.summary-event-item-editable:hover[b-mpkpkctwyu]::after {
    opacity: 1;
    border-color: rgba(17, 24, 39, .75);
}

.summary-event-item:hover[b-mpkpkctwyu] {
    transform: translateY(-1px);
    box-shadow: 0 6px 14px rgba(15, 23, 42, .08);
}

.summary-event-item:focus-visible[b-mpkpkctwyu] {
    outline: 2px solid #8b5cf6;
    outline-offset: 1px;
}

.summary-event-header[b-mpkpkctwyu] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: .35rem;
}

.summary-event-item.summary-status-inprogress[b-mpkpkctwyu] {
    background: #dbeafe;
    border-color: #3b82f6;
    border-left: 3px solid #2563eb;
}

.summary-event-item.summary-status-completed[b-mpkpkctwyu] {
    background: #d1fae5;
    border-color: #34d399;
    border-left: 3px solid #10b981;
}

.summary-event-item.summary-status-delayed[b-mpkpkctwyu] {
    background: #fee2e2;
    border-color: #f87171;
    border-left: 3px solid #ef4444;
}

.summary-event-item.summary-status-planned[b-mpkpkctwyu] {
    background: #f3f4f6;
    border-color: #9ca3af;
    border-left: 3px solid #94a3b8;
}

.summary-event-item.summary-category-reminder[b-mpkpkctwyu] {
    background: #fef3c7;
    border-color: #f59e0b;
    border-left: 3px solid #f59e0b;
}

.summary-event-item.summary-category-block[b-mpkpkctwyu] {
    background: #ffe4ef;
    border-color: #e11d48;
    border-left: 3px solid #e11d48;
}

.summary-event-item.summary-category-teammeeting[b-mpkpkctwyu] {
    background: #ede9fe;
    border-color: #8b5cf6;
    border-left: 3px solid #8b5cf6;
}

.summary-event-time[b-mpkpkctwyu] {
    font-size: .7rem;
    color: #6b7280;
}

.summary-event-title[b-mpkpkctwyu] {
    font-size: .8rem;
    color: #111827;
    font-weight: 700;
}

.summary-event-edit-icon[b-mpkpkctwyu] {
    color: #6b7280;
    opacity: .7;
    display: inline-flex;
    align-items: center;
    transition: opacity .16s ease, color .16s ease;
}

.summary-event-item:hover .summary-event-edit-icon[b-mpkpkctwyu] {
    opacity: 1;
    color: #4b5563;
}

[b-mpkpkctwyu] .summary-event-edit-icon .k-svg-icon {
    width: 12px;
    height: 12px;
}

.summary-event-meta[b-mpkpkctwyu] {
    font-size: .7rem;
    color: #6b7280;
}

[b-mpkpkctwyu] .calendar-scheduler .k-event,
[b-mpkpkctwyu] .calendar-scheduler .k-task {
    border-radius: 8px !important;
    box-shadow: none !important;
    background: #f3f4f6 !important;
    border-color: #9ca3af !important;
    color: #374151 !important;
}

[b-mpkpkctwyu] .calendar-scheduler .calendar-item-locked.calendar-status-inprogress,
[b-mpkpkctwyu] .calendar-scheduler .calendar-item-locked.calendar-status-inprogress .k-event,
[b-mpkpkctwyu] .calendar-scheduler .calendar-item-locked.calendar-status-inprogress .k-task,
[b-mpkpkctwyu] .calendar-scheduler .k-event.calendar-item-locked.calendar-status-inprogress,
[b-mpkpkctwyu] .calendar-scheduler .k-task.calendar-item-locked.calendar-status-inprogress {
    background: #dbeafe !important;
    border-color: #3b82f6 !important;
    color: #1d4ed8 !important;
    box-shadow: inset 3px 0 0 #2563eb !important;
}

[b-mpkpkctwyu] .calendar-scheduler .calendar-item-locked.calendar-status-completed,
[b-mpkpkctwyu] .calendar-scheduler .calendar-item-locked.calendar-status-completed .k-event,
[b-mpkpkctwyu] .calendar-scheduler .calendar-item-locked.calendar-status-completed .k-task,
[b-mpkpkctwyu] .calendar-scheduler .k-event.calendar-item-locked.calendar-status-completed,
[b-mpkpkctwyu] .calendar-scheduler .k-task.calendar-item-locked.calendar-status-completed {
    background: #d1fae5 !important;
    border-color: #34d399 !important;
    color: #047857 !important;
    box-shadow: inset 3px 0 0 #10b981 !important;
}

[b-mpkpkctwyu] .calendar-scheduler .calendar-item-locked.calendar-status-delayed,
[b-mpkpkctwyu] .calendar-scheduler .calendar-item-locked.calendar-status-delayed .k-event,
[b-mpkpkctwyu] .calendar-scheduler .calendar-item-locked.calendar-status-delayed .k-task,
[b-mpkpkctwyu] .calendar-scheduler .k-event.calendar-item-locked.calendar-status-delayed,
[b-mpkpkctwyu] .calendar-scheduler .k-task.calendar-item-locked.calendar-status-delayed {
    background: #fee2e2 !important;
    border-color: #f87171 !important;
    color: #b91c1c !important;
    box-shadow: inset 3px 0 0 #ef4444 !important;
}

[b-mpkpkctwyu] .calendar-scheduler .calendar-item-locked.calendar-status-planned,
[b-mpkpkctwyu] .calendar-scheduler .calendar-item-locked.calendar-status-planned .k-event,
[b-mpkpkctwyu] .calendar-scheduler .calendar-item-locked.calendar-status-planned .k-task,
[b-mpkpkctwyu] .calendar-scheduler .k-event.calendar-item-locked.calendar-status-planned,
[b-mpkpkctwyu] .calendar-scheduler .k-task.calendar-item-locked.calendar-status-planned {
    background: #e5e7eb !important;
    border-color: #9ca3af !important;
    color: #374151 !important;
    box-shadow: inset 3px 0 0 #94a3b8 !important;
}

[b-mpkpkctwyu] .calendar-scheduler .calendar-item-manual.calendar-category-reminder,
[b-mpkpkctwyu] .calendar-scheduler .calendar-item-manual.calendar-category-reminder .k-event,
[b-mpkpkctwyu] .calendar-scheduler .calendar-item-manual.calendar-category-reminder .k-task,
[b-mpkpkctwyu] .calendar-scheduler .k-event.calendar-item-manual.calendar-category-reminder,
[b-mpkpkctwyu] .calendar-scheduler .k-task.calendar-item-manual.calendar-category-reminder {
    background: #fef3c7 !important;
    border-color: #f59e0b !important;
    color: #92400e !important;
    box-shadow: inset 3px 0 0 #f59e0b !important;
}

[b-mpkpkctwyu] .calendar-scheduler .calendar-item-manual.calendar-category-block,
[b-mpkpkctwyu] .calendar-scheduler .calendar-item-manual.calendar-category-block .k-event,
[b-mpkpkctwyu] .calendar-scheduler .calendar-item-manual.calendar-category-block .k-task,
[b-mpkpkctwyu] .calendar-scheduler .k-event.calendar-item-manual.calendar-category-block,
[b-mpkpkctwyu] .calendar-scheduler .k-task.calendar-item-manual.calendar-category-block {
    background: #ffe4ef !important;
    border-color: #e11d48 !important;
    color: #9f1239 !important;
    box-shadow: inset 3px 0 0 #e11d48 !important;
}

[b-mpkpkctwyu] .calendar-scheduler .calendar-item-manual.calendar-category-teammeeting,
[b-mpkpkctwyu] .calendar-scheduler .calendar-item-manual.calendar-category-teammeeting .k-event,
[b-mpkpkctwyu] .calendar-scheduler .calendar-item-manual.calendar-category-teammeeting .k-task,
[b-mpkpkctwyu] .calendar-scheduler .k-event.calendar-item-manual.calendar-category-teammeeting,
[b-mpkpkctwyu] .calendar-scheduler .k-task.calendar-item-manual.calendar-category-teammeeting {
    background: #ede9fe !important;
    border-color: #8b5cf6 !important;
    color: #6d28d9 !important;
    box-shadow: inset 3px 0 0 #8b5cf6 !important;
}

[b-mpkpkctwyu] .calendar-scheduler .calendar-item-manual.calendar-status-planned,
[b-mpkpkctwyu] .calendar-scheduler .calendar-item-manual.calendar-status-planned .k-event,
[b-mpkpkctwyu] .calendar-scheduler .calendar-item-manual.calendar-status-planned .k-task,
[b-mpkpkctwyu] .calendar-scheduler .k-event.calendar-item-manual.calendar-status-planned,
[b-mpkpkctwyu] .calendar-scheduler .k-task.calendar-item-manual.calendar-status-planned {
    background: #f3f4f6 !important;
    border-color: #9ca3af !important;
    color: #4b5563 !important;
    box-shadow: inset 3px 0 0 #9ca3af !important;
}

[b-mpkpkctwyu] .k-button-group.telerik-blazor.k-toolbar-button-group.k-scheduler-navigation {
    display: none !important;
}

.calendar-scheduler-wrapper[b-mpkpkctwyu] {
    width: 100%;
}

.calendar-scheduler-wrapper[b-mpkpkctwyu]  .k-scheduler-toolbar {
    border-bottom: 1px solid #e5e7eb !important;
    background: #f8fafc !important;
    padding: 0 !important;
}

.calendar-scheduler-wrapper[b-mpkpkctwyu]  .k-scheduler-toolbar .k-button-group,
.calendar-scheduler-wrapper[b-mpkpkctwyu]  .k-scheduler-toolbar .k-toolbar-group,
.calendar-scheduler-wrapper[b-mpkpkctwyu]  .k-scheduler-toolbar .k-toolbar-items {
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 2px !important;
    gap: 4px !important;
}

.calendar-scheduler-wrapper[b-mpkpkctwyu]  .k-scheduler-toolbar .k-button {
    border: none !important;
    border-radius: 8px 8px 0 0 !important;
    margin: 0 2px !important;
    padding: 10px 16px !important;
    background: transparent !important;
    background-color: transparent !important;
    color: #6b7280 !important;
    font-weight: 500 !important;
    box-shadow: none !important;
}

.calendar-scheduler-wrapper[b-mpkpkctwyu]  .k-scheduler-toolbar .k-button:hover {
    background: rgba(102, 126, 234, 0.1) !important;
    color: #667eea !important;
}

.calendar-scheduler-wrapper[b-mpkpkctwyu]  .k-scheduler-toolbar .k-button.k-selected,
.calendar-scheduler-wrapper[b-mpkpkctwyu]  .k-scheduler-toolbar .k-button[aria-pressed='true'],
.calendar-scheduler-wrapper[b-mpkpkctwyu]  .k-scheduler-toolbar .k-button.k-active {
    background: #ffffff !important;
    background-color: #ffffff !important;
    color: #667eea !important;
    font-weight: 600 !important;
    border-bottom: none !important;
    box-shadow: inset 0 -3px 0 #667eea !important;
}

@media (max-width: 1199.98px) {
    .calendar-summary-list[b-mpkpkctwyu] {
        max-height: 300px;
    }
}
@media (max-width: 1199px) {
    .calendar-panel.filters-mobile[b-mpkpkctwyu] {
        margin-bottom: 0.75rem;
    }
}

/* Personalización del selector de vista responsivo en móvil */
.calendar-scheduler-wrapper[b-mpkpkctwyu]  .k-scheduler-toolbar select,
.calendar-scheduler-wrapper[b-mpkpkctwyu]  .k-scheduler-toolbar .k-dropdown {
    height: 34px !important;
    border-radius: 10px !important;
    border: 1px solid #d2d6dc !important;
    background-color: #ffffff !important;
    color: #4b5563 !important;
    font-weight: 600 !important;
    font-size: 0.85rem !important;
    font-family: inherit !important;
    padding: 0 32px 0 12px !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%234b5563' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'></polyline></svg>") !important;
    background-repeat: no-repeat !important;
    background-position: right 10px center !important;
    background-size: 14px !important;
    cursor: pointer !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.05) !important;
    margin: 4px !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
}

.calendar-scheduler-wrapper[b-mpkpkctwyu]  .k-scheduler-toolbar select:focus,
.calendar-scheduler-wrapper[b-mpkpkctwyu]  .k-scheduler-toolbar .k-dropdown:focus {
    outline: none !important;
    border-color: #667eea !important;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.15), 0 1px 2px rgba(15, 23, 42, 0.05) !important;
}

@media (max-width: 360px) {
    .calendar-scheduler-wrapper[b-mpkpkctwyu]  .k-scheduler-toolbar {
        display: flex !important;
        flex-wrap: nowrap !important;
        justify-content: space-between !important;
        align-items: center !important;
    }
}

@media (max-width: 320px) {
    .calendar-scheduler-wrapper[b-mpkpkctwyu]  .k-scheduler-toolbar select,
    .calendar-scheduler-wrapper[b-mpkpkctwyu]  .k-scheduler-toolbar .k-dropdown {
        padding: 0 10px 0 4px !important;
        background-position: right 2px center !important;
        margin: 2px !important;
        font-size: 0.8rem !important;
    }
}



/* /Pages/Changelog/Changelog.razor.rz.scp.css */
/* ==========================================================================
   Aurocore — Changelog Page: Timeline & Calm UX
   ========================================================================== */

.changelog-page[b-bfjghvatgd] {
    --glass-bg: rgba(255, 255, 255, 0.85);
    --glass-border: rgba(226, 232, 240, 0.8);
    --glass-specular: inset 0 1px 1.5px 0 rgba(255, 255, 255, 0.9), inset 0 -1px 2px 0 rgba(0, 0, 0, 0.03);
    --glass-shadow: 0 12px 36px -8px rgba(9, 61, 147, 0.08);
    --brand-blue: #093d93;
    --brand-orange: #ed7024;
    --brand-orange-light: #fd8c1d;
    --brand-orange-glow: rgba(237, 112, 36, 0.35);
    --slate-900: #09224f;
    --slate-800: #13376b;
    --slate-600: #2c4d75;
    --slate-500: #476487;
    --slate-200: #e2e8f0;
    --slate-100: #f1f5f9;
    --slate-50: #f8fafc;
    --emerald: #10b981;
    --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);

    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: #f8fafc;
    color: var(--text-heading-primary, #09224f);
    font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

.changelog-main[b-bfjghvatgd] { flex: 1 0 auto; width: 100%; }

.changelog-container[b-bfjghvatgd] {
    width: 100%;
    max-width: 880px;
    margin: 0 auto;
    padding: 0 clamp(1rem, 3vw, 2rem);
}

/* Hero */
.changelog-hero[b-bfjghvatgd] {
    position: relative;
    padding: clamp(7rem, 14vw, 9rem) 0 clamp(2rem, 4vw, 3rem);
    overflow: hidden;
}

.hero-ambient-mesh[b-bfjghvatgd] { position: absolute; inset: 0; pointer-events: none; z-index: 0; overflow: hidden; }
.mesh-orb[b-bfjghvatgd] { position: absolute; border-radius: 50%; filter: blur(80px); opacity: 0.6; }
.orb-blue[b-bfjghvatgd] { top: -15%; left: 10%; width: clamp(300px, 40vw, 600px); height: clamp(300px, 40vw, 600px); background: radial-gradient(circle, rgba(9, 61, 147, 0.15) 0%, transparent 70%); }
.orb-orange[b-bfjghvatgd] { bottom: -20%; right: 5%; width: clamp(250px, 35vw, 500px); height: clamp(250px, 35vw, 500px); background: radial-gradient(circle, rgba(237, 112, 36, 0.12) 0%, transparent 70%); }
.hero-grid-pattern[b-bfjghvatgd] { position: absolute; inset: 0; background-image: radial-gradient(rgba(9, 61, 147, 0.04) 1px, transparent 1px); background-size: 32px 32px; pointer-events: none; z-index: 0; }

.hero-header[b-bfjghvatgd] { position: relative; z-index: 1; max-width: 680px; margin: 0 auto; }

.hero-badge[b-bfjghvatgd] {
    display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.45rem 1rem; border-radius: 100px;
    background: rgba(255, 255, 255, 0.85); border: 1px solid #e2e8f0; box-shadow: 0 4px 16px -4px rgba(9, 61, 147, 0.08);
    backdrop-filter: blur(16px); font-size: 0.82rem; font-weight: 500; color: #475569; margin-bottom: 1.5rem;
}

.badge-dot-orange[b-bfjghvatgd] { width: 7px; height: 7px; border-radius: 50%; background: #ed7024; box-shadow: 0 0 6px rgba(237, 112, 36, 0.35); }
.badge-separator[b-bfjghvatgd] { color: var(--slate-200); font-weight: 300; }
.badge-subtext[b-bfjghvatgd] { color: var(--brand-orange); font-weight: 600; }

.hero-title[b-bfjghvatgd] {
    font-size: clamp(2rem, 5vw, 3rem); font-weight: 800; line-height: 1.15; color: #0f172a; margin: 0 0 1rem; letter-spacing: -0.02em;
}

.highlight-orange[b-bfjghvatgd] { background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; display: inline-block; }

.hero-lead[b-bfjghvatgd] { font-size: clamp(1rem, 2vw, 1.15rem); color: var(--slate-600); line-height: 1.7; margin: 0; }

/* Timeline */
.changelog-timeline-section[b-bfjghvatgd] {
    padding: clamp(2rem, 5vw, 4rem) 0 clamp(4rem, 8vw, 6rem);
}

.timeline[b-bfjghvatgd] {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.timeline-entry[b-bfjghvatgd] {
    display: grid;
    grid-template-columns: 40px 1fr;
    gap: 1.5rem;
}

.timeline-marker[b-bfjghvatgd] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 0.3rem;
}

.marker-dot[b-bfjghvatgd] {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--slate-200);
    border: 3px solid var(--slate-50);
    box-shadow: 0 0 0 2px var(--slate-200);
    flex-shrink: 0;
    z-index: 1;
}

.marker-dot.latest[b-bfjghvatgd] {
    background: var(--brand-orange);
    box-shadow: 0 0 0 2px var(--brand-orange), 0 0 12px rgba(237, 112, 36, 0.3);
    animation: dotPulse-b-bfjghvatgd 2s ease-in-out infinite;
}

@keyframes dotPulse-b-bfjghvatgd {
    0%, 100% { box-shadow: 0 0 0 2px var(--brand-orange), 0 0 12px rgba(237, 112, 36, 0.3); }
    50% { box-shadow: 0 0 0 4px rgba(237, 112, 36, 0.2), 0 0 20px rgba(237, 112, 36, 0.4); }
}

.marker-line[b-bfjghvatgd] {
    width: 2px;
    flex: 1;
    background: linear-gradient(to bottom, var(--slate-200), transparent);
    min-height: 40px;
}

.timeline-content[b-bfjghvatgd] {
    padding-bottom: 3rem;
}

.entry-header[b-bfjghvatgd] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
    flex-wrap: wrap;
}

.entry-date[b-bfjghvatgd] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--slate-500);
}

.entry-version[b-bfjghvatgd] {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--brand-blue);
    background: rgba(9, 61, 147, 0.08);
    padding: 0.15rem 0.6rem;
    border-radius: 100px;
}

.entry-tag[b-bfjghvatgd] {
    font-size: 0.65rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.15rem 0.6rem;
    border-radius: 100px;
}

.entry-tag.new[b-bfjghvatgd] {
    color: var(--emerald);
    background: rgba(16, 185, 129, 0.1);
}

.entry-title[b-bfjghvatgd] {
    font-size: clamp(1.15rem, 2.5vw, 1.4rem);
    font-weight: 800;
    color: var(--slate-900);
    margin: 0 0 0.5rem;
    letter-spacing: -0.01em;
}

.entry-description[b-bfjghvatgd] {
    font-size: 0.9rem;
    color: var(--slate-600);
    line-height: 1.7;
    margin: 0 0 1.25rem;
}

.entry-changes[b-bfjghvatgd] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.change-item[b-bfjghvatgd] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    font-size: 0.85rem;
    color: var(--slate-700, #334155);
    padding: 0.5rem 0.75rem;
    border-radius: 10px;
    background: white;
    border: 1px solid var(--slate-100);
    transition: all 0.2s var(--ease-spring);
}

.change-item:hover[b-bfjghvatgd] {
    background: var(--slate-50);
    border-color: var(--slate-200);
}

.change-badge[b-bfjghvatgd] {
    font-size: 0.65rem;
    font-weight: 800;
    text-transform: uppercase;
    padding: 0.1rem 0.5rem;
    border-radius: 6px;
    flex-shrink: 0;
    letter-spacing: 0.03em;
}

.change-item.feat .change-badge[b-bfjghvatgd] {
    color: var(--emerald);
    background: rgba(16, 185, 129, 0.1);
}

.change-item.improve .change-badge[b-bfjghvatgd] {
    color: var(--brand-blue);
    background: rgba(9, 61, 147, 0.08);
}

.change-item.fix .change-badge[b-bfjghvatgd] {
    color: var(--brand-orange);
    background: rgba(237, 112, 36, 0.08);
}

/* Mobile */
@media (max-width: 600px) {
    .timeline-entry[b-bfjghvatgd] {
        grid-template-columns: 28px 1fr;
        gap: 1rem;
    }

    .entry-header[b-bfjghvatgd] {
        gap: 0.5rem;
    }
}
/* /Pages/Clients/Clients.razor.rz.scp.css */
.pdf-preview-modal-body[b-m4htjr90jb] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.pdf-preview-header-info h6[b-m4htjr90jb] {
    margin: 0;
    font-weight: 700;
}

.pdf-preview-frame[b-m4htjr90jb] {
    width: 100%;
    height: 68vh;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    background: #f8fafc;
}

.activate-action[b-m4htjr90jb] {
    color: #28a745 !important;
}

.deactivate-action[b-m4htjr90jb] {
    color: #ffc107 !important;
}

.activate-action:hover[b-m4htjr90jb] {
    background-color: rgba(40, 167, 69, 0.1) !important;
}

.deactivate-action:hover[b-m4htjr90jb] {
    background-color: rgba(255, 193, 7, 0.1) !important;
}

.clients-grid-badge[b-m4htjr90jb] {
    font-size: 14px;
    font-weight: 400;
}

.clients-grid-badge-tax[b-m4htjr90jb] {
    color: #3d3d3d !important;
}

.clients-grid-badge-tax[b-m4htjr90jb]  .k-svg-icon {
    color: #d97706;
}
/* /Pages/Clients/ClientsManagement.razor.rz.scp.css */
/* Footer responsivo para modal de cliente */
.client-modal-footer[b-n39howd8j1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

@media (max-width: 768px) {
    .client-modal-footer[b-n39howd8j1] {
        flex-wrap: wrap !important;
        gap: 8px !important;
    }

    .client-modal-footer[b-n39howd8j1]  .btn-arregly,
    .client-modal-footer[b-n39howd8j1]  .k-button,
    .client-modal-footer[b-n39howd8j1]  button {
        min-width: 0 !important;
        flex: 1 1 calc(50% - 4px) !important;
        max-width: 100% !important;
        margin: 0 !important;
        min-height: 34px !important;
        height: auto !important;
        padding: 8px 10px !important;
        font-size: 0.84rem !important;
        font-weight: 500 !important;
        border-radius: 12px !important;
        display: inline-flex !important;
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        white-space: nowrap !important;
    }

    .pdf-preview-footer[b-n39howd8j1] {
        flex-wrap: wrap !important;
        gap: 8px !important;
    }

    .pdf-preview-footer[b-n39howd8j1]  .btn-arregly,
    .pdf-preview-footer[b-n39howd8j1]  .k-button,
    .pdf-preview-footer[b-n39howd8j1]  button {
        min-width: 0 !important;
        flex: 1 1 calc(50% - 4px) !important;
        max-width: 100% !important;
        margin: 0 !important;
        min-height: 34px !important;
        height: auto !important;
        padding: 8px 10px !important;
        font-size: 0.84rem !important;
        font-weight: 500 !important;
        border-radius: 12px !important;
        display: inline-flex !important;
        justify-content: center !important;
        align-items: center !important;
        text-align: center !important;
        white-space: nowrap !important;
    }
}

@media (max-width: 360px) {
    .client-modal-footer[b-n39howd8j1]  .btn-arregly,
    .client-modal-footer[b-n39howd8j1]  .k-button,
    .client-modal-footer[b-n39howd8j1]  button,
    .pdf-preview-footer[b-n39howd8j1]  .btn-arregly,
    .pdf-preview-footer[b-n39howd8j1]  .k-button,
    .pdf-preview-footer[b-n39howd8j1]  button {
        padding: 6px 8px !important;
        font-size: 0.80rem !important;
        letter-spacing: -0.2px !important;
    }
}
/* /Pages/Configuration/Configuration.razor.rz.scp.css */
.configuration-content[b-x5zna057ii] {
    background: transparent;
}

[b-x5zna057ii] .custom-tab-strip-container.pb-5 {
    padding-bottom: 1rem !important;
}

/* /Pages/Contact/Contact.razor.rz.scp.css */
/* ==========================================================================
   Aurocore — Contact Page: Calm UX & Liquid Glass
   ========================================================================== */

.contact-page[b-nm3akhlcn4] {
    --glass-bg: rgba(255, 255, 255, 0.85);
    --glass-border: rgba(226, 232, 240, 0.8);
    --glass-specular: inset 0 1px 1.5px 0 rgba(255, 255, 255, 0.9), inset 0 -1px 2px 0 rgba(0, 0, 0, 0.03);
    --glass-shadow: 0 12px 36px -8px rgba(9, 61, 147, 0.08);
    --brand-blue: #093d93;
    --brand-orange: #ed7024;
    --brand-orange-light: #fd8c1d;
    --brand-orange-glow: rgba(237, 112, 36, 0.35);
    --slate-900: #09224f;
    --slate-800: #13376b;
    --slate-600: #2c4d75;
    --slate-500: #476487;
    --slate-300: #cbd5e1;
    --slate-200: #e2e8f0;
    --slate-100: #f1f5f9;
    --slate-50: #f8fafc;
    --emerald: #10b981;
    --purple: #8b5cf6;
    --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);

    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: #f8fafc;
    color: var(--text-heading-primary, #09224f);
    font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

.contact-main[b-nm3akhlcn4] { flex: 1 0 auto; width: 100%; }

.contact-container[b-nm3akhlcn4] {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 clamp(1rem, 3vw, 2rem);
}

/* Hero */
.contact-hero[b-nm3akhlcn4] {
    position: relative;
    padding: clamp(7rem, 14vw, 9rem) 0 clamp(2rem, 4vw, 3rem);
    overflow: hidden;
}

.hero-ambient-mesh[b-nm3akhlcn4] { position: absolute; inset: 0; pointer-events: none; z-index: 0; overflow: hidden; }
.mesh-orb[b-nm3akhlcn4] { position: absolute; border-radius: 50%; filter: blur(80px); opacity: 0.6; }
.orb-blue[b-nm3akhlcn4] { top: -15%; left: 10%; width: clamp(300px, 40vw, 600px); height: clamp(300px, 40vw, 600px); background: radial-gradient(circle, rgba(9, 61, 147, 0.15) 0%, transparent 70%); }
.orb-orange[b-nm3akhlcn4] { bottom: -20%; right: 5%; width: clamp(250px, 35vw, 500px); height: clamp(250px, 35vw, 500px); background: radial-gradient(circle, rgba(237, 112, 36, 0.12) 0%, transparent 70%); }
.hero-grid-pattern[b-nm3akhlcn4] { position: absolute; inset: 0; background-image: radial-gradient(rgba(9, 61, 147, 0.04) 1px, transparent 1px); background-size: 32px 32px; pointer-events: none; z-index: 0; }

.hero-header[b-nm3akhlcn4] { position: relative; z-index: 1; max-width: 680px; margin: 0 auto; }

.hero-badge[b-nm3akhlcn4] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 1rem;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 16px -4px rgba(9, 61, 147, 0.08);
    backdrop-filter: blur(16px);
    font-size: 0.82rem;
    font-weight: 500;
    color: #475569;
    margin-bottom: 1.5rem;
}

.badge-dot-orange[b-nm3akhlcn4] { width: 7px; height: 7px; border-radius: 50%; background: #ed7024; box-shadow: 0 0 6px rgba(237, 112, 36, 0.35); }

.hero-title[b-nm3akhlcn4] {
    font-size: clamp(2rem, 5vw, 3rem);
    font-weight: 800;
    line-height: 1.15;
    color: #0f172a;
    margin: 0 0 1rem;
    letter-spacing: -0.02em;
}

.highlight-orange[b-nm3akhlcn4] {
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.hero-lead[b-nm3akhlcn4] {
    font-size: clamp(1rem, 2vw, 1.15rem);
    color: var(--slate-600);
    line-height: 1.7;
    margin: 0;
}

/* Contact Grid */
.contact-content-section[b-nm3akhlcn4] {
    padding: clamp(2rem, 5vw, 4rem) 0 clamp(4rem, 8vw, 6rem);
}

.contact-grid[b-nm3akhlcn4] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
}

@media (min-width: 992px) {
    .contact-grid[b-nm3akhlcn4] {
        grid-template-columns: 1.4fr 1fr;
        gap: 3rem;
    }
}

/* Form Card */
.contact-form-card[b-nm3akhlcn4] {
    padding: clamp(1.5rem, 4vw, 2.5rem);
    border-radius: 24px;
    background: white;
    border: 1px solid var(--slate-200);
    box-shadow: 0 8px 32px -8px rgba(0, 0, 0, 0.06);
}

.form-title[b-nm3akhlcn4] {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--slate-900);
    margin: 0 0 0.35rem;
}

.form-subtitle[b-nm3akhlcn4] {
    font-size: 0.9rem;
    color: var(--slate-500);
    margin: 0 0 2rem;
}

.contact-form[b-nm3akhlcn4] { display: flex; flex-direction: column; gap: 1.25rem; }

.form-row[b-nm3akhlcn4] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.25rem;
}

@media (min-width: 600px) {
    .form-row[b-nm3akhlcn4] { grid-template-columns: 1fr 1fr; }
}

.form-group[b-nm3akhlcn4] { display: flex; flex-direction: column; gap: 0.45rem; }

.form-group label[b-nm3akhlcn4] {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--slate-700, #334155);
}

.form-group input[b-nm3akhlcn4],
.form-group select[b-nm3akhlcn4],
.form-group textarea[b-nm3akhlcn4] {
    padding: 0.75rem 1rem;
    border-radius: 12px;
    border: 1.5px solid var(--slate-200);
    background: var(--slate-50);
    font-size: 0.9rem;
    font-family: inherit;
    color: var(--slate-900);
    transition: all 0.25s var(--ease-smooth);
    outline: none;
}

.form-group input:focus[b-nm3akhlcn4],
.form-group select:focus[b-nm3akhlcn4],
.form-group textarea:focus[b-nm3akhlcn4] {
    border-color: var(--brand-blue);
    background: white;
    box-shadow: 0 0 0 3px rgba(9, 61, 147, 0.08);
}

.form-group input[b-nm3akhlcn4]::placeholder,
.form-group textarea[b-nm3akhlcn4]::placeholder {
    color: var(--slate-300);
}

.form-group textarea[b-nm3akhlcn4] {
    resize: vertical;
    min-height: 120px;
}

.btn-submit[b-nm3akhlcn4] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.9rem 2rem;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--brand-orange), var(--brand-orange-light));
    color: white;
    font-weight: 700;
    font-size: 0.95rem;
    border: none;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.3s var(--ease-spring);
    box-shadow: 0 4px 16px rgba(237, 112, 36, 0.3);
}

.btn-submit:hover:not(:disabled)[b-nm3akhlcn4] {
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(237, 112, 36, 0.4);
}

.btn-submit:disabled[b-nm3akhlcn4] {
    opacity: 0.7;
    cursor: not-allowed;
}

.success-message[b-nm3akhlcn4] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    border-radius: 12px;
    background: rgba(16, 185, 129, 0.08);
    border: 1px solid rgba(16, 185, 129, 0.2);
    color: var(--emerald);
    font-size: 0.88rem;
    font-weight: 600;
    animation: slideIn-b-nm3akhlcn4 0.4s var(--ease-spring);
}

@keyframes slideIn-b-nm3akhlcn4 {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Info Cards */
.contact-info-col[b-nm3akhlcn4] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.info-card[b-nm3akhlcn4] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem;
    border-radius: 16px;
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    box-shadow: var(--glass-specular), 0 4px 16px -4px rgba(0, 0, 0, 0.04);
    backdrop-filter: blur(12px);
    transition: all 0.3s var(--ease-spring);
}

.info-card:hover[b-nm3akhlcn4] {
    transform: translateY(-2px);
    box-shadow: var(--glass-specular), 0 8px 24px -4px rgba(0, 0, 0, 0.08);
}

.info-icon[b-nm3akhlcn4] {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    flex-shrink: 0;
}

.info-icon.blue[b-nm3akhlcn4] { background: rgba(9, 61, 147, 0.08); color: var(--brand-blue); border: 1px solid rgba(9, 61, 147, 0.15); }
.info-icon.orange[b-nm3akhlcn4] { background: rgba(237, 112, 36, 0.08); color: var(--brand-orange); border: 1px solid rgba(237, 112, 36, 0.18); }
.info-icon.emerald[b-nm3akhlcn4] { background: rgba(9, 61, 147, 0.08); color: var(--brand-blue); border: 1px solid rgba(9, 61, 147, 0.15); }
.info-icon.purple[b-nm3akhlcn4] { background: rgba(44, 77, 117, 0.08); color: var(--text-body-lead); border: 1px solid rgba(44, 77, 117, 0.15); }

.info-card h4[b-nm3akhlcn4] {
    font-size: 0.92rem;
    font-weight: 700;
    color: var(--slate-900);
    margin: 0;
}

.info-card p[b-nm3akhlcn4] {
    font-size: 0.82rem;
    color: var(--slate-500);
    margin: 0.15rem 0 0;
}

/* Response Promise */
.response-promise[b-nm3akhlcn4] {
    display: flex;
    gap: 1rem;
    padding: 1.5rem;
    border-radius: 16px;
    background: linear-gradient(135deg, rgba(9, 61, 147, 0.04), rgba(16, 185, 129, 0.04));
    border: 1px solid rgba(16, 185, 129, 0.15);
    margin-top: 0.5rem;
}

.promise-icon[b-nm3akhlcn4] {
    color: var(--emerald);
    flex-shrink: 0;
    margin-top: 2px;
}

.response-promise h4[b-nm3akhlcn4] {
    font-size: 0.92rem;
    font-weight: 700;
    color: var(--slate-900);
    margin: 0 0 0.25rem;
}

.response-promise p[b-nm3akhlcn4] {
    font-size: 0.82rem;
    color: var(--slate-500);
    line-height: 1.6;
    margin: 0;
}

/* Validation Styles */
.form-group input.invalid[b-nm3akhlcn4],
.form-group select.invalid[b-nm3akhlcn4],
.form-group textarea.invalid[b-nm3akhlcn4] {
    border-color: #ef4444;
    background-color: #fef2f2;
}

.form-group input.invalid:focus[b-nm3akhlcn4],
.form-group select.invalid:focus[b-nm3akhlcn4],
.form-group textarea.invalid:focus[b-nm3akhlcn4] {
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.15);
}

.validation-message[b-nm3akhlcn4] {
    color: #ef4444;
    font-size: 0.8rem;
    margin-top: 0.35rem;
    font-weight: 500;
}

.text-danger[b-nm3akhlcn4] {
    color: #ef4444;
}

.form-actions[b-nm3akhlcn4] {
    display: flex;
    margin-top: 0.5rem;
}

/* ==========================================================================
   Espaciado y diseño unificado de controles Telerik
   ========================================================================== */
.form-row + .form-row[b-nm3akhlcn4],
.form-row + .form-group[b-nm3akhlcn4],
.form-group + .form-group[b-nm3akhlcn4] {
    margin-top: 1.25rem;
}

[b-nm3akhlcn4] .k-textarea.textarea-arregly {
    min-height: 120px !important;
    border-radius: 12px !important;
    border: 1px solid #d0d5dd !important;
    background-color: #ffffff !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

[b-nm3akhlcn4] .k-textarea.textarea-arregly:hover {
    border-color: var(--primary-color, #093d93) !important;
    box-shadow: 0 0 0 3px rgba(9, 61, 147, 0.08) !important;
}

[b-nm3akhlcn4] .k-textarea.textarea-arregly.k-focus,
[b-nm3akhlcn4] .k-textarea.textarea-arregly:focus-within {
    border-color: var(--primary-color, #093d93) !important;
    box-shadow: 0 0 0 3px rgba(9, 61, 147, 0.12) !important;
}

[b-nm3akhlcn4] .k-textarea.textarea-arregly .k-input-inner {
    min-height: 110px !important;
    padding: 0.75rem 1rem !important;
    border-radius: 12px !important;
    font-weight: 400;
    font-size: 0.9rem;
    font-family: inherit;
    color: var(--slate-900, #101828);
    resize: vertical;
}

[b-nm3akhlcn4] .k-textarea.textarea-arregly .k-input-inner::placeholder {
    color: #98a2b3 !important;
}
/* /Pages/Dashboard/Components/DashboardKpiCard.razor.rz.scp.css */
.dashboard-panel[b-90m8gy19j1] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 1rem;
}

.kpi-header[b-90m8gy19j1] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: .5rem;
}

.kpi-title[b-90m8gy19j1] {
    font-size: .85rem;
    color: #6b7280;
}

.kpi-icon[b-90m8gy19j1] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.kpi-icon-blue[b-90m8gy19j1] {
    background-color: #dbeafe;
    color: #2563eb;
}

.kpi-icon-green[b-90m8gy19j1] {
    background-color: #dcfce7;
    color: #16a34a;
}

.kpi-icon-yellow[b-90m8gy19j1] {
    background-color: #fef3c7;
    color: #d97706;
}

.kpi-icon-red[b-90m8gy19j1] {
    background-color: #fee2e2;
    color: #dc2626;
}

.kpi-value[b-90m8gy19j1] {
    font-size: 1.65rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
}

.kpi-trend[b-90m8gy19j1] {
    margin-top: .35rem;
    font-size: .75rem;
    display: inline-flex;
    align-items: center;
    gap: .25rem;
    font-weight: 500;
}

.trend-positive[b-90m8gy19j1] {
    color: #16a34a;
}

.trend-negative[b-90m8gy19j1] {
    color: #dc2626;
}
/* /Pages/Dashboard/Components/DashboardSectionCard.razor.rz.scp.css */
.dashboard-panel[b-h7ia24wp2p] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 1rem;
}

.section-header[b-h7ia24wp2p] {
    margin-bottom: .75rem;
}

.section-title-wrapper[b-h7ia24wp2p] {
    display: flex;
    align-items: center;
    gap: .4rem;
}

.section-icon[b-h7ia24wp2p] {
    color: #22c55e;
}

.section-title[b-h7ia24wp2p] {
    margin: 0;
    font-size: .95rem;
    font-weight: 600;
    color: #0f172a;
}

.section-subtitle[b-h7ia24wp2p] {
    margin: .15rem 0 0;
    font-size: .75rem;
    color: #6b7280;
}
/* /Pages/Dashboard/Dashboard.razor.rz.scp.css */
/* Filtro de sede: card de diseño premium */
.analytics-filters-panel[b-ec2xi3grrp] {
    margin-top: 0;
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #ffffff;
    border-radius: 16px;
    border: 1px solid #e5e7eb;
    padding: 0.85rem 1.5rem;
    gap: 1rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
}

.analytics-filters-left[b-ec2xi3grrp] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.analytics-filters-icon-container[b-ec2xi3grrp] {
    width: 42px;
    height: 42px;
    background-color: #edf5ed;
    color: #1e4620;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.analytics-filters-icon-container[b-ec2xi3grrp]  .k-svg-icon {
    font-size: 20px;
    width: 20px;
    height: 20px;
}

.analytics-filters-text[b-ec2xi3grrp] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.analytics-filters-title[b-ec2xi3grrp] {
    font-weight: 600;
    color: #111827;
    font-size: 0.95rem;
    line-height: 1.2;
}

.analytics-filters-subtitle[b-ec2xi3grrp] {
    font-size: 0.75rem;
    color: #6b7280;
    line-height: 1.2;
}

.analytics-filters-right[b-ec2xi3grrp] {
    display: flex;
    align-items: center;
}

.dashboard-content[b-ec2xi3grrp] {
    margin-top: 0;
    background: transparent;
}

.dashboard-status-message[b-ec2xi3grrp] {
    background: #dbeafe;
    border: 1px solid #bfdbfe;
    color: #1d4ed8;
    border-radius: 8px;
    padding: .85rem 1rem;
    font-weight: 500;
}

.dashboard-status-error[b-ec2xi3grrp] {
    background: #fef2f2;
    border-color: #fecaca;
    color: #dc2626;
}

.dashboard-empty-message[b-ec2xi3grrp] {
    color: #6b7280;
    font-size: .85rem;
    padding: .4rem 0;
}

.dashboard-list-group[b-ec2xi3grrp] {
    border: 0;
    gap: .5rem;
}

.dashboard-list-item[b-ec2xi3grrp] {
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    padding: .75rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.order-code[b-ec2xi3grrp] {
    font-weight: 600;
    color: #111827;
    font-size: .85rem;
}

.order-amount[b-ec2xi3grrp] {
    font-weight: 700;
    color: #1f2937;
    font-size: .85rem;
}

.order-status[b-ec2xi3grrp] {
    font-size: .7rem;
    padding: .2rem .55rem;
    border-radius: 12px;
    display: inline-block;
    margin-top: .2rem;
    font-weight: 600;
}

.status-processing[b-ec2xi3grrp] {
    background: #dbeafe;
    color: #2563eb;
}

.status-completed[b-ec2xi3grrp] {
    background: #dcfce7;
    color: #16a34a;
}

.status-pending[b-ec2xi3grrp] {
    background: #fef3c7;
    color: #d97706;
}

.dashboard-activity-list[b-ec2xi3grrp] {
    list-style: none;
    margin: 0;
    padding: 0;
}

.dashboard-activity-item[b-ec2xi3grrp] {
    display: flex;
    align-items: flex-start;
    gap: .65rem;
    padding: .45rem 0;
}

.activity-icon[b-ec2xi3grrp] {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.activity-title[b-ec2xi3grrp] {
    font-weight: 600;
    color: #111827;
    font-size: .85rem;
}

.activity-primary[b-ec2xi3grrp] {
    background: #dbeafe;
    color: #2563eb;
}

.activity-success[b-ec2xi3grrp] {
    background: #dcfce7;
    color: #16a34a;
}

.activity-warning[b-ec2xi3grrp] {
    background: #fef3c7;
    color: #d97706;
}

[b-ec2xi3grrp] .k-chart-tooltip,
[b-ec2xi3grrp] .k-tooltip,
[b-ec2xi3grrp] .k-chart-shared-tooltip {
    background-color: #111827 !important;
    color: #ffffff !important;
    border: 1px solid #374151 !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .25) !important;
    z-index: 10000 !important;
}

[b-ec2xi3grrp] .k-chart-tooltip *,
[b-ec2xi3grrp] .k-tooltip *,
[b-ec2xi3grrp] .k-chart-shared-tooltip * {
    color: #ffffff !important;
}

@media (max-width: 576px) {
    [b-ec2xi3grrp] .welcome-banner {
        margin-bottom: 1rem !important; /* 16px */
    }

    .analytics-filters-panel[b-ec2xi3grrp] {
        margin-top: 0;
        flex-direction: column;
        align-items: stretch;
        padding: 16px;
        gap: 1rem;
    }

    .analytics-filters-right[b-ec2xi3grrp] {
        width: 100%;
    }

    .analytics-filters-right[b-ec2xi3grrp]  .k-dropdownlist {
        width: 100% !important;
    }

    .dashboard-content[b-ec2xi3grrp] {
        margin-top: 0;
        overflow-x: hidden;
    }

    [b-ec2xi3grrp] .k-chart,
    [b-ec2xi3grrp] .k-chart > div,
    [b-ec2xi3grrp] .k-chart .k-chart-surface,
    [b-ec2xi3grrp] .k-chart svg {
        width: 100% !important;
        max-width: 100% !important;
    }

    [b-ec2xi3grrp] .k-chart svg {
        height: 240px !important;
    }

    [b-ec2xi3grrp] .k-chart .k-chart-legend,
    [b-ec2xi3grrp] .k-chart .k-legend {
        font-size: .75rem !important;
    }

    [b-ec2xi3grrp] .k-chart .k-chart-legend-wrap,
    [b-ec2xi3grrp] .k-chart .k-legend-wrap {
        max-width: 100% !important;
        overflow: hidden !important;
    }
}
/* /Pages/Documentation/Documentation.razor.rz.scp.css */
/* ==========================================================================
   Aurocore — Documentation Hub: Liquid Glass & Calm UX
   ========================================================================== */

.docs-page[b-lozgs9vbc1] {
    --glass-bg: rgba(255, 255, 255, 0.85);
    --glass-border: rgba(226, 232, 240, 0.8);
    --glass-specular: inset 0 1px 1.5px 0 rgba(255, 255, 255, 0.9), inset 0 -1px 2px 0 rgba(0, 0, 0, 0.03);
    --glass-shadow: 0 12px 36px -8px rgba(9, 61, 147, 0.08);
    --glass-shadow-hover: 0 20px 45px -8px rgba(9, 61, 147, 0.14);

    --brand-blue: #093d93;
    --brand-blue-light: #1a5bc4;
    --brand-orange: #ed7024;
    --brand-orange-light: #fd8c1d;
    --brand-orange-glow: rgba(237, 112, 36, 0.35);

    --slate-900: #09224f;
    --slate-800: #13376b;
    --slate-600: #2c4d75;
    --slate-500: #476487;
    --slate-200: #e2e8f0;
    --slate-100: #f1f5f9;
    --slate-50: #f8fafc;

    --emerald: #10b981;
    --purple: #8b5cf6;

    --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);

    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: #f8fafc;
    color: var(--text-heading-primary, #09224f);
    font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

.docs-main[b-lozgs9vbc1] { flex: 1 0 auto; width: 100%; }

.docs-container[b-lozgs9vbc1] {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 clamp(1rem, 3vw, 2rem);
}

/* Hero */
.docs-hero[b-lozgs9vbc1] {
    position: relative;
    padding: clamp(7rem, 14vw, 9rem) 0 clamp(3rem, 5vw, 4rem);
    background-color: #f8fafc;
    overflow: hidden;
}

.hero-ambient-mesh[b-lozgs9vbc1] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

.mesh-orb[b-lozgs9vbc1] {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.6;
    will-change: transform;
}

.orb-blue[b-lozgs9vbc1] {
    top: -15%;
    left: 10%;
    width: clamp(300px, 40vw, 600px);
    height: clamp(300px, 40vw, 600px);
    background: radial-gradient(circle, rgba(9, 61, 147, 0.15) 0%, transparent 70%);
}

.orb-orange[b-lozgs9vbc1] {
    bottom: -15%;
    right: 5%;
    width: clamp(250px, 35vw, 500px);
    height: clamp(250px, 35vw, 500px);
    background: radial-gradient(circle, rgba(237, 112, 36, 0.12) 0%, transparent 70%);
}

.hero-grid-pattern[b-lozgs9vbc1] {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(9, 61, 147, 0.04) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
    z-index: 0;
}

.hero-header[b-lozgs9vbc1] {
    position: relative;
    z-index: 1;
    max-width: 800px;
    margin: 0 auto;
}

.hero-badge[b-lozgs9vbc1] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 1rem;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 16px -4px rgba(9, 61, 147, 0.08);
    backdrop-filter: blur(16px);
    font-size: 0.82rem;
    font-weight: 500;
    color: #475569;
    margin-bottom: 1.5rem;
}

.badge-dot-orange[b-lozgs9vbc1] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #ed7024;
    box-shadow: 0 0 6px rgba(237, 112, 36, 0.35);
}

.badge-separator[b-lozgs9vbc1] { color: var(--slate-200); font-weight: 300; }
.badge-subtext[b-lozgs9vbc1] { color: var(--brand-orange); font-weight: 600; }

.hero-title[b-lozgs9vbc1] {
    font-size: clamp(2rem, 5vw, 3.25rem);
    font-weight: 800;
    line-height: 1.15;
    color: #0f172a;
    margin: 0 0 1.25rem;
    letter-spacing: -0.02em;
}

.highlight-orange[b-lozgs9vbc1] {
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.hero-lead[b-lozgs9vbc1] {
    font-size: clamp(1rem, 2vw, 1.18rem);
    color: var(--slate-600);
    line-height: 1.7;
    margin: 0 0 2rem;
}

/* Search Bar */
.docs-search-wrapper[b-lozgs9vbc1] {
    max-width: 620px;
    margin: 0 auto;
}

.docs-search-bar[b-lozgs9vbc1] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1.25rem;
    border-radius: 16px;
    background: white;
    border: 1.5px solid var(--slate-200);
    box-shadow: 0 8px 30px -4px rgba(9, 61, 147, 0.08);
    transition: all 0.3s var(--ease-spring);
}

.docs-search-bar:focus-within[b-lozgs9vbc1] {
    border-color: var(--brand-blue);
    box-shadow: 0 12px 35px -4px rgba(9, 61, 147, 0.16);
    transform: translateY(-2px);
}

.docs-search-bar[b-lozgs9vbc1]  .search-icon {
    color: var(--slate-400, #94a3b8);
    font-size: 1.15rem;
}

.docs-search-bar input[b-lozgs9vbc1] {
    flex: 1;
    border: none;
    outline: none;
    font-size: 0.95rem;
    color: var(--slate-900);
    background: transparent;
    font-family: inherit;
}

.search-kbd[b-lozgs9vbc1] {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--slate-400, #94a3b8);
    background: var(--slate-100);
    padding: 0.2rem 0.5rem;
    border-radius: 6px;
    border: 1px solid var(--slate-200);
}

/* Content Section */
.docs-content-section[b-lozgs9vbc1] {
    padding: clamp(3rem, 6vw, 5rem) 0 clamp(4rem, 8vw, 6rem);
    background: white;
}

.section-title-row[b-lozgs9vbc1] {
    margin-bottom: 2rem;
}

.section-kicker[b-lozgs9vbc1] {
    display: inline-block;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--brand-orange);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 0.5rem;
}

.section-title[b-lozgs9vbc1] {
    font-size: clamp(1.5rem, 3.5vw, 2.25rem);
    font-weight: 800;
    color: var(--text-heading-primary, #09224f) !important;
    letter-spacing: -0.02em;
    margin: 0;
}

/* Quickstart Grid */
.quickstart-grid[b-lozgs9vbc1] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.5rem;
    margin-bottom: 4rem;
}

.quickstart-card[b-lozgs9vbc1] {
    padding: 2rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(226, 232, 240, 0.9);
    box-shadow: 0 10px 30px -6px rgba(9, 61, 147, 0.05), inset 0 1px 0 rgba(255, 255, 255, 0.9);
    transition: all 0.35s var(--ease-spring);
    display: flex;
    flex-direction: column;
}

.quickstart-card:hover[b-lozgs9vbc1] {
    transform: translateY(-4px);
    background: white;
    box-shadow: var(--glass-shadow-hover);
    border-color: rgba(9, 61, 147, 0.25);
}

.card-icon-bubble[b-lozgs9vbc1] {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.25rem;
    font-size: 1.25rem;
    transition: transform 0.3s ease;
}

.card-icon-bubble.blue[b-lozgs9vbc1] { background: rgba(9, 61, 147, 0.08); color: var(--brand-blue); border: 1px solid rgba(9, 61, 147, 0.15); }
.card-icon-bubble.orange[b-lozgs9vbc1] { background: rgba(237, 112, 36, 0.08); color: var(--brand-orange); border: 1px solid rgba(237, 112, 36, 0.18); }
.card-icon-bubble.emerald[b-lozgs9vbc1] { background: rgba(9, 61, 147, 0.08); color: var(--brand-blue); border: 1px solid rgba(9, 61, 147, 0.15); }

.quickstart-card h3[b-lozgs9vbc1] {
    font-size: 1.18rem;
    font-weight: 700;
    color: var(--slate-900);
    margin: 0 0 0.6rem;
}

.quickstart-card p[b-lozgs9vbc1] {
    font-size: 0.9rem;
    color: var(--slate-600);
    line-height: 1.65;
    margin: 0 0 1.5rem;
    flex: 1;
}

.card-link[b-lozgs9vbc1] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--brand-blue);
    text-decoration: none;
    transition: gap 0.2s ease;
}

.card-link:hover[b-lozgs9vbc1] {
    gap: 0.7rem;
    color: var(--brand-orange);
}

/* Modules Directory */
.modules-directory-section[b-lozgs9vbc1] {
    margin-top: 3rem;
}

.doc-categories-grid[b-lozgs9vbc1] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 1.5rem;
    margin-bottom: 4rem;
}

.category-block[b-lozgs9vbc1] {
    padding: 1.75rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(226, 232, 240, 0.9);
    box-shadow: 0 10px 30px -6px rgba(9, 61, 147, 0.05), inset 0 1px 0 rgba(255, 255, 255, 0.9);
    transition: all 0.3s var(--ease-smooth);
}

.category-block:hover[b-lozgs9vbc1] {
    background: white;
    border-color: rgba(9, 61, 147, 0.25);
    box-shadow: 0 16px 36px -6px rgba(9, 61, 147, 0.12);
}

.category-header[b-lozgs9vbc1] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    margin-bottom: 1.25rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid var(--slate-200);
}

.category-icon[b-lozgs9vbc1] {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.category-icon.blue[b-lozgs9vbc1] { background: rgba(9, 61, 147, 0.08); color: var(--brand-blue); border: 1px solid rgba(9, 61, 147, 0.15); }
.category-icon.orange[b-lozgs9vbc1] { background: rgba(237, 112, 36, 0.08); color: var(--brand-orange); border: 1px solid rgba(237, 112, 36, 0.18); }
.category-icon.emerald[b-lozgs9vbc1] { background: rgba(9, 61, 147, 0.08); color: var(--brand-blue); border: 1px solid rgba(9, 61, 147, 0.15); }
.category-icon.purple[b-lozgs9vbc1] { background: rgba(44, 77, 117, 0.08); color: var(--text-body-lead); border: 1px solid rgba(44, 77, 117, 0.15); }

.category-header h4[b-lozgs9vbc1] {
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--slate-900);
    margin: 0;
}

.category-header span[b-lozgs9vbc1] {
    font-size: 0.78rem;
    color: var(--slate-500);
}

.article-list[b-lozgs9vbc1] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.article-list li a[b-lozgs9vbc1] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.88rem;
    color: var(--slate-700, #334155);
    text-decoration: none;
    transition: all 0.2s ease;
}

.article-list li a[b-lozgs9vbc1]  svg {
    color: var(--slate-400, #94a3b8);
    font-size: 0.95rem;
    transition: color 0.2s ease;
}

.article-list li a:hover[b-lozgs9vbc1] {
    color: var(--brand-blue);
    transform: translateX(4px);
}

.article-list li a:hover[b-lozgs9vbc1]  svg {
    color: var(--brand-orange);
}

/* Help CTA Banner */
.docs-help-card[b-lozgs9vbc1] {
    border-radius: 24px;
    padding: clamp(2rem, 4vw, 3rem);
    background: linear-gradient(135deg, rgba(9, 61, 147, 0.05), rgba(237, 112, 36, 0.05));
    border: 1px solid rgba(9, 61, 147, 0.12);
}

.help-card-content[b-lozgs9vbc1] {
    display: flex;
    align-items: center;
    gap: 2rem;
    flex-wrap: wrap;
}

.help-icon[b-lozgs9vbc1] {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    background: var(--brand-blue);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    flex-shrink: 0;
}

.help-card-content > div:nth-child(2)[b-lozgs9vbc1] {
    flex: 1;
    min-width: 250px;
}

.help-card-content h3[b-lozgs9vbc1] {
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--slate-900);
    margin: 0 0 0.35rem;
}

.help-card-content p[b-lozgs9vbc1] {
    font-size: 0.9rem;
    color: var(--slate-600);
    margin: 0;
    line-height: 1.6;
}

.btn-help-contact[b-lozgs9vbc1] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.85rem 1.75rem;
    border-radius: 12px;
    background: var(--brand-blue);
    color: white;
    font-weight: 700;
    font-size: 0.92rem;
    text-decoration: none;
    transition: all 0.3s var(--ease-spring);
    box-shadow: 0 4px 16px rgba(9, 61, 147, 0.2);
}

.btn-help-contact:hover[b-lozgs9vbc1] {
    background: var(--brand-orange);
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(237, 112, 36, 0.3);
}

/* Responsive */
@media (max-width: 767px) {
    .help-card-content[b-lozgs9vbc1] {
        flex-direction: column;
        align-items: flex-start;
        gap: 1.25rem;
    }

    .btn-help-contact[b-lozgs9vbc1] {
        width: 100%;
        justify-content: center;
    }
}
/* /Pages/Employees/Employee.razor.rz.scp.css */
.credentials-alert[b-swf66nl452] {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    padding: 0.9rem;
    border: 1px solid #d1fae5;
    border-radius: 10px;
    background: #ecfdf5;
}

.credentials-alert-icon[b-swf66nl452] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #d1fae5;
    color: #047857;
}

.credentials-alert-content strong[b-swf66nl452] {
    color: #065f46;
}

.credentials-alert-content p[b-swf66nl452] {
    margin: 0.2rem 0 0 0;
    color: #065f46;
    font-size: 0.9rem;
}

[b-swf66nl452] .shared-form-tabs,
[b-swf66nl452] .shared-form-tabs .k-content {
    overflow: visible !important;
}

.employee-status-badge[b-swf66nl452] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1;
    border: 1px solid transparent;
}

.employee-status-badge--available[b-swf66nl452] {
    color: #166534;
    background-color: #dcfce7;
    border-color: #86efac;
}

.employee-status-badge--inservice[b-swf66nl452] {
    color: #92400e;
    background-color: #fef3c7;
    border-color: #fcd34d;
}

.employee-status-badge--notavailable[b-swf66nl452] {
    color: #991b1b;
    background-color: #fee2e2;
    border-color: #fca5a5;
}

.employee-status-badge--default[b-swf66nl452] {
    color: #374151;
    background-color: #f3f4f6;
    border-color: #d1d5db;
}



@media (max-width: 768px) {
    [b-swf66nl452] .grid-toolbar,
    [b-swf66nl452] .toolbar-left {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: 4px !important;
        width: 100% !important;
        padding: 0 !important;
    }

    [b-swf66nl452] .toolbar-left .toolbar-extra {
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: 80px !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    [b-swf66nl452] .toolbar-left .toolbar-extra .inventory-toolbar-branch-filter,
    [b-swf66nl452] .toolbar-left .toolbar-extra .dropdownlist-arregly,
    [b-swf66nl452] .toolbar-left .toolbar-extra .k-dropdownlist,
    [b-swf66nl452] .toolbar-left .toolbar-extra .k-picker {
        width: 80px !important;
        max-width: 80px !important;
        min-width: 80px !important;
        display: block !important;
    }

    [b-swf66nl452] .toolbar-left .toolbar-extra .k-input-inner {
        padding: 2px 4px 2px 6px !important;
        font-size: 0.8rem !important;
    }

    [b-swf66nl452] .toolbar-left .toolbar-extra .k-input-button {
        padding: 0 4px !important;
    }

    [b-swf66nl452] .toolbar-left .toolbar-search-group {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        width: auto !important;
        display: flex !important;
        align-items: center !important;
        gap: 4px !important;
    }

    [b-swf66nl452] .toolbar-left .toolbar-utility-btn {
        flex: 0 0 28px !important;
        width: 28px !important;
        height: 28px !important;
        min-width: 28px !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    [b-swf66nl452] .modal-footer-custom {
        flex-shrink: 0 !important;
    }

    [b-swf66nl452] .modal-footer-custom .modal-wizard-footer.d-flex {
        width: 100% !important;
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        gap: 12px !important;
    }

    [b-swf66nl452] .modal-footer-custom .modal-wizard-footer.d-flex > button {
        width: auto !important;
        min-width: 0 !important;
        flex: 1 1 0% !important;
        max-width: 140px !important;
        margin: 0 !important;
    }
}

[b-swf66nl452] .admin-badge {
    font-size: 0.72rem !important;
    padding: 2px 8px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    border-radius: 20px !important;
    letter-spacing: 0.02em;
}

[b-swf66nl452] .k-grid-header th.text-center .k-cell-inner,
[b-swf66nl452] .k-grid-header th.text-center .k-link {
    justify-content: center !important;
    text-align: center !important;
}

[b-swf66nl452] .k-grid-header th.text-end .k-cell-inner,
[b-swf66nl452] .k-grid-header th.text-end .k-link {
    justify-content: flex-end !important;
    text-align: right !important;
}

[b-swf66nl452] .k-grid-header th.text-start .k-cell-inner,
[b-swf66nl452] .k-grid-header th.text-start .k-link {
    justify-content: flex-start !important;
    text-align: left !important;
}

/* /Pages/Guides/GuideDetail.razor.rz.scp.css */
.guide-detail-page[b-fy5ji439ty] {
    --brand-blue: #093d93;
    --brand-blue-light: #1a5bc4;
    --brand-orange: #ed7024;
    --brand-orange-light: #fd8c1d;
    --slate-900: #09224f;
    --slate-800: #13376b;
    --slate-600: #2c4d75;
    --slate-500: #476487;
    --slate-200: #e2e8f0;
    --slate-100: #f1f5f9;
    --slate-50: #f8fafc;

    background-color: #f8fafc;
    min-height: 100vh;
    font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}

.guide-detail-container[b-fy5ji439ty] {
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 clamp(1rem, 3vw, 2rem);
}

.guide-detail-hero[b-fy5ji439ty] {
    position: relative;
    padding: clamp(6.5rem, 12vw, 8.5rem) 0 clamp(2.5rem, 4vw, 3.5rem);
    background: #f8fafc;
    overflow: hidden;
    border-bottom: 1px solid var(--slate-200);
}

.hero-ambient-mesh[b-fy5ji439ty] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

.mesh-orb[b-fy5ji439ty] {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.6;
}

.orb-blue[b-fy5ji439ty] {
    top: -20%;
    left: 10%;
    width: 450px;
    height: 450px;
    background: radial-gradient(circle, rgba(9, 61, 147, 0.15) 0%, transparent 70%);
}

.orb-orange[b-fy5ji439ty] {
    bottom: -20%;
    right: 5%;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(237, 112, 36, 0.12) 0%, transparent 70%);
}

.guide-breadcrumb[b-fy5ji439ty] {
    position: relative;
    z-index: 1;
    margin-bottom: 1.5rem;
}

.breadcrumb-link[b-fy5ji439ty] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--brand-blue);
    text-decoration: none;
    transition: color 0.2s ease;
}

.breadcrumb-link:hover[b-fy5ji439ty] {
    color: var(--brand-orange);
}

.guide-header[b-fy5ji439ty] {
    position: relative;
    z-index: 1;
    max-width: 820px;
}

.guide-category-tag[b-fy5ji439ty] {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.3rem 0.75rem;
    border-radius: 6px;
    width: fit-content;
    margin-bottom: 1.25rem;
}

.guide-category-tag.blue[b-fy5ji439ty] { background: rgba(9, 61, 147, 0.08); color: var(--brand-blue); border: 1px solid rgba(9, 61, 147, 0.12); }
.guide-category-tag.orange[b-fy5ji439ty] { background: rgba(237, 112, 36, 0.08); color: var(--brand-orange); border: 1px solid rgba(237, 112, 36, 0.15); }
.guide-category-tag.emerald[b-fy5ji439ty] { background: rgba(9, 61, 147, 0.08); color: var(--brand-blue); border: 1px solid rgba(9, 61, 147, 0.12); }
.guide-category-tag.purple[b-fy5ji439ty] { background: rgba(44, 77, 117, 0.08); color: var(--slate-800); border: 1px solid rgba(44, 77, 117, 0.12); }

.guide-title[b-fy5ji439ty] {
    font-size: clamp(2rem, 4vw, 2.75rem);
    font-weight: 800;
    line-height: 1.2;
    color: var(--slate-900);
    margin: 0 0 1rem;
    letter-spacing: -0.02em;
}

.guide-lead[b-fy5ji439ty] {
    font-size: 1.12rem;
    color: var(--slate-600);
    line-height: 1.65;
    margin: 0 0 1.5rem;
}

.guide-meta[b-fy5ji439ty] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.85rem;
    color: var(--slate-500);
}

.meta-dot[b-fy5ji439ty] { color: var(--slate-200); }

.guide-content-section[b-fy5ji439ty] {
    padding: clamp(3rem, 5vw, 4.5rem) 0 clamp(4rem, 8vw, 6rem);
    background: white;
}

.guide-layout[b-fy5ji439ty] {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 340px;
    gap: 3.5rem;
    align-items: start;
}

.guide-article[b-fy5ji439ty] {
    max-width: 100%;
}

.guide-section-block[b-fy5ji439ty] {
    margin-bottom: 2.75rem;
}

.guide-section-block h2[b-fy5ji439ty] {
    font-size: 1.45rem;
    font-weight: 700;
    color: var(--slate-900);
    margin: 0 0 1rem;
    line-height: 1.35;
}

.guide-section-block p[b-fy5ji439ty] {
    font-size: 1rem;
    color: var(--slate-600);
    line-height: 1.75;
    margin: 0 0 1rem;
}

.guide-bullets[b-fy5ji439ty] {
    margin: 1rem 0;
    padding-left: 1.5rem;
    color: var(--slate-600);
}

.guide-bullets li[b-fy5ji439ty] {
    font-size: 0.95rem;
    line-height: 1.65;
    margin-bottom: 0.5rem;
}

.guide-article-footer[b-fy5ji439ty] {
    padding-top: 2rem;
    border-top: 1px solid var(--slate-200);
    margin-top: 3rem;
}

.share-box[b-fy5ji439ty] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.5rem;
    background: var(--slate-50);
    border: 1px solid var(--slate-200);
    border-radius: 16px;
}

.share-box span[b-fy5ji439ty] {
    font-weight: 600;
    color: var(--slate-900);
}

.btn-guide-cta[b-fy5ji439ty] {
    padding: 0.65rem 1.25rem;
    background: var(--brand-blue);
    color: white;
    font-weight: 600;
    font-size: 0.88rem;
    border-radius: 10px;
    text-decoration: none;
    transition: background 0.2s ease;
}

.btn-guide-cta:hover[b-fy5ji439ty] {
    background: var(--brand-blue-light);
}

.guide-sidebar[b-fy5ji439ty] {
    display: flex;
    flex-direction: column;
    gap: 1.75rem;
    position: sticky;
    top: 6rem;
}

.sidebar-card[b-fy5ji439ty] {
    padding: 1.75rem;
    background: var(--slate-50);
    border: 1px solid var(--slate-200);
    border-radius: 20px;
}

.cta-card[b-fy5ji439ty] {
    background: linear-gradient(135deg, #093d93 0%, #1a5bc4 100%);
    color: white;
    border: none;
}

.cta-badge[b-fy5ji439ty] {
    display: inline-block;
    padding: 0.25rem 0.65rem;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 700;
    margin-bottom: 1rem;
}

.cta-card h3[b-fy5ji439ty] {
    font-size: 1.25rem;
    font-weight: 700;
    color: white;
    margin: 0 0 0.5rem;
}

.cta-card p[b-fy5ji439ty] {
    font-size: 0.88rem;
    opacity: 0.9;
    line-height: 1.55;
    margin: 0 0 1.25rem;
}

.btn-sidebar-primary[b-fy5ji439ty] {
    display: block;
    text-align: center;
    padding: 0.75rem 1.25rem;
    background: var(--brand-orange);
    color: white;
    font-weight: 700;
    font-size: 0.9rem;
    border-radius: 12px;
    text-decoration: none;
    transition: background 0.2s ease;
}

.btn-sidebar-primary:hover[b-fy5ji439ty] {
    background: var(--brand-orange-light);
}

.sidebar-card h4[b-fy5ji439ty] {
    font-size: 1rem;
    font-weight: 700;
    color: var(--slate-900);
    margin: 0 0 1.25rem;
}

.related-guides-list[b-fy5ji439ty] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.related-guides-list a[b-fy5ji439ty] {
    text-decoration: none;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.related-tag[b-fy5ji439ty] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
}

.related-tag.blue[b-fy5ji439ty] { color: var(--brand-blue); }
.related-tag.orange[b-fy5ji439ty] { color: var(--brand-orange); }
.related-tag.emerald[b-fy5ji439ty] { color: var(--brand-blue); }
.related-tag.purple[b-fy5ji439ty] { color: var(--slate-800); }

.related-title[b-fy5ji439ty] {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--slate-800);
    line-height: 1.4;
    transition: color 0.2s ease;
}

.related-guides-list a:hover .related-title[b-fy5ji439ty] {
    color: var(--brand-orange);
}

@media (max-width: 991px) {
    .guide-layout[b-fy5ji439ty] {
        grid-template-columns: 1fr;
        gap: 2.5rem;
    }

    .guide-sidebar[b-fy5ji439ty] {
        position: static;
    }
}
/* /Pages/Guides/Guides.razor.rz.scp.css */
/* ==========================================================================
   Aurocore — Guides & Tutorials: Calm UX & Liquid Glass
   ========================================================================== */

.guides-page[b-2zv28huu6n] {
    --glass-bg: rgba(255, 255, 255, 0.85);
    --glass-border: rgba(226, 232, 240, 0.8);
    --glass-specular: inset 0 1px 1.5px 0 rgba(255, 255, 255, 0.9), inset 0 -1px 2px 0 rgba(0, 0, 0, 0.03);
    --glass-shadow: 0 12px 36px -8px rgba(9, 61, 147, 0.08);
    --glass-shadow-hover: 0 20px 45px -8px rgba(9, 61, 147, 0.14);

    --brand-blue: #093d93;
    --brand-blue-light: #1a5bc4;
    --brand-orange: #ed7024;
    --brand-orange-light: #fd8c1d;
    --brand-orange-glow: rgba(237, 112, 36, 0.35);

    --slate-900: #09224f;
    --slate-800: #13376b;
    --slate-600: #2c4d75;
    --slate-500: #476487;
    --slate-200: #e2e8f0;
    --slate-100: #f1f5f9;
    --slate-50: #f8fafc;

    --emerald: #10b981;
    --purple: #8b5cf6;

    --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);

    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: #f8fafc;
    color: var(--text-heading-primary, #09224f);
    font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

.guides-main[b-2zv28huu6n] { flex: 1 0 auto; width: 100%; }

.guides-container[b-2zv28huu6n] {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 clamp(1rem, 3vw, 2rem);
}

/* Hero */
.guides-hero[b-2zv28huu6n] {
    position: relative;
    padding: clamp(7rem, 14vw, 9rem) 0 clamp(3rem, 5vw, 4rem);
    background-color: #f8fafc;
    overflow: hidden;
}

.hero-ambient-mesh[b-2zv28huu6n] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

.mesh-orb[b-2zv28huu6n] {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.6;
    will-change: transform;
}

.orb-blue[b-2zv28huu6n] {
    top: -15%;
    left: 10%;
    width: clamp(300px, 40vw, 600px);
    height: clamp(300px, 40vw, 600px);
    background: radial-gradient(circle, rgba(9, 61, 147, 0.15) 0%, transparent 70%);
}

.orb-orange[b-2zv28huu6n] {
    bottom: -15%;
    right: 5%;
    width: clamp(250px, 35vw, 500px);
    height: clamp(250px, 35vw, 500px);
    background: radial-gradient(circle, rgba(237, 112, 36, 0.12) 0%, transparent 70%);
}

.hero-grid-pattern[b-2zv28huu6n] {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(9, 61, 147, 0.04) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
    z-index: 0;
}

.hero-header[b-2zv28huu6n] {
    position: relative;
    z-index: 1;
    max-width: 800px;
    margin: 0 auto;
}

.hero-badge[b-2zv28huu6n] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 1rem;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.85);
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 16px -4px rgba(9, 61, 147, 0.08);
    backdrop-filter: blur(16px);
    font-size: 0.82rem;
    font-weight: 500;
    color: #475569;
    margin-bottom: 1.5rem;
}

.badge-dot-orange[b-2zv28huu6n] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #ed7024;
    box-shadow: 0 0 6px rgba(237, 112, 36, 0.35);
}

.badge-separator[b-2zv28huu6n] { color: var(--slate-200); font-weight: 300; }
.badge-subtext[b-2zv28huu6n] { color: var(--brand-orange); font-weight: 600; }

.hero-title[b-2zv28huu6n] {
    font-size: clamp(2rem, 5vw, 3.25rem);
    font-weight: 800;
    line-height: 1.15;
    color: #0f172a;
    margin: 0 0 1.25rem;
    letter-spacing: -0.02em;
}

.highlight-orange[b-2zv28huu6n] {
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.hero-lead[b-2zv28huu6n] {
    font-size: clamp(1rem, 2vw, 1.18rem);
    color: var(--slate-600);
    line-height: 1.7;
    margin: 0 0 2rem;
}

/* Category Filter Pills */
.guides-filters[b-2zv28huu6n] {
    display: flex;
    justify-content: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.filter-pill[b-2zv28huu6n] {
    padding: 0.55rem 1.25rem;
    border-radius: 100px;
    border: 1px solid var(--slate-200);
    background: white;
    color: var(--slate-600);
    font-size: 0.88rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.25s var(--ease-spring);
    font-family: inherit;
}

.filter-pill:hover[b-2zv28huu6n] {
    border-color: var(--brand-blue);
    color: var(--brand-blue);
    transform: translateY(-2px);
}

.filter-pill.active[b-2zv28huu6n] {
    background: var(--brand-blue);
    color: white;
    border-color: var(--brand-blue);
    box-shadow: 0 4px 14px rgba(9, 61, 147, 0.25);
}

/* Guides Grid */
.guides-grid-section[b-2zv28huu6n] {
    padding: clamp(3rem, 6vw, 5rem) 0 clamp(4rem, 8vw, 6rem);
    background: white;
}

.guides-grid[b-2zv28huu6n] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
    gap: 1.5rem;
    margin-bottom: 4rem;
}

.guide-card[b-2zv28huu6n] {
    padding: 2rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(226, 232, 240, 0.9);
    box-shadow: 0 10px 30px -6px rgba(9, 61, 147, 0.05), inset 0 1px 0 rgba(255, 255, 255, 0.9);
    transition: all 0.35s var(--ease-spring);
    display: flex;
    flex-direction: column;
}

.guide-card:hover[b-2zv28huu6n] {
    transform: translateY(-4px);
    background: white;
    box-shadow: var(--glass-shadow-hover);
    border-color: rgba(9, 61, 147, 0.25);
}

.guide-category-tag[b-2zv28huu6n] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 0.25rem 0.65rem;
    border-radius: 6px;
    width: fit-content;
    margin-bottom: 1.25rem;
}

.guide-category-tag.blue[b-2zv28huu6n] { background: rgba(9, 61, 147, 0.08); color: var(--brand-blue); border: 1px solid rgba(9, 61, 147, 0.12); }
.guide-category-tag.orange[b-2zv28huu6n] { background: rgba(237, 112, 36, 0.08); color: var(--brand-orange); border: 1px solid rgba(237, 112, 36, 0.15); }
.guide-category-tag.emerald[b-2zv28huu6n] { background: rgba(9, 61, 147, 0.08); color: var(--brand-blue); border: 1px solid rgba(9, 61, 147, 0.12); }
.guide-category-tag.purple[b-2zv28huu6n] { background: rgba(44, 77, 117, 0.08); color: var(--text-body-lead); border: 1px solid rgba(44, 77, 117, 0.12); }

.guide-card h3[b-2zv28huu6n] {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--slate-900);
    margin: 0 0 0.75rem;
    line-height: 1.4;
}

.guide-card p[b-2zv28huu6n] {
    font-size: 0.88rem;
    color: var(--slate-600);
    line-height: 1.65;
    margin: 0 0 1.5rem;
    flex: 1;
}

.guide-card-footer[b-2zv28huu6n] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: 1rem;
    border-top: 1px solid var(--slate-200);
}

.read-time[b-2zv28huu6n] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.78rem;
    color: var(--slate-500);
}

.read-time[b-2zv28huu6n]  svg { font-size: 0.85rem; }

.guide-read-btn[b-2zv28huu6n] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.85rem;
    font-weight: 700;
    color: var(--brand-blue);
    text-decoration: none;
    transition: gap 0.2s ease;
}

.guide-read-btn:hover[b-2zv28huu6n] {
    gap: 0.6rem;
    color: var(--brand-orange);
}

/* CTA Newsletter */
.guides-cta[b-2zv28huu6n] {
    border-radius: 24px;
    padding: clamp(2rem, 5vw, 3.5rem);
    background: linear-gradient(135deg, var(--brand-blue), #1a5bc4);
    color: white;
    text-align: center;
}

.cta-inner[b-2zv28huu6n] {
    max-width: 620px;
    margin: 0 auto;
}

.cta-icon-box[b-2zv28huu6n] {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.15);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.35rem;
    margin: 0 auto 1.25rem;
}

.guides-cta h3[b-2zv28huu6n] {
    font-size: clamp(1.35rem, 3vw, 1.85rem);
    font-weight: 800;
    margin: 0 0 0.6rem;
}

.guides-cta p[b-2zv28huu6n] {
    font-size: 0.95rem;
    opacity: 0.85;
    line-height: 1.6;
    margin: 0 0 1.75rem;
}

.cta-newsletter-form[b-2zv28huu6n] {
    display: flex;
    gap: 0.75rem;
    max-width: 480px;
    margin: 0 auto;
}

.cta-newsletter-form input[b-2zv28huu6n] {
    flex: 1;
    padding: 0.75rem 1.25rem;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    background: rgba(255, 255, 255, 0.1);
    color: white;
    font-size: 0.9rem;
    font-family: inherit;
    outline: none;
}

.cta-newsletter-form input[b-2zv28huu6n]::placeholder {
    color: rgba(255, 255, 255, 0.6);
}

.btn-subscribe[b-2zv28huu6n] {
    padding: 0.75rem 1.5rem;
    border-radius: 12px;
    background: var(--brand-orange);
    color: white;
    font-weight: 700;
    font-size: 0.9rem;
    border: none;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.3s var(--ease-spring);
    box-shadow: 0 4px 14px rgba(237, 112, 36, 0.4);
}

.btn-subscribe:hover[b-2zv28huu6n] {
    background: var(--brand-orange-light);
    transform: translateY(-2px);
}

@media (max-width: 600px) {
    .cta-newsletter-form[b-2zv28huu6n] {
        flex-direction: column;
    }
}
/* /Pages/Home.razor.rz.scp.css */
.landing-page[b-ijftnp0kz9] {
    min-height: 100vh;
    background-color: #ffffff;
    width: 100%;
    overflow-x: clip;
    position: relative;
}

body[b-ijftnp0kz9] {
    margin: 0;
    padding: 0;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
        'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
        sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

*[b-ijftnp0kz9] {
    box-sizing: border-box;
}
/* /Pages/Inventory/Inventory.razor.rz.scp.css */
/* Estilos específicos para la página de inventario */

/* ==========================================================================
   Header Compacto (~72px) para Recuperación de Espacio Vertical
   ========================================================================== */
[b-sw02hht6lw] .welcome-banner {
    padding: 12px 20px !important;
    margin-bottom: 12px !important;
    min-height: unset !important;
    border-radius: 12px !important;
}

[b-sw02hht6lw] .welcome-banner::before {
    width: 120px !important;
    height: 120px !important;
    transform: translate(30px, -30px) !important;
}

[b-sw02hht6lw] .welcome-banner::after {
    display: none !important;
}

[b-sw02hht6lw] .welcome-banner .title-icon {
    width: 38px !important;
    height: 38px !important;
    border-radius: 10px !important;
}

[b-sw02hht6lw] .welcome-banner .title-icon ::deep .icon-main,
[b-sw02hht6lw] .welcome-banner .title-icon .icon-main {
    width: 20px !important;
    height: 20px !important;
}

[b-sw02hht6lw] .welcome-banner .banner-title {
    font-size: 1.25rem !important;
    margin-bottom: 2px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
}

[b-sw02hht6lw] .welcome-banner .banner-subtitle {
    font-size: 0.8125rem !important; /* 13px legible */
    color: rgba(255, 255, 255, 0.95) !important;
    opacity: 1 !important;
    margin-bottom: 0 !important;
    line-height: 1.35 !important;
    font-weight: 400 !important;
}

[b-sw02hht6lw] .welcome-banner .title-container {
    gap: 12px !important;
}

[b-sw02hht6lw] .welcome-banner .banner-content {
    align-items: center !important;
}

/* ==========================================================================
   Botones de Acción en Banner de Inventario (Header Glassmorphism)
   ========================================================================== */
.inventory-valuation-pill[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-valuation-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 9999px;
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(255, 255, 255, 0.20);
    font-size: 0.75rem;
    font-weight: 500;
    cursor: default;
    box-shadow: none;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    white-space: nowrap;
}

.inventory-valuation-pill .valuation-prefix[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-valuation-pill .valuation-prefix {
    opacity: 0.75;
    font-weight: 400;
}

.inventory-valuation-pill[b-sw02hht6lw]  .btn-icon,
[b-sw02hht6lw] .inventory-valuation-pill .btn-icon {
    width: 15px;
    height: 15px;
    opacity: 0.9;
}

.inventory-banner-actions[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-banner-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.inventory-banner-btn[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-banner-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 8px 16px;
    font-size: 0.84rem;
    font-weight: 600;
    line-height: 1.25;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    text-decoration: none;
    user-select: none;
    white-space: nowrap;
    outline: none;
    border: 1px solid transparent;
}

.inventory-banner-btn--icon-only[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-banner-btn--icon-only {
    width: 38px;
    height: 38px;
    padding: 0;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.15);
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.25);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.inventory-banner-btn--icon-only:hover[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-banner-btn--icon-only:hover {
    background: rgba(255, 255, 255, 0.25);
    border-color: rgba(255, 255, 255, 0.5);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.inventory-banner-btn:focus-visible[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-banner-btn:focus-visible {
    outline: 2px solid rgba(255, 255, 255, 0.7);
    outline-offset: 2px;
}

/* 1. Botón Secundario: 'Nuevo producto' - Glassmorphism refinado con borde sutil */
.inventory-banner-btn--secondary[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-banner-btn--secondary {
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
    border-color: rgba(255, 255, 255, 0.25);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.inventory-banner-btn--secondary:hover[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-banner-btn--secondary:hover {
    background: rgba(255, 255, 255, 0.22);
    border-color: rgba(255, 255, 255, 0.45);
    color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.16);
}

.inventory-banner-btn--secondary:active[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-banner-btn--secondary:active {
    transform: translateY(0);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* 2. Botón Primario: 'Nuevo inventario' - Cristal blanco brillante contrastante */
.inventory-banner-btn--primary[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-banner-btn--primary {
    background: #ffffff;
    color: #104a3c;
    border-color: #ffffff;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
}

.inventory-banner-btn--primary:hover[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-banner-btn--primary:hover {
    background: #f8fafc;
    color: #0b382b;
    border-color: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.22);
}

.inventory-banner-btn--primary:active[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-banner-btn--primary:active {
    transform: translateY(0);
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}

.inventory-banner-btn[b-sw02hht6lw]  .btn-icon,
[b-sw02hht6lw] .inventory-banner-btn .btn-icon {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

@media (max-width: 768px) {
    .inventory-banner-actions[b-sw02hht6lw],
    [b-sw02hht6lw] .inventory-banner-actions {
        width: 100%;
        gap: 8px;
    }

    .inventory-banner-btn[b-sw02hht6lw],
    [b-sw02hht6lw] .inventory-banner-btn {
        flex: 1 1 auto;
        padding: 10px 14px;
        font-size: 0.84rem;
        justify-content: center;
    }
}

/* ==========================================================================
   Filtros de Salud de Stock (Segmented Pills Toolbar)
   ========================================================================== */
.inventory-toolbar-wrapper[b-sw02hht6lw] {
    margin-bottom: 4px;
}

.inventory-health-filters[b-sw02hht6lw] {
    display: flex;
    align-items: center;
    gap: 6px;
    overflow-x: auto;
    flex-wrap: nowrap;
    padding: 2px 2px 6px 2px;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    max-width: 100%;
}

.inventory-health-pill[b-sw02hht6lw] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 40px;
    padding: 6px 12px;
    border-radius: 9999px;
    border: 1px solid #e2e8f0;
    background-color: #ffffff;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #475569;
    cursor: pointer;
    transition: all 0.15s ease-in-out;
    white-space: nowrap;
    user-select: none;
    line-height: 1;
}

.inventory-health-pill:hover[b-sw02hht6lw] {
    background-color: #f8fafc;
    border-color: #cbd5e1;
    color: #1e293b;
}

.inventory-health-pill.active[b-sw02hht6lw] {
    font-weight: 600;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.inventory-health-pill.active.active-all[b-sw02hht6lw] {
    background-color: #f1f5f9;
    border-color: #64748b;
    color: #0f172a;
}

.inventory-health-pill.active.active-normal[b-sw02hht6lw] {
    background-color: #f0fdf4;
    border-color: #10b981;
    color: #065f46;
}

.inventory-health-pill.active.active-low[b-sw02hht6lw] {
    background-color: #fffbeb;
    border-color: #f59e0b;
    color: #92400e;
}

.inventory-health-pill.active.active-out[b-sw02hht6lw] {
    background-color: #fef2f2;
    border-color: #ef4444;
    color: #991b1b;
}

.inventory-health-badge[b-sw02hht6lw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 20px;
    height: 20px;
    padding: 0 6px;
    border-radius: 9999px;
    font-size: 0.72rem;
    font-weight: 700;
}

.badge-all[b-sw02hht6lw] {
    background-color: #e2e8f0;
    color: #334155;
}

.badge-normal[b-sw02hht6lw] {
    background-color: #dcfce7;
    color: #15803d;
}

.badge-low[b-sw02hht6lw] {
    background-color: #fef3c7;
    color: #b45309;
}

.badge-out[b-sw02hht6lw] {
    background-color: #fee2e2;
    color: #b91c1c;
}




.btn-loading[b-sw02hht6lw] {
    animation: spin-b-sw02hht6lw 1s linear infinite;
    width: 16px;
    height: 16px;
    margin-right: 8px;
}

@keyframes spin-b-sw02hht6lw {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@media (max-width: 768px) {
    [b-sw02hht6lw] .grid-toolbar,
    [b-sw02hht6lw] .toolbar-left {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: 4px !important;
        width: 100% !important;
        padding: 0 !important;
    }

    [b-sw02hht6lw] .toolbar-left .toolbar-extra {
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: 80px !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    [b-sw02hht6lw] .toolbar-left .toolbar-extra .inventory-toolbar-branch-filter,
    [b-sw02hht6lw] .toolbar-left .toolbar-extra .dropdownlist-arregly,
    [b-sw02hht6lw] .toolbar-left .toolbar-extra .k-dropdownlist,
    [b-sw02hht6lw] .toolbar-left .toolbar-extra .k-picker {
        width: 80px !important;
        max-width: 80px !important;
        min-width: 80px !important;
        display: block !important;
    }

    [b-sw02hht6lw] .toolbar-left .toolbar-extra .k-input-inner {
        padding: 2px 4px 2px 6px !important;
        font-size: 0.8rem !important;
    }

    [b-sw02hht6lw] .toolbar-left .toolbar-extra .k-input-button {
        padding: 0 4px !important;
    }

    [b-sw02hht6lw] .toolbar-left .toolbar-search-group {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        width: auto !important;
        display: flex !important;
        align-items: center !important;
        gap: 4px !important;
    }

    [b-sw02hht6lw] .toolbar-left .toolbar-utility-btn {
        flex: 0 0 28px !important;
        width: 28px !important;
        height: 28px !important;
        min-width: 28px !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .movements-header[b-sw02hht6lw] {
        text-align: center;
    }
}

[b-sw02hht6lw] .badge-theme {
    max-width: 100%;
    letter-spacing: 0.02em;
    padding: 0.35rem 0.65rem;
    font-size: 0.8125rem;
    font-weight: 600;
}

/* Micro-chips armónicos para inventario */
.inventory-sku-pill[b-sw02hht6lw] {
    background-color: #f8fafc;
    color: #475569;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    padding: 0.2rem 0.5rem;
    font-size: 0.78rem;
    font-weight: 500;
    letter-spacing: 0.02em;
}

.product-type-pill[b-sw02hht6lw] {
    display: inline-flex;
    align-items: center;
    border-radius: 4px;
    padding: 0.1rem 0.4rem;
    font-size: 0.68rem;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: 0.02em;
}

.product-type-pill--sellable[b-sw02hht6lw] {
    background-color: #f0fdf4;
    color: #15803d;
    border: 1px solid #bbf7d0;
}

.product-type-pill--consumable[b-sw02hht6lw] {
    background-color: #fffbeb;
    color: #b45309;
    border: 1px solid #fde68a;
}

.product-type-pill--dual[b-sw02hht6lw] {
    background-color: #f5f3ff;
    color: #6d28d9;
    border: 1px solid #ddd6fe;
}

.empaque-chip-sealed[b-sw02hht6lw] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background-color: #f8fafc;
    color: #334155;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    padding: 0.18rem 0.5rem;
    font-size: 0.74rem;
    font-weight: 500;
}

.empaque-chip-open[b-sw02hht6lw] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background-color: #fffbeb;
    color: #92400e;
    border: 1px solid #fef3c7;
    border-radius: 6px;
    padding: 0.18rem 0.5rem;
    font-size: 0.74rem;
    font-weight: 600;
}

.empaque-chip-neutral[b-sw02hht6lw] {
    display: inline-flex;
    align-items: center;
    background-color: #f8fafc;
    color: #64748b;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    padding: 0.18rem 0.5rem;
    font-size: 0.74rem;
}

.empaque-chip-bottled[b-sw02hht6lw] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background-color: #f0fdf9;
    color: #034c48;
    border: 1px solid #99f6e4;
    border-radius: 6px;
    padding: 0.18rem 0.5rem;
    font-size: 0.74rem;
    font-weight: 600;
    transition: all 0.15s ease;
}

.empaque-chip-bottled:hover[b-sw02hht6lw] {
    background-color: #ccfbf1;
    border-color: #2dd4bf;
}

.empaque-chip-commercial[b-sw02hht6lw] {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    background-color: #f8fafc;
    color: #334155;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    padding: 0.18rem 0.5rem;
    font-size: 0.74rem;
    font-weight: 500;
    transition: all 0.15s ease;
}

.empaque-chip-commercial:hover[b-sw02hht6lw] {
    background-color: #f1f5f9;
    border-color: #94a3b8;
    color: #0f172a;
}


/* ==========================================================================
   Opciones de exportación PDF
   ========================================================================== */
.pdf-option-card[b-sw02hht6lw] {
    background-color: #ffffff;
    border-color: #e2e8f0;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    position: relative;
}

.pdf-option-card:hover:not(.pdf-option-disabled)[b-sw02hht6lw] {
    border-color: #034c48 !important;
    background-color: #f0fdf9;
    box-shadow: 0 4px 12px rgba(3, 76, 72, 0.08);
}

.pdf-option-selected[b-sw02hht6lw] {
    border-color: #034c48 !important;
    background-color: #f0fdf9 !important;
    box-shadow: 0 0 0 1.5px #034c48, 0 4px 12px rgba(3, 76, 72, 0.08);
}

.pdf-option-disabled[b-sw02hht6lw] {
    opacity: 0.65;
    background-color: #f8fafc;
    border-color: #e2e8f0;
}

/* Sobrescribir botón PDF en toolbar para armonía cromática premium */
.toolbar-utility-btn--pdf[b-sw02hht6lw],
[b-sw02hht6lw] .toolbar-utility-btn--pdf {
    color: #475569 !important;
    border-color: #cbd5e1 !important;
    background: #ffffff !important;
}

.toolbar-utility-btn--pdf:hover[b-sw02hht6lw],
[b-sw02hht6lw] .toolbar-utility-btn--pdf:hover {
    color: #b91c1c !important;
    border-color: #fca5a5 !important;
    background: #fef2f2 !important;
    box-shadow: 0 2px 6px rgba(185, 28, 28, 0.08) !important;
}

.inventory-abc-header-icon[b-sw02hht6lw] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: #f1f5f9;
    border: 1px solid #e2e8f0;
    color: #475569;
}

/* ==========================================================================
   Celdas y Botones de Acción en BaseGrid (Affordance Tangible)
   ========================================================================== */
.product-cell-wrapper[b-sw02hht6lw] {
    display: flex;
    flex-direction: column;
}

.product-cell-title[b-sw02hht6lw] {
    font-size: 0.90rem;
    font-weight: 600;
    color: #0f172a;
    line-height: 1.3;
    transition: color 0.15s ease;
}

.product-cell-title:hover[b-sw02hht6lw] {
    color: #4f46e5;
}

.badge-abc-tag[b-sw02hht6lw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.65rem;
    font-weight: 700;
    line-height: 1;
    padding: 1px 5px;
    border-radius: 4px;
    background: #f1f5f9;
    color: #475569;
    border: 1px solid #cbd5e1;
}

/* Micro-badge para sedes en vista multisede */
.branch-pill-badge[b-sw02hht6lw],
[b-sw02hht6lw] .branch-pill-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    background-color: #f1f5f9;
    color: #475569;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    padding: 1px 6px;
    font-size: 0.69rem;
    font-weight: 500;
}

/* Micro-indicador de stock mínimo */
.stock-min-hint[b-sw02hht6lw],
[b-sw02hht6lw] .stock-min-hint {
    display: inline-flex;
    align-items: center;
    font-size: 0.70rem;
    font-weight: 500;
    color: #64748b;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 4px;
    padding: 0 5px;
    line-height: 1.35;
}

/* ==========================================================================
   Alineación de Fila y Botón Rápido de Ingreso en Acciones (Inline)
   ========================================================================== */
[b-sw02hht6lw] .custom-base-grid tbody td {
    vertical-align: middle !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

.btn-inline-inflow[b-sw02hht6lw],
[b-sw02hht6lw] .btn-inline-inflow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    min-width: 28px;
    border-radius: 7px;
    border: 1px solid #dbeafe;
    background-color: #eff6ff;
    color: #2563eb;
    cursor: pointer;
    transition: all 0.18s ease;
    padding: 0;
    box-shadow: 0 1px 2px rgba(37, 99, 235, 0.08);
}

.btn-inline-inflow:hover[b-sw02hht6lw],
[b-sw02hht6lw] .btn-inline-inflow:hover {
    background-color: #2563eb;
    color: #ffffff;
    border-color: #2563eb;
    transform: scale(1.05);
    box-shadow: 0 2px 6px rgba(37, 99, 235, 0.25);
}

/* ==========================================================================
   Pills de Estado Operacional de Inventario (SaaS Sobrio)
   ========================================================================== */
.inventory-status-pill[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-status-pill {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 0.69rem;
    font-weight: 500;
    line-height: 1.25;
    white-space: nowrap;
    user-select: none;
    background-color: #f8fafc;
    color: #334155;
    border: 1px solid #e2e8f0;
    transition: all 0.15s ease-in-out;
}

.inventory-status-pill--available[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-status-pill--available {
    background-color: #f0fdf4;
    color: #166534;
    border: 1px solid #bbf7d0;
}

.inventory-status-pill--available.status-out[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-status-pill--available.status-out {
    background-color: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

.inventory-status-pill--reserved[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-status-pill--reserved {
    background-color: #fffbeb;
    color: #92400e;
    border: 1px solid #fde68a;
}

.inventory-status-pill--blocked[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-status-pill--blocked {
    background-color: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

/* ==========================================================================
   Dashboard ABC (Análisis Pareto)
   ========================================================================== */
.abc-card[b-sw02hht6lw] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 0.9rem;
    cursor: pointer;
    transition: all 0.2s ease;
    user-select: none;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
}

.abc-card:hover[b-sw02hht6lw] {
    border-color: #cbd5e1;
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.04);
}

.abc-card-a[b-sw02hht6lw] {
    border-left: 3px solid #6366f1;
}

.abc-card-b[b-sw02hht6lw] {
    border-left: 3px solid #0284c7;
}

.abc-card-c[b-sw02hht6lw] {
    border-left: 3px solid #10b981;
}

.abc-card.abc-active[b-sw02hht6lw] {
    box-shadow: 0 0 0 2px #6366f1;
    background: #fbfbfe;
}

.abc-pill[b-sw02hht6lw] {
    font-size: 0.73rem;
    font-weight: 600;
    padding: 0.15rem 0.5rem;
    border-radius: 4px;
}

.abc-pill-a[b-sw02hht6lw] {
    background: #eef2ff;
    color: #4338ca;
}

.abc-pill-b[b-sw02hht6lw] {
    background: #f0f9ff;
    color: #0369a1;
}

.abc-pill-c[b-sw02hht6lw] {
    background: #ecfdf5;
    color: #047857;
}

.abc-share[b-sw02hht6lw] {
    font-size: 0.72rem;
    font-weight: 500;
    color: #64748b;
}

.badge-batch-danger[b-sw02hht6lw] {
    background: #fef2f2;
    color: #b91c1c;
    border: 1px solid #fecaca;
    font-weight: 600;
}

.badge-batch-warning[b-sw02hht6lw] {
    background: #fffbeb;
    color: #b45309;
    border: 1px solid #fde68a;
    font-weight: 600;
}

/* Checkbox de selección en tarjeta móvil - Mobile-First Touch Target */
.mobile-card-select-wrap[b-sw02hht6lw] {
    min-width: 44px;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: -10px -8px -10px -8px;
}

/* ==========================================================================
   Indicadores de Stock Tabular y Chips Unificados de Presentaciones
   ========================================================================== */
.stock-cell-container[b-sw02hht6lw] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 2px;
}

.stock-tabular-wrapper[b-sw02hht6lw] {
    display: inline-flex;
    align-items: baseline;
    justify-content: flex-end;
    gap: 5px;
    width: auto;
}

.stock-qty-val[b-sw02hht6lw] {
    font-size: 1.02rem;
    font-weight: 700;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
    text-align: right;
}

.stock-qty--normal[b-sw02hht6lw] {
    color: #0f172a;
}

.stock-qty--low[b-sw02hht6lw] {
    color: #b45309;
}

.stock-qty--out[b-sw02hht6lw] {
    color: #dc2626;
}

.stock-unit-slot[b-sw02hht6lw] {
    font-size: 0.80rem;
    color: #64748b;
    font-weight: 500;
    text-align: left;
    white-space: nowrap;
}

.stock-min-wrapper[b-sw02hht6lw] {
    display: flex;
    justify-content: flex-end;
    margin-top: 1px;
}

.stock-min-label[b-sw02hht6lw] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 0.68rem;
    color: #1e293b;
    font-weight: 600;
    background: #e2e8f0;
    padding: 1px 5px;
    border-radius: 4px;
    border: 1px solid #cbd5e1;
    line-height: 1.2;
}

.stock-min-label strong[b-sw02hht6lw] {
    color: #0f172a;
    font-weight: 700;
}

.stock-alert-wrapper[b-sw02hht6lw] {
    display: flex;
    justify-content: flex-end;
    margin-top: 2px;
}

.stock-health-tag[b-sw02hht6lw] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 7px;
    border-radius: 9999px;
    font-size: 0.70rem;
    font-weight: 600;
    line-height: 1;
    user-select: none;
}

.stock-health-tag--low[b-sw02hht6lw] {
    background-color: #fffbeb;
    color: #92400e;
    border: 1px solid #fde68a;
}

.stock-health-tag--out[b-sw02hht6lw] {
    background-color: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

.stock-health-dot[b-sw02hht6lw] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
}

.dot-low[b-sw02hht6lw] {
    background-color: #d97706;
    box-shadow: 0 0 0 2px rgba(217, 119, 6, 0.2);
}

.dot-out[b-sw02hht6lw] {
    background-color: #dc2626;
    box-shadow: 0 0 0 2px rgba(220, 38, 38, 0.2);
}

.presentation-cell-wrapper[b-sw02hht6lw] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

/* Resaltado sutil y sobrio de fila activa (elimina saturación verde/teal) */
[b-sw02hht6lw] .custom-base-grid .k-grid-content .k-table-row.k-selected > td,
[b-sw02hht6lw] .custom-base-grid .k-grid-content tr.k-selected > td {
    background-color: #f1f5f9 !important;
    color: #1e293b !important;
}

[b-sw02hht6lw] .custom-base-grid .k-grid-content .k-table-row.k-selected:hover > td,
[b-sw02hht6lw] .custom-base-grid .k-grid-content tr.k-selected:hover > td {
    background-color: #e2e8f0 !important;
}

/* Chips Unificados de Presentaciones (Estilo & Formato Armónico) */
.presentation-unified-chip[b-sw02hht6lw],
[b-sw02hht6lw] .presentation-unified-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 7px;
    border-radius: 6px;
    font-size: 0.74rem;
    font-weight: 500;
    line-height: 1.25;
    background-color: #f8fafc;
    color: #334155;
    border: 1px solid #e2e8f0;
    transition: all 0.15s ease;
    user-select: none;
    white-space: nowrap;
}

.presentation-unified-chip:hover[b-sw02hht6lw] {
    background-color: #f1f5f9;
    border-color: #cbd5e1;
    color: #0f172a;
    transform: translateY(-1px);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.04);
}

.presentation-unified-chip--stock[b-sw02hht6lw] {
    background-color: #f0fdf4;
    border-color: #bbf7d0;
    color: #166534;
}

.presentation-unified-chip--stock:hover[b-sw02hht6lw] {
    background-color: #dcfce7;
    border-color: #86efac;
}

/* Presentación Base (Venta directa de granel) */
.presentation-unified-chip--base[b-sw02hht6lw],
[b-sw02hht6lw] .presentation-unified-chip--base {
    background-color: #eff6ff;
    border-color: #bfdbfe;
    color: #1e40af;
}

.presentation-unified-chip--base:hover[b-sw02hht6lw],
[b-sw02hht6lw] .presentation-unified-chip--base:hover {
    background-color: #dbeafe;
    border-color: #93c5fd;
    color: #1e3a8a;
}

.presentation-unified-chip--base .pres-name[b-sw02hht6lw] {
    color: #1e40af;
    font-weight: 700;
}

.presentation-unified-chip--base .pres-qty[b-sw02hht6lw] {
    color: #2563eb;
    font-weight: 600;
}

.presentation-unified-chip--base .pres-price[b-sw02hht6lw] {
    color: #1d4ed8;
    font-weight: 600;
}

.presentation-unified-chip--out[b-sw02hht6lw],
[b-sw02hht6lw] .presentation-unified-chip--out {
    background-color: #fff1f2;
    border-color: #fecdd3;
    color: #9f1239;
}

.presentation-unified-chip--out:hover[b-sw02hht6lw],
[b-sw02hht6lw] .presentation-unified-chip--out:hover {
    background-color: #ffe4e6;
    border-color: #fda4af;
}

.presentation-unified-chip--out .pres-name[b-sw02hht6lw] {
    color: #881337;
}

.presentation-unified-chip--out .pres-qty[b-sw02hht6lw] {
    color: #e11d48;
    font-weight: 700;
}

.presentation-unified-chip .pres-name[b-sw02hht6lw] {
    font-weight: 600;
    color: #1e293b;
}

.presentation-unified-chip--stock .pres-name[b-sw02hht6lw] {
    color: #14532d;
}

.presentation-unified-chip .pres-qty[b-sw02hht6lw] {
    font-weight: 600;
    color: #0d9488;
}

.presentation-unified-chip .pres-price[b-sw02hht6lw] {
    font-weight: 500;
    color: #64748b;
    font-size: 0.70rem;
}

/* Presentaciones inhabilitadas para la venta (Rol: Solo Insumo) */
.presentation-unified-chip--disabled[b-sw02hht6lw],
[b-sw02hht6lw] .presentation-unified-chip--disabled {
    background-color: #f8fafc !important;
    border-color: #e2e8f0 !important;
    color: #94a3b8 !important;
    opacity: 0.72;
    cursor: default !important;
    user-select: none;
    box-shadow: none !important;
    transform: none !important;
}

.presentation-unified-chip--disabled:hover[b-sw02hht6lw],
[b-sw02hht6lw] .presentation-unified-chip--disabled:hover {
    background-color: #f8fafc !important;
    border-color: #e2e8f0 !important;
    color: #94a3b8 !important;
    box-shadow: none !important;
    transform: none !important;
    cursor: default !important;
}

.presentation-unified-chip--disabled .pres-name[b-sw02hht6lw] {
    color: #64748b;
}

.presentation-unified-chip--disabled .pres-qty[b-sw02hht6lw] {
    color: #94a3b8;
}

.presentation-unified-chip--disabled .pres-price-disabled[b-sw02hht6lw] {
    font-size: 0.68rem;
    font-weight: 600;
    color: #94a3b8;
    background-color: #f1f5f9;
    padding: 1px 4px;
    border-radius: 4px;
    border: 1px solid #e2e8f0;
}

.empaque-chip-disabled[b-sw02hht6lw],
[b-sw02hht6lw] .empaque-chip-disabled {
    background-color: #f8fafc !important;
    color: #94a3b8 !important;
    border: 1px solid #e2e8f0 !important;
    opacity: 0.72;
    cursor: default !important;
    user-select: none;
    box-shadow: none !important;
    transform: none !important;
}

.empaque-chip-disabled:hover[b-sw02hht6lw],
[b-sw02hht6lw] .empaque-chip-disabled:hover {
    background-color: #f8fafc !important;
    border-color: #e2e8f0 !important;
    color: #94a3b8 !important;
    box-shadow: none !important;
    transform: none !important;
    cursor: default !important;
}

/* ==========================================================================
   Botón Desplegable Consolidado en Banner (Registrar Movimiento)
   ========================================================================== */
.inventory-banner-btn-dropdown[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-banner-btn-dropdown {
    background: #ffffff !important;
    color: var(--primary-color, #093d93) !important;
    font-weight: 600 !important;
    border: 1px solid rgba(255, 255, 255, 0.9) !important;
    border-radius: 9999px !important;
    padding: 6px 16px !important;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1) !important;
    transition: all 0.2s ease !important;
    display: inline-flex !important;
    align-items: center !important;
}

.inventory-banner-btn-dropdown:hover[b-sw02hht6lw],
[b-sw02hht6lw] .inventory-banner-btn-dropdown:hover {
    background: #f8fafc !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15) !important;
    transform: translateY(-1px);
}

/* ==========================================================================
   Barra Flotante de Acciones Masivas (Bulk Actions Bar)
   ========================================================================== */
.inventory-bulk-bar[b-sw02hht6lw] {
    position: sticky;
    bottom: 16px;
    z-index: 1020;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 10px 20px;
    margin-bottom: 14px;
    border-radius: 14px;
    background: #0f172a;
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.14);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3), 0 8px 10px -6px rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.inventory-bulk-badge[b-sw02hht6lw] {
    display: inline-flex;
    align-items: center;
    font-size: 0.875rem;
    font-weight: 500;
    color: #e2e8f0;
}

/* ==========================================================================
   Badge Neutro de Filtros de Salud (Cero Alertas Falsas)
   ========================================================================== */
.badge-neutral[b-sw02hht6lw] {
    background-color: #f1f5f9;
    color: #64748b;
}

/* ==========================================================================
   Presentaciones Compactas (Fila Uniforme Calm UX)
   ========================================================================== */
.presentation-cell-compact[b-sw02hht6lw] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    padding-left: 0.25rem;
}

.pres-base-link[b-sw02hht6lw] {
    font-size: 0.8125rem;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    transition: color 0.15s ease;
}

.pres-base-link:hover[b-sw02hht6lw] {
    color: var(--primary-color, #093d93) !important;
}

.presentation-summary-pill[b-sw02hht6lw],
[b-sw02hht6lw] .presentation-summary-pill {
    display: inline-flex !important;
    align-items: center !important;
    font-size: 0.75rem !important;
    font-weight: 500 !important;
    padding: 2px 8px !important;
    border-radius: 9999px !important;
    border: 1px solid #e2e8f0 !important;
    background: #f8fafc !important;
    color: #334155 !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    transition: all 0.15s ease-in-out !important;
    width: fit-content !important;
    min-height: 24px !important;
}

.presentation-summary-pill:hover[b-sw02hht6lw],
[b-sw02hht6lw] .presentation-summary-pill:hover {
    background: #f1f5f9 !important;
    border-color: #cbd5e1 !important;
    color: var(--primary-color, #093d93) !important;
    transform: translateY(-1px);
}

.pres-pill-badge[b-sw02hht6lw] {
    font-size: 0.70rem;
    font-weight: 600;
}

/* ==========================================================================
   Fase 2: Bullet Progress Bar, Estado, Acciones Contextuales y Fila Expandible
   ========================================================================== */

/* Columna Estado */
.inventory-status-cell[b-sw02hht6lw] {
    min-height: 24px;
}

.inventory-status-indicator[b-sw02hht6lw] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.status-dot[b-sw02hht6lw] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
}

.status-dot-success[b-sw02hht6lw] {
    background-color: #10b981;
}

/* Columna En mano (Bullet Graph) */
.inventory-bullet-cell[b-sw02hht6lw] {
    width: 100%;
    max-width: 190px;
}

.bullet-qty[b-sw02hht6lw] {
    font-size: 0.875rem;
}

.bullet-unit[b-sw02hht6lw] {
    font-size: 0.75rem;
}

.bullet-min-tag[b-sw02hht6lw] {
    font-size: 0.70rem;
    color: #64748b;
    white-space: nowrap;
}

.bullet-bar-track[b-sw02hht6lw] {
    width: 100%;
    height: 6px;
    background: #e2e8f0;
    border-radius: 9999px;
    overflow: hidden;
}

.bullet-bar-fill[b-sw02hht6lw] {
    height: 100%;
    border-radius: 9999px;
    transition: width 0.3s ease;
}

.bullet-bar-fill--normal[b-sw02hht6lw] {
    background-color: #0f766e;
}

.bullet-bar-fill--low[b-sw02hht6lw] {
    background-color: #d97706;
}

.bullet-bar-fill--out[b-sw02hht6lw] {
    background-color: #ef4444;
    width: 100% !important;
}

/* Botones de acción contextual por fila */
.btn-inline-action[b-sw02hht6lw] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    font-size: 0.78rem;
    font-weight: 500;
    padding: 4px 14px;
    border-radius: 16px;
    border: 1px solid #cbd5e1;
    background: #ffffff;
    color: #334155;
    cursor: pointer;
    transition: all 0.15s ease;
    white-space: nowrap;
}

.btn-inline-action:hover[b-sw02hht6lw] {
    border-color: var(--primary-color, #093d93);
    color: var(--primary-color, #093d93);
    background: #f8fafc;
}

.btn-inline-action--ingresar[b-sw02hht6lw] {
    border-color: #cbd5e1;
}

/* Tipografía de SKU limpia sin pill saturado */
.product-cell-sku[b-sw02hht6lw] {
    font-size: 0.75rem;
    color: #64748b;
    font-weight: 500;
    letter-spacing: 0.01em;
}

/* Micro-pill interactivo de Sedes */
.btn-branch-summary-pill[b-sw02hht6lw] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: 12px;
    font-size: 0.76rem;
    font-weight: 500;
    color: #334155;
    background-color: #f1f5f9;
    border: 1px solid #e2e8f0;
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-branch-summary-pill:hover[b-sw02hht6lw] {
    background-color: #e2e8f0;
    color: var(--primary-color, #093d93);
    border-color: #cbd5e1;
}

/* Fila expandible (Detail Accordion) */
.inventory-detail-accordion[b-sw02hht6lw] {
    background: #f8fafc !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 8px;
}

.border-end-md[b-sw02hht6lw] {
    border-right: 1px solid #e2e8f0;
}

@media (max-width: 767.98px) {
    .border-end-md[b-sw02hht6lw] {
        border-right: none;
        border-bottom: 1px solid #e2e8f0;
        padding-bottom: 10px;
    }
}

/* Presentaciones comerciales y desglose multi-sede inline */
.btn-presentations-toggle[b-sw02hht6lw] {
    transition: opacity 0.15s ease;
    color: var(--primary-color, #093d93) !important;
}

.btn-presentations-toggle:hover[b-sw02hht6lw] {
    opacity: 0.8;
    text-decoration: underline;
}

/* Alineación vertical al tope para mantener el baseline entre columnas */
[b-sw02hht6lw] .custom-base-grid .k-grid-table td {
    vertical-align: top !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

/* Panel armónico de desglose por sede y presentaciones */
.inventory-expand-panel[b-sw02hht6lw] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 20px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 10px 14px;
    margin-top: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
}

.inventory-expand-col[b-sw02hht6lw] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.inventory-expand-col--divider[b-sw02hht6lw] {
    border-left: 1px solid #e2e8f0;
    padding-left: 16px;
}

.inventory-expand-title[b-sw02hht6lw] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #64748b;
    margin-bottom: 2px;
}

.inventory-expand-item[b-sw02hht6lw] {
    font-size: 0.73rem;
    line-height: 1.4;
    color: #334155;
}

.btn-detail-history-link[b-sw02hht6lw] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.74rem;
    font-weight: 600;
    color: var(--primary-color, #093d93);
    transition: all 0.15s ease;
    cursor: pointer;
}

.btn-detail-history-link:hover[b-sw02hht6lw] {
    text-decoration: underline;
    opacity: 0.85;
}

/* Selector de sedes responsivo en toolbar */
.branch-dropdown-responsive[b-sw02hht6lw] {
    width: 220px;
}

@media (max-width: 767.98px) {
    .inventory-toolbar-wrapper[b-sw02hht6lw] {
        width: 100%;
    }
    .inventory-toolbar-branch-filter[b-sw02hht6lw] {
        width: 100%;
    }
    .branch-dropdown-responsive[b-sw02hht6lw] {
        width: 100% !important;
    }
}

/* Panel de detalle 100% ancho con división 50% / 50% */
.inventory-detail-fullwidth[b-sw02hht6lw] {
    background: #f8fafc;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
}

.inventory-detail-card[b-sw02hht6lw] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
}

.inventory-detail-card-title[b-sw02hht6lw] {
    font-size: 0.80rem;
    font-weight: 700;
    color: var(--text-heading-primary, #09224f);
}

/* Tarjeta Móvil - Calm UX & 3-KPI Strip */
.mobile-card-title[b-sw02hht6lw] {
    color: var(--text-heading-primary, #09224f);
    font-size: 0.95rem;
    line-height: 1.25;
    transition: color 0.15s ease;
}

.mobile-card-title:hover[b-sw02hht6lw] {
    color: var(--primary-color, #093d93);
    text-decoration: underline;
}

.mobile-card-sku[b-sw02hht6lw] {
    font-size: 0.72rem;
    color: var(--text-body-muted, #476487);
}

.mobile-card-branch[b-sw02hht6lw] {
    font-size: 0.68rem;
    font-weight: 500;
}

.mobile-kpi-strip[b-sw02hht6lw] {
    background: #ffffff;
    border-color: #e2e8f0 !important;
}

.mobile-kpi-item[b-sw02hht6lw] {
    flex: 1;
}

.mobile-kpi-label[b-sw02hht6lw] {
    font-size: 0.66rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    color: #64748b;
    margin-bottom: 2px;
}

.mobile-kpi-value[b-sw02hht6lw] {
    font-size: 0.98rem;
    line-height: 1.2;
}

.mobile-kpi-unit[b-sw02hht6lw] {
    font-size: 0.72rem;
}

.mobile-kpi-divider[b-sw02hht6lw] {
    width: 1px;
    height: 32px;
    background: #e2e8f0;
    margin: 0 8px;
}

.btn-mobile-action-primary[b-sw02hht6lw] {
    background: var(--primary-gradient, linear-gradient(135deg, #093d93 0%, #062b66 100%));
    color: #ffffff !important;
    border: none;
    min-height: 44px;
    font-size: 0.84rem;
    box-shadow: 0 2px 4px rgba(9, 61, 147, 0.2);
    transition: all 0.15s ease;
    cursor: pointer;
}

.btn-mobile-action-primary:hover[b-sw02hht6lw] {
    opacity: 0.92;
    transform: translateY(-1px);
}

.btn-mobile-action-primary:active[b-sw02hht6lw] {
    transform: translateY(0);
}

.btn-mobile-drawer-toggle[b-sw02hht6lw] {
    min-height: 44px;
    font-size: 0.80rem;
    border-color: #cbd5e1 !important;
    cursor: pointer;
    transition: background-color 0.15s ease;
}

.btn-mobile-drawer-toggle:hover[b-sw02hht6lw] {
    background-color: #e2e8f0 !important;
}

.mobile-detail-drawer[b-sw02hht6lw] {
    background: #f1f5f9;
    border-color: #e2e8f0 !important;
}

/* ==========================================================================
   Calm UX & Mockup Design System Extensions
   ========================================================================== */

/* Miniatura de Producto */
.product-avatar-thumb[b-sw02hht6lw] {
    width: 38px;
    height: 38px;
    border-radius: 8px;
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}

.product-cell-title[b-sw02hht6lw] {
    color: #0f172a;
    font-size: 0.88rem;
    line-height: 1.25;
    transition: color 0.15s ease;
}

.product-cell-title:hover[b-sw02hht6lw] {
    color: var(--primary-color, #093d93);
    text-decoration: underline;
}

.product-cell-sku[b-sw02hht6lw] {
    color: #64748b;
    font-size: 0.74rem;
}

/* Pastillas de Tipo de Producto */
.product-type-pill[b-sw02hht6lw] {
    display: inline-flex;
    align-items: center;
    font-size: 0.68rem;
    font-weight: 600;
    padding: 1px 7px;
    border-radius: 6px;
    line-height: 1.3;
}

.product-type-pill--sellable[b-sw02hht6lw] {
    background-color: #ecfdf5;
    color: #059669;
    border: 1px solid #a7f3d0;
}

.product-type-pill--consumable[b-sw02hht6lw] {
    background-color: #eff6ff;
    color: #2563eb;
    border: 1px solid #bfdbfe;
}

.product-type-pill--dual[b-sw02hht6lw] {
    background-color: #faf5ff;
    color: #7c3aed;
    border: 1px solid #e9d5ff;
}

/* Puntos de Estado */
.status-dot[b-sw02hht6lw] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
    flex-shrink: 0;
}

.status-dot-success[b-sw02hht6lw] {
    background-color: #10b981;
}

.status-dot-warning[b-sw02hht6lw] {
    background-color: #f59e0b;
}

.status-dot-danger[b-sw02hht6lw] {
    background-color: #ef4444;
}

/* Barra de Progreso de Stock */
.inventory-progress-track[b-sw02hht6lw] {
    width: 85px;
    height: 4px;
    background-color: #e2e8f0;
    border-radius: 9999px;
    overflow: hidden;
}

.inventory-progress-bar[b-sw02hht6lw] {
    height: 100%;
    border-radius: 9999px;
    transition: width 0.3s ease;
}

.progress-fill-success[b-sw02hht6lw] {
    background-color: #10b981;
}

.progress-fill-warning[b-sw02hht6lw] {
    background-color: #f59e0b;
}

.progress-fill-danger[b-sw02hht6lw] {
    background-color: #ef4444;
}

.inventory-progress-pct[b-sw02hht6lw] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #64748b;
    min-width: 28px;
}

/* Pastilla de Sedes */
.btn-branch-pill-mockup[b-sw02hht6lw] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 9999px;
    padding: 3px 12px;
    font-size: 0.76rem;
    font-weight: 500;
    color: #475569;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
    cursor: default;
    transition: all 0.15s ease;
}

.btn-branch-pill-mockup:hover[b-sw02hht6lw] {
    background-color: #f8fafc;
    border-color: #cbd5e1;
    color: var(--primary-color, #093d93);
}

/* Botón Registrar Entrada */
.btn-inline-action--registrar[b-sw02hht6lw] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    font-size: 0.76rem;
    font-weight: 600;
    border-radius: 6px;
    background-color: transparent;
    border: 1px solid var(--primary-color, #093d93);
    color: var(--primary-color, #093d93);
    transition: all 0.2s ease;
    white-space: nowrap;
    cursor: pointer;
}

.btn-inline-action--registrar:hover[b-sw02hht6lw] {
    background-color: var(--primary-color, #093d93);
    color: #ffffff;
}

/* Fila Activa Expandida */
[b-sw02hht6lw] .custom-base-grid tr.k-master-row:has(+ tr.k-detail-row:not([style*="display: none"])),
[b-sw02hht6lw] .custom-base-grid tr.k-master-row:has(.k-hierarchy-cell a[aria-expanded="true"]) {
    background-color: #f8fafc !important;
}

[b-sw02hht6lw] .custom-base-grid tr.k-master-row:has(+ tr.k-detail-row:not([style*="display: none"])) .btn-inline-action--registrar,
[b-sw02hht6lw] .custom-base-grid tr.k-master-row:has(.k-hierarchy-cell a[aria-expanded="true"]) .btn-inline-action--registrar {
    background-color: var(--primary-color, #093d93) !important;
    color: #ffffff !important;
    border-color: var(--primary-color, #093d93) !important;
    box-shadow: 0 2px 6px rgba(9, 61, 147, 0.25) !important;
}



/* /Pages/Inventory/InventoryAlerts.razor.rz.scp.css */
/* =============================================
   Selector de Sede en Banner
   ============================================= */
.branch-filter-box[b-ezzajclvt1] {
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 10px;
    padding: 0.2rem 0.5rem;
}

[b-ezzajclvt1] .branch-dropdown-custom.k-dropdown {
    background: #ffffff !important;
    border-radius: 8px !important;
    border: 1px solid #cbd5e1 !important;
    font-size: 0.85rem !important;
    font-weight: 500 !important;
    color: #1e293b !important;
}

/* =============================================
   KPI Row — Resumen visual de estado (Calm UX)
   ============================================= */
.kpi-row[b-ezzajclvt1] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
    margin-bottom: 1.25rem;
}

@media (max-width: 900px) {
    .kpi-row[b-ezzajclvt1] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .kpi-row[b-ezzajclvt1] {
        grid-template-columns: 1fr;
    }
}

.kpi-card[b-ezzajclvt1] {
    background: #ffffff;
    border: 1px solid var(--border-linear-theme-arregly, #e2e8f0);
    border-radius: 14px;
    padding: 1rem 1.25rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.03);
    transition: transform 0.18s ease, box-shadow 0.18s ease;
    min-height: 84px;
}

.kpi-card:hover[b-ezzajclvt1] {
    transform: translateY(-2px);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
}

/* Animaciones sutiles de aviso */
.kpi-pulse[b-ezzajclvt1] {
    animation: kpiPulse-b-ezzajclvt1 2.5s ease-in-out infinite;
}

@keyframes kpiPulse-b-ezzajclvt1 {
    0%, 100% { box-shadow: 0 2px 8px rgba(239, 68, 68, 0.08); }
    50% { box-shadow: 0 4px 16px rgba(239, 68, 68, 0.20); }
}

.kpi-attention[b-ezzajclvt1] {
    animation: kpiAttention-b-ezzajclvt1 3s ease-in-out infinite;
}

@keyframes kpiAttention-b-ezzajclvt1 {
    0%, 100% { box-shadow: 0 2px 8px rgba(245, 158, 11, 0.08); }
    50% { box-shadow: 0 4px 16px rgba(245, 158, 11, 0.20); }
}

/* Iconos de KPI */
.kpi-icon[b-ezzajclvt1] {
    width: 48px;
    height: 48px;
    min-width: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
}

.kpi-danger-bg[b-ezzajclvt1]  { background: rgba(239, 68, 68, 0.1);  color: #dc2626; }
.kpi-warning-bg[b-ezzajclvt1] { background: rgba(245, 158, 11, 0.1); color: #d97706; }
.kpi-success-bg[b-ezzajclvt1] { background: rgba(16, 185, 129, 0.1); color: #059669; }
.kpi-primary-bg[b-ezzajclvt1] { background: rgba(102, 126, 234, 0.1); color: var(--primary-color, #667eea); }

/* Bordes acento suaves */
.kpi-danger[b-ezzajclvt1]  { border-left: 4px solid #ef4444; }
.kpi-warning[b-ezzajclvt1] { border-left: 4px solid #f59e0b; }
.kpi-success[b-ezzajclvt1] { border-left: 4px solid #10b981; }
.kpi-primary[b-ezzajclvt1] { border-left: 4px solid var(--primary-color, #667eea); }

/* Cuerpo del KPI */
.kpi-body[b-ezzajclvt1] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.kpi-label[b-ezzajclvt1] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    line-height: 1.2;
}

.kpi-value[b-ezzajclvt1] {
    font-size: 1.65rem;
    font-weight: 700;
    line-height: 1.1;
}

.kpi-val-danger[b-ezzajclvt1]  { color: #dc2626; }
.kpi-val-warning[b-ezzajclvt1] { color: #d97706; }
.kpi-val-success[b-ezzajclvt1] { color: #059669; }
.kpi-val-primary[b-ezzajclvt1] { color: var(--primary-color, #667eea); }

.kpi-hint[b-ezzajclvt1] {
    font-size: 0.74rem;
    color: #94a3b8;
    line-height: 1.2;
}

/* =============================================
   Glass Card
   ============================================= */
.card-glass[b-ezzajclvt1] {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(214, 212, 209, 0.6);
    border-radius: 14px;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.03);
}

/* =============================================
   Badges y Títulos
   ============================================= */
.product-title[b-ezzajclvt1] {
    font-size: 0.95rem;
    font-family: 'Poppins', sans-serif;
    color: #1e293b;
    line-height: 1.3;
}

.badge-branch[b-ezzajclvt1] {
    font-size: 0.72rem;
    font-weight: 600;
    background: #e0e7ff;
    color: #4338ca;
    padding: 0.12rem 0.45rem;
    border-radius: 4px;
    display: inline-block;
}

.badge-sku[b-ezzajclvt1] {
    font-size: 0.72rem;
    font-weight: 500;
    background: #f1f5f9;
    color: #64748b;
    padding: 0.12rem 0.45rem;
    border-radius: 4px;
    display: inline-block;
}

.badge-urgency[b-ezzajclvt1] {
    padding: 0.3rem 0.7rem;
    border-radius: 8px;
    font-size: 0.78rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    white-space: nowrap;
}

.badge-urgency-critical[b-ezzajclvt1] {
    background: #fef2f2;
    color: #dc2626;
    border: 1px solid #fecaca;
}

.badge-urgency-warning[b-ezzajclvt1] {
    background: #fffbeb;
    color: #d97706;
    border: 1px solid #fde68a;
}

.badge-urgency-normal[b-ezzajclvt1] {
    background: #ecfdf5;
    color: #059669;
    border: 1px solid #a7f3d0;
}

.badge-status[b-ezzajclvt1] {
    padding: 0.25rem 0.65rem;
    border-radius: 8px;
    font-size: 0.78rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.status-completed[b-ezzajclvt1] {
    background: #dcfce7;
    color: #15803d;
}

/* =============================================
   Columna de recomendación amigable
   ============================================= */
.rec-text[b-ezzajclvt1] {
    font-size: 0.82rem;
    color: #475569;
    line-height: 1.4;
    display: block;
}

.tiny[b-ezzajclvt1] {
    font-size: 0.72rem;
}

.cursor-pointer[b-ezzajclvt1] {
    cursor: pointer;
}

/* =============================================
   Toggle "Ya tengo esto en bodega"
   ============================================= */
.receive-stock-toggle[b-ezzajclvt1] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 0.85rem 1rem;
}

/* =============================================
   Icono wrap (pantalla de feature desactivada)
   ============================================= */
.kpi-icon-wrap[b-ezzajclvt1] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}

/* =============================================
   Mobile-First: Tarjetas Táctiles
   ============================================= */
.mobile-cards-stack[b-ezzajclvt1] {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.mobile-item-card[b-ezzajclvt1] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 1rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.03);
}

.mobile-stats-row[b-ezzajclvt1] {
    background: #f8fafc;
    border-radius: 8px;
    padding: 0.5rem 0.25rem;
}

@media (max-width: 640px) {
    .kpi-label[b-ezzajclvt1] {
        font-size: 0.72rem;
    }
    .kpi-value[b-ezzajclvt1] {
        font-size: 1.3rem;
    }
}
/* /Pages/Inventory/InventoryAuditPage.razor.rz.scp.css */

.table th[b-g3b5ih2cub] {
    font-size: 0.82rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-weight: 600;
    color: #64748b;
}

.table td[b-g3b5ih2cub] {
    vertical-align: middle;
}
/* /Pages/Inventory/InventoryConfigPage.razor.rz.scp.css */
.tier-status-banner[b-003m228zfw] {
    background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
    border-color: #e2e8f0 !important;
}

.tier-icon-circle[b-003m228zfw] {
    width: 52px;
    height: 52px;
    background: color-mix(in srgb, var(--primary-color, #667eea) 12%, transparent);
    color: var(--primary-color, #667eea);
}

.tier-badge[b-003m228zfw] {
    font-size: 0.85rem;
    font-weight: 700;
    padding: 6px 14px;
    border-radius: 20px;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}

.tier-badge--basic[b-003m228zfw] {
    background-color: #e0e7ff;
    color: #3730a3;
}

.tier-badge--standard[b-003m228zfw] {
    background-color: #e0f2fe;
    color: #0369a1;
}

.tier-badge--advanced[b-003m228zfw] {
    background-color: #fef3c7;
    color: #92400e;
}

.tier-badge--enterprise[b-003m228zfw] {
    background-color: #f1f5f9;
    color: #0f172a;
    border: 1px solid #cbd5e1;
}

.config-card[b-003m228zfw] {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    background: #ffffff;
}

.config-card:hover[b-003m228zfw] {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.08) !important;
}

.feature-row[b-003m228zfw] {
    background-color: #f8fafc;
    border: 1px solid #f1f5f9;
    transition: background-color 0.15s ease;
}

.feature-row:hover[b-003m228zfw] {
    background-color: #f1f5f9;
}
/* /Pages/Inventory/InventoryFinancialDashboard.razor.rz.scp.css */
.dashboard-container[b-xvedn7ph0s] {
    max-width: 1600px;
    margin: 0 auto;
}

.kpi-card[b-xvedn7ph0s] {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    border: 1px solid rgba(0, 0, 0, 0.04) !important;
}

.kpi-card:hover[b-xvedn7ph0s] {
    transform: translateY(-2px);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.08) !important;
}

.aging-badge-box[b-xvedn7ph0s] {
    transition: background-color 0.2s ease;
}

.aging-badge-box:hover[b-xvedn7ph0s] {
    background-color: #f1f3f9 !important;
}

.table th[b-xvedn7ph0s] {
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #6c757d;
}

.table td[b-xvedn7ph0s] {
    font-size: 0.88rem;
    padding: 0.85rem 0.75rem;
}

.btn-gradient-primary-arregly[b-xvedn7ph0s] {
    background: var(--primary-gradient, linear-gradient(135deg, #093d93 0%, #1e40af 100%));
    border: none;
    box-shadow: 0 4px 12px var(--RgbaColor02, rgba(9, 61, 147, 0.25));
}

.btn-gradient-primary-arregly:hover[b-xvedn7ph0s] {
    background: var(--primary-gradient, linear-gradient(135deg, #093d93 0%, #1e40af 100%));
    filter: brightness(1.08);
    box-shadow: 0 6px 16px var(--RgbaColor04, rgba(9, 61, 147, 0.40));
}

.progress[b-xvedn7ph0s] {
    background-color: #e9ecef;
}
/* /Pages/Inventory/InventoryTransfers.razor.rz.scp.css */
.card-kpi[b-8677xdfleb] {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.card-kpi:hover[b-8677xdfleb] {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);
}

.kpi-icon[b-8677xdfleb] {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
}

.kpi-icon-blue[b-8677xdfleb] {
    background-color: rgba(102, 126, 234, 0.12);
    color: #667eea;
}

.kpi-icon-orange[b-8677xdfleb] {
    background-color: rgba(253, 126, 20, 0.12);
    color: #fd7e14;
}

.kpi-icon-green[b-8677xdfleb] {
    background-color: rgba(40, 167, 69, 0.12);
    color: #28a745;
}

.kpi-icon-red[b-8677xdfleb] {
    background-color: rgba(220, 53, 69, 0.12);
    color: #dc3545;
}
/* /Pages/Inventory/ManufacturingOrders.razor.rz.scp.css */
/* ════════════════════════════════════════════════════════════
   MANUFACTURING ORDERS — Scoped CSS (Aurocore Design System)
   ════════════════════════════════════════════════════════════ */

/* ─── Página principal ──────────────────────────────────────── */
.mfg-banner-action[b-ysw7uonx1w] {
    display: flex;
    align-items: center;
}

/* ─── Empty state inline ────────────────────────────────────── */
.mfg-empty-state-wrapper[b-ysw7uonx1w] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 3rem 2rem;
    text-align: center;
}

.mfg-empty-state-wrapper h3[b-ysw7uonx1w] {
    font-size: 1.35rem;
    font-weight: 700;
    color: #1e293b;
    margin: 0;
}

.mfg-empty-state-wrapper p[b-ysw7uonx1w] {
    font-size: 0.9rem;
    color: #64748b;
    max-width: 460px;
    margin: 0;
    line-height: 1.6;
}

.mfg-empty-icon[b-ysw7uonx1w] {
    color: #667eea;
    opacity: 0.35;
}

.mfg-list-card[b-ysw7uonx1w] {
    padding: 1.25rem;
    min-height: 300px;
}

/* ─── Pestañas de Vista (Manufacturados vs Historial) ──────── */
.mfg-header-toolbar[b-ysw7uonx1w] {
    padding-bottom: 0.5rem;
}

.mfg-view-tabs[b-ysw7uonx1w] {
    gap: 0.25rem;
}

.mfg-view-tab-btn[b-ysw7uonx1w] {
    border: none;
    background: transparent;
    padding: 0.45rem 0.9rem;
    border-radius: 6px;
    font-size: 0.85rem;
    font-weight: 500;
    color: var(--text-body-muted, #476487);
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

.mfg-view-tab-btn:hover[b-ysw7uonx1w] {
    color: var(--primary-color, #093d93);
    background: rgba(9, 61, 147, 0.05);
}

.mfg-view-tab-btn.active[b-ysw7uonx1w] {
    background: #ffffff;
    color: var(--primary-color, #093d93);
    font-weight: 600;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.mfg-view-pill[b-ysw7uonx1w] {
    margin-left: 0.5rem;
    font-size: 0.75rem;
    padding: 0.1rem 0.45rem;
    border-radius: 12px;
    background: rgba(0, 0, 0, 0.06);
    color: inherit;
    font-weight: 600;
}

.mfg-view-tab-btn.active .mfg-view-pill[b-ysw7uonx1w] {
    background: var(--primary-color, #093d93);
    color: #ffffff;
}

.mfg-grid-header[b-ysw7uonx1w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 0 1rem 0;
}

.mfg-grid-title[b-ysw7uonx1w] {
    font-size: 1rem;
    font-weight: 600;
    color: #1e293b;
}

.mfg-grid-count[b-ysw7uonx1w] {
    font-size: 0.8rem;
    color: #64748b;
    background: #f1f5f9;
    padding: 0.25rem 0.75rem;
    border-radius: 20px;
}

/* ─── Grid: celdas ──────────────────────────────────────────── */
.mfg-order-number[b-ysw7uonx1w] {
    font-weight: 700;
    color: #0f766e;
}

.mfg-date-cell[b-ysw7uonx1w] {
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.mfg-date-time[b-ysw7uonx1w] {
    color: #94a3b8;
    font-size: 0.78rem;
}

.mfg-qty-badge[b-ysw7uonx1w] {
    display: inline-block;
    padding: 0.2rem 0.6rem;
    border-radius: 6px;
    font-size: 0.8rem;
    font-weight: 600;
}

.mfg-qty-input[b-ysw7uonx1w] {
    background: #f1f5f9;
    color: #334155;
}

.mfg-qty-output[b-ysw7uonx1w] {
    background: #f0fdf4;
    color: #166534;
}

.mfg-cost-cell[b-ysw7uonx1w] {
    font-weight: 700;
    color: #059669;
}

.badge-status[b-ysw7uonx1w] {
    padding: 0.25rem 0.6rem;
    border-radius: 6px;
    font-size: 0.8rem;
    font-weight: 600;
}

.status-completed[b-ysw7uonx1w] {
    background: #dcfce7;
    color: #15803d;
}

/* ════════════════════════════════════════════════════════════
   MODAL — Cuerpo (Calm UX & Mobile-First)
   ════════════════════════════════════════════════════════════ */
.mfg-modal-body[b-ysw7uonx1w] {
    padding: 0.5rem 0.25rem;
    display: flex;
    flex-direction: column;
    gap: 0;
}

/* ─── Banner informativo (Calm UX) ──────────────────────────── */
.mfg-info-banner[b-ysw7uonx1w] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 0.85rem 1rem;
    margin-bottom: 1.25rem;
    font-size: 0.85rem;
    color: #334155;
    line-height: 1.5;
}

.mfg-info-icon[b-ysw7uonx1w] {
    flex-shrink: 0;
    color: #0f766e;
    margin-top: 2px;
}

/* ─── Secciones de paso ──────────────────────────────────────── */
.mfg-section[b-ysw7uonx1w] {
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 1rem;
    background: #ffffff;
}

.mfg-section-advanced[b-ysw7uonx1w] {
    background: #fcfcfd;
}

.mfg-section-notes[b-ysw7uonx1w] {
    border: none;
    background: transparent;
    padding: 0;
    margin-bottom: 0.75rem;
}

.mfg-section-header[b-ysw7uonx1w] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.85rem 1rem;
    background: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
}

.mfg-header-clickable[b-ysw7uonx1w] {
    cursor: pointer;
    user-select: none;
    transition: background 0.15s ease;
}

.mfg-header-clickable:hover[b-ysw7uonx1w] {
    background: #f1f5f9;
}

.mfg-section-titles[b-ysw7uonx1w] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.mfg-section-title[b-ysw7uonx1w] {
    font-size: 0.92rem;
    font-weight: 600;
    color: #1e293b;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.mfg-section-sub[b-ysw7uonx1w] {
    font-size: 0.775rem;
    color: #64748b;
}

.mfg-optional-tag[b-ysw7uonx1w] {
    font-size: 0.7rem;
    background: #f1f5f9;
    color: #475569;
    border: 1px solid #cbd5e1;
    border-radius: 20px;
    padding: 0.1rem 0.5rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.mfg-collapse-icon[b-ysw7uonx1w] {
    color: #64748b;
}

/* ─── Badges de paso (Armónicos Aurocore Calm UX) ─────────────── */
.mfg-step-badge[b-ysw7uonx1w] {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: #475569;
    color: white;
    font-size: 0.78rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.mfg-step-input[b-ysw7uonx1w] {
    background: #0f766e;
}

.mfg-step-output[b-ysw7uonx1w] {
    background: #047857;
}

.mfg-step-profit[b-ysw7uonx1w] {
    background: #334155;
}

.mfg-step-loss[b-ysw7uonx1w] {
    background: #64748b;
}

/* ─── Botones de Acción (Calm UX — Sin texto blanco invisible ni azul chillón) ─── */
[b-ysw7uonx1w] .mfg-btn-action,
.mfg-btn-action[b-ysw7uonx1w] {
    background-color: #f8fafc !important;
    background-image: none !important;
    color: #334155 !important;
    border: 1px solid #cbd5e1 !important;
    font-size: 0.8125rem !important;
    font-weight: 500 !important;
    padding: 0.4rem 0.85rem !important;
    border-radius: 6px !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.4rem !important;
    transition: all 0.15s ease-in-out !important;
    text-decoration: none !important;
    cursor: pointer !important;
}

[b-ysw7uonx1w] .mfg-btn-action:hover,
[b-ysw7uonx1w] .mfg-btn-action:focus,
[b-ysw7uonx1w] .mfg-btn-action:active,
[b-ysw7uonx1w] .mfg-btn-action.k-focus,
[b-ysw7uonx1w] .mfg-btn-action.k-hover,
.mfg-btn-action:hover[b-ysw7uonx1w],
.mfg-btn-action:focus[b-ysw7uonx1w],
.mfg-btn-action:active[b-ysw7uonx1w],
.mfg-btn-action.k-focus[b-ysw7uonx1w],
.mfg-btn-action.k-hover[b-ysw7uonx1w] {
    background-color: #e2e8f0 !important;
    background-image: none !important;
    color: #0f172a !important;
    border-color: #94a3b8 !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06) !important;
}

[b-ysw7uonx1w] .mfg-btn-action .k-icon,
[b-ysw7uonx1w] .mfg-btn-action .k-svg-icon,
.mfg-btn-action .k-icon[b-ysw7uonx1w],
.mfg-btn-action .k-svg-icon[b-ysw7uonx1w] {
    color: #475569 !important;
    fill: #475569 !important;
}

[b-ysw7uonx1w] .mfg-btn-action:hover .k-icon,
[b-ysw7uonx1w] .mfg-btn-action:hover .k-svg-icon,
.mfg-btn-action:hover .k-icon[b-ysw7uonx1w],
.mfg-btn-action:hover .k-svg-icon[b-ysw7uonx1w] {
    color: #0f172a !important;
    fill: #0f172a !important;
}

[b-ysw7uonx1w] .mfg-btn-action-primary,
.mfg-btn-action-primary[b-ysw7uonx1w] {
    background-color: #f0fdf4 !important;
    background-image: none !important;
    color: #166534 !important;
    border: 1px solid #bbf7d0 !important;
    font-size: 0.8125rem !important;
    font-weight: 600 !important;
    padding: 0.4rem 0.85rem !important;
    border-radius: 6px !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.4rem !important;
    transition: all 0.15s ease-in-out !important;
    text-decoration: none !important;
    cursor: pointer !important;
}

[b-ysw7uonx1w] .mfg-btn-action-primary:hover,
[b-ysw7uonx1w] .mfg-btn-action-primary:focus,
[b-ysw7uonx1w] .mfg-btn-action-primary:active,
[b-ysw7uonx1w] .mfg-btn-action-primary.k-focus,
[b-ysw7uonx1w] .mfg-btn-action-primary.k-hover,
.mfg-btn-action-primary:hover[b-ysw7uonx1w],
.mfg-btn-action-primary:focus[b-ysw7uonx1w],
.mfg-btn-action-primary:active[b-ysw7uonx1w],
.mfg-btn-action-primary.k-focus[b-ysw7uonx1w],
.mfg-btn-action-primary.k-hover[b-ysw7uonx1w] {
    background-color: #dcfce7 !important;
    background-image: none !important;
    color: #14532d !important;
    border-color: #86efac !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06) !important;
}

[b-ysw7uonx1w] .mfg-btn-action-primary .k-icon,
[b-ysw7uonx1w] .mfg-btn-action-primary .k-svg-icon,
.mfg-btn-action-primary .k-icon[b-ysw7uonx1w],
.mfg-btn-action-primary .k-svg-icon[b-ysw7uonx1w] {
    color: #166534 !important;
    fill: #166534 !important;
}

[b-ysw7uonx1w] .mfg-btn-action-primary:hover .k-icon,
[b-ysw7uonx1w] .mfg-btn-action-primary:hover .k-svg-icon,
.mfg-btn-action-primary:hover .k-icon[b-ysw7uonx1w],
.mfg-btn-action-primary:hover .k-svg-icon[b-ysw7uonx1w] {
    color: #14532d !important;
    fill: #14532d !important;
}

[b-ysw7uonx1w] .mfg-btn-icon,
.mfg-btn-icon[b-ysw7uonx1w] {
    min-width: 38px !important;
    min-height: 38px !important;
    padding: 0 0.5rem !important;
    background-color: #f8fafc !important;
    background-image: none !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 6px !important;
    color: #475569 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.15s ease-in-out !important;
    cursor: pointer !important;
}

[b-ysw7uonx1w] .mfg-btn-icon:hover,
[b-ysw7uonx1w] .mfg-btn-icon:focus,
[b-ysw7uonx1w] .mfg-btn-icon.k-hover,
.mfg-btn-icon:hover[b-ysw7uonx1w],
.mfg-btn-icon:focus[b-ysw7uonx1w],
.mfg-btn-icon.k-hover[b-ysw7uonx1w] {
    background-color: #e2e8f0 !important;
    border-color: #94a3b8 !important;
    color: #0f172a !important;
}

[b-ysw7uonx1w] .mfg-btn-icon .k-svg-icon,
.mfg-btn-icon .k-svg-icon[b-ysw7uonx1w] {
    color: inherit !important;
    fill: currentColor !important;
}

/* ─── Prevenir texto blanco sobre fondo blanco en btn-outline-secondary ─── */
[b-ysw7uonx1w] .btn-outline-secondary,
.btn-outline-secondary[b-ysw7uonx1w] {
    background-color: #f8fafc !important;
    color: #475569 !important;
    border: 1px solid #cbd5e1 !important;
    transition: all 0.15s ease-in-out !important;
}

[b-ysw7uonx1w] .btn-outline-secondary:hover,
[b-ysw7uonx1w] .btn-outline-secondary:focus,
[b-ysw7uonx1w] .btn-outline-secondary:active,
.btn-outline-secondary:hover[b-ysw7uonx1w],
.btn-outline-secondary:focus[b-ysw7uonx1w],
.btn-outline-secondary:active[b-ysw7uonx1w] {
    background-color: #e2e8f0 !important;
    color: #0f172a !important;
    border-color: #94a3b8 !important;
}

/* ─── Badges de tarjetas y detalles ─────────────────────────── */
.mfg-card-badge[b-ysw7uonx1w] {
    display: inline-flex;
    align-items: center;
    font-size: 0.75rem;
    font-weight: 600;
    color: #475569;
    background: #f1f5f9;
    border: 1px solid #cbd5e1;
    padding: 0.2rem 0.55rem;
    border-radius: 6px;
    letter-spacing: 0.02em;
}

/* ─── Cuerpo de sección ──────────────────────────────────────── */
.mfg-section-body[b-ysw7uonx1w] {
    padding: 1rem;
}

/* ─── Tarjetas de Materiales y Productos (Calm UX) ───────────── */
.mfg-item-card[b-ysw7uonx1w] {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.85rem;
    background: #ffffff;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.mfg-item-card:hover[b-ysw7uonx1w] {
    border-color: #cbd5e1;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.03);
}

.mfg-card-external[b-ysw7uonx1w] {
    background: #fafaf9;
}

.mfg-label-sm[b-ysw7uonx1w] {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    color: #475569;
    margin-bottom: 0.25rem;
}

.mfg-subtotal-val[b-ysw7uonx1w] {
    display: block;
    font-size: 0.95rem;
    font-weight: 700;
    color: #0f172a;
    padding-top: 0.25rem;
}

/* ─── Stock indicator ────────────────────────────────────────── */
.mfg-stock-ok[b-ysw7uonx1w] {
    font-size: 0.75rem;
    font-weight: 500;
    color: #166534;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    padding: 0.2rem 0.5rem;
    border-radius: 6px;
    white-space: nowrap;
}

.mfg-stock-zero[b-ysw7uonx1w] {
    font-size: 0.75rem;
    font-weight: 500;
    color: #991b1b;
    background: #fef2f2;
    border: 1px solid #fecaca;
    padding: 0.2rem 0.5rem;
    border-radius: 6px;
    white-space: nowrap;
}

/* ─── Botón eliminar (Mobile Touch Target >= 44px) ───────────── */
.mfg-btn-del[b-ysw7uonx1w] {
    min-height: 40px;
    min-width: 40px;
    padding: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
}

/* ─── Estado vacío de sección ────────────────────────────────── */
.mfg-empty-section[b-ysw7uonx1w] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.85rem 1rem;
    background: #f8fafc;
    border: 1px dashed #cbd5e1;
    border-radius: 8px;
    color: #64748b;
    font-size: 0.85rem;
}

/* ─── Hints y ayudas ─────────────────────────────────────────── */
.mfg-label[b-ysw7uonx1w] {
    display: block;
    font-size: 0.85rem;
    font-weight: 600;
    color: #334155;
    margin-bottom: 0.35rem;
}

.mfg-hint[b-ysw7uonx1w] {
    display: block;
    margin-top: 0.3rem;
    font-size: 0.75rem;
    color: #64748b;
}

.mfg-loss-hint[b-ysw7uonx1w] {
    font-size: 0.82rem;
    color: #475569;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    padding: 0.6rem 0.85rem;
    border-radius: 8px;
    margin: 0;
}

/* ════════════════════════════════════════════════════════════
   BALANCE DE MASA (Calm UX)
   ════════════════════════════════════════════════════════════ */
.mfg-balance-bar[b-ysw7uonx1w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    padding: 0.9rem 1.25rem;
    border-radius: 10px;
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    margin-top: 0.5rem;
    transition: background 0.2s ease, border-color 0.2s ease;
}

.mfg-balance-ok[b-ysw7uonx1w] {
    background: #f8fafc;
    border-color: #cbd5e1;
}

.mfg-balance-error[b-ysw7uonx1w] {
    background: #fffbeb;
    border-color: #fde68a;
}

.mfg-balance-metric[b-ysw7uonx1w] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 0.1rem;
}

.mfg-balance-label[b-ysw7uonx1w] {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
}

.mfg-balance-value[b-ysw7uonx1w] {
    font-size: 1.35rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.1;
}

.mfg-balance-unit[b-ysw7uonx1w] {
    font-size: 0.73rem;
    color: #94a3b8;
}

.mfg-balance-eq[b-ysw7uonx1w] {
    color: #64748b;
}

.mfg-balance-ok .mfg-balance-eq[b-ysw7uonx1w] {
    color: #16a34a;
}

.mfg-balance-error .mfg-balance-eq[b-ysw7uonx1w] {
    color: #d97706;
}

.mfg-balance-status[b-ysw7uonx1w] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 0.35rem;
}

.mfg-badge-ok[b-ysw7uonx1w] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    color: #166534;
    padding: 0.35rem 0.85rem;
    border-radius: 20px;
    font-weight: 600;
    font-size: 0.82rem;
}

.mfg-badge-error[b-ysw7uonx1w] {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: #fef3c7;
    border: 1px solid #fde68a;
    color: #92400e;
    padding: 0.35rem 0.85rem;
    border-radius: 20px;
    font-weight: 600;
    font-size: 0.82rem;
}

.mfg-balance-tip[b-ysw7uonx1w] {
    font-size: 0.73rem;
    color: #92400e;
    text-align: right;
}

/* ════════════════════════════════════════════════════════════
   RESPONSIVE & MOBILE-FIRST
   ════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
    .mfg-modal-body[b-ysw7uonx1w] {
        padding: 0;
    }

    .mfg-section-header[b-ysw7uonx1w] {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }

    .mfg-section-header .ms-auto[b-ysw7uonx1w] {
        margin-left: 0 !important;
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 0.4rem;
    }

    .mfg-section-header .ms-auto .btn-arregly[b-ysw7uonx1w] {
        width: 100%;
        justify-content: center;
    }

    .mfg-balance-bar[b-ysw7uonx1w] {
        flex-direction: column;
        align-items: stretch;
        gap: 0.75rem;
    }

    .mfg-balance-metric[b-ysw7uonx1w] {
        align-items: flex-start;
        text-align: left;
    }

    .mfg-balance-status[b-ysw7uonx1w] {
        align-items: flex-start;
        width: 100%;
    }

    .mfg-balance-tip[b-ysw7uonx1w] {
        text-align: left;
    }

    .mfg-btn-del[b-ysw7uonx1w] {
        min-height: 44px;
        min-width: 44px;
    }

    /* Evitar zoom en iOS y asegurar área de toque */
    .textbox-arregly input[b-ysw7uonx1w],
    .dropdownlist-arregly[b-ysw7uonx1w],
    .datepicker-arregly[b-ysw7uonx1w],
    .k-input-inner[b-ysw7uonx1w] {
        min-height: 44px !important;
        font-size: 16px !important;
    }
}

/* ─── Botón Cancelar (Calm UX — Neutro, borde nítido, sin fondos blancos invisibles ni hover azul) ─── */
[b-ysw7uonx1w] .mfg-btn-cancel,
.mfg-btn-cancel[b-ysw7uonx1w] {
    background-color: #f8fafc !important;
    background-image: none !important;
    color: #475569 !important;
    border: 1px solid #cbd5e1 !important;
    font-size: 0.8125rem !important;
    font-weight: 500 !important;
    padding: 0.45rem 1rem !important;
    border-radius: 6px !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.15s ease-in-out !important;
    cursor: pointer !important;
    text-decoration: none !important;
}

[b-ysw7uonx1w] .mfg-btn-cancel:hover,
[b-ysw7uonx1w] .mfg-btn-cancel:focus,
[b-ysw7uonx1w] .mfg-btn-cancel:active,
.mfg-btn-cancel:hover[b-ysw7uonx1w],
.mfg-btn-cancel:focus[b-ysw7uonx1w],
.mfg-btn-cancel:active[b-ysw7uonx1w] {
    background-color: #e2e8f0 !important;
    background-image: none !important;
    border-color: #94a3b8 !important;
    color: #0f172a !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.06) !important;
}

/* ─── Botones Secundarios / Outline (Calm UX — Contraste nítido y hover garantizado) ─── */
[b-ysw7uonx1w] .btn-outline-secondary-arregly,
[b-ysw7uonx1w] .btn-arregly.btn-outline-secondary-arregly,
.btn-outline-secondary-arregly[b-ysw7uonx1w],
.btn-arregly.btn-outline-secondary-arregly[b-ysw7uonx1w] {
    background-color: #ffffff !important;
    background-image: none !important;
    color: #334155 !important;
    border: 1px solid #cbd5e1 !important;
    font-size: 0.8125rem !important;
    font-weight: 500 !important;
    padding: 0.45rem 1rem !important;
    border-radius: 6px !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.15s ease-in-out !important;
    cursor: pointer !important;
    text-decoration: none !important;
}

[b-ysw7uonx1w] .btn-outline-secondary-arregly *,
[b-ysw7uonx1w] .btn-arregly.btn-outline-secondary-arregly *,
.btn-outline-secondary-arregly *[b-ysw7uonx1w],
.btn-arregly.btn-outline-secondary-arregly *[b-ysw7uonx1w] {
    color: #334155 !important;
    fill: #334155 !important;
}

[b-ysw7uonx1w] .btn-outline-secondary-arregly:hover,
[b-ysw7uonx1w] .btn-outline-secondary-arregly:focus,
[b-ysw7uonx1w] .btn-outline-secondary-arregly:active,
[b-ysw7uonx1w] .btn-arregly.btn-outline-secondary-arregly:hover,
[b-ysw7uonx1w] .btn-arregly.btn-outline-secondary-arregly:focus,
[b-ysw7uonx1w] .btn-arregly.btn-outline-secondary-arregly:active,
.btn-outline-secondary-arregly:hover[b-ysw7uonx1w],
.btn-outline-secondary-arregly:focus[b-ysw7uonx1w],
.btn-outline-secondary-arregly:active[b-ysw7uonx1w],
.btn-arregly.btn-outline-secondary-arregly:hover[b-ysw7uonx1w],
.btn-arregly.btn-outline-secondary-arregly:focus[b-ysw7uonx1w],
.btn-arregly.btn-outline-secondary-arregly:active[b-ysw7uonx1w] {
    background-color: #f1f5f9 !important;
    background-image: none !important;
    border-color: #94a3b8 !important;
    color: #0f172a !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06) !important;
}

[b-ysw7uonx1w] .btn-outline-secondary-arregly:hover *,
[b-ysw7uonx1w] .btn-outline-secondary-arregly:focus *,
[b-ysw7uonx1w] .btn-outline-secondary-arregly:active *,
[b-ysw7uonx1w] .btn-arregly.btn-outline-secondary-arregly:hover *,
[b-ysw7uonx1w] .btn-arregly.btn-outline-secondary-arregly:focus *,
[b-ysw7uonx1w] .btn-arregly.btn-outline-secondary-arregly:active *,
.btn-outline-secondary-arregly:hover *[b-ysw7uonx1w],
.btn-outline-secondary-arregly:focus *[b-ysw7uonx1w],
.btn-outline-secondary-arregly:active *[b-ysw7uonx1w],
.btn-arregly.btn-outline-secondary-arregly:hover *[b-ysw7uonx1w],
.btn-arregly.btn-outline-secondary-arregly:focus *[b-ysw7uonx1w],
.btn-arregly.btn-outline-secondary-arregly:active *[b-ysw7uonx1w] {
    color: #0f172a !important;
    fill: #0f172a !important;
}

/* ─── Selector de Sede (Calm UX) ────────────────────────────── */
.mfg-branch-selection-bar[b-ysw7uonx1w] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.75rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.mfg-branch-badge-bar[b-ysw7uonx1w] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.5rem 1rem;
    display: inline-flex;
    align-items: center;
}

.mfg-branch-filter[b-ysw7uonx1w] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

/* ─── Tarjeta Fiscal e Impuestos (Calm UX) ─────────────────────── */
.mfg-tax-card[b-ysw7uonx1w] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
}

/* ─── Tips Didácticos de Métodos de Costeo ─────────────────────── */
.mfg-didactic-tip[b-ysw7uonx1w] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.55rem 0.75rem;
    font-size: 0.78rem;
    color: #475569;
    display: flex;
    align-items: flex-start;
    line-height: 1.45;
}

/* ─── Banner Didáctico de Mermas ───────────────────────────────── */
.mfg-merma-didactic-banner[b-ysw7uonx1w] {
    background-color: #fffbeb;
    border: 1px solid #fef3c7;
    border-left: 4px solid #f59e0b;
    border-radius: 8px;
    padding: 0.75rem 1rem;
}

/* ─── Tarjeta de Liquidación Resumida ("Tipo Factura") ─────────── */
.mfg-invoice-card[b-ysw7uonx1w] {
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.03);
}

.mfg-invoice-icon-box[b-ysw7uonx1w] {
    width: 38px;
    height: 38px;
    border-radius: 8px;
    background: #f1f5f9;
    color: #0f766e;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.mfg-invoice-title[b-ysw7uonx1w] {
    font-size: 1rem;
    letter-spacing: -0.01em;
}

.mfg-invoice-table[b-ysw7uonx1w] {
    font-size: 0.8125rem;
}

.mfg-invoice-table thead th[b-ysw7uonx1w] {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #475569;
    padding: 0.55rem 0.75rem;
}

.mfg-invoice-table tbody td[b-ysw7uonx1w] {
    padding: 0.55rem 0.75rem;
}

.mfg-invoice-table tfoot td[b-ysw7uonx1w] {
    padding: 0.6rem 0.75rem;
}

/* ─── Botón Auto-Ajustar Merma (Calm UX) ────────────────────────── */
[b-ysw7uonx1w] .btn-outline-warning-arregly,
.btn-outline-warning-arregly[b-ysw7uonx1w] {
    background-color: #fffbeb !important;
    background-image: none !important;
    color: #b45309 !important;
    border: 1px solid #fde68a !important;
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    padding: 0.35rem 0.75rem !important;
    border-radius: 6px !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03) !important;
    transition: all 0.15s ease-in-out !important;
    cursor: pointer !important;
}

[b-ysw7uonx1w] .btn-outline-warning-arregly:hover,
.btn-outline-warning-arregly:hover[b-ysw7uonx1w] {
    background-color: #fef3c7 !important;
    border-color: #f59e0b !important;
    color: #92400e !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
}

/* ─── Sección de Merma por Insumo (Calm UX) ───────────────────── */
.mfg-input-loss-container[b-ysw7uonx1w] {
    background-color: #fbfcfe;
    border-radius: 8px;
}

/* ─── Banner de Receta Precargada (Calm UX) ───────────────────── */
.mfg-recipe-banner[b-ysw7uonx1w] {
    background-color: #f0f7ff;
    border: 1px solid #bae0fd;
    transition: all 0.2s ease-in-out;
}

.mfg-recipe-banner--suggest[b-ysw7uonx1w] {
    background-color: #f8fafc;
    border: 1px dashed #cbd5e1;
}

.mfg-recipe-banner:hover[b-ysw7uonx1w] {
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
}

/* ─── Stepper Calm UX para Modal de Producción ────────────────── */
.mfg-stepper[b-ysw7uonx1w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 0.75rem 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
}

.mfg-step-item[b-ysw7uonx1w] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    background: none;
    border: none;
    padding: 0.25rem 0.5rem;
    border-radius: 8px;
    transition: all 0.2s ease;
    user-select: none;
}

.mfg-step-circle[b-ysw7uonx1w] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.85rem;
    font-weight: 700;
    background: #f1f5f9;
    color: #64748b;
    border: 1.5px solid #cbd5e1;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

.mfg-step-info[b-ysw7uonx1w] {
    display: flex;
    flex-direction: column;
    text-align: left;
}

.mfg-step-title[b-ysw7uonx1w] {
    font-size: 0.82rem;
    font-weight: 600;
    color: #475569;
    transition: color 0.2s ease;
}

.mfg-step-subtitle[b-ysw7uonx1w] {
    font-size: 0.7rem;
    color: #94a3b8;
}

.mfg-step-connector[b-ysw7uonx1w] {
    flex-grow: 1;
    height: 2px;
    background: #e2e8f0;
    margin: 0 0.75rem;
    transition: background-color 0.2s ease;
}

.mfg-step-connector--active[b-ysw7uonx1w] {
    background: var(--primary-color, #093d93);
}

.mfg-step-item.mfg-step-active .mfg-step-circle[b-ysw7uonx1w] {
    background: var(--primary-color, #093d93);
    color: #ffffff;
    border-color: var(--primary-color, #093d93);
    box-shadow: 0 0 0 3px rgba(9, 61, 147, 0.15);
}

.mfg-step-item.mfg-step-active .mfg-step-title[b-ysw7uonx1w] {
    color: var(--primary-color, #093d93);
    font-weight: 700;
}

.mfg-step-item.mfg-step-completed .mfg-step-circle[b-ysw7uonx1w] {
    background: #ecfdf5;
    color: #059669;
    border-color: #10b981;
}

.mfg-step-item.mfg-step-completed .mfg-step-title[b-ysw7uonx1w] {
    color: #059669;
}

/* ─── Hero Pricing Card (Calm UX — Jerarquía Visual) ──────────── */
.mfg-hero-card[b-ysw7uonx1w] {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border: 1.5px solid #cbd5e1;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04);
}

.mfg-hero-price-box[b-ysw7uonx1w] {
    background: #ffffff;
    border: 2px solid var(--primary-color, #093d93);
    border-radius: 10px;
    padding: 1rem 1.25rem;
    box-shadow: 0 4px 10px rgba(9, 61, 147, 0.08);
}

.mfg-hero-price-header[b-ysw7uonx1w] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.5rem;
}

.mfg-hero-price-title[b-ysw7uonx1w] {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--text-heading-primary, #09224f);
}

.mfg-hero-input[b-ysw7uonx1w]  input {
    font-size: 1.55rem !important;
    font-weight: 800 !important;
    color: var(--primary-color, #093d93) !important;
    text-align: right !important;
    padding: 0.5rem 0.75rem !important;
}

.mfg-kpi-card[b-ysw7uonx1w] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 0.85rem 1rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.mfg-kpi-label[b-ysw7uonx1w] {
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
    font-weight: 600;
}

.mfg-kpi-val[b-ysw7uonx1w] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #1e293b;
    margin-top: 0.25rem;
}

.mfg-kpi-sub[b-ysw7uonx1w] {
    font-size: 0.7rem;
    color: #94a3b8;
    margin-top: 0.2rem;
}

/* ─── Paso 4: Comprobante y Liquidación Ejecutiva (Calm UX) ─────── */
.mfg-invoice-card[b-ysw7uonx1w] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
}

.mfg-invoice-icon-box[b-ysw7uonx1w] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: rgba(9, 61, 147, 0.08);
    color: var(--primary-color, #093d93);
    display: flex;
    align-items: center;
    justify-content: center;
}

.mfg-invoice-title[b-ysw7uonx1w] {
    font-size: 0.95rem;
    color: var(--text-heading-primary, #09224f);
}

.mfg-invoice-table[b-ysw7uonx1w] {
    font-size: 0.85rem;
}

.mfg-invoice-table th[b-ysw7uonx1w] {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: #64748b;
    font-weight: 600;
    padding: 0.6rem 0.75rem;
}

.mfg-invoice-table td[b-ysw7uonx1w] {
    padding: 0.6rem 0.75rem;
}

.mfg-invoice-table tfoot td[b-ysw7uonx1w] {
    padding: 0.75rem;
    font-size: 0.88rem;
}

/* ─── Hero Pricing & Calm UX Visual Hierarchy (Paso 3 & Paso 4) ─ */
.mfg-hero-final-display[b-ysw7uonx1w] {
    background: #f8fafc;
    border: 1.5px solid #cbd5e1;
    border-radius: 10px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.mfg-final-label[b-ysw7uonx1w] {
    font-size: 0.72rem;
    letter-spacing: 0.04em;
    color: #64748b;
}

.mfg-final-price-massive[b-ysw7uonx1w] {
    font-size: 1.9rem;
    font-weight: 800;
    color: var(--primary-color, #093d93);
    line-height: 1.1;
    letter-spacing: -0.02em;
}

.mfg-tax-final-card[b-ysw7uonx1w] {
    background: rgba(9, 61, 147, 0.04) !important;
    border-color: rgba(9, 61, 147, 0.25) !important;
}

.mfg-summary-hero[b-ysw7uonx1w] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.03);
}

.mfg-summary-hero-price[b-ysw7uonx1w] {
    font-size: 1.75rem;
    font-weight: 800;
    color: var(--primary-color, #093d93);
    line-height: 1.1;
    letter-spacing: -0.02em;
}
/* /Pages/Inventory/PromotionsManagement.razor.rz.scp.css */
/* ==========================================================================
   PromotionsManagement.razor.css - Aurocore Design System (Calm UI)
   ========================================================================== */

.dashboard-container[b-j3pi2jvzpy] {
    padding: 1.5rem;
    max-width: 1400px;
    margin: 0 auto;
}

/* ── Botones de Acción en Banner (Alto Contraste y Elegancia) ───────────── */
.inventory-banner-actions[b-j3pi2jvzpy],
[b-j3pi2jvzpy] .inventory-banner-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.inventory-banner-btn[b-j3pi2jvzpy],
[b-j3pi2jvzpy] .inventory-banner-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 40px;
    padding: 0 18px;
    border-radius: 10px;
    font-size: 0.875rem;
    font-weight: 600;
    cursor: pointer;
    border: 1px solid transparent;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    white-space: nowrap;
    text-decoration: none;
    user-select: none;
}

/* Botón Secundario: 'Actualizar' */
.inventory-banner-btn--secondary[b-j3pi2jvzpy],
[b-j3pi2jvzpy] .inventory-banner-btn--secondary {
    background: rgba(255, 255, 255, 0.16) !important;
    border-color: rgba(255, 255, 255, 0.35) !important;
    color: #ffffff !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.inventory-banner-btn--secondary span[b-j3pi2jvzpy],
.inventory-banner-btn--secondary .btn-icon[b-j3pi2jvzpy],
.inventory-banner-btn--secondary[b-j3pi2jvzpy]  .k-svg-icon,
.inventory-banner-btn--secondary[b-j3pi2jvzpy]  svg {
    color: #ffffff !important;
    fill: currentColor !important;
}

.inventory-banner-btn--secondary:hover:not(:disabled)[b-j3pi2jvzpy],
[b-j3pi2jvzpy] .inventory-banner-btn--secondary:hover:not(:disabled) {
    background: rgba(255, 255, 255, 0.28) !important;
    border-color: rgba(255, 255, 255, 0.5) !important;
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18);
}

.inventory-banner-btn--secondary:disabled[b-j3pi2jvzpy],
[b-j3pi2jvzpy] .inventory-banner-btn--secondary:disabled {
    opacity: 0.55;
    cursor: not-allowed;
    transform: none;
}

/* Botón Primario: 'Nueva Promoción' / 'Nuevo Kit' */
.inventory-banner-btn--primary[b-j3pi2jvzpy],
[b-j3pi2jvzpy] .inventory-banner-btn--primary {
    background: #ffffff !important;
    color: #034C48 !important;
    border-color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
}

.inventory-banner-btn--primary span[b-j3pi2jvzpy],
.inventory-banner-btn--primary .btn-icon[b-j3pi2jvzpy],
.inventory-banner-btn--primary[b-j3pi2jvzpy]  .k-svg-icon,
.inventory-banner-btn--primary[b-j3pi2jvzpy]  svg {
    color: #034C48 !important;
    fill: currentColor !important;
}

.inventory-banner-btn--primary:hover[b-j3pi2jvzpy],
[b-j3pi2jvzpy] .inventory-banner-btn--primary:hover {
    background: #f8fafc !important;
    color: #02312e !important;
    border-color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.22);
}

.inventory-banner-btn .btn-icon[b-j3pi2jvzpy],
.inventory-banner-btn[b-j3pi2jvzpy]  .btn-icon,
[b-j3pi2jvzpy] .inventory-banner-btn .btn-icon {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

@keyframes spin-b-j3pi2jvzpy {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.spin-icon[b-j3pi2jvzpy],
[b-j3pi2jvzpy] .spin-icon {
    animation: spin-b-j3pi2jvzpy 1s linear infinite;
}

/* ── KPI Cards (Sin bordes izquierdos coloreados, calma y sutileza) ─────── */
.card-glass[b-j3pi2jvzpy] {
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(226, 232, 240, 0.9);
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.04);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.card-glass:hover[b-j3pi2jvzpy] {
    transform: translateY(-2px);
    box-shadow: 0 8px 26px rgba(15, 23, 42, 0.07);
}

.kpi-icon-circle[b-j3pi2jvzpy] {
    width: 48px;
    height: 48px;
    min-width: 48px;
    border-radius: 12px;
    flex-shrink: 0;
}

.kpi-icon-circle--primary[b-j3pi2jvzpy] {
    background: color-mix(in srgb, var(--primary-color, #034C48) 10%, #ffffff);
    color: var(--primary-color, #034C48);
}

.kpi-icon-circle--success[b-j3pi2jvzpy] {
    background: #ecfdf5;
    color: #059669;
}

.kpi-icon-circle--info[b-j3pi2jvzpy] {
    background: #f0f9ff;
    color: #0284c7;
}

/* ── Filtros con Píldoras para BaseGrid ─────────────────────────────────── */
.promo-filter-pills[b-j3pi2jvzpy] {
    display: inline-flex;
    align-items: center;
    background: #f1f5f9;
    padding: 3px;
    border-radius: 10px;
    gap: 2px;
}

.promo-filter-pill[b-j3pi2jvzpy] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 14px;
    border: none;
    background: transparent;
    border-radius: 8px;
    font-size: 0.8125rem;
    font-weight: 500;
    color: #64748b;
    cursor: pointer;
    transition: all 0.18s ease;
    user-select: none;
    min-height: 34px;
}

.promo-filter-pill:hover:not(.active)[b-j3pi2jvzpy] {
    color: #1e293b;
    background: rgba(255, 255, 255, 0.6);
}

.promo-filter-pill.active[b-j3pi2jvzpy] {
    background: #ffffff;
    font-weight: 600;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.08);
}

.promo-filter-pill.active.active-all[b-j3pi2jvzpy] {
    color: #1e293b;
}

.promo-filter-pill.active.active-active[b-j3pi2jvzpy] {
    color: #059669;
}

.promo-filter-pill.active.active-inactive[b-j3pi2jvzpy] {
    color: #64748b;
}

.promo-filter-badge[b-j3pi2jvzpy] {
    padding: 1px 7px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
}

.badge-all[b-j3pi2jvzpy] {
    background: #e2e8f0;
    color: #334155;
}

.badge-active[b-j3pi2jvzpy] {
    background: #dcfce7;
    color: #15803d;
}

.badge-inactive[b-j3pi2jvzpy] {
    background: #f1f5f9;
    color: #64748b;
}

/* ── Badges y Estados ───────────────────────────────────────────────────── */
.badge-status[b-j3pi2jvzpy] {
    padding: 0.25rem 0.65rem;
    border-radius: 6px;
    font-size: 0.8rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
}

.badge-pill[b-j3pi2jvzpy] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.78rem;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 999px;
}

.badge-pill--success[b-j3pi2jvzpy] {
    background: #f0fdf4;
    color: #15803d;
    border: 1px solid #bbf7d0;
}

.badge-pill--neutral[b-j3pi2jvzpy] {
    background: #f8fafc;
    color: #64748b;
    border: 1px solid #e2e8f0;
}

.badge-sku-pill[b-j3pi2jvzpy] {
    font-family: monospace;
    font-size: 0.73rem;
    background: #f1f5f9;
    color: #475569;
    padding: 1px 7px;
    border-radius: 4px;
    display: inline-block;
    width: fit-content;
}

.badge-bom-counter[b-j3pi2jvzpy] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #f0fdfa;
    color: #0f766e;
    border: 1px solid #ccfbf1;
    border-radius: 8px;
    padding: 4px 10px;
    font-size: 0.8rem;
}

/* ── Fila de Kits ───────────────────────────────────────────────────────── */
.kit-row-info[b-j3pi2jvzpy] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.kit-row-icon[b-j3pi2jvzpy] {
    width: 36px;
    height: 36px;
    min-width: 36px;
    border-radius: 8px;
    background: #f0fdfa;
    color: #0f766e;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #ccfbf1;
}

.kit-row-details[b-j3pi2jvzpy] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.kit-row-title[b-j3pi2jvzpy] {
    font-weight: 700;
    font-size: 0.88rem;
    color: #0f172a;
    line-height: 1.25;
}

/* ── Pestañas Telerik ───────────────────────────────────────────────────── */
[b-j3pi2jvzpy] .promotions-tabs.k-tabstrip {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

[b-j3pi2jvzpy] .promotions-tabs .k-tabstrip-items-wrapper {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(226, 232, 240, 0.8) !important;
    padding: 0 !important;
    margin-bottom: 1.5rem !important;
}

[b-j3pi2jvzpy] .promotions-tabs .k-tabstrip-items {
    background: transparent !important;
    border: 0 !important;
    padding: 4px 0 !important;
    gap: 12px;
}

[b-j3pi2jvzpy] .promotions-tabs .k-tabstrip-item {
    border: 1px solid rgba(226, 232, 240, 0.8) !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    color: #64748b !important;
    transition: all 0.2s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
}

[b-j3pi2jvzpy] .promotions-tabs .k-tabstrip-item:hover {
    color: #0f172a !important;
    background: #f8fafc !important;
    border-color: #cbd5e1 !important;
}

[b-j3pi2jvzpy] .promotions-tabs .k-tabstrip-item.k-active {
    background: var(--primary-color, #034C48) !important;
    color: #ffffff !important;
    border-color: var(--primary-color, #034C48) !important;
    box-shadow: 0 4px 12px color-mix(in srgb, var(--primary-color, #034C48) 25%, transparent);
}

[b-j3pi2jvzpy] .promotions-tabs .k-tabstrip-item .k-link {
    padding: 10px 20px !important;
    font-weight: 600;
    font-size: 0.92rem;
    color: inherit !important;
}

[b-j3pi2jvzpy] .promotions-tabs .k-tabstrip-content {
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
}

/* ── Mobile-First Cards para BaseGrid ───────────────────────────────────── */
.promo-mobile-card[b-j3pi2jvzpy] {
    background: #ffffff;
    border: 1px solid rgba(226, 232, 240, 0.9);
    border-radius: 14px;
    padding: 14px 16px;
    margin-bottom: 12px;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}

.promo-mobile-card-header[b-j3pi2jvzpy] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding-bottom: 10px;
    border-bottom: 1px solid #f1f5f9;
    margin-bottom: 10px;
}

.promo-mobile-card-body[b-j3pi2jvzpy] {
    font-size: 0.835rem;
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 12px;
}

.promo-mobile-card-actions[b-j3pi2jvzpy] {
    padding-top: 10px;
    border-top: 1px solid #f1f5f9;
}

.promo-mobile-card-actions button[b-j3pi2jvzpy] {
    min-height: 42px;
    font-weight: 600;
}

/* ── Responsive Mobile First ────────────────────────────────────────────── */
@media (max-width: 768px) {
    .dashboard-container[b-j3pi2jvzpy] {
        padding: 1rem;
    }

    .inventory-banner-actions[b-j3pi2jvzpy],
    [b-j3pi2jvzpy] .inventory-banner-actions {
        flex-wrap: wrap;
        width: 100%;
        margin-top: 8px;
    }

    .inventory-banner-btn[b-j3pi2jvzpy],
    [b-j3pi2jvzpy] .inventory-banner-btn {
        flex: 1 1 auto;
        min-height: 44px;
        font-size: 0.825rem;
        padding: 0 14px;
    }

    .promo-filter-pills[b-j3pi2jvzpy] {
        width: 100%;
        display: flex;
        overflow-x: auto;
    }

    .promo-filter-pill[b-j3pi2jvzpy] {
        flex: 1;
        justify-content: center;
        min-height: 40px;
    }
}
/* /Pages/Inventory/SupplierManagement.razor.rz.scp.css */
/* ==========================================================================
   SupplierManagement.razor.css - Aurocore Design System
   ========================================================================== */



/* ── Botones de Acción en Banner ────────────────────────────────────────── */
.inventory-banner-actions[b-sp5bzal56h],
[b-sp5bzal56h] .inventory-banner-actions {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: nowrap;
    flex-shrink: 0;
}

.inventory-banner-btn[b-sp5bzal56h],
[b-sp5bzal56h] .inventory-banner-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 10px 20px;
    font-size: 0.875rem;
    font-weight: 600;
    line-height: 1.25;
    border-radius: 12px;
    cursor: pointer;
    transition: all 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    text-decoration: none;
    user-select: none;
    white-space: nowrap;
    outline: none;
    border: 1px solid transparent;
}

.inventory-banner-btn:focus-visible[b-sp5bzal56h],
[b-sp5bzal56h] .inventory-banner-btn:focus-visible {
    outline: 2px solid rgba(255, 255, 255, 0.7);
    outline-offset: 2px;
}

/* 1. Botón Secundario: 'Actualizar' - Glassmorphism con texto blanco nítido */
.inventory-banner-btn--secondary[b-sp5bzal56h],
[b-sp5bzal56h] .inventory-banner-btn--secondary {
    background: rgba(255, 255, 255, 0.15) !important;
    color: #ffffff !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.inventory-banner-btn--secondary span[b-sp5bzal56h],
.inventory-banner-btn--secondary .btn-icon[b-sp5bzal56h],
.inventory-banner-btn--secondary[b-sp5bzal56h]  .k-svg-icon,
.inventory-banner-btn--secondary[b-sp5bzal56h]  svg {
    color: #ffffff !important;
    fill: currentColor !important;
}

.inventory-banner-btn--secondary:hover:not(:disabled)[b-sp5bzal56h],
[b-sp5bzal56h] .inventory-banner-btn--secondary:hover:not(:disabled) {
    background: rgba(255, 255, 255, 0.28) !important;
    border-color: rgba(255, 255, 255, 0.5) !important;
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18);
}

.inventory-banner-btn--secondary:disabled[b-sp5bzal56h],
[b-sp5bzal56h] .inventory-banner-btn--secondary:disabled {
    opacity: 0.55;
    cursor: not-allowed;
    transform: none;
}

/* 2. Botón Primario: 'Nuevo Proveedor' - Fondo blanco puro con texto oscuro de máximo contraste */
.inventory-banner-btn--primary[b-sp5bzal56h],
[b-sp5bzal56h] .inventory-banner-btn--primary {
    background: #ffffff !important;
    color: #034C48 !important;
    border-color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
}

.inventory-banner-btn--primary span[b-sp5bzal56h],
.inventory-banner-btn--primary .btn-icon[b-sp5bzal56h],
.inventory-banner-btn--primary[b-sp5bzal56h]  .k-svg-icon,
.inventory-banner-btn--primary[b-sp5bzal56h]  svg {
    color: #034C48 !important;
    fill: currentColor !important;
}

.inventory-banner-btn--primary:hover[b-sp5bzal56h],
[b-sp5bzal56h] .inventory-banner-btn--primary:hover {
    background: #f8fafc !important;
    color: #02312e !important;
    border-color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.22);
}

.inventory-banner-btn .btn-icon[b-sp5bzal56h],
.inventory-banner-btn[b-sp5bzal56h]  .btn-icon,
[b-sp5bzal56h] .inventory-banner-btn .btn-icon {
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

@keyframes spin-b-sp5bzal56h {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.spin-icon[b-sp5bzal56h],
[b-sp5bzal56h] .spin-icon {
    animation: spin-b-sp5bzal56h 1s linear infinite;
}

/* ── KPI Cards (Sin bordes izquierdos, iconos nítidos) ──────────────────── */
.card-glass[b-sp5bzal56h] {
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(226, 232, 240, 0.9);
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.04);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.card-glass:hover[b-sp5bzal56h] {
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(15, 23, 42, 0.07);
}

.kpi-icon-circle[b-sp5bzal56h] {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    flex-shrink: 0;
    transition: transform 0.2s ease;
}

.card-glass:hover .kpi-icon-circle[b-sp5bzal56h] {
    transform: scale(1.05);
}

.kpi-icon-circle--primary[b-sp5bzal56h] {
    background: rgba(102, 126, 234, 0.12);
    color: #667eea;
}

.kpi-icon-circle--success[b-sp5bzal56h] {
    background: rgba(16, 185, 129, 0.12);
    color: #059669;
}

.kpi-icon-circle--warning[b-sp5bzal56h] {
    background: rgba(245, 158, 11, 0.12);
    color: #d97706;
}

/* ── Filtros por Estado en Toolbar (Pills) ──────────────────────────────── */
.supplier-filter-pills[b-sp5bzal56h],
[b-sp5bzal56h] .supplier-filter-pills {
    display: inline-flex;
    align-items: center;
    background: #f1f5f9;
    padding: 3px;
    border-radius: 10px;
    gap: 3px;
}

.supplier-filter-pill[b-sp5bzal56h],
[b-sp5bzal56h] .supplier-filter-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 8px;
    font-size: 0.8125rem;
    font-weight: 600;
    color: #64748b;
    border: none;
    background: transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    user-select: none;
    white-space: nowrap;
}

.supplier-filter-pill:hover[b-sp5bzal56h],
[b-sp5bzal56h] .supplier-filter-pill:hover {
    color: #1e293b;
    background: rgba(255, 255, 255, 0.6);
}

.supplier-filter-pill.active[b-sp5bzal56h],
[b-sp5bzal56h] .supplier-filter-pill.active {
    background: #ffffff;
    color: #034C48;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}

.supplier-filter-badge[b-sp5bzal56h],
[b-sp5bzal56h] .supplier-filter-badge {
    font-size: 0.72rem;
    padding: 1px 6px;
    border-radius: 10px;
    background: #e2e8f0;
    color: #475569;
}

.supplier-filter-pill.active .supplier-filter-badge[b-sp5bzal56h],
[b-sp5bzal56h] .supplier-filter-pill.active .supplier-filter-badge {
    background: rgba(3, 76, 72, 0.12);
    color: #034C48;
}

/* ── Estilos de Celdas y Tabla ─────────────────────────────────────────── */
.supplier-table-avatar[b-sp5bzal56h] {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: rgba(3, 76, 72, 0.08);
    color: #034C48;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.badge-lead-time[b-sp5bzal56h] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    background: rgba(245, 158, 11, 0.1);
    color: #b45309;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.8125rem;
    border: 1px solid rgba(245, 158, 11, 0.2);
}

.badge-status[b-sp5bzal56h] {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.8125rem;
}

.status-completed[b-sp5bzal56h] {
    background: rgba(16, 185, 129, 0.12);
    color: #047857;
    border: 1px solid rgba(16, 185, 129, 0.25);
}

.status-inactive[b-sp5bzal56h] {
    background: rgba(100, 116, 139, 0.12);
    color: #475569;
    border: 1px solid rgba(100, 116, 139, 0.2);
}

/* ── Responsive & Mobile First ──────────────────────────────────────────── */
@media (max-width: 768px) {
    .inventory-banner-actions[b-sp5bzal56h],
    [b-sp5bzal56h] .inventory-banner-actions {
        flex-wrap: wrap;
        width: 100%;
        margin-top: 8px;
    }

    .inventory-banner-btn[b-sp5bzal56h],
    [b-sp5bzal56h] .inventory-banner-btn {
        flex: 1 1 auto;
    }

    .supplier-filter-pills[b-sp5bzal56h],
    [b-sp5bzal56h] .supplier-filter-pills {
        width: 100%;
        justify-content: space-between;
    }

    .supplier-filter-pill[b-sp5bzal56h],
    [b-sp5bzal56h] .supplier-filter-pill {
        flex: 1;
        justify-content: center;
    }
}
/* /Pages/Inventory/WarehouseLocations.razor.rz.scp.css */
.dashboard-container[b-hiv4odkogn] {
    font-family: 'Poppins', sans-serif;
}

/* KPI Cards - Calm UX Enterprise */
.kpi-card[b-hiv4odkogn] {
    background: #ffffff;
    border: 1px solid #edf2f7;
    border-radius: 14px;
    padding: 1.15rem 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.kpi-card:hover[b-hiv4odkogn] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

.kpi-metric-title[b-hiv4odkogn] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.kpi-metric-value[b-hiv4odkogn] {
    font-size: 1.65rem;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.2;
    margin-bottom: 0.2rem;
}

.kpi-metric-subtitle[b-hiv4odkogn] {
    font-size: 0.75rem;
    color: #94a3b8;
    display: block;
}

/* KPI Icons - Subtle Enterprise Tint (Calm UX) */
.kpi-icon-container[b-hiv4odkogn] {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.kpi-icon-indigo[b-hiv4odkogn] {
    background-color: #eef2ff;
    color: #4f46e5;
}

.kpi-icon-teal[b-hiv4odkogn] {
    background-color: #f0fdfa;
    color: #0d9488;
}

.kpi-icon-amber[b-hiv4odkogn] {
    background-color: #fffbeb;
    color: #d97706;
}

.kpi-icon-slate[b-hiv4odkogn] {
    background-color: #f1f5f9;
    color: #475569;
}

/* Grid Pill Badges & Tags */
[b-hiv4odkogn] .location-code-pill {
    display: inline-flex;
    align-items: center;
    background: #f8fafc;
    color: #334155;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    padding: 2px 8px;
    font-size: 0.80rem;
    font-weight: 600;
}

[b-hiv4odkogn] .badge-default-pill {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    background: #ecfdf5;
    color: #047857;
    border: 1px solid #a7f3d0;
    border-radius: 10px;
    padding: 1px 7px;
    font-size: 0.68rem;
    font-weight: 600;
}

[b-hiv4odkogn] .location-type-tag {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 3px 9px;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 500;
}

/* Status Badges */
[b-hiv4odkogn] .status-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

[b-hiv4odkogn] .status-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    display: inline-block;
}

[b-hiv4odkogn] .status-active {
    background: #def7ec;
    color: #03543f;
    border: 1px solid #bcf0da;
}

[b-hiv4odkogn] .status-active .status-dot {
    background-color: #0e9f6e;
}

[b-hiv4odkogn] .status-inactive {
    background: #fde8e8;
    color: #9b1c1c;
    border: 1px solid #fbd5d5;
}

[b-hiv4odkogn] .status-inactive .status-dot {
    background-color: #f05252;
}

/* Branch Dropdown in Banner Header */
[b-hiv4odkogn] .branch-dropdown-banner .k-picker {
    background-color: rgba(255, 255, 255, 0.95);
    border-radius: 8px;
    border: 1px solid #e2e8f0;
}

/* Sub-navegación por Pestañas Segmentadas */
.warehouse-tabs-nav[b-hiv4odkogn] {
    background: #f8fafc;
    border-radius: 12px;
}

.btn-subtab[b-hiv4odkogn] {
    display: inline-flex;
    align-items: center;
    border: none;
    background: transparent;
    padding: 8px 16px;
    border-radius: 8px;
    font-size: 0.86rem;
    font-weight: 500;
    color: #64748b;
    transition: all 0.2s ease;
    cursor: pointer;
}

.btn-subtab:hover[b-hiv4odkogn] {
    color: #1e293b;
    background: rgba(255, 255, 255, 0.6);
}

.btn-subtab.active[b-hiv4odkogn] {
    background: #ffffff;
    color: #4338ca;
    font-weight: 600;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

.filter-caption-label[b-hiv4odkogn] {
    font-size: 0.74rem;
    font-weight: 600;
    color: #475569;
    margin-bottom: 3px;
    display: block;
}

.dropdown-arregly-select[b-hiv4odkogn] {
    border-radius: 8px;
    border-color: #cbd5e1;
    font-size: 0.82rem;
    height: 38px;
}

[b-hiv4odkogn] .transfer-code-pill {
    display: inline-flex;
    align-items: center;
    background: #f1f5f9;
    color: #1e293b;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    padding: 2px 8px;
    font-size: 0.80rem;
}

[b-hiv4odkogn] .location-flow-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 6px;
    padding: 2px 7px;
    font-size: 0.74rem;
    font-weight: 500;
}

[b-hiv4odkogn] .user-initials-circle {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: #ffffff;
    font-size: 0.68rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* Acciones en BaseGrid */
[b-hiv4odkogn] .action-menu-container {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    white-space: nowrap;
}

/* /Pages/Invoices/Components/CashClosingCreateModal.razor.rz.scp.css */
.cierre-subtitle[b-7j3festmgy] {
    font-size: 0.82rem;
    color: #6b7280;
    font-weight: 400;
}

.cierre-content[b-7j3festmgy] {
    display: flex;
    flex-direction: column;
    gap: 1.1rem;
}

.cierre-field[b-7j3festmgy] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.cierre-label[b-7j3festmgy] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #374151;
}

.cierre-resumen-card[b-7j3festmgy] {
    background-color: #f8fafb;
    border: 1px solid #e8ecef;
    border-radius: 10px;
    padding: 1rem 1.15rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.cierre-resumen-row[b-7j3festmgy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 0.5rem;
    border-bottom: 1px solid #e5e7eb;
}

.cierre-resumen-label[b-7j3festmgy] {
    font-size: 0.85rem;
    color: #6b7280;
}

.cierre-resumen-value[b-7j3festmgy] {
    font-weight: 600;
    color: #1f2937;
}

.cierre-metodos[b-7j3festmgy] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.cierre-metodo-row[b-7j3festmgy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.85rem;
    color: #4b5563;
}

.cierre-metodo-dot[b-7j3festmgy] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
}

.cierre-dot-efectivo[b-7j3festmgy] { background-color: #10b981; }
.cierre-dot-transferencia[b-7j3festmgy] { background-color: #3b82f6; }
.cierre-dot-tarjeta[b-7j3festmgy] { background-color: #a855f7; }

.cierre-total-row[b-7j3festmgy] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #e5e7eb;
    padding-top: 0.65rem;
}

.cierre-total-label[b-7j3festmgy] {
    font-weight: 600;
    color: #1f2937;
    font-size: 0.9rem;
}

.cierre-total-value[b-7j3festmgy] {
    font-weight: 700;
    color: #059669;
    font-size: 1.1rem;
}

.invoice-inline-error[b-7j3festmgy] {
    color: #b91c1c;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 0.45rem 0.6rem;
    font-size: 0.8rem;
}

[b-7j3festmgy] .picker-arregly.k-invalid,
[b-7j3festmgy] .picker-arregly.k-invalid:focus-within,
[b-7j3festmgy] .picker-arregly.k-picker.k-invalid,
[b-7j3festmgy] .picker-arregly.k-datepicker.k-invalid {
    border-color: #d0d5dd !important;
    box-shadow: none !important;
}

[b-7j3festmgy] .picker-arregly.k-invalid .k-input-inner,
[b-7j3festmgy] .picker-arregly.k-picker.k-invalid .k-input-inner,
[b-7j3festmgy] .picker-arregly.k-datepicker.k-invalid .k-input-inner {
    color: #101828 !important;
}
/* /Pages/Invoices/Components/CashClosingDetailsModal.razor.rz.scp.css */
.detail-subtitle[b-sr4dt6mreg] {
    font-size: 0.82rem;
    color: #6b7280;
    font-weight: 400;
}

.detail-loading[b-sr4dt6mreg] {
    min-height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6b7280;
}

.detail-grid[b-sr4dt6mreg] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem 1.2rem;
    margin-bottom: 1rem;
}

.detail-label[b-sr4dt6mreg] {
    display: block;
    font-size: 0.78rem;
    color: #6b7280;
}

.detail-value[b-sr4dt6mreg] {
    display: block;
    color: #111827;
    font-weight: 600;
}

.detail-card[b-sr4dt6mreg] {
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 0.95rem;
    background: #fff;
}

.detail-card-title[b-sr4dt6mreg] {
    margin-bottom: 0.8rem;
    color: #1f2937;
}

.detail-rows[b-sr4dt6mreg] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.detail-row[b-sr4dt6mreg] {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 0.45rem;
}

.dot[b-sr4dt6mreg] {
    width: 9px;
    height: 9px;
    border-radius: 50%;
}

.dot-cash[b-sr4dt6mreg] { background: #10b981; }
.dot-transfer[b-sr4dt6mreg] { background: #3b82f6; }
.dot-card[b-sr4dt6mreg] { background: #a855f7; }

.detail-total-row[b-sr4dt6mreg] {
    margin-top: 0.65rem;
    padding-top: 0.55rem;
    border-top: 1px solid #e5e7eb;
    display: flex;
    justify-content: space-between;
    font-size: 1.1rem;
    color: #059669;
    font-weight: 700;
}

.detail-notes[b-sr4dt6mreg] {
    margin-top: 0.95rem;
    background: #f3f4f6;
    border-radius: 10px;
    padding: 0.7rem;
    color: #4b5563;
    font-size: 0.85rem;
}

@media (max-width: 768px) {
    .detail-grid[b-sr4dt6mreg] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Invoices/Components/InvoiceMetricsCards.razor.rz.scp.css */
.stat-cards-row[b-jilqqm0nh4] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.75rem;
}

.stat-card[b-jilqqm0nh4] {
    background: #ffffff;
    border: none;
    border-radius: 14px;
    padding: 0.85rem 1rem;
    display: grid;
    grid-template-columns: auto 1fr auto;
    grid-template-rows: auto auto;
    gap: 0.1rem 1rem;
    align-items: center;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.stat-card-header[b-jilqqm0nh4] {
    display: contents;
}

.stat-card-icon[b-jilqqm0nh4] {
    grid-column: 1;
    grid-row: 1 / 3;
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.stat-icon-blue[b-jilqqm0nh4] { background-color: #dbeafe; color: #3b82f6; }
.stat-icon-green[b-jilqqm0nh4] { background-color: #d1fae5; color: #10b981; }
.stat-icon-orange[b-jilqqm0nh4] { background-color: #ffedd5; color: #f97316; }
.stat-icon-red[b-jilqqm0nh4] { background-color: #fee2e2; color: #ef4444; }

.stat-card-label[b-jilqqm0nh4] {
    grid-column: 2;
    grid-row: 1;
    align-self: end;
    font-size: 0.7rem;
    font-weight: 500;
    color: #6b7280;
    text-transform: uppercase;
    letter-spacing: 0.02em;
}

.stat-card-value[b-jilqqm0nh4] {
    grid-column: 2;
    grid-row: 2;
    align-self: start;
    font-size: 1.1rem;
    font-weight: 700;
    color: #1f2937;
}

.stat-value-green[b-jilqqm0nh4] { color: #059669; }
.stat-value-orange[b-jilqqm0nh4] { color: #ea580c; }
.stat-value-red[b-jilqqm0nh4] { color: #dc2626; }

@media (min-width: 576px) {
    .stat-cards-row[b-jilqqm0nh4] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 992px) {
    .stat-cards-row[b-jilqqm0nh4] {
        grid-template-columns: repeat(4, 1fr);
        gap: 1rem;
    }
}
/* /Pages/Invoices/Components/InvoicesBillingTab.razor.rz.scp.css */
.tab-facturas-content[b-fvuxq9mnzp] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.invoice-section-card[b-fvuxq9mnzp] {
    background: #fff;
    border-radius: 14px;
    border: none;
    padding: 14px 16px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    overflow: hidden;
}

.invoices-filters-row[b-fvuxq9mnzp] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.invoices-filter-dropdowns[b-fvuxq9mnzp] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    width: 100%;
}

.invoices-filter-dropdowns[b-fvuxq9mnzp]  .dropdownlist-arregly {
    flex: 1 1 calc(50% - 0.5rem);
    min-width: 120px;
}

.invoice-grid-wrap[b-fvuxq9mnzp] {
    margin-top: 4px;
    width: 100%;
}

.invoice-grid-wrap[b-fvuxq9mnzp]  .base-grid-container {
    margin-left: 0;
    margin-right: 0;
    width: 100%;
}

[b-fvuxq9mnzp] .invoice-orden-link { color: var(--primary-color); font-weight: 500; font-size: 0.85rem; cursor: pointer; }
[b-fvuxq9mnzp] .invoice-cell-fecha {
    display: flex;
    flex-direction: column;
    gap: 2px;
    white-space: nowrap;
}
[b-fvuxq9mnzp] .invoice-fecha-date {
    font-size: 0.85rem;
    font-weight: 500;
    color: #1e293b;
    line-height: 1.25;
}
[b-fvuxq9mnzp] .invoice-fecha-time {
    font-size: 0.75rem;
    color: #64748b;
    line-height: 1.2;
}
[b-fvuxq9mnzp] .invoice-total-cell { font-weight: normal; font-size: 0.9rem; color: #1f2937; }

[b-fvuxq9mnzp] .invoice-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.2rem 0.65rem;
    border-radius: 20px;
    font-size: 0.78rem;
    font-weight: 500;
}

[b-fvuxq9mnzp] .badge-pagada { background-color: #d1fae5; color: #065f46; }
[b-fvuxq9mnzp] .badge-emitida { background-color: #dbeafe; color: #1e40af; }
[b-fvuxq9mnzp] .badge-enviada { background-color: #ede9fe; color: #5b21b6; }
[b-fvuxq9mnzp] .badge-vencida { background-color: #fee2e2; color: #991b1b; }
[b-fvuxq9mnzp] .badge-anulada, [b-fvuxq9mnzp] .badge-default { background-color: #f3f4f6; color: #6b7280; }

[b-fvuxq9mnzp] .invoice-mobile-card .border-top {
    border-top: 1px solid #cbd5e1 !important;
    margin-top: 0.25rem !important;
    padding-top: 0.5rem !important;
}
/* /Pages/Invoices/Components/InvoicesCashClosingTab.razor.rz.scp.css */
.cash-closing-tab-content[b-z9noufvxqk] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.cash-closing-toolbar[b-z9noufvxqk] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.8rem;
}

.cash-closing-toolbar-left[b-z9noufvxqk] {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    flex-wrap: wrap;
}

[b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle {
    position: relative !important;
    display: flex !important;
    justify-content: center;
    width: 220px !important;
    padding: 0 !important;
    border: 1px solid #d0d5dd !important;
    border-radius: 12px !important;
    background: #fff !important;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.06), 0 8px 24px rgba(102, 126, 234, 0.12) !important;
    overflow: hidden !important;
    isolation: isolate !important;
}

[b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle::before {
    content: "";
    position: absolute;
    top: 4px;
    left: 4px;
    width: calc(50% - 4px);
    height: calc(100% - 8px);
    border-radius: 999px;
    background: var(--primary-gradient);
    box-shadow: 0 10px 24px rgba(102, 126, 234, 0.28);
    transform: translateX(0);
    transition: transform 0.3s ease;
    z-index: 0;
}

[b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle.is-monthly::before {
    transform: translateX(calc(100% - 4px));
}

[b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle .k-radio-list,
[b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle .k-radio-list-horizontal,
[b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle .k-radio-list-wrapper,
[b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle ul {
    position: relative !important;
    z-index: 1 !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: stretch !important;
    gap: 0 !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    list-style: none !important;
}

[b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle .k-radio-item,
[b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle li,
[b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle .k-radio-wrap {
    margin: 0 !important;
    padding: 0 !important;
    min-height: 40px;
}

[b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle .k-radio-label,
[b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle label {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 9px 12px !important;
    border: 0 !important;
    background: transparent !important;
    color: #6b7280 !important;
    font-weight: 700 !important;
    font-size: 0.86rem !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    transition: color 0.25s ease !important;
    cursor: pointer !important;
}

[b-z9noufvxqk] .cash-closing-mode-item {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

[b-z9noufvxqk] .cash-closing-mode-item .k-svg-icon,
[b-z9noufvxqk] .cash-closing-mode-item .k-icon {
    width: 14px;
    height: 14px;
}

[b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle .k-radio-item:has(.k-radio:checked) .k-radio-label,
[b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle li:has(input:checked) label,
[b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle .k-radio-wrap.k-selected .k-radio-label {
    color: #fff !important;
}

[b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle .k-radio,
[b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle input[type="radio"] {
    position: absolute !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
    pointer-events: none !important;
}

[b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle .k-radio-list:focus-within,
[b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle:focus-within {
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.18), inset 0 1px 2px rgba(15, 23, 42, 0.06), 0 8px 24px rgba(102, 126, 234, 0.12) !important;
}

.cash-closing-grid-wrap[b-z9noufvxqk] {
    width: 100%;
}

.amount-cash[b-z9noufvxqk] { color: #059669; font-weight: 600; }
.amount-transfer[b-z9noufvxqk] { color: #2563eb; font-weight: 600; }
.amount-card[b-z9noufvxqk] { color: #9333ea; font-weight: 600; }

.invoice-count-badge[b-z9noufvxqk] {
    background: #f3f4f6;
    color: #374151;
    border-radius: 16px;
    padding: 0.15rem 0.55rem;
    font-size: 0.78rem;
    font-weight: 600;
}

[b-z9noufvxqk] .picker-arregly.k-invalid,
[b-z9noufvxqk] .picker-arregly.k-invalid:focus-within,
[b-z9noufvxqk] .picker-arregly.k-picker.k-invalid,
[b-z9noufvxqk] .picker-arregly.k-datepicker.k-invalid {
    border-color: #d0d5dd !important;
    box-shadow: none !important;
}

[b-z9noufvxqk] .picker-arregly.k-invalid .k-input-inner,
[b-z9noufvxqk] .picker-arregly.k-picker.k-invalid .k-input-inner,
[b-z9noufvxqk] .picker-arregly.k-datepicker.k-invalid .k-input-inner {
    color: #101828 !important;
}

@media (max-width: 992px) {
    .cash-closing-toolbar[b-z9noufvxqk] {
        flex-direction: column;
        align-items: stretch;
    }

    .cash-closing-toolbar-left[b-z9noufvxqk] {
        width: 100%;
    }

    [b-z9noufvxqk] .radio-pill.cash-closing-mode-toggle {
        width: 100% !important;
        max-width: 320px;
    }
}
/* /Pages/Invoices/Components/InvoicesReportsTab.razor.rz.scp.css */
.tab-reportes-content[b-izkuc8uq0t] {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.reporte-periodo-card[b-izkuc8uq0t],
.reporte-section-card[b-izkuc8uq0t],
.stat-card[b-izkuc8uq0t] {
    background: #ffffff;
    border: none;
    border-radius: 14px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.reporte-periodo-card[b-izkuc8uq0t] {
    padding: 1rem;
}

.reporte-periodo-header[b-izkuc8uq0t] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
}

.reporte-periodo-title[b-izkuc8uq0t] { font-weight: 600; color: #111827; font-size: 0.95rem; margin: 0; }
.reporte-periodo-desc[b-izkuc8uq0t] { font-size: 0.8rem; color: #6b7280; }

.reporte-section-card[b-izkuc8uq0t] {
    padding: 1.25rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.reporte-section-title[b-izkuc8uq0t] { font-weight: 600; color: #1f2937; font-size: 0.95rem; margin: 0; }

.stat-cards-row[b-izkuc8uq0t] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.75rem;
}

.stat-card[b-izkuc8uq0t] {
    display: flex;
    flex-direction: column;
    padding: 1.1rem 1.25rem;
    gap: 0.4rem;
}

.stat-card-header[b-izkuc8uq0t] { display: flex; justify-content: space-between; align-items: center; }
.stat-card-icon[b-izkuc8uq0t] { width: 30px; height: 30px; border-radius: 8px; display: flex; align-items: center; justify-content: center; }
.stat-icon-blue[b-izkuc8uq0t] { background-color: #dbeafe; color: #3b82f6; }
.stat-icon-green[b-izkuc8uq0t] { background-color: #d1fae5; color: #10b981; }
.stat-icon-orange[b-izkuc8uq0t] { background-color: #ffedd5; color: #f97316; }
.stat-card-label[b-izkuc8uq0t] { font-size: 0.8rem; color: #6b7280; text-transform: uppercase; }
.stat-card-value[b-izkuc8uq0t] { font-size: 1.55rem; font-weight: 700; color: #1f2937; }
.stat-value-green[b-izkuc8uq0t] { color: #059669; }
.stat-value-orange[b-izkuc8uq0t] { color: #ea580c; }
.stat-card-footer-text[b-izkuc8uq0t] { font-size: 0.78rem; color: #9ca3af; }

.pago-bars-container[b-izkuc8uq0t] { display: flex; flex-direction: column; gap: 0.85rem; }
.pago-bar-item[b-izkuc8uq0t] { display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto; gap: 0.25rem 0.75rem; }
.pago-bar-track[b-izkuc8uq0t] { grid-column: 1; grid-row: 2; height: 8px; background-color: #f3f4f6; border-radius: 4px; overflow: hidden; }
.pago-bar-fill[b-izkuc8uq0t] { height: 100%; border-radius: 4px; transition: width 0.5s ease; }
.pago-fill-efectivo[b-izkuc8uq0t] { background-color: #1f2937; }
.pago-fill-transferencia[b-izkuc8uq0t] { background-color: #3b82f6; }
.pago-fill-tarjeta[b-izkuc8uq0t] { background-color: #6b7280; }
.pago-fill-saldo-afavor[b-izkuc8uq0t] { background-color: #8b5cf6; }
.pago-bar-amount[b-izkuc8uq0t] { grid-column: 2; grid-row: 1 / 3; align-self: center; text-align: right; font-size: 0.85rem; min-width: 70px; font-weight: 600; color: #1f2937; }
.pago-dot[b-izkuc8uq0t] { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.pago-dot-efectivo[b-izkuc8uq0t] { background-color: #1f2937; }
.pago-dot-transferencia[b-izkuc8uq0t] { background-color: #3b82f6; }
.pago-dot-tarjeta[b-izkuc8uq0t] { background-color: #6b7280; }
.pago-dot-saldo-afavor[b-izkuc8uq0t] { background-color: #8b5cf6; }
.pago-bar-label[b-izkuc8uq0t] { font-size: 0.85rem; color: #4b5563; font-weight: 500; }

.estado-cards-row[b-izkuc8uq0t] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.85rem;
}

.estado-card[b-izkuc8uq0t] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3rem;
    padding: 1.1rem 0.75rem;
    background: #f9fafb;
    border: 1px solid #f3f4f6;
    border-radius: 10px;
}

[b-izkuc8uq0t] .estado-icon { width: 22px; height: 22px; }
[b-izkuc8uq0t] .estado-icon-blue { color: #3b82f6; }
[b-izkuc8uq0t] .estado-icon-purple { color: #8b5cf6; }
[b-izkuc8uq0t] .estado-icon-green { color: #10b981; }
[b-izkuc8uq0t] .estado-icon-orange { color: #f97316; }
[b-izkuc8uq0t] .estado-icon-red { color: #ef4444; }
[b-izkuc8uq0t] .estado-icon-gray { color: #9ca3af; }
.estado-count[b-izkuc8uq0t] { font-size: 1.5rem; font-weight: 700; }
.estado-count-blue[b-izkuc8uq0t] { color: #3b82f6; }
.estado-count-purple[b-izkuc8uq0t] { color: #8b5cf6; }
.estado-count-green[b-izkuc8uq0t] { color: #10b981; }
.estado-count-orange[b-izkuc8uq0t] { color: #f97316; }
.estado-count-red[b-izkuc8uq0t] { color: #ef4444; }
.estado-count-gray[b-izkuc8uq0t] { color: #9ca3af; }

@media (min-width: 768px) {
    .reporte-periodo-header[b-izkuc8uq0t] {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
    }

    .stat-cards-3[b-izkuc8uq0t] {
        grid-template-columns: repeat(3, 1fr);
    }

    .estado-cards-row[b-izkuc8uq0t] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (min-width: 992px) {
    .estado-cards-row[b-izkuc8uq0t] {
        grid-template-columns: repeat(5, 1fr);
    }
}

/* Acciones del periodo de reporte - Responsivo y Fluido */
.reporte-periodo-actions[b-izkuc8uq0t] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    width: 100%;
}

.reporte-periodo-actions[b-izkuc8uq0t]  .dropdown-sede {
    width: 180px !important;
}

.reporte-periodo-actions[b-izkuc8uq0t]  .dropdown-periodo {
    width: 160px !important;
}

.reporte-periodo-actions[b-izkuc8uq0t]  .btn-exportar {
    flex-shrink: 0;
}

@media (max-width: 767px) {
    .reporte-periodo-actions[b-izkuc8uq0t] {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
    }

    .reporte-periodo-actions[b-izkuc8uq0t]  .dropdown-sede,
    .reporte-periodo-actions[b-izkuc8uq0t]  .dropdown-periodo,
    .reporte-periodo-actions[b-izkuc8uq0t]  .btn-exportar {
        width: 100% !important;
    }
}
/* /Pages/Invoices/Components/InvoicesTaxConfigurationTab.razor.rz.scp.css */
.tax-config-tab-content[b-vqh3zyjvcr] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.tax-config-card[b-vqh3zyjvcr] {
    background: #ffffff;
    border: none;
    border-radius: 14px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    padding: 1rem;
}

.tax-config-header[b-vqh3zyjvcr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
}

.tax-config-title[b-vqh3zyjvcr] {
    font-weight: 600;
    color: #111827;
    font-size: 0.95rem;
    margin: 0;
}

.tax-config-subtitle[b-vqh3zyjvcr] {
    color: #6b7280;
    font-size: 0.8rem;
}

.tax-config-grid-wrap[b-vqh3zyjvcr] {
    width: 100%;
}

.tax-icon-badge[b-vqh3zyjvcr] {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #dcfce7;
    color: #047857;
    font-weight: 700;
}

.status-badge[b-vqh3zyjvcr] {
    padding: 0.2rem 0.55rem;
    border-radius: 16px;
    font-size: 0.75rem;
    font-weight: 600;
}

.status-active[b-vqh3zyjvcr] {
    background: #dcfce7;
    color: #047857;
}

.status-inactive[b-vqh3zyjvcr] {
    background: #e5e7eb;
    color: #4b5563;
}

@media (max-width: 992px) {
    .tax-config-header[b-vqh3zyjvcr] {
        flex-direction: column;
        align-items: stretch;
    }
}
/* /Pages/Invoices/Components/TaxRuleFormModal.razor.rz.scp.css */
.tax-rule-subtitle[b-qoqkkfmm6l] {
    display: block;
    font-size: 0.82rem;
    color: #6b7280;
    font-weight: 400;
    line-height: 1.3;
}

.tax-rule-form-content[b-qoqkkfmm6l] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.tax-rule-field[b-qoqkkfmm6l] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.tax-rule-label[b-qoqkkfmm6l] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #374151;
}

.tax-rule-notice[b-qoqkkfmm6l] {
    color: #b45309;
    background: #fffbeb;
    border: 1px solid #fde68a;
    border-radius: 8px;
    padding: 0.4rem 0.55rem;
    font-size: 0.78rem;
}

.tax-rule-preview-card[b-qoqkkfmm6l] {
    border: 1px solid #86efac;
    border-radius: 10px;
    background: #ecfdf5;
    padding: 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}

.tax-rule-preview-title[b-qoqkkfmm6l] {
    color: #059669;
    font-size: 0.84rem;
    font-weight: 700;
}

.tax-rule-preview-text[b-qoqkkfmm6l] {
    color: #1f2937;
    font-size: 0.86rem;
}

.invoice-inline-error[b-qoqkkfmm6l] {
    color: #b91c1c;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 0.45rem 0.6rem;
    font-size: 0.8rem;
}
/* /Pages/Invoices/InvoiceDetail.razor.rz.scp.css */
/* Base Shell Layout & Scrollbar Elimination */
.order-edit-page-shell[b-i367de5fti] {
    overflow-x: hidden !important;
    overscroll-behavior-y: auto !important;
    padding-left: 15px;
    padding-right: 15px;
}

.order-edit-page-shell[b-i367de5fti]  .custom-tab-strip-container {
    padding-bottom: 0 !important;
}

/* Permitir scroll vertical natural en el contenedor de tabs */
.order-edit-page-shell[b-i367de5fti]  .custom-tab-strip--floating,
.order-edit-page-shell[b-i367de5fti]  .custom-tab-strip--floating .k-tabstrip-content,
.order-edit-page-shell[b-i367de5fti]  .custom-tab-strip--floating .k-content,
.order-edit-page-shell[b-i367de5fti]  .tab-content {
    overflow: visible !important;
    overflow-y: visible !important;
    height: auto !important;
}

/* Header Banner Row Styling (Idéntica al de la Orden de Trabajo) */
.order-detail-header-row[b-i367de5fti] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    flex-wrap: wrap;
    gap: 16px;
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px 14px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05), 0 1px 2px 0 rgba(0, 0, 0, 0.03);
    margin-bottom: 20px;
}

.order-header-main-info[b-i367de5fti] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.order-header-title[b-i367de5fti] {
    font-size: 1.65rem;
    font-weight: 800;
    color: #0f172a !important;
    letter-spacing: 1px;
    margin: 0;
}

.order-header-subtitle[b-i367de5fti] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 0.9rem;
    color: #475569;
    line-height: 1.2;
    margin-top: 4px;
}

.subtitle-item[b-i367de5fti] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.subtitle-separator[b-i367de5fti] {
    color: #94a3b8;
}

/* Back Link Button styles */
.order-detail-header-row[b-i367de5fti]  .order-back-link-btn,
.order-detail-header-row[b-i367de5fti]  .order-back-link-btn.k-button {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-color: transparent !important;
    padding: 4px !important;
    color: var(--primary-color, #667eea) !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: none !important;
    transition: opacity 0.2s ease;
}

.order-detail-header-row[b-i367de5fti]  .order-back-link-btn:hover,
.order-detail-header-row[b-i367de5fti]  .order-back-link-btn.k-button:hover {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-color: transparent !important;
    opacity: 0.7 !important;
    box-shadow: none !important;
}

.order-detail-header-row[b-i367de5fti]  .order-back-link-btn:focus,
.order-detail-header-row[b-i367de5fti]  .order-back-link-btn:active,
.order-detail-header-row[b-i367de5fti]  .order-back-link-btn.k-button:focus,
.order-detail-header-row[b-i367de5fti]  .order-back-link-btn.k-button:active {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

.order-detail-header-row[b-i367de5fti]  .order-back-link-btn .k-svg-icon,
.order-detail-header-row[b-i367de5fti]  .order-back-link-btn.k-button .k-svg-icon {
    color: var(--primary-color, #667eea) !important;
}

/* Action Buttons alignment inside header row */
.order-detail-header-actions[b-i367de5fti] {
    display: flex;
    align-items: center;
    gap: 8px;
}

@media (max-width: 768px) {
    .order-detail-header-row[b-i367de5fti] {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    .order-header-main-info[b-i367de5fti] {
        align-items: flex-start !important;
    }

    .order-detail-header-actions[b-i367de5fti] {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 6px !important;
        border-top: 1px solid #e2e8f0;
        padding-top: 12px;
        margin-top: 4px;
        width: 100%;
        box-sizing: border-box !important;
        justify-content: stretch !important;
    }

    .order-detail-header-actions[b-i367de5fti]  .k-button,
    .order-detail-header-actions[b-i367de5fti]  .k-dropdown-button,
    .order-detail-header-actions[b-i367de5fti]  .k-dropdownbutton,
    .order-detail-header-actions[b-i367de5fti]  .btn-outline-primary-arregly {
        width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 7px 6px !important;
        box-sizing: border-box !important;
        justify-content: center !important;
    }

    .order-detail-header-actions[b-i367de5fti]  .k-dropdownbutton > .k-button,
    .order-detail-header-actions[b-i367de5fti]  .k-dropdown-button > .k-button {
        width: 100% !important;
        min-width: 0 !important;
        padding: 7px 6px !important;
        box-sizing: border-box !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 4px !important;
    }

    .order-detail-header-actions[b-i367de5fti]  .k-button > span,
    .order-detail-header-actions[b-i367de5fti]  .k-dropdownbutton button span,
    .order-detail-header-actions[b-i367de5fti]  .k-dropdown-button .k-button-text {
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        font-size: 0.76rem !important;
    }

    .order-detail-header-actions[b-i367de5fti]  .k-svg-icon {
        flex-shrink: 0 !important;
    }

    .order-detail-header-actions > *:last-child:nth-child(odd):not(:only-child)[b-i367de5fti] {
        grid-column: 1 / -1 !important;
    }

    .order-header-title[b-i367de5fti] {
        font-size: 1.4rem !important;
    }
}

@media (max-width: 576px) {
    .order-header-subtitle[b-i367de5fti] {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }
}

/* Order Status Badges matching standard badges */
[b-i367de5fti] .order-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1;
    border: 1px solid transparent;
}

.status-paid[b-i367de5fti] {
    color: #166534 !important;
    background-color: #dcfce7 !important;
    border-color: #86efac !important;
}

.status-partial[b-i367de5fti] {
    color: #92400e !important;
    background-color: #fef3c7 !important;
    border-color: #fcd34d !important;
}

.status-overdue[b-i367de5fti] {
    color: #991b1b !important;
    background-color: #fee2e2 !important;
    border-color: #fca5a5 !important;
}

.status-cancelled[b-i367de5fti] {
    color: #374151 !important;
    background-color: #f3f4f6 !important;
    border-color: #d1d5db !important;
}

.status-default[b-i367de5fti] {
    color: #1d4ed8 !important;
    background-color: #dbeafe !important;
    border-color: #93c5fd !important;
}

/* Card layout structural styles (Idénticos al de los otros módulos) */
.order-section-card[b-i367de5fti],
.order-aside-card[b-i367de5fti] {
    border: none;
    border-radius: 14px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    background-color: #fff;
    overflow: hidden;
}

.order-section-card__header[b-i367de5fti],
.order-aside-card__header[b-i367de5fti] {
    background-color: #fff;
    border-bottom: 1px solid #eef2f7;
    padding: 16px 18px;
}

.order-section-card__body[b-i367de5fti],
.order-aside-card__body[b-i367de5fti] {
    padding: 16px 18px;
    font-size: 14px;
    color: #4b5563;
}

.order-aside-card__body[b-i367de5fti] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.order-aside-data-row[b-i367de5fti] {
    font-size: 1rem;
}

.order-aside-data-label[b-i367de5fti] {
    color: #6b7280;
    margin-right: 12px;
}

.order-aside-card .order-aside-data-value[b-i367de5fti] {
    font-weight: 600 !important;
    color: #111827 !important;
    text-align: right !important;
    letter-spacing: -0.015em !important;
    line-height: 1.25 !important;
}

[b-i367de5fti] .header-icon-dark,
[b-i367de5fti] .header-icon-dark.k-svg-icon {
    color: #111827 !important;
    font-size: 1rem !important;
    vertical-align: middle;
}

/* Conceptos Facturados Table */
.items-table[b-i367de5fti] {
    width: 100%;
    border-collapse: collapse;
}

.items-table th[b-i367de5fti] {
    background-color: #f9fafb;
    color: #374151;
    font-weight: 600;
    font-size: 13px;
    border-bottom: 1px solid #e5e7eb;
}

.items-table td[b-i367de5fti] {
    vertical-align: middle;
    border-bottom: 1px solid #f3f4f6;
}

.quantity-column[b-i367de5fti] {
    width: 80px;
}

.value-column[b-i367de5fti] {
    width: 140px;
}

[b-i367de5fti] .text-success-green,
[b-i367de5fti] .text-success-green.k-svg-icon {
    color: #10b981 !important;
}

/* Totals Card */
.invoice-totals-card[b-i367de5fti] {
    border: none;
    border-radius: 14px;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    background-color: #fff;
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.invoice-totals-card > div[b-i367de5fti] {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
}

.invoice-total-row[b-i367de5fti] {
    border-top: 1px solid #e5e7eb;
    padding-top: 10px;
    font-weight: 700;
}

.invoice-retention-divider[b-i367de5fti] {
    border-top: 1px dashed #d1d5db;
    margin: 4px 0;
}

.invoice-retention-row[b-i367de5fti] {
    display: flex;
    justify-content: space-between;
}

.invoice-retention-row strong[b-i367de5fti] {
    color: #dc2626;
}

.invoice-net-total-row strong[b-i367de5fti] {
    color: #16a34a;
}

/* Quota / Installments Cards */
.quota-card[b-i367de5fti] {
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 12px;
    margin-bottom: 10px;
}

.quota-card.selected[b-i367de5fti] {
    border-color: #6366f1;
    box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.12);
}

.quota-card.blocked[b-i367de5fti] {
    opacity: 0.75;
    background: #f9fafb;
}

.quota-card-header[b-i367de5fti],
.quota-card-footer[b-i367de5fti] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.82rem;
}

.quota-status[b-i367de5fti] {
    color: #6b7280;
    font-size: 0.75rem;
}

.quota-blocked-text[b-i367de5fti] {
    color: #b45309;
    margin-left: 0.3rem;
}

.schedule-item-blocked[b-i367de5fti] {
    color: #9ca3af;
}

.quota-progress-wrap[b-i367de5fti] {
    margin: 8px 0;
    height: 6px;
    background: #f3f4f6;
    border-radius: 4px;
    overflow: hidden;
}

.quota-progress[b-i367de5fti] {
    height: 100%;
    background: #f59e0b;
}

/* Forms layout */
.invoice-form-grid[b-i367de5fti] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 16px;
}

.invoice-info-span-2[b-i367de5fti] {
    grid-column: span 2;
}

.invoice-form-field-ref[b-i367de5fti] {
    grid-column: 2;
}

.invoice-payment-monto-card[b-i367de5fti] {
    grid-row: span 2;
}

.invoice-form-grid label[b-i367de5fti] {
    display: block;
    font-size: 0.8rem;
    color: #4b5563;
    margin-bottom: 4px;
}

.form-help[b-i367de5fti] {
    color: #6b7280;
    font-size: 0.72rem;
}

.invoice-credit-preview-value[b-i367de5fti] {
    min-height: 38px;
    border: 1px dashed #d1d5db;
    border-radius: 8px;
    padding: 8px 12px;
    background: #f9fafb;
    color: #111827;
    font-weight: 600;
    display: flex;
    align-items: center;
}

.invoice-inline-error[b-i367de5fti] {
    color: #b91c1c;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 8px;
    padding: 8px 12px;
    margin-top: 10px;
    font-size: 0.8rem;
}

.invoice-form-actions-row[b-i367de5fti] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    width: 100%;
    margin-top: 16px;
}

.invoice-form-actions[b-i367de5fti] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 0;
}

@media (max-width: 576px) {
    .invoice-form-actions-row[b-i367de5fti] {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
        margin-top: 14px;
    }

    .invoice-form-actions[b-i367de5fti] {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-between !important;
        gap: 8px !important;
        width: 100% !important;
        flex-wrap: nowrap !important;
    }

    .invoice-form-actions[b-i367de5fti]  .btn-arregly,
    .invoice-form-actions[b-i367de5fti]  .k-button {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        width: auto !important;
        margin: 0 !important;
        min-height: 34px !important;
        height: auto !important;
        padding: 8px 10px !important;
        font-size: 0.82rem !important;
        font-weight: 600 !important;
        border-radius: 12px !important;
        justify-content: center !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 6px !important;
        white-space: nowrap !important;
        text-align: center !important;
    }

    .invoice-form-actions[b-i367de5fti]  .k-button .k-button-text,
    .invoice-form-actions[b-i367de5fti]  .btn-arregly span {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .btn-close-credit-form-simple[b-i367de5fti] {
        display: none !important;
    }
}

/* History Events */
.invoice-history-wrapper[b-i367de5fti] {
    min-height: 120px;
}

.invoice-timeline-list[b-i367de5fti] {
    display: flex;
    flex-direction: column;
}

.invoice-timeline-item[b-i367de5fti] {
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: 12px;
    position: relative;
    padding-bottom: 20px;
}

.invoice-timeline-item[b-i367de5fti]::after {
    content: "";
    position: absolute;
    left: 17px;
    top: 36px;
    bottom: -2px;
    width: 1px;
    background: #dbe3ee;
}

.invoice-timeline-item:last-child[b-i367de5fti] {
    padding-bottom: 0;
}

.invoice-timeline-item:last-child[b-i367de5fti]::after {
    display: none;
}

.invoice-timeline-dot[b-i367de5fti] {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
}

.invoice-timeline-card[b-i367de5fti] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
    padding: 14px 16px;
}

.invoice-timeline-head[b-i367de5fti] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 2px;
}

.history-icon-payment[b-i367de5fti] {
    background: #dcfce7;
    color: #15803d;
}

.history-icon-creditnote[b-i367de5fti] {
    background: #fef3c7;
    color: #b45309;
}

.history-icon-refund[b-i367de5fti] {
    background: #fee2e2;
    color: #b91c1c;
}

.history-icon-warranty[b-i367de5fti] {
    background: #e0f2fe;
    color: #0369a1;
}

.history-icon-customercredit[b-i367de5fti] {
    background: #ede9fe;
    color: #6d28d9;
}

.history-icon-default[b-i367de5fti] {
    background: #f3f4f6;
    color: #4b5563;
}

.history-event-title[b-i367de5fti] {
    font-size: 0.92rem;
    font-weight: 700;
    color: #111827;
}

.history-sub[b-i367de5fti] {
    font-size: 0.75rem;
    color: #6b7280;
}

.history-description[b-i367de5fti] {
    font-size: 0.82rem;
    color: #4b5563;
    line-height: 1.25;
}

.history-app-method[b-i367de5fti] {
    margin-top: 4px;
    font-size: 0.78rem;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.history-app-method-badge[b-i367de5fti] {
    background: #f3f4f6;
    color: #1f2937;
    border: 1px solid #d1d5db;
    border-radius: 999px;
    padding: 2px 10px;
    font-size: 0.75rem;
    font-weight: 600;
}

.history-sub-ref[b-i367de5fti] {
    font-size: 0.74rem;
    color: #9ca3af;
}

.history-status-badge[b-i367de5fti] {
    padding: 2px 10px;
    font-size: 0.7rem;
    font-weight: 600;
    border-radius: 999px;
    display: inline-block;
}

.history-badge-success[b-i367de5fti] {
    background-color: #dcfce7;
    color: #166534;
}

.history-badge-danger[b-i367de5fti] {
    background-color: #fee2e2;
    color: #991b1b;
}

.history-badge-warning[b-i367de5fti] {
    background-color: #fef3c7;
    color: #92400e;
}

.history-badge-info[b-i367de5fti] {
    background-color: #e0f2fe;
    color: #075985;
}

.history-badge-default[b-i367de5fti] {
    background-color: #f3f4f6;
    color: #374151;
}

.history-amount[b-i367de5fti] {
    font-weight: 700;
    font-size: 0.95rem;
    align-self: flex-start;
}

.history-amount-payment[b-i367de5fti] {
    color: #16a34a;
}

.history-amount-creditnote[b-i367de5fti] {
    color: #d97706;
}

.history-amount-refund[b-i367de5fti] {
    color: #dc2626;
}

.history-amount-customercredit[b-i367de5fti] {
    color: #2563eb;
}

.history-amount-default[b-i367de5fti] {
    color: #4b5563;
}

@media (max-width: 768px) {
    .invoice-timeline-head[b-i367de5fti] {
        flex-direction: column;
        gap: 6px;
    }

    .history-amount[b-i367de5fti] {
        align-self: flex-start;
    }
}

@media (max-width: 768px) {
    .invoice-info-grid[b-i367de5fti],
    .invoice-form-grid[b-i367de5fti] {
        grid-template-columns: 1fr;
    }
    .invoice-info-span-2[b-i367de5fti] {
        grid-column: span 1;
    }
    .invoice-form-field-ref[b-i367de5fti] {
        grid-column: auto;
    }
    .invoice-payment-monto-card[b-i367de5fti] {
        grid-row: auto;
    }
}

/* Premium Credit Application Styles */
.btn-close-credit-form-simple[b-i367de5fti] {
    background: transparent !important;
    border: none !important;
    padding: 8px !important;
    box-shadow: none !important;
    outline: none !important;
    cursor: pointer !important;
    color: #4b5563 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.2s ease !important;
}

.btn-close-credit-form-simple:hover[b-i367de5fti] {
    color: var(--primary-color) !important;
    transform: translateY(-2px);
}

.btn-close-credit-form-simple svg[b-i367de5fti],
.btn-close-credit-form-simple .k-svg-icon[b-i367de5fti] {
    width: 20px !important;
    height: 20px !important;
}

.invoice-credit-form-container[b-i367de5fti] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 18px;
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.015), 0 4px 20px rgba(0, 0, 0, 0.02);
}

.invoice-form-field-card[b-i367de5fti] {
    background: #ffffff;
    border: 1px solid #edf2f7;
    border-radius: 8px;
    padding: 10px 14px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.01);
}

.invoice-form-field-label[b-i367de5fti] {
    display: block;
    font-size: 0.72rem !important;
    font-weight: 600 !important;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #718096 !important;
    margin-bottom: 4px !important;
}

.invoice-credit-preview-value[b-i367de5fti] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #2d3748;
    border: none !important;
    padding: 0 !important;
    min-height: auto !important;
    background: transparent !important;
}

.btn-xs-arregly[b-i367de5fti] {
    padding: 0.2rem 0.5rem !important;
    font-size: 0.75rem !important;
    min-height: auto !important;
    border-radius: 6px !important;
    gap: 0.25rem !important;
}

/* Refinance Preview Styles */
.refinance-preview-container[b-i367de5fti] {
    border: 1px solid #e6eef8;
    border-radius: 12px;
    background: #f8fbff;
    padding: 12px;
}

.refinance-summary-row[b-i367de5fti] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.refinance-summary-item[b-i367de5fti] {
    border-radius: 10px;
    padding: 8px 10px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.refinance-summary-item--current[b-i367de5fti] {
    background: #fff5f5;
    border: 1px solid #ffd7d7;
}

.refinance-summary-item--new[b-i367de5fti] {
    background: #f2fff7;
    border: 1px solid #c8f0d8;
}

.refinance-summary-label[b-i367de5fti] {
    font-size: 0.75rem;
    color: #5d728e;
    font-weight: 600;
}

.refinance-summary-value[b-i367de5fti] {
    font-size: 0.9rem;
    color: #253f63;
    font-weight: 700;
}

.refinance-preview-table th[b-i367de5fti] {
    padding: 12px !important;
    background-color: #f8fafc !important;
    color: #475569 !important;
    font-weight: 600 !important;
    font-size: 0.8rem !important;
    border-bottom: 1px solid #e2e8f0 !important;
}

.refinance-preview-table td[b-i367de5fti] {
    padding: 12px !important;
    vertical-align: middle !important;
    font-size: 0.85rem !important;
    line-height: 1.5 !important;
    border-bottom: 1px solid #f1f5f9 !important;
    color: #334f74;
}

.refinance-old-installment[b-i367de5fti] {
    color: #ef4444 !important;
    text-decoration: line-through !important;
    font-weight: 500 !important;
}

.refinance-new-installment[b-i367de5fti] {
    color: #10b981 !important;
    font-weight: 600 !important;
}

@media (max-width: 768px) {
    .refinance-summary-row[b-i367de5fti] {
        grid-template-columns: 1fr;
    }
}

.form-group-arregly[b-i367de5fti] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

/* Homologación estricta de TelerikDropDownButton con los botones hermanos 1 y 2 */
.order-detail-header-actions[b-i367de5fti]  .k-dropdown-button,
.order-detail-header-actions[b-i367de5fti]  .k-menu-button,
.order-detail-header-actions[b-i367de5fti]  .btn-outline-primary-arregly {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
    border: 1px solid var(--primary-color) !important;
    border-radius: 20px !important;
    color: var(--primary-color) !important;
    padding: 8px 16px !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    transition: all 0.2s ease-in-out !important;
}

.order-detail-header-actions[b-i367de5fti]  .k-dropdown-button .k-button-text,
.order-detail-header-actions[b-i367de5fti]  .k-dropdown-button .k-svg-icon,
.order-detail-header-actions[b-i367de5fti]  .k-dropdown-button .k-icon,
.order-detail-header-actions[b-i367de5fti]  .btn-outline-primary-arregly .k-button-text,
.order-detail-header-actions[b-i367de5fti]  .btn-outline-primary-arregly .k-svg-icon,
.order-detail-header-actions[b-i367de5fti]  .btn-outline-primary-arregly .k-icon {
    color: var(--primary-color) !important;
    fill: var(--primary-color) !important;
}

/* Hover State - Réplica exacta de botones 1 y 2 */
.order-detail-header-actions[b-i367de5fti]  .k-dropdown-button:hover,
.order-detail-header-actions[b-i367de5fti]  .k-menu-button:hover,
.order-detail-header-actions[b-i367de5fti]  .btn-outline-primary-arregly:hover,
.order-detail-header-actions[b-i367de5fti]  .btn-outline-primary-arregly.k-focus,
.order-detail-header-actions[b-i367de5fti]  .btn-outline-primary-arregly.k-active {
    background: var(--primary-color) !important;
    background-color: var(--primary-color) !important;
    background-image: none !important;
    border-color: var(--primary-color) !important;
    color: #ffffff !important;
}

.order-detail-header-actions[b-i367de5fti]  .k-dropdown-button:hover *,
.order-detail-header-actions[b-i367de5fti]  .k-menu-button:hover *,
.order-detail-header-actions[b-i367de5fti]  .btn-outline-primary-arregly:hover *,
.order-detail-header-actions[b-i367de5fti]  .btn-outline-primary-arregly:hover .k-button-text,
.order-detail-header-actions[b-i367de5fti]  .btn-outline-primary-arregly:hover .k-svg-icon,
.order-detail-header-actions[b-i367de5fti]  .btn-outline-primary-arregly:hover .k-icon,
.order-detail-header-actions[b-i367de5fti]  .btn-outline-primary-arregly:hover i,
.order-detail-header-actions[b-i367de5fti]  .btn-outline-primary-arregly:hover svg {
    color: #ffffff !important;
    fill: #ffffff !important;
}

/* Lista integrada de conceptos facturados en móvil (sin padding contenedor redundante) */
.billed-items-mobile-container[b-i367de5fti] {
    padding: 0 !important;
    display: flex;
    flex-direction: column;
    gap: 0;
    background-color: transparent;
    border-radius: 0 0 14px 14px;
    overflow: hidden;
}

.billed-item-mobile-row[b-i367de5fti] {
    padding: 12px 14px;
    border-bottom: 1px solid #f1f5f9;
    background-color: #ffffff;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
}

.billed-item-mobile-row:last-child[b-i367de5fti] {
    border-bottom: none;
}
/* /Pages/Invoices/Invoices.razor.rz.scp.css */
[b-5jo7xrh43u] .btn-new-order {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 28px;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 12px;
    color: var(--primary-text-color);
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s ease;
    backdrop-filter: blur(10px);
    text-decoration: none;
}

[b-5jo7xrh43u] .btn-new-order:hover {
    background: rgba(255, 255, 255, 0.25);
    border-color: rgba(255, 255, 255, 0.3);
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15);
    color: var(--primary-text-color);
}

[b-5jo7xrh43u] .btn-new-order:active {
    transform: translateY(0);
}

.placeholder-tab-content[b-5jo7xrh43u] {
    min-height: 180px;
    background: #ffffff;
    border-radius: 14px;
    border: none;
    padding: 1.25rem;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.placeholder-text[b-5jo7xrh43u] {
    color: #6b7280;
    font-size: 0.95rem;
    font-weight: 500;
}

[b-5jo7xrh43u] .custom-base-grid tbody tr > td:first-child {
    padding: 0 !important;
    cursor: pointer !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
}

[b-5jo7xrh43u] .custom-base-grid tbody tr > td:first-child:hover {
    background-color: rgba(99, 102, 241, 0.12) !important;
}

[b-5jo7xrh43u] .custom-base-grid tbody tr > td:first-child:hover .badge-theme-theme {
    background-color: rgba(99, 102, 241, 0.25) !important;
    color: #4f46e5 !important;
    text-decoration: underline solid !important;
}
/* /Pages/Legal/CookiesPolicy.razor.rz.scp.css */
/* ==========================================================================
   Aurocore — Política de Cookies: Pro Legal Layout & Liquid Glass
   ========================================================================== */

.cookies-policy-page[b-q6i4n53qma] {
    --glass-bg: rgba(255, 255, 255, 0.88);
    --glass-border: rgba(226, 232, 240, 0.85);
    --glass-specular: inset 0 1px 1.5px 0 rgba(255, 255, 255, 0.9), inset 0 -1px 2px 0 rgba(0, 0, 0, 0.03);
    --glass-shadow: 0 12px 36px -8px rgba(9, 61, 147, 0.08);
    --glass-shadow-hover: 0 20px 45px -8px rgba(9, 61, 147, 0.14);

    --brand-blue: #093d93;
    --brand-blue-light: #1a5bc4;
    --brand-orange: #ed7024;
    --brand-orange-light: #fd8c1d;

    --slate-900: #09224f;
    --slate-800: #13376b;
    --slate-700: #1e3a5f;
    --slate-600: #2c4d75;
    --slate-500: #476487;
    --slate-200: #e2e8f0;
    --slate-100: #f1f5f9;
    --slate-50: #f8fafc;

    --emerald: #10b981;
    --purple: #8b5cf6;

    --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);

    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: #f8fafc;
    color: var(--text-heading-primary, #09224f);
    font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

.cookies-main[b-q6i4n53qma] { flex: 1 0 auto; width: 100%; }

.cookies-container[b-q6i4n53qma] {
    width: 100%;
    max-width: 1260px;
    margin: 0 auto;
    padding: 0 clamp(1rem, 3vw, 2rem);
}

/* ==========================================================================
   Hero Section
   ========================================================================== */
.cookies-hero[b-q6i4n53qma] {
    position: relative;
    padding: clamp(5.5rem, 8vw, 7.5rem) 0 clamp(1.5rem, 3vw, 2.5rem);
    background-color: #f8fafc;
    overflow: hidden;
}

.hero-ambient-mesh[b-q6i4n53qma] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

.mesh-orb[b-q6i4n53qma] {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.6;
    will-change: transform;
}

.orb-orange[b-q6i4n53qma] {
    top: -15%;
    left: 10%;
    width: clamp(300px, 40vw, 550px);
    height: clamp(300px, 40vw, 550px);
    background: radial-gradient(circle, rgba(237, 112, 36, 0.14) 0%, transparent 70%);
}

.orb-blue[b-q6i4n53qma] {
    bottom: -15%;
    right: 10%;
    width: clamp(250px, 35vw, 500px);
    height: clamp(250px, 35vw, 500px);
    background: radial-gradient(circle, rgba(9, 61, 147, 0.12) 0%, transparent 70%);
}

.hero-grid-pattern[b-q6i4n53qma] {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(9, 61, 147, 0.04) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
    z-index: 0;
}

.hero-header[b-q6i4n53qma] {
    position: relative;
    z-index: 1;
    max-width: 820px;
    margin: 0 auto;
}

.hero-badge[b-q6i4n53qma] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 1.1rem;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 16px -4px rgba(9, 61, 147, 0.08);
    backdrop-filter: blur(16px);
    font-size: 0.82rem;
    font-weight: 500;
    color: #475569;
    margin-bottom: 1.5rem;
}

.badge-dot-orange[b-q6i4n53qma] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #ed7024;
    box-shadow: 0 0 6px rgba(237, 112, 36, 0.35);
}

.badge-separator[b-q6i4n53qma] { color: #cbd5e1; font-weight: 300; }
.badge-subtext[b-q6i4n53qma] { color: #ed7024; font-weight: 600; }

.hero-title[b-q6i4n53qma] {
    font-size: clamp(2.2rem, 5vw, 3.5rem);
    font-weight: 800;
    line-height: 1.15;
    color: #0f172a;
    margin: 0 0 1.25rem;
    letter-spacing: -0.02em;
}

.highlight-orange[b-q6i4n53qma] {
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.hero-lead[b-q6i4n53qma] {
    font-size: clamp(1rem, 2vw, 1.18rem);
    color: #475569;
    line-height: 1.65;
    margin: 0 0 1.5rem;
}

.policy-meta[b-q6i4n53qma] {
    display: flex;
    justify-content: center;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.meta-tag[b-q6i4n53qma] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.85rem;
    color: #64748b;
    font-weight: 500;
}

/* ==========================================================================
   2-Column Layout Grid & Sticky Table of Contents
   ========================================================================== */
.cookies-content-section[b-q6i4n53qma] {
    position: relative;
    padding-bottom: 5rem;
}

.policy-layout-grid[b-q6i4n53qma] {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 2.5rem;
    align-items: start;
}

/* Sticky Sidebar */
.policy-sidebar[b-q6i4n53qma] {
    position: sticky;
    top: 90px;
    z-index: 10;
}

.toc-sticky-card[b-q6i4n53qma] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    padding: 1.5rem 1.25rem;
    box-shadow: 0 10px 30px -6px rgba(9, 61, 147, 0.05);
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    max-height: calc(100vh - 120px);
    overflow-y: auto;
}

.toc-header[b-q6i4n53qma] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #093d93;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #f1f5f9;
}

.toc-nav[b-q6i4n53qma] {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.toc-link[b-q6i4n53qma] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.5rem 0.75rem;
    border-radius: 10px;
    color: #475569;
    font-size: 0.85rem;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.2s ease;
    line-height: 1.3;
    background: transparent;
    border: none;
    border-left: 3px solid transparent;
    cursor: pointer;
    font-family: inherit;
    text-align: left;
    width: 100%;
}

.toc-link:hover[b-q6i4n53qma] {
    color: #093d93;
    background: #f0f7ff;
    padding-left: 0.85rem;
}

.toc-link.active[b-q6i4n53qma] {
    color: #093d93;
    background: #e0f2fe;
    border-left-color: #093d93;
    font-weight: 700;
    padding-left: 0.85rem;
}

.toc-num[b-q6i4n53qma] {
    font-family: 'Fira Code', monospace;
    font-size: 0.72rem;
    font-weight: 700;
    color: #94a3b8;
}

.toc-link.active .toc-num[b-q6i4n53qma] {
    color: #093d93;
    font-weight: 800;
}

.toc-action-box[b-q6i4n53qma] {
    background: linear-gradient(135deg, rgba(9, 61, 147, 0.04), rgba(237, 112, 36, 0.04));
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.toc-action-title[b-q6i4n53qma] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.85rem;
    font-weight: 700;
    color: #0f172a;
}

.toc-action-box p[b-q6i4n53qma] {
    font-size: 0.78rem;
    color: #64748b;
    margin: 0 0 0.5rem;
    line-height: 1.4;
}

.btn-toc-manage[b-q6i4n53qma] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.55rem 0.9rem;
    border-radius: 10px;
    background: #093d93;
    color: white;
    font-size: 0.82rem;
    font-weight: 600;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: inherit;
    width: 100%;
}

.btn-toc-manage:hover[b-q6i4n53qma] {
    background: #1a5bc4;
    transform: translateY(-1px);
}

/* Mobile Quick Jump Bar */
.mobile-toc-bar[b-q6i4n53qma] {
    display: none;
    margin-bottom: 1.5rem;
    padding: 0.85rem 1rem;
    border-radius: 14px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 14px -4px rgba(9, 61, 147, 0.05);
}

.mobile-toc-label[b-q6i4n53qma] {
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #64748b;
    margin-bottom: 0.5rem;
    display: block;
}

.mobile-toc-scroll[b-q6i4n53qma] {
    display: flex;
    gap: 0.5rem;
    overflow-x: auto;
    padding-bottom: 0.25rem;
    scrollbar-width: thin;
}

.mobile-toc-chip[b-q6i4n53qma] {
    flex-shrink: 0;
    padding: 0.4rem 0.85rem;
    border-radius: 100px;
    background: #f1f5f9;
    color: #334155;
    font-size: 0.8rem;
    font-weight: 500;
    white-space: nowrap;
    border: 1px solid #e2e8f0;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.2s ease;
}

.mobile-toc-chip:hover[b-q6i4n53qma] {
    background: #e0f2fe;
    color: #093d93;
    border-color: #bfdbfe;
}

.mobile-toc-chip.active[b-q6i4n53qma] {
    background: #093d93;
    color: #ffffff;
    border-color: #093d93;
    font-weight: 700;
}

/* ==========================================================================
   Quick Settings Banner
   ========================================================================== */
.quick-settings-banner[b-q6i4n53qma] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    padding: 1.25rem 1.75rem;
    margin-bottom: 2rem;
    border-radius: 20px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 10px 30px -6px rgba(9, 61, 147, 0.06);
}

.settings-banner-left[b-q6i4n53qma] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    flex: 1;
}

.settings-banner-icon[b-q6i4n53qma] {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background: rgba(9, 61, 147, 0.08);
    color: #093d93;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    flex-shrink: 0;
}

.settings-banner-text[b-q6i4n53qma] {
    flex: 1;
}

.settings-banner-text h3[b-q6i4n53qma] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 0.2rem;
}

.settings-banner-text p[b-q6i4n53qma] {
    font-size: 0.85rem;
    color: #64748b;
    margin: 0;
    line-height: 1.45;
}

.btn-manage-cookies[b-q6i4n53qma] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 1.4rem;
    border-radius: 12px;
    background: linear-gradient(135deg, #093d93 0%, #1a5bc4 100%);
    color: white;
    font-size: 0.88rem;
    font-weight: 600;
    border: none;
    cursor: pointer;
    box-shadow: 0 4px 14px -2px rgba(9, 61, 147, 0.3);
    transition: all 0.3s var(--ease-spring);
    font-family: inherit;
    white-space: nowrap;
    flex-shrink: 0;
}

.btn-manage-cookies:hover[b-q6i4n53qma] {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px -2px rgba(9, 61, 147, 0.4);
}

/* ==========================================================================
   Document Article Content
   ========================================================================== */
.policy-document[b-q6i4n53qma] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 24px;
    box-shadow: 0 12px 40px -8px rgba(9, 61, 147, 0.06);
    padding: clamp(2rem, 5vw, 3.5rem);
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.policy-section[b-q6i4n53qma] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    border-bottom: 1px solid #f1f5f9;
    padding-bottom: 2.25rem;
    scroll-margin-top: 100px;
}

.policy-section:last-of-type[b-q6i4n53qma] {
    border-bottom: none;
    padding-bottom: 0;
}

.section-title-wrap[b-q6i4n53qma] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.sec-badge[b-q6i4n53qma] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: rgba(9, 61, 147, 0.08);
    color: #093d93;
    font-family: 'Fira Code', monospace;
    font-size: 0.85rem;
    font-weight: 700;
    flex-shrink: 0;
}

.policy-section h2[b-q6i4n53qma] {
    font-size: clamp(1.25rem, 2.5vw, 1.6rem);
    font-weight: 700;
    color: #0f172a;
    margin: 0;
    letter-spacing: -0.01em;
}

.policy-section p[b-q6i4n53qma] {
    font-size: 0.96rem;
    color: #475569;
    line-height: 1.75;
    margin: 0;
}

.policy-list[b-q6i4n53qma] {
    list-style: none;
    padding: 0;
    margin: 0.5rem 0;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.policy-list li[b-q6i4n53qma] {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    font-size: 0.94rem;
    color: #334155;
    line-height: 1.6;
}

.policy-list li span.k-icon[b-q6i4n53qma],
.policy-list li span.k-svg-icon[b-q6i4n53qma] {
    color: #10b981;
    font-size: 1rem;
    margin-top: 0.2rem;
    flex-shrink: 0;
}

/* Callouts */
.policy-callout[b-q6i4n53qma] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-radius: 12px;
    background: #f8fafc;
    border-left: 4px solid #093d93;
    font-size: 0.9rem;
    color: #334155;
    margin-top: 0.5rem;
}

.policy-callout.warning[b-q6i4n53qma] {
    background: #fffbeb;
    border-left-color: #f59e0b;
    color: #92400e;
}

/* ==========================================================================
   Category Bento Grid
   ========================================================================== */
.cookie-category-grid[b-q6i4n53qma] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 1.25rem;
    margin-top: 0.5rem;
}

.cookie-category-card[b-q6i4n53qma] {
    border-radius: 18px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    padding: 1.4rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    transition: all 0.25s ease;
}

.cookie-category-card:hover[b-q6i4n53qma] {
    background: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px -4px rgba(9, 61, 147, 0.08);
}

.cat-header[b-q6i4n53qma] {
    display: flex;
    align-items: center;
    gap: 0.85rem;
}

.cat-icon-pill[b-q6i4n53qma] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    flex-shrink: 0;
    background: #f1f5f9;
    color: #093d93;
}

.cat-title-row[b-q6i4n53qma] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.cat-title-row h3[b-q6i4n53qma] {
    font-size: 1.02rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
}

.cat-subtitle[b-q6i4n53qma] {
    font-size: 0.75rem;
    color: #64748b;
    font-weight: 500;
}

.cat-badge[b-q6i4n53qma] {
    font-size: 0.65rem;
    font-weight: 700;
    padding: 0.15rem 0.5rem;
    border-radius: 100px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.cat-badge.necessary[b-q6i4n53qma] {
    background: #e0f2fe;
    color: #0369a1;
}

.cat-badge.optional[b-q6i4n53qma] {
    background: #f1f5f9;
    color: #64748b;
    border: 1px solid #e2e8f0;
}

/* ==========================================================================
   Technical Inventory Table
   ========================================================================== */
.table-responsive[b-q6i4n53qma] {
    width: 100%;
    overflow-x: auto;
    border-radius: 14px;
    border: 1px solid #e2e8f0;
    margin: 0.75rem 0;
}

.cookie-inventory-table[b-q6i4n53qma] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.88rem;
    text-align: left;
}

.cookie-inventory-table th[b-q6i4n53qma] {
    background: #f8fafc;
    padding: 0.85rem 1.1rem;
    font-weight: 600;
    color: #1e293b;
    border-bottom: 1px solid #e2e8f0;
    white-space: nowrap;
}

.cookie-inventory-table td[b-q6i4n53qma] {
    padding: 0.85rem 1.1rem;
    border-bottom: 1px solid #f1f5f9;
    color: #475569;
    line-height: 1.5;
}

.cookie-inventory-table tr:hover td[b-q6i4n53qma] {
    background: #f8fafc;
}

.cookie-inventory-table tr:last-child td[b-q6i4n53qma] {
    border-bottom: none;
}

.cookie-inventory-table code[b-q6i4n53qma] {
    font-family: 'Fira Code', monospace;
    font-size: 0.82rem;
    background: #f1f5f9;
    padding: 0.2rem 0.5rem;
    border-radius: 6px;
    color: #093d93;
    font-weight: 600;
}

.badge-type[b-q6i4n53qma] {
    display: inline-block;
    padding: 0.15rem 0.5rem;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: 600;
}

.badge-type.nec[b-q6i4n53qma] { background: #e0f2fe; color: #0369a1; }
.badge-type.pref[b-q6i4n53qma] { background: #ffedd5; color: #c2410c; }
.badge-type.ana[b-q6i4n53qma] { background: #dcfce7; color: #15803d; }

/* ==========================================================================
   Browser Guide Cards
   ========================================================================== */
.browser-guide-grid[b-q6i4n53qma] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin: 0.5rem 0;
}

.browser-guide-card[b-q6i4n53qma] {
    padding: 1rem 1.2rem;
    border-radius: 12px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.browser-guide-card strong[b-q6i4n53qma] {
    font-size: 0.92rem;
    color: #0f172a;
}

.browser-guide-card span[b-q6i4n53qma] {
    font-size: 0.8rem;
    color: #64748b;
    line-height: 1.4;
}

/* ==========================================================================
   Contact Box & Closing
   ========================================================================== */
.contact-box[b-q6i4n53qma] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1.25rem;
    margin-top: 1rem;
}

.contact-item[b-q6i4n53qma] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem;
    border-radius: 14px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}

.contact-item span.k-icon[b-q6i4n53qma],
.contact-item span.k-svg-icon[b-q6i4n53qma] {
    font-size: 1.4rem;
    color: #ed7024;
}

.contact-item div[b-q6i4n53qma] {
    display: flex;
    flex-direction: column;
    font-size: 0.88rem;
    line-height: 1.4;
}

.contact-item strong[b-q6i4n53qma] {
    color: #0f172a;
}

.contact-item span[b-q6i4n53qma] {
    color: #64748b;
}

.policy-closing[b-q6i4n53qma] {
    background: linear-gradient(135deg, rgba(9, 61, 147, 0.04), rgba(237, 112, 36, 0.04));
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 2rem;
    margin-top: 1rem;
}

.policy-closing h3[b-q6i4n53qma] {
    font-size: 1.2rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 0.75rem;
}

.policy-closing p[b-q6i4n53qma] {
    font-size: 0.94rem;
    color: #475569;
    line-height: 1.7;
    margin: 0 0 1rem;
}

.closing-brand[b-q6i4n53qma] {
    font-size: 0.88rem !important;
    color: #64748b !important;
    border-top: 1px solid #e2e8f0;
    padding-top: 1rem;
    margin-bottom: 0 !important;
}

/* ==========================================================================
   Responsive Breakpoints
   ========================================================================== */
@media (max-width: 1024px) {
    .policy-layout-grid[b-q6i4n53qma] {
        grid-template-columns: 1fr;
    }

    .policy-sidebar[b-q6i4n53qma] {
        display: none;
    }

    .mobile-toc-bar[b-q6i4n53qma] {
        display: block;
    }
}

@media (max-width: 768px) {
    .policy-document[b-q6i4n53qma] {
        padding: 1.5rem;
    }

    .quick-settings-banner[b-q6i4n53qma] {
        padding: 1.25rem;
        flex-direction: column;
        align-items: flex-start;
    }

    .btn-manage-cookies[b-q6i4n53qma] {
        width: 100%;
        justify-content: center;
    }

    .cookie-category-grid[b-q6i4n53qma] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Legal/SecurityTrust.razor.rz.scp.css */
/* ==========================================================================
   Aurocore — Centro de Seguridad & Confianza: Pro Layout & Bento Grid
   ========================================================================== */

.security-page[b-4a9yhajij9] {
    --glass-bg: rgba(255, 255, 255, 0.88);
    --glass-border: rgba(226, 232, 240, 0.85);
    --glass-specular: inset 0 1px 1.5px 0 rgba(255, 255, 255, 0.9), inset 0 -1px 2px 0 rgba(0, 0, 0, 0.03);
    --glass-shadow: 0 12px 36px -8px rgba(9, 61, 147, 0.08);

    --brand-blue: #093d93;
    --brand-blue-light: #1a5bc4;
    --brand-orange: #ed7024;
    --brand-orange-light: #fd8c1d;

    --slate-900: #09224f;
    --slate-800: #13376b;
    --slate-700: #1e3a5f;
    --slate-600: #2c4d75;
    --slate-500: #476487;
    --slate-200: #e2e8f0;
    --slate-100: #f1f5f9;
    --slate-50: #f8fafc;

    --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);

    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: #f8fafc;
    color: var(--text-heading-primary, #09224f);
    font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

.security-main[b-4a9yhajij9] { flex: 1 0 auto; width: 100%; }

.security-container[b-4a9yhajij9] {
    width: 100%;
    max-width: 1260px;
    margin: 0 auto;
    padding: 0 clamp(1rem, 3vw, 2rem);
}

/* ==========================================================================
   Hero Section
   ========================================================================== */
.security-hero[b-4a9yhajij9] {
    position: relative;
    padding: clamp(5.5rem, 8vw, 7.5rem) 0 clamp(1.5rem, 3vw, 2.5rem);
    background-color: #f8fafc;
    overflow: hidden;
}

.hero-ambient-mesh[b-4a9yhajij9] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

.mesh-orb[b-4a9yhajij9] {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.6;
    will-change: transform;
}

.orb-orange[b-4a9yhajij9] {
    top: -15%;
    left: 10%;
    width: clamp(300px, 40vw, 550px);
    height: clamp(300px, 40vw, 550px);
    background: radial-gradient(circle, rgba(237, 112, 36, 0.14) 0%, transparent 70%);
}

.orb-blue[b-4a9yhajij9] {
    bottom: -15%;
    right: 10%;
    width: clamp(250px, 35vw, 500px);
    height: clamp(250px, 35vw, 500px);
    background: radial-gradient(circle, rgba(9, 61, 147, 0.12) 0%, transparent 70%);
}

.hero-grid-pattern[b-4a9yhajij9] {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(9, 61, 147, 0.04) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
    z-index: 0;
}

.hero-header[b-4a9yhajij9] {
    position: relative;
    z-index: 1;
    max-width: 820px;
    margin: 0 auto;
}

.hero-badge[b-4a9yhajij9] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 1.1rem;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 16px -4px rgba(9, 61, 147, 0.08);
    backdrop-filter: blur(16px);
    font-size: 0.82rem;
    font-weight: 500;
    color: #475569;
    margin-bottom: 1.25rem;
}

.badge-dot-orange[b-4a9yhajij9] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #ed7024;
    box-shadow: 0 0 6px rgba(237, 112, 36, 0.35);
}

.badge-separator[b-4a9yhajij9] { color: #cbd5e1; font-weight: 300; }
.badge-subtext[b-4a9yhajij9] { color: #ed7024; font-weight: 600; }

.hero-title[b-4a9yhajij9] {
    font-size: clamp(2.2rem, 5vw, 3.5rem);
    font-weight: 800;
    line-height: 1.15;
    color: #0f172a;
    margin: 0 0 1.25rem;
    letter-spacing: -0.02em;
}

.highlight-orange[b-4a9yhajij9] {
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.hero-lead[b-4a9yhajij9] {
    font-size: clamp(1rem, 2vw, 1.18rem);
    color: #475569;
    line-height: 1.65;
    margin: 0 0 1.5rem;
}

.policy-meta[b-4a9yhajij9] {
    display: flex;
    justify-content: center;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.meta-tag[b-4a9yhajij9] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.85rem;
    color: #64748b;
    font-weight: 500;
}

/* ==========================================================================
   2-Column Layout Grid & Sticky Table of Contents
   ========================================================================== */
.security-content-section[b-4a9yhajij9] {
    position: relative;
    padding-bottom: 5rem;
}

.security-layout-grid[b-4a9yhajij9] {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 2.5rem;
    align-items: start;
}

/* Sticky Sidebar */
.security-sidebar[b-4a9yhajij9] {
    position: sticky;
    top: 90px;
    z-index: 10;
}

.toc-sticky-card[b-4a9yhajij9] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    padding: 1.5rem 1.25rem;
    box-shadow: 0 10px 30px -6px rgba(9, 61, 147, 0.05);
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    max-height: calc(100vh - 120px);
    overflow-y: auto;
}

.toc-header[b-4a9yhajij9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #093d93;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #f1f5f9;
}

.toc-nav[b-4a9yhajij9] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.toc-link[b-4a9yhajij9] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.45rem 0.65rem;
    border-radius: 8px;
    color: #475569;
    font-size: 0.83rem;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.2s ease;
    line-height: 1.3;
    background: transparent;
    border: none;
    border-left: 3px solid transparent;
    cursor: pointer;
    font-family: inherit;
    text-align: left;
    width: 100%;
}

.toc-link:hover[b-4a9yhajij9] {
    color: #093d93;
    background: #f0f7ff;
    padding-left: 0.85rem;
}

.toc-link.active[b-4a9yhajij9] {
    color: #093d93;
    background: #e0f2fe;
    border-left-color: #093d93;
    font-weight: 700;
    padding-left: 0.85rem;
}

.toc-num[b-4a9yhajij9] {
    font-family: 'Fira Code', monospace;
    font-size: 0.72rem;
    font-weight: 700;
    color: #94a3b8;
}

.toc-link.active .toc-num[b-4a9yhajij9] {
    color: #093d93;
    font-weight: 800;
}

.toc-action-box[b-4a9yhajij9] {
    background: linear-gradient(135deg, rgba(9, 61, 147, 0.04), rgba(237, 112, 36, 0.04));
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.toc-action-title[b-4a9yhajij9] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.85rem;
    font-weight: 700;
    color: #0f172a;
}

.toc-action-box p[b-4a9yhajij9] {
    font-size: 0.78rem;
    color: #64748b;
    margin: 0 0 0.5rem;
    line-height: 1.4;
}

.btn-toc-contact[b-4a9yhajij9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.55rem 0.9rem;
    border-radius: 10px;
    background: #093d93;
    color: white;
    font-size: 0.82rem;
    font-weight: 600;
    border: none;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: inherit;
    width: 100%;
}

.btn-toc-contact:hover[b-4a9yhajij9] {
    background: #1a5bc4;
    transform: translateY(-1px);
    color: white;
}

/* Mobile Quick Jump Bar */
.mobile-toc-bar[b-4a9yhajij9] {
    display: none;
    margin-bottom: 1.5rem;
    padding: 0.85rem 1rem;
    border-radius: 14px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 14px -4px rgba(9, 61, 147, 0.05);
}

.mobile-toc-label[b-4a9yhajij9] {
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #64748b;
    margin-bottom: 0.5rem;
    display: block;
}

.mobile-toc-scroll[b-4a9yhajij9] {
    display: flex;
    gap: 0.5rem;
    overflow-x: auto;
    padding-bottom: 0.25rem;
    scrollbar-width: thin;
}

.mobile-toc-chip[b-4a9yhajij9] {
    flex-shrink: 0;
    padding: 0.4rem 0.85rem;
    border-radius: 100px;
    background: #f1f5f9;
    color: #334155;
    font-size: 0.8rem;
    font-weight: 500;
    white-space: nowrap;
    border: 1px solid #e2e8f0;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.2s ease;
}

.mobile-toc-chip:hover[b-4a9yhajij9] {
    background: #e0f2fe;
    color: #093d93;
    border-color: #bfdbfe;
}

.mobile-toc-chip.active[b-4a9yhajij9] {
    background: #093d93;
    color: #ffffff;
    border-color: #093d93;
    font-weight: 700;
}

/* ==========================================================================
   Document Article Content
   ========================================================================== */
.security-document[b-4a9yhajij9] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 24px;
    box-shadow: 0 12px 40px -8px rgba(9, 61, 147, 0.06);
    padding: clamp(2rem, 5vw, 3.5rem);
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.security-section[b-4a9yhajij9] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    border-bottom: 1px solid #f1f5f9;
    padding-bottom: 2.25rem;
    scroll-margin-top: 100px;
}

.security-section:last-of-type[b-4a9yhajij9] {
    border-bottom: none;
    padding-bottom: 0;
}

.section-title-wrap[b-4a9yhajij9] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.sec-badge[b-4a9yhajij9] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: rgba(9, 61, 147, 0.08);
    color: #093d93;
    font-family: 'Fira Code', monospace;
    font-size: 0.85rem;
    font-weight: 700;
    flex-shrink: 0;
}

.security-section h2[b-4a9yhajij9] {
    font-size: clamp(1.25rem, 2.5vw, 1.6rem);
    font-weight: 700;
    color: #0f172a;
    margin: 0;
    letter-spacing: -0.01em;
}

.security-section p[b-4a9yhajij9] {
    font-size: 0.96rem;
    color: #475569;
    line-height: 1.75;
    margin: 0;
}

.security-list[b-4a9yhajij9] {
    list-style: none;
    padding: 0;
    margin: 0.5rem 0;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.security-list li[b-4a9yhajij9] {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    font-size: 0.94rem;
    color: #334155;
    line-height: 1.6;
}

.security-list li span.k-icon[b-4a9yhajij9],
.security-list li span.k-svg-icon[b-4a9yhajij9] {
    color: #10b981;
    font-size: 1rem;
    margin-top: 0.2rem;
    flex-shrink: 0;
}

.security-link[b-4a9yhajij9] {
    color: #093d93;
    font-weight: 600;
    text-decoration: underline;
}

.security-callout[b-4a9yhajij9] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-radius: 12px;
    background: #f8fafc;
    border-left: 4px solid #093d93;
    font-size: 0.9rem;
    color: #334155;
    margin-top: 0.5rem;
}

/* ==========================================================================
   Pillars Summary
   ========================================================================== */
.security-pillars-summary[b-4a9yhajij9] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1rem;
    margin-top: 0.5rem;
}

.pillar-mini-card[b-4a9yhajij9] {
    padding: 1.25rem;
    border-radius: 14px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.pillar-icon[b-4a9yhajij9] {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: rgba(9, 61, 147, 0.08);
    color: #093d93;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    margin-bottom: 0.25rem;
}

.pillar-mini-card strong[b-4a9yhajij9] {
    font-size: 0.95rem;
    color: #0f172a;
}

.pillar-mini-card span[b-4a9yhajij9] {
    font-size: 0.83rem;
    color: #64748b;
    line-height: 1.45;
}

/* ==========================================================================
   Security Bento Grid
   ========================================================================== */
.security-bento-grid[b-4a9yhajij9] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 1.25rem;
    margin-top: 0.75rem;
}

.bento-card[b-4a9yhajij9] {
    padding: 1.5rem;
    border-radius: 18px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    transition: all 0.25s ease;
}

.bento-card:hover[b-4a9yhajij9] {
    background: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 10px 30px -4px rgba(9, 61, 147, 0.08);
}

.bento-icon[b-4a9yhajij9] {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    color: #093d93;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    margin-bottom: 0.35rem;
    box-shadow: 0 4px 12px -2px rgba(9, 61, 147, 0.06);
}

.bento-card h3[b-4a9yhajij9] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
}

.bento-card p[b-4a9yhajij9] {
    font-size: 0.88rem;
    color: #64748b;
    line-height: 1.55;
    margin: 0;
}

/* ==========================================================================
   Roles Matrix Grid
   ========================================================================== */
.roles-matrix-grid[b-4a9yhajij9] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1rem;
    margin-top: 0.5rem;
}

.role-box[b-4a9yhajij9] {
    padding: 1.25rem;
    border-radius: 14px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.role-box strong[b-4a9yhajij9] {
    font-size: 0.95rem;
    color: #0f172a;
}

.role-box span[b-4a9yhajij9] {
    font-size: 0.85rem;
    color: #64748b;
    line-height: 1.5;
}

/* ==========================================================================
   Shared Responsibility Grid
   ========================================================================== */
.shared-responsibility-grid[b-4a9yhajij9] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
    margin-top: 0.75rem;
}

.responsibility-card[b-4a9yhajij9] {
    padding: 1.5rem;
    border-radius: 18px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.aurocore-side[b-4a9yhajij9] {
    border-top: 4px solid #093d93;
}

.user-side[b-4a9yhajij9] {
    border-top: 4px solid #ed7024;
}

.resp-side-header[b-4a9yhajij9] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.02rem;
    color: #0f172a;
}

.aurocore-side .resp-side-header[b-4a9yhajij9] { color: #093d93; }
.user-side .resp-side-header[b-4a9yhajij9] { color: #ed7024; }

.resp-bullets[b-4a9yhajij9] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.resp-bullets li[b-4a9yhajij9] {
    display: flex;
    align-items: flex-start;
    gap: 0.5rem;
    font-size: 0.88rem;
    color: #334155;
    line-height: 1.45;
}

.resp-bullets li span.k-icon[b-4a9yhajij9],
.resp-bullets li span.k-svg-icon[b-4a9yhajij9] {
    color: #10b981;
    font-size: 0.95rem;
    margin-top: 0.15rem;
    flex-shrink: 0;
}

.resp-note[b-4a9yhajij9] {
    font-size: 0.9rem !important;
    color: #64748b !important;
    line-height: 1.6 !important;
    margin-top: 0.5rem !important;
}

/* ==========================================================================
   Contact Box & Closing
   ========================================================================== */
.contact-box[b-4a9yhajij9] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1.25rem;
    margin-top: 1rem;
}

.contact-item[b-4a9yhajij9] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem;
    border-radius: 14px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}

.contact-item span.k-icon[b-4a9yhajij9],
.contact-item span.k-svg-icon[b-4a9yhajij9] {
    font-size: 1.4rem;
    color: #ed7024;
}

.contact-item div[b-4a9yhajij9] {
    display: flex;
    flex-direction: column;
    font-size: 0.88rem;
    line-height: 1.4;
}

.contact-item strong[b-4a9yhajij9] {
    color: #0f172a;
}

.contact-item span[b-4a9yhajij9] {
    color: #64748b;
}

.security-closing[b-4a9yhajij9] {
    background: linear-gradient(135deg, rgba(9, 61, 147, 0.04), rgba(237, 112, 36, 0.04));
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 2rem;
    margin-top: 1.5rem;
}

.security-closing h3[b-4a9yhajij9] {
    font-size: 1.2rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 0.75rem;
}

.security-closing p[b-4a9yhajij9] {
    font-size: 0.94rem;
    color: #475569;
    line-height: 1.7;
    margin: 0 0 1rem;
}

.closing-brand[b-4a9yhajij9] {
    font-size: 0.88rem !important;
    color: #64748b !important;
    border-top: 1px solid #e2e8f0;
    padding-top: 1rem;
    margin-bottom: 0 !important;
}

/* ==========================================================================
   Responsive Breakpoints
   ========================================================================== */
@media (max-width: 1024px) {
    .security-layout-grid[b-4a9yhajij9] {
        grid-template-columns: 1fr;
    }

    .security-sidebar[b-4a9yhajij9] {
        display: none;
    }

    .mobile-toc-bar[b-4a9yhajij9] {
        display: block;
    }

    .shared-responsibility-grid[b-4a9yhajij9] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .security-document[b-4a9yhajij9] {
        padding: 1.5rem;
    }

    .security-bento-grid[b-4a9yhajij9] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Legal/TermsAndConditions.razor.rz.scp.css */
/* ==========================================================================
   Aurocore — Términos y Condiciones de Uso: Pro Legal Layout & Liquid Glass
   ========================================================================== */

.terms-page[b-t09v73h4np] {
    --glass-bg: rgba(255, 255, 255, 0.88);
    --glass-border: rgba(226, 232, 240, 0.85);
    --glass-specular: inset 0 1px 1.5px 0 rgba(255, 255, 255, 0.9), inset 0 -1px 2px 0 rgba(0, 0, 0, 0.03);
    --glass-shadow: 0 12px 36px -8px rgba(9, 61, 147, 0.08);

    --brand-blue: #093d93;
    --brand-blue-light: #1a5bc4;
    --brand-orange: #ed7024;
    --brand-orange-light: #fd8c1d;

    --slate-900: #09224f;
    --slate-800: #13376b;
    --slate-700: #1e3a5f;
    --slate-600: #2c4d75;
    --slate-500: #476487;
    --slate-200: #e2e8f0;
    --slate-100: #f1f5f9;
    --slate-50: #f8fafc;

    --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);

    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: #f8fafc;
    color: var(--text-heading-primary, #09224f);
    font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

.terms-main[b-t09v73h4np] { flex: 1 0 auto; width: 100%; }

.terms-container[b-t09v73h4np] {
    width: 100%;
    max-width: 1260px;
    margin: 0 auto;
    padding: 0 clamp(1rem, 3vw, 2rem);
}

/* ==========================================================================
   Hero Section
   ========================================================================== */
.terms-hero[b-t09v73h4np] {
    position: relative;
    padding: clamp(5.5rem, 8vw, 7.5rem) 0 clamp(1.5rem, 3vw, 2.5rem);
    background-color: #f8fafc;
    overflow: hidden;
}

.hero-ambient-mesh[b-t09v73h4np] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

.mesh-orb[b-t09v73h4np] {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.6;
    will-change: transform;
}

.orb-orange[b-t09v73h4np] {
    top: -15%;
    left: 10%;
    width: clamp(300px, 40vw, 550px);
    height: clamp(300px, 40vw, 550px);
    background: radial-gradient(circle, rgba(237, 112, 36, 0.14) 0%, transparent 70%);
}

.orb-blue[b-t09v73h4np] {
    bottom: -15%;
    right: 10%;
    width: clamp(250px, 35vw, 500px);
    height: clamp(250px, 35vw, 500px);
    background: radial-gradient(circle, rgba(9, 61, 147, 0.12) 0%, transparent 70%);
}

.hero-grid-pattern[b-t09v73h4np] {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(9, 61, 147, 0.04) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
    z-index: 0;
}

.hero-header[b-t09v73h4np] {
    position: relative;
    z-index: 1;
    max-width: 820px;
    margin: 0 auto;
}

.hero-badge[b-t09v73h4np] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 1.1rem;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 16px -4px rgba(9, 61, 147, 0.08);
    backdrop-filter: blur(16px);
    font-size: 0.82rem;
    font-weight: 500;
    color: #475569;
    margin-bottom: 1.25rem;
}

.badge-dot-orange[b-t09v73h4np] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #ed7024;
    box-shadow: 0 0 6px rgba(237, 112, 36, 0.35);
}

.badge-separator[b-t09v73h4np] { color: #cbd5e1; font-weight: 300; }
.badge-subtext[b-t09v73h4np] { color: #ed7024; font-weight: 600; }

.hero-title[b-t09v73h4np] {
    font-size: clamp(2.2rem, 5vw, 3.5rem);
    font-weight: 800;
    line-height: 1.15;
    color: #0f172a;
    margin: 0 0 1.25rem;
    letter-spacing: -0.02em;
}

.highlight-orange[b-t09v73h4np] {
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.hero-lead[b-t09v73h4np] {
    font-size: clamp(1rem, 2vw, 1.18rem);
    color: #475569;
    line-height: 1.65;
    margin: 0 0 1.5rem;
}

.policy-meta[b-t09v73h4np] {
    display: flex;
    justify-content: center;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.meta-tag[b-t09v73h4np] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.85rem;
    color: #64748b;
    font-weight: 500;
}

/* ==========================================================================
   2-Column Layout Grid & Sticky Table of Contents
   ========================================================================== */
.terms-content-section[b-t09v73h4np] {
    position: relative;
    padding-bottom: 5rem;
}

.terms-layout-grid[b-t09v73h4np] {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 2.5rem;
    align-items: start;
}

/* Sticky Sidebar */
.terms-sidebar[b-t09v73h4np] {
    position: sticky;
    top: 90px;
    z-index: 10;
}

.toc-sticky-card[b-t09v73h4np] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    padding: 1.5rem 1.25rem;
    box-shadow: 0 10px 30px -6px rgba(9, 61, 147, 0.05);
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    max-height: calc(100vh - 120px);
    overflow-y: auto;
}

.toc-header[b-t09v73h4np] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #093d93;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #f1f5f9;
}

.toc-nav[b-t09v73h4np] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.toc-link[b-t09v73h4np] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.45rem 0.65rem;
    border-radius: 8px;
    color: #475569;
    font-size: 0.83rem;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.2s ease;
    line-height: 1.3;
    background: transparent;
    border: none;
    border-left: 3px solid transparent;
    cursor: pointer;
    font-family: inherit;
    text-align: left;
    width: 100%;
}

.toc-link:hover[b-t09v73h4np] {
    color: #093d93;
    background: #f0f7ff;
    padding-left: 0.85rem;
}

.toc-link.active[b-t09v73h4np] {
    color: #093d93;
    background: #e0f2fe;
    border-left-color: #093d93;
    font-weight: 700;
    padding-left: 0.85rem;
}

.toc-num[b-t09v73h4np] {
    font-family: 'Fira Code', monospace;
    font-size: 0.72rem;
    font-weight: 700;
    color: #94a3b8;
}

.toc-link.active .toc-num[b-t09v73h4np] {
    color: #093d93;
    font-weight: 800;
}

.toc-action-box[b-t09v73h4np] {
    background: linear-gradient(135deg, rgba(9, 61, 147, 0.04), rgba(237, 112, 36, 0.04));
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.toc-action-title[b-t09v73h4np] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.85rem;
    font-weight: 700;
    color: #0f172a;
}

.toc-action-box p[b-t09v73h4np] {
    font-size: 0.78rem;
    color: #64748b;
    margin: 0 0 0.5rem;
    line-height: 1.4;
}

.btn-toc-contact[b-t09v73h4np] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.55rem 0.9rem;
    border-radius: 10px;
    background: #093d93;
    color: white;
    font-size: 0.82rem;
    font-weight: 600;
    border: none;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.2s ease;
    font-family: inherit;
    width: 100%;
}

.btn-toc-contact:hover[b-t09v73h4np] {
    background: #1a5bc4;
    transform: translateY(-1px);
    color: white;
}

/* Mobile Quick Jump Bar */
.mobile-toc-bar[b-t09v73h4np] {
    display: none;
    margin-bottom: 1.5rem;
    padding: 0.85rem 1rem;
    border-radius: 14px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    box-shadow: 0 4px 14px -4px rgba(9, 61, 147, 0.05);
}

.mobile-toc-label[b-t09v73h4np] {
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #64748b;
    margin-bottom: 0.5rem;
    display: block;
}

.mobile-toc-scroll[b-t09v73h4np] {
    display: flex;
    gap: 0.5rem;
    overflow-x: auto;
    padding-bottom: 0.25rem;
    scrollbar-width: thin;
}

.mobile-toc-chip[b-t09v73h4np] {
    flex-shrink: 0;
    padding: 0.4rem 0.85rem;
    border-radius: 100px;
    background: #f1f5f9;
    color: #334155;
    font-size: 0.8rem;
    font-weight: 500;
    white-space: nowrap;
    border: 1px solid #e2e8f0;
    cursor: pointer;
    font-family: inherit;
    transition: all 0.2s ease;
}

.mobile-toc-chip:hover[b-t09v73h4np] {
    background: #e0f2fe;
    color: #093d93;
    border-color: #bfdbfe;
}

.mobile-toc-chip.active[b-t09v73h4np] {
    background: #093d93;
    color: #ffffff;
    border-color: #093d93;
    font-weight: 700;
}

/* ==========================================================================
   Document Article Content
   ========================================================================== */
.terms-document[b-t09v73h4np] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 24px;
    box-shadow: 0 12px 40px -8px rgba(9, 61, 147, 0.06);
    padding: clamp(2rem, 5vw, 3.5rem);
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.terms-section[b-t09v73h4np] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    border-bottom: 1px solid #f1f5f9;
    padding-bottom: 2.25rem;
    scroll-margin-top: 100px;
}

.terms-section:last-of-type[b-t09v73h4np] {
    border-bottom: none;
    padding-bottom: 0;
}

.section-title-wrap[b-t09v73h4np] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.sec-badge[b-t09v73h4np] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: rgba(9, 61, 147, 0.08);
    color: #093d93;
    font-family: 'Fira Code', monospace;
    font-size: 0.85rem;
    font-weight: 700;
    flex-shrink: 0;
}

.terms-section h2[b-t09v73h4np] {
    font-size: clamp(1.25rem, 2.5vw, 1.6rem);
    font-weight: 700;
    color: #0f172a;
    margin: 0;
    letter-spacing: -0.01em;
}

.terms-section p[b-t09v73h4np] {
    font-size: 0.96rem;
    color: #475569;
    line-height: 1.75;
    margin: 0;
}

.terms-list[b-t09v73h4np] {
    list-style: none;
    padding: 0;
    margin: 0.5rem 0;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.terms-list li[b-t09v73h4np] {
    display: flex;
    align-items: flex-start;
    gap: 0.65rem;
    font-size: 0.94rem;
    color: #334155;
    line-height: 1.6;
}

.terms-list li span.k-icon[b-t09v73h4np],
.terms-list li span.k-svg-icon[b-t09v73h4np] {
    color: #10b981;
    font-size: 1rem;
    margin-top: 0.2rem;
    flex-shrink: 0;
}

.terms-link[b-t09v73h4np] {
    color: #093d93;
    font-weight: 600;
    text-decoration: underline;
}

/* Callouts */
.terms-callout[b-t09v73h4np] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    border-radius: 12px;
    background: #f8fafc;
    border-left: 4px solid #093d93;
    font-size: 0.9rem;
    color: #334155;
    margin-top: 0.5rem;
}

/* ==========================================================================
   Responsibilities Bento Grid
   ========================================================================== */
.responsibilities-grid[b-t09v73h4np] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.25rem;
    margin-top: 0.75rem;
}

.resp-card[b-t09v73h4np] {
    padding: 1.35rem;
    border-radius: 16px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    transition: all 0.25s ease;
}

.resp-card:hover[b-t09v73h4np] {
    background: #ffffff;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px -4px rgba(9, 61, 147, 0.08);
}

.resp-icon[b-t09v73h4np] {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: #f1f5f9;
    color: #093d93;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    margin-bottom: 0.25rem;
}

.resp-card strong[b-t09v73h4np] {
    font-size: 0.98rem;
    color: #0f172a;
}

.resp-card span[b-t09v73h4np] {
    font-size: 0.85rem;
    color: #64748b;
    line-height: 1.5;
}

/* ==========================================================================
   Contact Box & Closing
   ========================================================================== */
.contact-box[b-t09v73h4np] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1.25rem;
    margin-top: 1rem;
}

.contact-item[b-t09v73h4np] {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.25rem;
    border-radius: 14px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}

.contact-item span.k-icon[b-t09v73h4np],
.contact-item span.k-svg-icon[b-t09v73h4np] {
    font-size: 1.4rem;
    color: #ed7024;
}

.contact-item div[b-t09v73h4np] {
    display: flex;
    flex-direction: column;
    font-size: 0.88rem;
    line-height: 1.4;
}

.contact-item strong[b-t09v73h4np] {
    color: #0f172a;
}

.contact-item span[b-t09v73h4np] {
    color: #64748b;
}

.terms-closing[b-t09v73h4np] {
    background: linear-gradient(135deg, rgba(9, 61, 147, 0.04), rgba(237, 112, 36, 0.04));
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 2rem;
    margin-top: 1rem;
}

.terms-closing h3[b-t09v73h4np] {
    font-size: 1.2rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 0.75rem;
}

.terms-closing p[b-t09v73h4np] {
    font-size: 0.94rem;
    color: #475569;
    line-height: 1.7;
    margin: 0 0 1rem;
}

.closing-brand[b-t09v73h4np] {
    font-size: 0.88rem !important;
    color: #64748b !important;
    border-top: 1px solid #e2e8f0;
    padding-top: 1rem;
    margin-bottom: 0 !important;
}

/* ==========================================================================
   Responsive Breakpoints
   ========================================================================== */
@media (max-width: 1024px) {
    .terms-layout-grid[b-t09v73h4np] {
        grid-template-columns: 1fr;
    }

    .terms-sidebar[b-t09v73h4np] {
        display: none;
    }

    .mobile-toc-bar[b-t09v73h4np] {
        display: block;
    }
}

@media (max-width: 768px) {
    .terms-document[b-t09v73h4np] {
        padding: 1.5rem;
    }

    .responsibilities-grid[b-t09v73h4np] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Notifications/Notification.razor.rz.scp.css */
/* Contenedor principal de la página de notificaciones */
.notifications-container[b-bm10i30sku] {
    width: 100%;
}

/* Fila de acciones dentro del banner */
.notifications-container[b-bm10i30sku]  .banner-actions {
    margin-left: 0;
}

.notifications-banner-actions[b-bm10i30sku] {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

/* Botones del banner con estilo visual de empresa */
.notifications-banner-actions[b-bm10i30sku]  .notifications-banner-btn.k-button,
.notifications-banner-actions[b-bm10i30sku]  .k-button.notifications-banner-btn {
    background: rgba(255, 255, 255, 0.15) !important;
    border: 2px solid rgba(255, 255, 255, 0.3) !important;
    color: #ffffff !important;
    backdrop-filter: blur(20px) !important;
    border-radius: 12px !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
    min-width: auto;
    padding: 0.42rem 0.9rem !important;
}

.notifications-banner-actions[b-bm10i30sku]  .notifications-banner-btn.k-button:hover,
.notifications-banner-actions[b-bm10i30sku]  .k-button.notifications-banner-btn:hover {
    background: rgba(255, 255, 255, 0.25) !important;
    border-color: rgba(255, 255, 255, 0.5) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15) !important;
}

.notifications-banner-actions[b-bm10i30sku]  .notifications-banner-btn .k-button-text,
.notifications-banner-actions[b-bm10i30sku]  .notifications-banner-btn .k-svg-icon {
    color: #ffffff !important;
}

/* Indicador de no leídas sin interacción visual de botón */
.notifications-banner-actions[b-bm10i30sku]  .notifications-banner-info.k-disabled,
.notifications-banner-actions[b-bm10i30sku]  .notifications-banner-info.k-disabled:hover {
    opacity: 1;
    cursor: default;
    filter: none;
    background: rgba(255, 255, 255, 0.15) !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
    color: #ffffff !important;
    box-shadow: none !important;
    transform: none !important;
}

/* Cuadrícula que contiene las cards resumen por categoría */
.filter-cards[b-bm10i30sku] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 20px;
    width: 100%;
}

/* Estilo base de cada botón card de categoría */
.filter-card[b-bm10i30sku] {
    position: relative;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #fff;
    padding: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    transition: box-shadow .2s ease, border-color .2s ease, transform .2s ease, background-color .2s ease;
}

/* Ajustes del botón Telerik dentro de la cuadrícula de cards */
.filter-cards[b-bm10i30sku]  .filter-card.k-button {
    position: relative;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    background: #fff !important;
    padding: 10px 14px !important;
    height: 70px;
    flex: 1 1 80px;
    min-height: auto;
    box-sizing: border-box;
    min-width: auto;
    text-align: inherit;
    transition: box-shadow .2s ease, border-color .2s ease, transform .2s ease, background-color .2s ease;
}

.filter-cards[b-bm10i30sku]  .filter-card.k-button .k-button-text {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    min-height: auto;
}

.card-layout[b-bm10i30sku] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    height: 100%;
}

/* Efecto al pasar el mouse sobre las cards */
.filter-card:hover[b-bm10i30sku] {
    border-color: #b7c6db;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
    transform: translateY(-1px);
}

/* Efecto hover aplicado al botón Telerik real */
.filter-cards[b-bm10i30sku]  .filter-card.k-button:hover {
    border-color: #b7c6db !important;
    box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08) !important;
    transform: translateY(-1px) !important;
}

.filter-card.selected[b-bm10i30sku] {
    border-color: var(--primary-color, #667eea);
    background: #f7f8ff;
    box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.14);
}

.filter-cards[b-bm10i30sku]  .filter-card.selected.k-button {
    border-color: var(--primary-color, #667eea) !important;
    background: #f7f8ff !important;
    box-shadow: 0 0 0 2px rgba(102, 126, 234, 0.14) !important;
}

/* Contenedor del ícono de categoría dentro de cada card */
.card-icon[b-bm10i30sku] {
    position: relative;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* Total numérico mostrado por categoría */
.card-count[b-bm10i30sku] {
    position: relative;
    font-size: 22px;
    font-weight: 700;
    color: #9ca3af;
    line-height: 1;
    transition: color .2s ease;
}

.card-count.has-unread[b-bm10i30sku] {
    color: #ef4444;
}

.filter-cards[b-bm10i30sku]  .filter-card.selected.k-button .card-count {
    color: #374151;
}

.filter-cards[b-bm10i30sku]  .filter-card.selected.k-button .card-count.has-unread {
    color: #ef4444;
}


/* Variantes de color para íconos de categoría */
.card-icon.blue[b-bm10i30sku] { background: #e0ecff; color: #2563eb; }
.card-icon.slate[b-bm10i30sku] { background: #e2e8f0; color: #334155; }
.card-icon.yellow[b-bm10i30sku] { background: #fff4d6; color: #d97706; }
.card-icon.purple[b-bm10i30sku] { background: #ece9ff; color: #6366f1; }
.card-icon.teal[b-bm10i30sku] { background: #dbf4ff; color: #0369a1; }
.card-icon.cyan[b-bm10i30sku] { background: #cffafe; color: #0e7490; }
.card-icon.indigo[b-bm10i30sku] { background: #e0e7ff; color: #4338ca; }
.card-icon.gray[b-bm10i30sku] { background: #e5e7eb; color: #374151; }

/* Panel principal con tabs, filtros y listado */
.panel[b-bm10i30sku] {
    background: #fff;
    border-radius: 14px;
    border: 1px solid #e5e7eb;
    overflow: hidden;
}

/* Fila superior con tabs y buscador */
.panel-top[b-bm10i30sku] {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    background: var(--RgbaColor01, #f7f9ff);
    border-bottom: 1px solid #d1d5db;
}

/* Contenedor de tabs */
.tabs[b-bm10i30sku] {
    display: flex;
    gap: 4px;
    background: #e2e8f0;
    padding: 4px;
    border-radius: 8px;
    align-self: center;
    position: relative;
    z-index: 2;
}

/* Estilo base de tabs */
.tabs[b-bm10i30sku]  .k-button.tab {
    border: none !important;
    background: transparent !important;
    color: #64748b !important;
    font-weight: 600;
    font-size: 13px;
    padding: 6px 14px !important;
    border-radius: 6px !important;
    transition: all 0.2s ease;
    box-shadow: none !important;
    margin: 0 !important;
    min-width: auto;
    opacity: 1;
    text-shadow: none;
}

/* Estado visual del tab activo */
.tabs[b-bm10i30sku]  .k-button.tab.active,
.tabs[b-bm10i30sku]  .k-button.tab.k-selected,
.tabs[b-bm10i30sku]  .k-button.tab.active:hover,
.tabs[b-bm10i30sku]  .k-button.tab.k-selected:hover,
.tabs[b-bm10i30sku]  .k-button.tab.active.k-hover,
.tabs[b-bm10i30sku]  .k-button.tab.k-selected.k-hover,
.tabs[b-bm10i30sku]  .k-button.tab.active:focus,
.tabs[b-bm10i30sku]  .k-button.tab.active.k-focus,
.tabs[b-bm10i30sku]  .k-button.tab.k-selected:focus,
.tabs[b-bm10i30sku]  .k-button.tab.k-selected.k-focus {
    background: #ffffff !important;
    color: #0f172a !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08) !important;
    border: none !important;
    margin: 0 !important;
    padding: 6px 14px !important;
    opacity: 1 !important;
    z-index: 6;
    outline: none !important;
}

.tabs[b-bm10i30sku]  .k-button.tab:hover:not(.active):not(.k-selected),
.tabs[b-bm10i30sku]  .k-button.tab.k-hover:not(.active):not(.k-selected) {
    color: #0f172a !important;
    background: rgba(255, 255, 255, 0.4) !important;
    border: none !important;
}

/* Ancho del área de búsqueda */
.search-box[b-bm10i30sku] {
    width: 320px;
    flex: 0 0 auto;
    align-self: center;
}

/* Input de búsqueda al 100% del contenedor */
.search-box .notifications-search[b-bm10i30sku] {
    width: 100%;
}

/* Fila de selección masiva sobre el listado */
.panel-selection-row[b-bm10i30sku] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 14px;
    border-bottom: 0 !important;
    box-shadow: none !important;
    font-size: 13px;
    color: #6b7280;
}

/* Lado izquierdo: checkbox de seleccionar todo y texto */
.selection-left[b-bm10i30sku] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Tamaño de checkbox en controles de selección */
.selection-left[b-bm10i30sku]  .k-checkbox,
.notification-left[b-bm10i30sku]  .k-checkbox {
    width: 16px;
    height: 16px;
}

/* Texto con el total de notificaciones filtradas */
.selection-count[b-bm10i30sku] {
    font-weight: 600;
}

/* Lado derecho: total y acciones masivas */
.selection-right[b-bm10i30sku] {
    display: flex;
    align-items: center;
    gap: 10px;
}

/* Grupo de botones de acciones masivas */
.selection-actions[b-bm10i30sku] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Estilo base de botones de acciones masivas */
.selection-action-btn[b-bm10i30sku] {
    font-weight: 600;
}

/* Estilo visual del botón Telerik para acciones masivas */
.selection-actions[b-bm10i30sku]  .selection-action-btn.k-button {
    border-radius: 999px;
    border-color: #d1d5db;
    background: #f9fafb;
    color: #111827;
    padding: 0.4rem 0.9rem;
    transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
}

/* Estado hover de botones de acciones masivas */
.selection-actions[b-bm10i30sku]  .selection-action-btn.k-button:hover {
    background: #f3f4f6;
    border-color: #9ca3af;
    transform: translateY(-1px);
}

/* Etiqueta separadora por día (ejemplo: HOY) */
.date-label[b-bm10i30sku] {
    padding: 10px 14px;
    font-weight: 700;
    font-size: 13px;
    color: #6b7280;
    border-top: 0 !important;
    margin-top: 0;
    border-bottom: 1px solid #e5e7eb;
    background: #fafafa;
}

/* Estilo base de cada fila de notificación */
.notification-item[b-bm10i30sku] {
    padding: 10px 12px;
    border-bottom: 1px solid #e5e7eb;
    transition: background-color .2s ease;
}

/* Fondo para notificaciones no leídas */
.notification-item.unread[b-bm10i30sku] {
    background: #f8fafc;
}

/* Resalte cuando el ítem está abierto o en hover */
.notification-item.open[b-bm10i30sku],
.notification-item:hover[b-bm10i30sku] {
    background: #f8fafc;
}

/* Encabezado de cada notificación */
.notification-header[b-bm10i30sku] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    cursor: pointer;
}

/* Lado izquierdo: checkbox, ícono y textos */
.notification-left[b-bm10i30sku] {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    flex: 1;
}

/* Contenedor del checkbox para evitar expandir al hacer clic */
.notification-select[b-bm10i30sku] {
    display: inline-flex;
    align-items: center;
}

/* Contenedor circular del ícono de notificación */
.notification-icon[b-bm10i30sku] {
    width: 38px;
    height: 38px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* Variantes de color por módulo para íconos */
.icon-order[b-bm10i30sku] { background: #e0ecff; color: #2563eb; }
.icon-service[b-bm10i30sku] { background: #e2e8f0; color: #334155; }
.icon-product[b-bm10i30sku] { background: #dbf4ff; color: #0369a1; }
.icon-inventory[b-bm10i30sku] { background: #fff4d6; color: #d97706; }
.icon-quote[b-bm10i30sku] { background: #ece9ff; color: #6366f1; }
.icon-client[b-bm10i30sku] { background: #cffafe; color: #0e7490; }
.icon-employee[b-bm10i30sku] { background: #e0e7ff; color: #4338ca; }
.icon-invoice[b-bm10i30sku] { background: #e5e7eb; color: #374151; }
.icon-default[b-bm10i30sku] { background: #eef2ff; color: #4f46e5; }

/* Título corto de la notificación */
.notification-title[b-bm10i30sku] {
    font-size: 15px;
    font-weight: 700;
    color: #111827;
}

/* Línea resumen en estado colapsado */
.notification-subtitle[b-bm10i30sku] {
    font-size: 13px;
    color: #6b7280;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 460px;
}

/* Contenedor de etiquetas de módulo */
.notification-tags[b-bm10i30sku] {
    margin-top: 6px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

/* Estilo base de etiquetas de módulo */
.notification-tag[b-bm10i30sku] {
    border-radius: 999px;
    padding: 2px 8px;
    font-size: 11px;
    font-weight: 700;
}

/* Variantes de color para etiquetas de módulo */
.tag-order[b-bm10i30sku] { background: #e0ecff; color: #2563eb; }
.tag-employee[b-bm10i30sku] { background: #e0e7ff; color: #4338ca; }
.tag-service[b-bm10i30sku] { background: #e2e8f0; color: #334155; }
.tag-product[b-bm10i30sku] { background: #dbf4ff; color: #0369a1; }
.tag-inventory[b-bm10i30sku] { background: #fff4d6; color: #b45309; }
.tag-client[b-bm10i30sku] { background: #cffafe; color: #0e7490; }
.tag-quote[b-bm10i30sku] { background: #ece9ff; color: #5b21b6; }
.tag-invoice[b-bm10i30sku] { background: #e5e7eb; color: #374151; }

/* Metadatos del lado derecho (tiempo y acciones) */
.notification-meta[b-bm10i30sku] {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    font-size: 11px;
    color: #6b7280;
    flex-shrink: 0;
}

/* Información derecha: etiqueta y tiempo relativo */
.notification-meta-info[b-bm10i30sku] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

/* Contenedor de acciones rápidas a la derecha */
.notification-meta-actions[b-bm10i30sku] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* Estilo del tiempo relativo */
.notification-time[b-bm10i30sku] {
    white-space: nowrap;
}

/* Botones rápidos en fila colapsada */
.notification-meta-actions[b-bm10i30sku]  .notification-inline-btn.k-button {
    border-radius: 999px;
    font-weight: 700;
    font-size: 12px;
    padding: 0.34rem 0.88rem;
    border: 1px solid transparent;
    line-height: 1.1;
    transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
    min-width: auto;
}

.notification-meta-actions[b-bm10i30sku]  .notification-inline-btn-read.k-button {
    border-color: #374151 !important;
    background-color: #374151 !important;
    color: #f9fafb !important;
    box-shadow: 0 4px 10px rgba(17, 24, 39, 0.18);
}

.notification-meta-actions[b-bm10i30sku]  .notification-inline-btn-read.k-button:hover {
    background-color: #1f2937 !important;
    border-color: #1f2937 !important;
    transform: translateY(-1px);
}

.notification-meta-actions[b-bm10i30sku]  .notification-inline-btn-archive.k-button {
    border-color: #d1d5db !important;
    background-color: #ffffff !important;
    color: #111827 !important;
}

.notification-meta-actions[b-bm10i30sku]  .notification-inline-btn-archive.k-button:hover {
    border-color: #9ca3af !important;
    background-color: #f9fafb !important;
    transform: translateY(-1px);
}

.notification-meta-actions[b-bm10i30sku]  .notification-inline-btn-delete.k-button {
    border-color: transparent !important;
    background-color: transparent !important;
    color: #9ca3af !important;
    padding: 0.34rem 0.55rem;
}

.notification-meta-actions[b-bm10i30sku]  .notification-inline-btn-delete.k-button:hover {
    background-color: #fee2e2 !important;
    border-color: #fca5a5 !important;
    color: #dc2626 !important;
    transform: translateY(-1px);
}

/* Indicador tipo punto para no leídas */
.notification-unread-dot[b-bm10i30sku] {
    color: #111827;
    font-size: 12px;
}

/* Flecha para expandir/colapsar */
.arrow[b-bm10i30sku] {
    display: inline-flex;
    transition: transform .2s ease;
}

/* Flecha rotada cuando la notificación está expandida */
.arrow.rotate[b-bm10i30sku] {
    transform: rotate(180deg);
}

/* Contenedor del detalle expandido */
.notification-body[b-bm10i30sku] {
    margin-top: 12px;
    margin-left: 72px;
    background: #f3f4f6;
    border-radius: 10px;
    padding: 12px;
}

/* Estilo de párrafos dentro del detalle expandido */
.notification-body p[b-bm10i30sku] {
    margin: 0;
    font-size: 12px;
    color: #374151;
}

/* Estilo de lista dentro del detalle expandido */
.notification-body[b-bm10i30sku]  ul {
    margin: 6px 0 0 18px;
    padding: 0;
    list-style: none !important;
    font-size: 12px;
}

/* Espaciado entre ítems de lista en el detalle */
.notification-body[b-bm10i30sku]  li {
    margin-bottom: 4px;
    list-style: none !important;
}

/* Área de acciones dentro del detalle expandido */
.actions[b-bm10i30sku] {
    margin-top: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

/* Estilo base de botones de acción dentro del detalle */
.actions[b-bm10i30sku]  .detail-action-btn.k-button {
    border-radius: 999px;
    font-weight: 700;
    padding: 0.38rem 0.9rem;
    border-width: 1px;
    border-style: solid;
    transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
}

/* Botón de marcar como vista */
.actions[b-bm10i30sku]  .detail-action-read.k-button {
    border-color: #374151;
    background-color: #374151;
    color: #f9fafb;
    box-shadow: 0 4px 10px rgba(17, 24, 39, 0.18);
}

/* Hover de marcar como vista */
.actions[b-bm10i30sku]  .detail-action-read.k-button:hover {
    background-color: #1f2937;
    border-color: #1f2937;
    transform: translateY(-1px);
}

/* Botón de archivar/restaurar */
.actions[b-bm10i30sku]  .detail-action-archive.k-button {
    border-color: #d1d5db;
    background-color: #ffffff;
    color: #111827;
}

/* Hover de archivar/restaurar */
.actions[b-bm10i30sku]  .detail-action-archive.k-button:hover {
    border-color: #9ca3af;
    background-color: #f9fafb;
    transform: translateY(-1px);
}

/* Botón de eliminar en detalle */
.actions[b-bm10i30sku]  .detail-action-delete.k-button {
    border-color: #ef4444 !important;
    background-color: #ef4444 !important;
    color: #ffffff !important;
}

.actions[b-bm10i30sku]  .detail-action-delete.k-button:hover {
    border-color: #dc2626 !important;
    background-color: #dc2626 !important;
    transform: translateY(-1px);
}

/* Botón de eliminar en selección masiva */
.selection-actions[b-bm10i30sku]  .selection-action-btn-delete.k-button {
    border-color: #fee2e2 !important;
    background-color: #fef2f2 !important;
    color: #dc2626 !important;
}

.selection-actions[b-bm10i30sku]  .selection-action-btn-delete.k-button:hover {
    border-color: #fca5a5 !important;
    background-color: #fee2e2 !important;
    color: #b91c1c !important;
    transform: translateY(-1px);
}

/* Estado deshabilitado de botones de acción */
.actions[b-bm10i30sku]  .detail-action-btn.k-button:disabled {
    opacity: 0.7;
    box-shadow: none;
}

/* ==========================================================================
   Responsive (Mobile < 768px)
   ========================================================================== */
@media (max-width: 768px) {
    /* Fix 2: Notificaciones: título truncado y layout roto en mobile */
    .notification-header[b-bm10i30sku] {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
    }

    .notification-title[b-bm10i30sku] {
        font-size: 13px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 200px;
    }

    .notification-subtitle[b-bm10i30sku] {
        max-width: 100%;
        font-size: 12px;
    }

    .notification-meta[b-bm10i30sku] {
        width: 100%;
        justify-content: flex-start;
        flex-wrap: wrap;
        gap: 6px;
        padding-left: 48px;
    }

    .notification-meta-info[b-bm10i30sku] {
        flex-wrap: wrap;
        gap: 4px;
    }

    .notification-meta-actions[b-bm10i30sku] {
        flex-wrap: wrap;
        gap: 4px;
    }

    .notification-meta-actions[b-bm10i30sku]  .notification-inline-btn.k-button {
        font-size: 11px;
        padding: 0.28rem 0.7rem;
    }

    /* Fix 3: Detalle expandido en mobile */
    .notification-body[b-bm10i30sku] {
        margin-left: 0;
        margin-top: 8px;
    }

    .notification-body p[b-bm10i30sku] {
        font-size: 11px;
    }

    .actions[b-bm10i30sku] {
        gap: 6px;
    }

    .notification-body .actions[b-bm10i30sku]  .detail-action-archive.k-button {
        display: none;
    }

    .actions[b-bm10i30sku]  .detail-action-btn.k-button {
        padding: 0.32rem 0.75rem;
        font-size: 12px;
    }

    /* Fix 4: Panel top: tabs y buscador en mobile */
    .panel-top[b-bm10i30sku] {
        display: grid !important;
        grid-template-columns: 1fr auto;
        gap: 8px;
        padding: 10px;
    }

    .search-box[b-bm10i30sku] {
        grid-column: 1 / 2;
        width: 100%;
        order: 1;
    }

    .selection-toggle-wrapper[b-bm10i30sku] {
        grid-column: 2 / 3;
        align-self: center;
        margin-left: 0 !important;
        order: 2;
    }

    .selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button {
        padding: 0 !important;
        width: 38px !important;
        height: 38px !important;
        min-width: auto !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 8px !important;
    }

    .tabs[b-bm10i30sku] {
        grid-column: 1 / 3;
        width: 100%;
        display: flex !important;
        flex-wrap: nowrap !important;
        padding: 4px;
        gap: 4px;
        background: #e2e8f0;
        border-radius: 8px;
        order: 3;
    }

    .tabs[b-bm10i30sku]::-webkit-scrollbar {
        display: none;
    }

    .tabs[b-bm10i30sku]  .k-button.tab {
        font-size: 12px;
        padding: 6px 4px !important;
        white-space: nowrap;
        flex: 1 1 0px !important;
        text-align: center !important;
        justify-content: center !important;
        margin: 0 !important;
        border: none !important;
        background: transparent !important;
    }
    
    .tabs[b-bm10i30sku]  .k-button.tab.active,
    .tabs[b-bm10i30sku]  .k-button.tab.k-selected {
        background: #ffffff !important;
        color: #0f172a !important;
        padding: 6px 4px !important;
    }

    /* Fix 5: Selección masiva en mobile */
    .panel-selection-row[b-bm10i30sku] {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        padding: 8px 12px;
    }

    .selection-right[b-bm10i30sku] {
        width: 100%;
        flex-wrap: wrap;
        gap: 6px;
    }

    .selection-actions[b-bm10i30sku] {
        flex-wrap: wrap;
        gap: 6px;
    }

    .selection-actions[b-bm10i30sku]  .selection-action-btn.k-button {
        font-size: 11px;
        padding: 0.32rem 0.75rem;
    }

    /* Fix 6: Padding del contenedor en mobile */
    .notifications-container[b-bm10i30sku] {
        padding: 0 0.25rem;
    }

    .notification-item[b-bm10i30sku] {
        padding: 8px 10px;
    }

    /* Fix 7: Banner de notificaciones en mobile */
    .notifications-banner-actions[b-bm10i30sku] {
        flex-direction: column;
        align-items: stretch;
        gap: 6px;
    }

    .notifications-banner-actions[b-bm10i30sku]  .notifications-banner-btn.k-button {
        width: 100%;
        justify-content: center;
        font-size: 13px;
    }
}

/* Nuevos estilos de módulos y severidades */
.tag-event[b-bm10i30sku] { background: #fce7f3; color: #db2777; }
.icon-event[b-bm10i30sku] { background: #fce7f3; color: #db2777; }
.tag-system[b-bm10i30sku] { background: #ffedd5; color: #ea580c; }
.icon-system[b-bm10i30sku] { background: #ffedd5; color: #ea580c; }

/* Indicación visual para la entidad cliqueable */
.clickable-entity[b-bm10i30sku] {
    cursor: pointer;
    text-decoration: none;
    transition: color 0.2s ease;
}
.clickable-entity:hover[b-bm10i30sku] {
    color: var(--primary-color, #2563eb);
    text-decoration: underline;
}

/* Alertas críticas resaltadas */
.notification-item.critical-alert[b-bm10i30sku] {
    border-left: 4px solid #ef4444 !important;
    background: #fef2f2 !important;
}
.notification-item.critical-alert:hover[b-bm10i30sku] {
    background: #fee2e2 !important;
}
.notification-item.critical-alert.read[b-bm10i30sku] {
    border-left-color: #fca5a5 !important;
    background: #fff5f5 !important;
}

/* Botón de modo selección */
.selection-toggle-wrapper[b-bm10i30sku] {
    align-self: center;
}
.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button {
    border-radius: 10px !important;
    font-weight: 600 !important;
    padding: 0.28rem 0.8rem !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    height: auto !important;
    transition: all 0.2s ease;
}

/* Quitar el comportamiento gris/difuso del focus en las pestañas */
.tabs[b-bm10i30sku]  .k-button.tab:focus,
.tabs[b-bm10i30sku]  .k-button.tab.k-focus,
.tabs[b-bm10i30sku]  .k-button.tab:focus-visible {
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    border: none !important;
}

.tabs[b-bm10i30sku]  .k-button.tab.active:focus,
.tabs[b-bm10i30sku]  .k-button.tab.active.k-focus,
.tabs[b-bm10i30sku]  .k-button.tab.k-selected:focus,
.tabs[b-bm10i30sku]  .k-button.tab.k-selected.k-focus,
.tabs[b-bm10i30sku]  .k-button.tab.active:focus-visible,
.tabs[b-bm10i30sku]  .k-button.tab.k-selected:focus-visible {
    background: #ffffff !important;
    color: #0f172a !important;
    border: none !important;
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08) !important;
    outline: none !important;
}

/* Ocultar pseudo-elementos de foco para evitar líneas grises */
.tabs[b-bm10i30sku]  .k-button.tab:focus::after,
.tabs[b-bm10i30sku]  .k-button.tab.k-focus::after,
.tabs[b-bm10i30sku]  .k-button.tab:focus-visible::after,
.tabs[b-bm10i30sku]  .k-button.tab:focus::before,
.tabs[b-bm10i30sku]  .k-button.tab.k-focus::before,
.tabs[b-bm10i30sku]  .k-button.tab:focus-visible::before,
.tabs[b-bm10i30sku]  .k-button.tab.active:focus::after,
.tabs[b-bm10i30sku]  .k-button.tab.active.k-focus::after,
.tabs[b-bm10i30sku]  .k-button.tab.k-selected:focus::after,
.tabs[b-bm10i30sku]  .k-button.tab.k-selected.k-focus::after,
.tabs[b-bm10i30sku]  .k-button.tab.active:focus::before,
.tabs[b-bm10i30sku]  .k-button.tab.active.k-focus::before,
.tabs[b-bm10i30sku]  .k-button.tab.k-selected:focus::before,
.tabs[b-bm10i30sku]  .k-button.tab.k-selected.k-focus::before {
    display: none !important;
    content: none !important;
}

/* Botón de selección: Estados activo, hover y focus */
.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button.active,
.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button.active:hover,
.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button.active:focus,
.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button.active.k-focus,
.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button.active:active {
    background-color: var(--primary-color, #2563eb) !important;
    color: #ffffff !important;
    border-color: var(--primary-color, #2563eb) !important;
}

.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button.active .k-svg-icon,
.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button.active .k-button-text {
    color: #ffffff !important;
}

/* Evitar que se quede coloreado por focus cuando se desactiva */
.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button:not(.active):focus,
.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button:not(.active).k-focus,
.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button:not(.active):active {
    background-color: transparent !important;
    color: var(--primary-color, #2563eb) !important;
    border-color: var(--primary-color, #2563eb) !important;
    box-shadow: none !important;
}

.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button:not(.active):focus .k-svg-icon,
.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button:not(.active).k-focus .k-svg-icon,
.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button:not(.active):active .k-svg-icon,
.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button:not(.active):focus .k-button-text,
.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button:not(.active).k-focus .k-button-text,
.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button:not(.active):active .k-button-text {
    color: var(--primary-color, #2563eb) !important;
}

/* Evitar que el hover simule quedarse pegado en dispositivos táctiles */
.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button:not(.active):hover {
    background-color: transparent !important;
    color: var(--primary-color, #2563eb) !important;
    border-color: var(--primary-color, #2563eb) !important;
}
.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button:not(.active):hover .k-svg-icon,
.selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button:not(.active):hover .k-button-text {
    color: var(--primary-color, #2563eb) !important;
}

/* Solo aplicar hover (relleno de color) en dispositivos que soportan hover real (mouse) */
@media (hover: hover) {
    .selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button:not(.active):hover {
        background-color: var(--primary-color, #2563eb) !important;
        color: #ffffff !important;
        border-color: var(--primary-color, #2563eb) !important;
    }
    .selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button:not(.active):hover .k-svg-icon,
    .selection-toggle-wrapper[b-bm10i30sku]  .btn-outline-primary-arregly.k-button:not(.active):hover .k-button-text {
        color: #ffffff !important;
    }
}

/* ==========================================================================
   Paginación de notificaciones
   ========================================================================== */
.notifications-pager[b-bm10i30sku] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 18px;
    margin-top: 18px;
    background: #ffffff;
    border-radius: 12px;
    border: 1px solid #e5e7eb;
    gap: 16px;
    flex-wrap: wrap;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.notifications-pager .pager-left[b-bm10i30sku] {
    font-size: 13px;
    color: #64748b;
    font-weight: 500;
}

.notifications-pager .pager-center[b-bm10i30sku] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.notifications-pager .pager-center[b-bm10i30sku]  .k-button.pager-btn {
    width: 34px !important;
    min-width: 34px !important;
    height: 34px !important;
    padding: 0 !important;
    border-radius: 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.notifications-pager .pager-info-text[b-bm10i30sku] {
    font-size: 13px;
    color: #334155;
    padding: 0 8px;
    white-space: nowrap;
    font-weight: 500;
}

.notifications-pager .pager-right[b-bm10i30sku] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #64748b;
    font-weight: 500;
}

.notifications-pager[b-bm10i30sku]  .pager-pagesize-dropdown.k-dropdownlist {
    border-radius: 8px !important;
}

@media (max-width: 768px) {
    .notifications-pager[b-bm10i30sku] {
        flex-direction: column;
        align-items: center;
        gap: 12px;
        padding: 12px;
    }
    .notifications-pager .pager-left[b-bm10i30sku],
    .notifications-pager .pager-right[b-bm10i30sku] {
        width: 100%;
        justify-content: center;
        text-align: center;
    }
}
/* /Pages/Notifications/NotificationItem.razor.rz.scp.css */
/* /Pages/Orders/Orders.razor.rz.scp.css */
.order-status-badge[b-0w6tbi7ygr] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1;
    border: 1px solid transparent;
}

.order-status-badge--created[b-0w6tbi7ygr] {
    color: #1d4ed8;
    background-color: #dbeafe;
    border-color: #93c5fd;
}

.order-status-badge--progress[b-0w6tbi7ygr] {
    color: #92400e;
    background-color: #fef3c7;
    border-color: #fcd34d;
}

.order-status-badge--completed[b-0w6tbi7ygr] {
    color: #166534;
    background-color: #dcfce7;
    border-color: #86efac;
}

.order-status-badge--delivered[b-0w6tbi7ygr] {
    color: #0f766e;
    background-color: #ccfbf1;
    border-color: #5eead4;
}

.order-status-badge--invoiced[b-0w6tbi7ygr] {
    color: #6d28d9;
    background-color: #ede9fe;
    border-color: #c4b5fd;
}

.order-status-badge--cancelled[b-0w6tbi7ygr] {
    color: #991b1b;
    background-color: #fee2e2;
    border-color: #fca5a5;
}

.order-status-badge--default[b-0w6tbi7ygr] {
    color: #374151;
    background-color: #f3f4f6;
    border-color: #d1d5db;
}


[b-0w6tbi7ygr] .custom-base-grid tbody tr > td:first-child {
    padding: 0 !important;
    cursor: pointer !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
}

[b-0w6tbi7ygr] .custom-base-grid tbody tr > td:first-child:hover {
    background-color: rgba(99, 102, 241, 0.12) !important;
}

[b-0w6tbi7ygr] .custom-base-grid tbody tr > td:first-child:hover .badge-theme-theme {
    background-color: rgba(99, 102, 241, 0.25) !important;
    color: #4f46e5 !important;
    text-decoration: underline solid !important;
}

/* ==========================================================================
   Buscador / Escáner y Filtros de Mis Órdenes (Homologación Arregly)
   ========================================================================== */
.orders-toolbar-filters[b-0w6tbi7ygr] {
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: nowrap;
}

.orders-toolbar-filter-item[b-0w6tbi7ygr] {
    width: 195px;
    min-width: 170px;
    flex: 0 0 auto;
}

.orders-toolbar-filter-item--scanner[b-0w6tbi7ygr] {
    width: 225px;
    min-width: 210px;
    flex: 0 0 auto;
}

.orders-toolbar-filter-item[b-0w6tbi7ygr]  .dropdownlist-arregly,
.orders-toolbar-filter-item[b-0w6tbi7ygr]  .k-dropdownlist {
    width: 100% !important;
}

/* Control del ancho del buscador general (808px x 30px) */
[b-0w6tbi7ygr] .toolbar-left .search-input-container {
    flex: 0 1 808px !important;
    width: 808px !important;
    max-width: 808px !important;
    min-width: 200px !important;
}

[b-0w6tbi7ygr] .toolbar-left .search-input-container .k-textbox,
[b-0w6tbi7ygr] .toolbar-left .search-input-container .textbox-arregly {
    height: 30px !important;
}

.scanner-input-container[b-0w6tbi7ygr] {
    position: relative;
    width: 100%;
    display: inline-flex;
    align-items: center;
}

.scanner-icon[b-0w6tbi7ygr] {
    position: absolute;
    left: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: #667085;
    font-size: 0.9rem;
    pointer-events: none;
    z-index: 2;
    transition: color 0.2s ease;
}

.scanner-textbox-aurocore[b-0w6tbi7ygr] {
    width: 100%;
    height: 30px;
    padding: 0 12px 0 32px;
    border-radius: 12px;
    border: 1px solid #d0d5dd;
    background-color: #ffffff;
    color: #101828;
    font-size: 0.85rem;
    line-height: 30px;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.scanner-textbox-aurocore[b-0w6tbi7ygr]::placeholder {
    color: #98a2b3;
    font-size: 0.825rem;
}

.scanner-textbox-aurocore:hover[b-0w6tbi7ygr] {
    border-color: var(--primary-color, #50150a) !important;
    box-shadow: 0 0 0 3px var(--primary-rgba-color, rgba(80, 21, 10, 0.1)) !important;
}

.scanner-textbox-aurocore:focus[b-0w6tbi7ygr] {
    outline: none;
    border-color: var(--primary-color, #50150a) !important;
    box-shadow: 0 0 0 3px var(--primary-rgba-color, rgba(80, 21, 10, 0.15)) !important;
    background-color: #ffffff;
}

.scanner-textbox-aurocore:focus + .scanner-icon[b-0w6tbi7ygr],
.scanner-input-container:focus-within .scanner-icon[b-0w6tbi7ygr] {
    color: var(--primary-color, #50150a);
}

.scanner-textbox-aurocore:disabled[b-0w6tbi7ygr] {
    background-color: #f2f4f7;
    color: #98a2b3;
    cursor: not-allowed;
}

/* Modal de orden identificada */
.scanned-modal-icon-badge[b-0w6tbi7ygr] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: var(--primary-rgba-color, rgba(80, 21, 10, 0.1));
    color: var(--primary-color, #50150a);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.scanned-card-highlight[b-0w6tbi7ygr] {
    background-color: #f8fafc;
    border-color: #e2e8f0;
}

@media (max-width: 768px) {
    .orders-toolbar-filters[b-0w6tbi7ygr] {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
        width: 100% !important;
    }

    .orders-toolbar-filter-item[b-0w6tbi7ygr],
    .orders-toolbar-filter-item--scanner[b-0w6tbi7ygr] {
        flex: unset !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .orders-toolbar-filter-item:last-child:nth-child(odd)[b-0w6tbi7ygr],
    .orders-toolbar-filter-item--scanner:last-child:nth-child(odd)[b-0w6tbi7ygr] {
        grid-column: 1 / -1 !important;
    }

    [b-0w6tbi7ygr] .toolbar-left .search-input-container {
        flex: 1 1 auto !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
}

/* ==========================================================================
   Filtros Avanzados (Botón y Panel Desplegable)
   ========================================================================== */
.btn-advanced-filters[b-0w6tbi7ygr] {
    height: 30px;
    padding: 0 12px;
    border-radius: 12px;
    border: 1px solid #d0d5dd;
    background-color: #ffffff;
    color: #344054;
    font-size: 0.825rem;
    font-weight: 500;
    transition: all 0.2s ease;
    cursor: pointer;
    flex: 0 0 auto;
}

.btn-advanced-filters:hover[b-0w6tbi7ygr] {
    border-color: var(--primary-color, #0f766e) !important;
    color: var(--primary-color, #0f766e) !important;
    background-color: #f9fafb;
}

.btn-advanced-filters.active[b-0w6tbi7ygr] {
    background-color: var(--primary-rgba-color, rgba(15, 118, 110, 0.08)) !important;
    border-color: var(--primary-color, #0f766e) !important;
    color: var(--primary-color, #0f766e) !important;
    font-weight: 600;
}

.orders-advanced-filters-panel[b-0w6tbi7ygr] {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05);
    animation: fadeInFilters-b-0w6tbi7ygr 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes fadeInFilters-b-0w6tbi7ygr {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* /Pages/Orders/SignOrderExternally.razor.rz.scp.css */
.accept-quote-page-wrapper[b-1frbjzki93] {
    --primary-color: var(--tenant-theme-color, #059669);
    --primary-dark: color-mix(in srgb, var(--tenant-theme-color, #059669) 80%, black);
    --primary-gradient: linear-gradient(135deg, var(--tenant-theme-color, #059669) 0%, color-mix(in srgb, var(--tenant-theme-color, #059669) 80%, black) 100%);
    --primary-rgba-color: color-mix(in srgb, var(--tenant-theme-color, #059669) 15%, transparent);

    position: relative;
    min-height: 100vh;
    width: 100%;
    background: #f8fafc;
    overflow-x: hidden;
    z-index: 1;
}

/* Background blob decorations for a modern, fluid visual style */
.background-decorations[b-1frbjzki93] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}

.blob[b-1frbjzki93] {
    position: fixed;
    border-radius: 50%;
    filter: blur(120px);
    opacity: 0.12;
    z-index: 0;
}

.blob-1[b-1frbjzki93] {
    top: -10%;
    right: -10%;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, var(--primary-color) 0%, var(--primary-dark) 100%);
}

.blob-2[b-1frbjzki93] {
    bottom: -10%;
    left: -10%;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, var(--primary-dark) 0%, var(--primary-color) 100%);
}

.content-container[b-1frbjzki93] {
    position: relative;
    z-index: 2;
}

/* Glassmorphism card styles */
.glass-card[b-1frbjzki93] {
    background: rgba(255, 255, 255, 0.82);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.45);
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04), 0 1px 3px rgba(0, 0, 0, 0.02);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Header customization */
.quote-header[b-1frbjzki93] {
    border-left: 6px solid var(--primary-color);
}

.tenant-logo-placeholder[b-1frbjzki93] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: var(--primary-gradient);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: 700;
    box-shadow: 0 4px 10px rgba(5, 150, 105, 0.25);
}

.tenant-name[b-1frbjzki93] {
    font-size: 1.35rem;
    font-weight: 700;
    color: #1e293b;
    letter-spacing: -0.025em;
}

.branch-name[b-1frbjzki93] {
    font-size: 0.875rem;
    font-weight: 500;
}

.quote-code[b-1frbjzki93] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.01em;
}

.expiration-date[b-1frbjzki93] {
    font-size: 0.85rem;
}

.expiration-date strong[b-1frbjzki93] {
    color: #334155;
}

/* Section elements styling */
.card-section-title[b-1frbjzki93] {
    font-size: 1.15rem;
    font-weight: 700;
    color: #1e293b;
    display: flex;
    align-items: center;
    gap: 8px;
}

.card-section-title[b-1frbjzki93]  svg {
    color: var(--primary-color);
    width: 20px;
    height: 20px;
}

/* Custom table styling for items */
.table-arregly[b-1frbjzki93] {
    margin-bottom: 0;
}

.table-arregly thead th[b-1frbjzki93] {
    background-color: #f1f5f9;
    color: #475569;
    font-weight: 600;
    font-size: 0.825rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 12px 16px;
    border-bottom: 2px solid #e2e8f0;
}

.table-arregly tbody td[b-1frbjzki93] {
    padding: 16px;
    border-bottom: 1px solid #e2e8f0;
    color: #334155;
    font-size: 0.9rem;
}

.table-arregly tbody tr:last-child td[b-1frbjzki93] {
    border-bottom: none;
}

.item-description-block[b-1frbjzki93] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.item-name[b-1frbjzki93] {
    color: #1e293b;
    font-size: 0.95rem;
}

.item-type-badge[b-1frbjzki93] {
    align-self: flex-start;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
}

.badge-service[b-1frbjzki93] {
    background-color: rgba(5, 150, 105, 0.15);
    color: #047857;
}

.badge-product[b-1frbjzki93] {
    background-color: #f3e8ff;
    color: #7e22ce;
}

/* Client Details card style */
.client-details-list[b-1frbjzki93] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.client-detail-item[b-1frbjzki93] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.client-detail-item .label[b-1frbjzki93] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    color: #64748b;
    letter-spacing: 0.025em;
}

.client-detail-item .value[b-1frbjzki93] {
    font-size: 0.9rem;
    color: #334155;
    word-break: break-all;
}

/* Summary and totals styling */
.summary-card[b-1frbjzki93] {
    border-top: 5px solid var(--primary-color);
}

/* Loading & Error States */
.loading-state[b-1frbjzki93], .error-state[b-1frbjzki93], .success-state[b-1frbjzki93] {
    max-width: 600px;
    margin: 60px auto;
    border-top: 5px solid var(--primary-color);
}

.error-state[b-1frbjzki93] {
    border-top-color: #ef4444;
}

.success-state[b-1frbjzki93] {
    border-top-color: #10b981;
}

.loading-title[b-1frbjzki93], .error-title[b-1frbjzki93], .success-title[b-1frbjzki93] {
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
}

.spinner-container[b-1frbjzki93] {
    display: inline-block;
}

.spinner[b-1frbjzki93] {
    width: 48px;
    height: 48px;
    border: 4px solid rgba(5, 150, 105, 0.15);
    border-top-color: var(--primary-color);
    border-radius: 50%;
    animation: spin-b-1frbjzki93 1s infinite linear;
}

@keyframes spin-b-1frbjzki93 {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.error-icon-wrapper[b-1frbjzki93] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background-color: #fee2e2;
}

.error-svg-icon[b-1frbjzki93]  svg {
    color: #ef4444;
    width: 32px;
    height: 32px;
}

.error-text[b-1frbjzki93] {
    font-size: 1rem;
    color: #64748b;
    max-width: 450px;
    margin-left: auto;
    margin-right: auto;
}

/* Success page elements (migrados a SignatureSuccessCard compartido) */

/* Canvas Drawing Block style */
.signature-canvas-container[b-1frbjzki93] {
    position: relative;
    width: 100%;
    border-radius: 12px;
    overflow: hidden;
    border: 2px dashed #cbd5e1;
    background-color: #fafafa;
    transition: border-color 0.2s ease;
}

.signature-canvas-container:hover[b-1frbjzki93] {
    border-color: var(--primary-color);
}

/* Terms Acceptance layout styling */
.terms-acceptance-block[b-1frbjzki93] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}

.terms-text[b-1frbjzki93] {
    font-size: 0.85rem;
    color: #475569;
    line-height: 1.5;
}

.checkbox-custom[b-1frbjzki93] {
    width: 16px;
    height: 16px;
    border-radius: 4px;
    border: 1px solid #cbd5e1;
    accent-color: var(--primary-color);
    flex-shrink: 0;
}

/* Loader modal when saving */
.submitting-loader[b-1frbjzki93] {
    width: 100%;
    max-width: 450px;
    border-top: 5px solid var(--primary-color);
}

.submitting-loader .spinner[b-1frbjzki93] {
    margin: 0 auto;
}

.submitting-loader h4[b-1frbjzki93] {
    font-weight: 700;
    color: #0f172a;
}

.submitting-loader p[b-1frbjzki93] {
    font-size: 0.875rem;
}

/* Grid layout rules for dynamic responsive order */
.accept-quote-grid[b-1frbjzki93] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

@media (min-width: 992px) {
    .accept-quote-grid[b-1frbjzki93] {
        display: grid;
        grid-template-columns: 7fr 5fr;
        gap: 1.5rem;
        align-items: start;
    }
    
    .grid-details[b-1frbjzki93] {
        grid-column: 1;
    }
    
    .grid-totals[b-1frbjzki93] {
        grid-column: 2;
        position: sticky;
        top: 24px;
    }
}

@media (max-width: 768px) {
    /* Enforce exact rendering order on mobile */
    .accept-quote-grid[b-1frbjzki93] {
        display: flex;
        flex-direction: column;
        gap: 1rem !important;
    }

    .grid-details[b-1frbjzki93] {
        order: 1 !important;
    }

    .grid-totals[b-1frbjzki93] {
        order: 2 !important;
    }

    /* Tighter padding on mobile for cards */
    .glass-card[b-1frbjzki93] {
        padding: 16px !important;
    }
}

/* Custom central styles for buttons with Blazor isolation override */
[b-1frbjzki93] .btn-gradient-primary-arregly {
    background: var(--primary-gradient) !important;
    color: white !important;
    border: none !important;
}

[b-1frbjzki93] .btn-gradient-primary-arregly:hover {
    opacity: 0.95 !important;
}

[b-1frbjzki93] .btn-outline-primary-arregly {
    background-color: transparent !important;
    color: var(--primary-color) !important;
    border: 1px solid var(--primary-color) !important;
}

[b-1frbjzki93] .btn-outline-primary-arregly:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
    border-color: var(--primary-color) !important;
}

[b-1frbjzki93] .btn-arregly.k-disabled,
[b-1frbjzki93] .btn-arregly:disabled {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
}
/* /Pages/Orders/Views/EditOrder.razor.rz.scp.css */
.order-detail-header[b-r61kiw9iih] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.order-detail-header-main[b-r61kiw9iih] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.order-back-link[b-r61kiw9iih] {
    border: none;
    background: transparent;
    color: #6b7280;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.9rem;
    font-weight: 500;
    padding: 0;
    width: fit-content;
}

.order-back-link:hover[b-r61kiw9iih] {
    color: #111827;
}

.order-detail-title-wrap[b-r61kiw9iih] {
    display: grid;
    gap: 4px;
}

.order-detail-title-row[b-r61kiw9iih] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.tracking-code[b-r61kiw9iih] {
    letter-spacing: 2px;
}

.order-detail-header-actions[b-r61kiw9iih] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.order-module-card[b-r61kiw9iih] {
    border: none;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.order-edit-page-shell[b-r61kiw9iih]  .employee-tabstrip,
.order-edit-page-shell[b-r61kiw9iih]  .employee-tabstrip .k-tabstrip-content,
.order-edit-page-shell[b-r61kiw9iih]  .employee-tabstrip .k-content,
.order-edit-page-shell[b-r61kiw9iih]  .tab-content {
    overflow: visible !important;
    overflow-y: visible !important;
    height: auto !important;
}

.order-detail-header-row[b-r61kiw9iih] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    flex-wrap: wrap;
    gap: 16px;
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px 14px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05), 0 1px 2px 0 rgba(0, 0, 0, 0.03);
    margin-bottom: 20px;
}

@media (max-width: 768px) {
    .order-detail-header-row[b-r61kiw9iih] {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    .order-header-main-info[b-r61kiw9iih] {
        align-items: flex-start !important;
    }

    .order-detail-header-actions[b-r61kiw9iih] {
        display: flex;
        flex-direction: row !important;
        justify-content: space-between !important;
        align-items: center !important;
        gap: 6px !important;
        border-top: 1px solid #e2e8f0;
        padding-top: 12px;
        margin-top: 4px;
        width: 100% !important;
        flex-wrap: nowrap !important;
    }

    .order-detail-header-actions[b-r61kiw9iih]  .k-button {
        width: auto !important;
        min-width: 0 !important;
        max-width: max-content !important;
        padding: 5px 10px !important;
        font-size: 0.75rem !important;
        font-weight: 600 !important;
        border-radius: 8px !important;
        white-space: nowrap !important;
    }

    .order-detail-header-actions[b-r61kiw9iih]  .k-button .k-svg-icon {
        width: 14px !important;
        height: 14px !important;
        font-size: 14px !important;
        flex-shrink: 0 !important;
    }

    .order-detail-header-actions[b-r61kiw9iih]  .btn-outline-primary-arregly {
        order: 1 !important;
    }

    .order-detail-header-actions[b-r61kiw9iih]  .btn-gradient-primary-arregly,
    .order-detail-header-actions[b-r61kiw9iih]  .btn-primary-arregly {
        order: 2 !important;
        margin-left: auto !important;
    }

    .order-detail-header-actions[b-r61kiw9iih]  .k-hidden,
    .order-detail-header-actions[b-r61kiw9iih]  .k-button.k-hidden {
        display: none !important;
    }

    .order-header-title[b-r61kiw9iih] {
        font-size: 1.4rem !important;
    }

    .order-status-badge[b-r61kiw9iih] {
        margin-left: auto !important;
    }

    .d-none-canceled-mobile[b-r61kiw9iih] {
        display: none !important;
    }
}

@media (max-width: 360px) {
    .order-detail-header-actions[b-r61kiw9iih] {
        gap: 4px !important;
    }

    .order-detail-header-actions[b-r61kiw9iih]  .k-button {
        padding: 4px 7px !important;
        font-size: 0.72rem !important;
        gap: 3px !important;
    }
}

.alert-cancellation-reason[b-r61kiw9iih] {
    background-color: #fff1f2;
    /* rojo suave/rosa */
    border: 1.5px solid #fda4af;
    /* borde rojo suave */
    border-radius: 12px;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    margin-top: 20px;
    margin-bottom: 20px;
    box-shadow: 0 4px 12px rgba(225, 29, 72, 0.05);
}

.cancellation-icon-container[b-r61kiw9iih] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background-color: #ffe4e6;
    /* rojo suave más oscuro */
    color: #e11d48;
    /* rojo fuerte */
    flex-shrink: 0;
}

.cancellation-icon-container[b-r61kiw9iih]  .k-svg-icon {
    width: 24px;
    height: 24px;
}

.cancellation-title[b-r61kiw9iih] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #9f1239;
    /* rojo oscuro */
}

.cancellation-text[b-r61kiw9iih] {
    font-size: 0.9rem;
    color: #4c0519;
    /* rojo muy oscuro / marrón rojizo */
    line-height: 1.4;
}

.order-status-badge[b-r61kiw9iih] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1;
    border: 1px solid transparent;
}

.order-status-badge--created[b-r61kiw9iih] {
    color: #1d4ed8;
    background-color: #dbeafe;
    border-color: #93c5fd;
}

.order-status-badge--progress[b-r61kiw9iih] {
    color: #92400e;
    background-color: #fef3c7;
    border-color: #fcd34d;
}

.order-status-badge--completed[b-r61kiw9iih] {
    color: #166534;
    background-color: #dcfce7;
    border-color: #86efac;
}

.order-status-badge--delivered[b-r61kiw9iih] {
    color: #0f766e;
    background-color: #ccfbf1;
    border-color: #5eead4;
}

.order-status-badge--invoiced[b-r61kiw9iih] {
    color: #6d28d9;
    background-color: #ede9fe;
    border-color: #c4b5fd;
}

.order-status-badge--cancelled[b-r61kiw9iih] {
    color: #991b1b;
    background-color: #fee2e2;
    border-color: #fca5a5;
}

.order-status-badge--default[b-r61kiw9iih] {
    color: #374151;
    background-color: #f3f4f6;
    border-color: #d1d5db;
}

.order-header-main-info[b-r61kiw9iih] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.order-header-title[b-r61kiw9iih] {
    font-size: 1.65rem;
    font-weight: 800;
    color: #0f172a !important;
    /* Very dark slate-900 */
    letter-spacing: 1px;
}

.order-header-subtitle[b-r61kiw9iih] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    /* Increased spacing */
    font-size: 0.9rem;
    color: #475569;
    /* Slate-600 */
    line-height: 1.2;
}

.subtitle-item[b-r61kiw9iih] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.subtitle-separator[b-r61kiw9iih] {
    color: #94a3b8;
}

.order-header-subtitle[b-r61kiw9iih]  .k-svg-icon {
    align-self: center;
    position: relative;
    top: -1px;
    /* Optical centering alignment */
}

@media (max-width: 576px) {
    .order-header-subtitle[b-r61kiw9iih] {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .subtitle-separator[b-r61kiw9iih] {
        display: none !important;
    }
}

.order-detail-header-row[b-r61kiw9iih]  .order-back-link-btn,
.order-detail-header-row[b-r61kiw9iih]  .order-back-link-btn.k-button {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-color: transparent !important;
    padding: 4px !important;
    color: var(--primary-color, #667eea) !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: none !important;
    transition: opacity 0.2s ease;
}

.order-detail-header-row[b-r61kiw9iih]  .order-back-link-btn:hover,
.order-detail-header-row[b-r61kiw9iih]  .order-back-link-btn.k-button:hover {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-color: transparent !important;
    opacity: 0.7 !important;
    box-shadow: none !important;
}

.order-detail-header-row[b-r61kiw9iih]  .order-back-link-btn:focus,
.order-detail-header-row[b-r61kiw9iih]  .order-back-link-btn:active,
.order-detail-header-row[b-r61kiw9iih]  .order-back-link-btn.k-button:focus,
.order-detail-header-row[b-r61kiw9iih]  .order-back-link-btn.k-button:active {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

.order-detail-header-row[b-r61kiw9iih]  .order-back-link-btn .k-svg-icon,
.order-detail-header-row[b-r61kiw9iih]  .order-back-link-btn.k-button .k-svg-icon {
    color: var(--primary-color, #667eea) !important;
}

.quote-code-highlight[b-r61kiw9iih] {
    color: var(--primary-color, #667eea) !important;
    /* Theme primary color */
    font-weight: 700;
    text-decoration: none;
}

.quote-code-highlight:hover[b-r61kiw9iih] {
    text-decoration: underline;
    opacity: 0.85;
}
/* /Pages/PaymentGateway/PaymentResultSummary.razor.rz.scp.css */
.receipt-page-container[b-z5hg8k52yh] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f0f2f5;
    background-image: 
        radial-gradient(at 0% 0%, color-mix(in srgb, var(--primary-color, #7c3aed) 8%, transparent) 0px, transparent 50%),
        radial-gradient(at 100% 100%, color-mix(in srgb, var(--primary-color, #7c3aed) 5%, transparent) 0px, transparent 50%);
    padding: 30px 16px;
}

.ticket-wrapper[b-z5hg8k52yh] {
    max-width: 440px;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 14px;
    animation: ticketSlideIn-b-z5hg8k52yh 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

@keyframes ticketSlideIn-b-z5hg8k52yh {
    from {
        opacity: 0;
        transform: translateY(12px) scale(0.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

/* ── EL TIQUETE FINTECH / TIRA DE PAGO ── */
.fintech-ticket[b-z5hg8k52yh] {
    background: #ffffff;
    border-radius: 20px;
    box-shadow: 0 12px 32px -4px rgba(15, 23, 42, 0.08), 0 4px 12px -2px rgba(15, 23, 42, 0.04);
    position: relative;
    border: 1px solid #e2e8f0;
}

/* Barra superior de acento */
.ticket-accent-bar[b-z5hg8k52yh] {
    height: 6px;
    border-radius: 20px 20px 0 0;
    background: var(--primary-color, #7c3aed);
}

.ticket-accent-bar.success[b-z5hg8k52yh] {
    background: linear-gradient(90deg, #10b981 0%, #059669 100%);
}

.ticket-accent-bar.danger[b-z5hg8k52yh] {
    background: linear-gradient(90deg, #ef4444 0%, #dc2626 100%);
}

.ticket-accent-bar.warning[b-z5hg8k52yh] {
    background: linear-gradient(90deg, #f59e0b 0%, #d97706 100%);
}

/* Sección Superior del Tiquete */
.ticket-top-section[b-z5hg8k52yh] {
    padding: 22px 24px 14px 24px;
    text-align: center;
}

.ticket-badge-pill[b-z5hg8k52yh] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.725rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 12px;
}

.ticket-badge-pill.success[b-z5hg8k52yh] {
    background: #ecfdf5;
    color: #059669;
    border: 1px solid #a7f3d0;
}

.ticket-badge-pill.danger[b-z5hg8k52yh] {
    background: #fef2f2;
    color: #dc2626;
    border: 1px solid #fecaca;
}

.ticket-badge-pill.warning[b-z5hg8k52yh] {
    background: #fffbeb;
    color: #d97706;
    border: 1px solid #fde68a;
}

.ticket-status-circle[b-z5hg8k52yh] {
    width: 58px;
    height: 58px;
    border-radius: 50%;
    margin: 0 auto 10px auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.9rem;
}

.ticket-status-circle.success[b-z5hg8k52yh] {
    background: #ecfdf5;
    border: 2.5px solid #34d399;
    color: #059669;
}

.ticket-status-circle.danger[b-z5hg8k52yh] {
    background: #fef2f2;
    border: 2.5px solid #f87171;
    color: #dc2626;
}

.ticket-status-circle.warning[b-z5hg8k52yh] {
    background: #fffbeb;
    border: 2.5px solid #fbbf24;
    color: #d97706;
}

.ticket-title[b-z5hg8k52yh] {
    font-size: 1.2rem;
    font-weight: 800;
    color: #0f172a;
    margin-bottom: 2px;
}

.ticket-subtitle[b-z5hg8k52yh] {
    font-size: 0.78rem;
    color: #64748b;
    margin-bottom: 14px;
}

/* Valor Principal Estilo Tiquete */
.ticket-amount-box[b-z5hg8k52yh] {
    background: color-mix(in srgb, var(--primary-color, #7c3aed) 4%, #f8fafc);
    border-radius: 12px;
    padding: 12px 16px;
    border: 1.5px dashed color-mix(in srgb, var(--primary-color, #7c3aed) 25%, #cbd5e1);
}

.ticket-amount-label[b-z5hg8k52yh] {
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #64748b;
    display: block;
    margin-bottom: 2px;
}

.ticket-amount-value[b-z5hg8k52yh] {
    font-size: 2.1rem;
    font-weight: 900;
    color: var(--primary-color, #7c3aed);
    line-height: 1.1;
    letter-spacing: -0.02em;
}

/* ── DIVISOR DE RECORTE / MUESCAS LATERALES (TICKET NOTCH) ── */
.ticket-notch-divider[b-z5hg8k52yh] {
    position: relative;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.notch-left[b-z5hg8k52yh],
.notch-right[b-z5hg8k52yh] {
    position: absolute;
    width: 20px;
    height: 20px;
    background: #f0f2f5;
    border-radius: 50%;
    top: 1px;
    z-index: 2;
    box-shadow: inset 0 0 0 1px #e2e8f0;
}

.notch-left[b-z5hg8k52yh] {
    left: -10px;
}

.notch-right[b-z5hg8k52yh] {
    right: -10px;
}

.ticket-perforation-line[b-z5hg8k52yh] {
    width: 86%;
    border-top: 2px dashed #cbd5e1;
}

/* ── SECCIÓN INFERIOR DEL TIQUETE (DETALLES) ── */
.ticket-bottom-section[b-z5hg8k52yh] {
    padding: 12px 24px 20px 24px;
}

.ticket-details-grid[b-z5hg8k52yh] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 16px;
}

.ticket-detail-item[b-z5hg8k52yh] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.825rem;
}

.ticket-detail-item:not(:last-child)[b-z5hg8k52yh] {
    padding-bottom: 7px;
    border-bottom: 1px dotted #e2e8f0;
}

.ticket-item-label[b-z5hg8k52yh] {
    color: #64748b;
    font-weight: 500;
}

.ticket-item-value[b-z5hg8k52yh] {
    color: #1e293b;
    font-weight: 600;
    text-align: right;
}

.ticket-item-value.monospace[b-z5hg8k52yh] {
    font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-size: 0.775rem;
    color: #334155;
    background: #f1f5f9;
    padding: 2px 6px;
    border-radius: 4px;
}

/* Código de Barras / Pie de Seguridad */
.ticket-footer-barcode[b-z5hg8k52yh] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    padding-top: 10px;
    border-top: 1px solid #f1f5f9;
}

.barcode-strip[b-z5hg8k52yh] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2.5px;
    height: 24px;
    opacity: 0.6;
}

.barcode-bar[b-z5hg8k52yh] {
    height: 100%;
    background: #334155;
    border-radius: 1px;
}

.barcode-caption[b-z5hg8k52yh] {
    font-size: 0.675rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #94a3b8;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 4px;
}

/* ── BOTONES DE ACCIÓN ── */
.ticket-actions-row[b-z5hg8k52yh] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}

/* ── ESTILOS DE IMPRESIÓN ── */
@media print {
    .receipt-page-container[b-z5hg8k52yh] {
        background: #ffffff !important;
        padding: 0 !important;
        min-height: auto !important;
    }

    .ticket-wrapper[b-z5hg8k52yh] {
        max-width: 100% !important;
        width: 100% !important;
    }

    .fintech-ticket[b-z5hg8k52yh] {
        box-shadow: none !important;
        border: 1px solid #000000 !important;
        border-radius: 0 !important;
    }

    .ticket-notch-divider[b-z5hg8k52yh] {
        display: none !important;
    }

    .ticket-actions-row[b-z5hg8k52yh] {
        display: none !important;
    }
}
/* /Pages/PointOfSale/Components/CashMovementModal.razor.rz.scp.css */
/* Cabecera personalizada */
.movement-header-icon-badge[b-pahcoq91bl] {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background-color: #ecfdf5;
    border: 1px solid #d1fae5;
    color: #059669;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1.25rem;
}

.movement-header-subtitle[b-pahcoq91bl] {
    font-size: 0.8rem;
    color: #64748b;
    display: block;
    margin-top: 1px;
}

/* Tarjeta informativa de Caja y Efectivo disponible */
.cash-session-info-card[b-pahcoq91bl] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 12px 18px;
}

.cash-session-wallet-icon[b-pahcoq91bl] {
    font-size: 1.35rem;
    color: #475569;
    flex-shrink: 0;
}

.cash-session-name[b-pahcoq91bl] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.cash-session-divider[b-pahcoq91bl] {
    height: 34px;
    width: 1px;
    background-color: #e2e8f0;
    margin: 0 16px;
    flex-shrink: 0;
}

.cash-session-label[b-pahcoq91bl] {
    font-size: 0.74rem;
    color: #64748b;
    display: block;
    line-height: 1.2;
    margin-bottom: 2px;
}

.cash-session-amount[b-pahcoq91bl] {
    font-size: 1.15rem;
    font-weight: 800;
    color: #059669;
    line-height: 1.2;
}

/* Contenedor y botones de selección de tipo de movimiento (Ingreso / Egreso) */
.movement-type-container[b-pahcoq91bl] {
    display: flex;
    gap: 10px;
    width: 100%;
}

.movement-type-btn[b-pahcoq91bl] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 10px 16px;
    border-radius: 10px;
    font-size: 0.9rem;
    font-weight: 600;
    cursor: pointer;
    border: 1.5px solid #e2e8f0;
    background-color: #f8fafc;
    color: #475569;
    transition: all 0.2s ease-in-out;
    width: 50%;
}

.movement-type-btn:hover[b-pahcoq91bl] {
    background-color: #f1f5f9;
    border-color: #cbd5e1;
    color: #334155;
}

.movement-type-btn[b-pahcoq91bl]  .k-svg-icon,
.movement-type-btn svg[b-pahcoq91bl] {
    color: currentColor;
    fill: currentColor;
}

/* Estado activo: Ingreso (+) */
.movement-type-btn.movement-in.active[b-pahcoq91bl] {
    background-color: #ecfdf5;
    border-color: #10b981;
    color: #047857;
    box-shadow: 0 2px 6px rgba(16, 185, 129, 0.15);
}

.movement-type-btn.movement-in:not(.active):hover[b-pahcoq91bl] {
    border-color: #a7f3d0;
    color: #059669;
    background-color: #f0fdf4;
}

/* Estado activo: Egreso (-) */
.movement-type-btn.movement-out.active[b-pahcoq91bl] {
    background-color: #fef2f2;
    border-color: #ef4444;
    color: #b91c1c;
    box-shadow: 0 2px 6px rgba(239, 68, 68, 0.15);
}

.movement-type-btn.movement-out:not(.active):hover[b-pahcoq91bl] {
    border-color: #fecaca;
    color: #dc2626;
    background-color: #fef2f2;
}

/* Botón de confirmar guardado en verde esmeralda (Mockup) */
[b-pahcoq91bl] .btn-movement-save {
    background-color: #047857 !important;
    color: #ffffff !important;
    border: 1px solid #047857 !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    transition: all 0.2s ease !important;
}

[b-pahcoq91bl] .btn-movement-save:hover {
    background-color: #065f46 !important;
    border-color: #065f46 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(4, 120, 87, 0.25) !important;
}

[b-pahcoq91bl] .btn-movement-save .k-button-text,
[b-pahcoq91bl] .btn-movement-save .k-svg-icon,
[b-pahcoq91bl] .btn-movement-save svg {
    color: #ffffff !important;
    fill: #ffffff !important;
}

/* Estilos responsivos para botones del footer */
[b-pahcoq91bl] .btn-movement-modal-action {
    min-width: auto !important;
    padding: 7px 16px !important;
    font-size: 0.85rem !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

@media (max-width: 480px) {
    [b-pahcoq91bl] .movement-modal-footer {
        gap: 6px !important;
    }

    [b-pahcoq91bl] .btn-movement-modal-action {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        padding: 6px 8px !important;
        font-size: 0.78rem !important;
        letter-spacing: -0.2px !important;
    }

    [b-pahcoq91bl] .btn-movement-modal-action .k-button-text {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}
/* /Pages/PointOfSale/Components/CashSessionDetailModal.razor.rz.scp.css */
/* ==========================================================================
   CashSessionDetailModal.razor.css - Estilos del Modal de Detalle de Sesión
   ========================================================================== */

/* Contenedor raíz del cuerpo sin padding redundante (hereda padding de ModalBase) */
.session-detail-body[b-8wl3tct0zf] {
    padding: 0;
    width: 100%;
}

/* Contenedor de cada pestaña: cero padding horizontal para aprovechar el modal */
.session-tab-content[b-8wl3tct0zf] {
    padding: 10px 0 0 0;
    width: 100%;
}

/* ==========================================================================
   Tabs Estilo Cápsulas Flotantes (Reutilizando patrón Promotions y CustomTabStrip)
   ========================================================================== */
[b-8wl3tct0zf] .session-tabs.k-tabstrip,
[b-8wl3tct0zf] .session-tabs .k-tabstrip,
[b-8wl3tct0zf] .session-tabs.k-widget {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0;
}

[b-8wl3tct0zf] .session-tabs .k-tabstrip-items-wrapper {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(226, 232, 240, 0.8) !important;
    padding: 0 0 4px 0 !important;
    margin-bottom: 12px !important;
}

[b-8wl3tct0zf] .session-tabs .k-tabstrip-items {
    background: transparent !important;
    border: 0 !important;
    padding: 2px 0 !important;
    gap: 8px !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none !important;
}

[b-8wl3tct0zf] .session-tabs .k-tabstrip-items::-webkit-scrollbar {
    display: none !important;
}

[b-8wl3tct0zf] .session-tabs .k-tabstrip-item {
    border: 1px solid rgba(226, 232, 240, 0.9) !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    color: #64748b !important;
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03) !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
}

[b-8wl3tct0zf] .session-tabs .k-tabstrip-item:hover {
    color: #0f172a !important;
    background: #f8fafc !important;
    border-color: #cbd5e1 !important;
}

[b-8wl3tct0zf] .session-tabs .k-tabstrip-item.k-active,
[b-8wl3tct0zf] .session-tabs .k-tabstrip-item.k-selected {
    background: var(--primary-color, #034C48) !important;
    color: #ffffff !important;
    border-color: var(--primary-color, #034C48) !important;
    box-shadow: 0 4px 12px color-mix(in srgb, var(--primary-color, #034C48) 25%, transparent) !important;
}

[b-8wl3tct0zf] .session-tabs .k-tabstrip-item .k-link {
    padding: 8px 16px !important;
    font-weight: 600 !important;
    font-size: 0.88rem !important;
    color: inherit !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    outline: none !important;
    box-shadow: none !important;
    border: none !important;
}

[b-8wl3tct0zf] .session-tabs .k-tabstrip-item.k-active .k-svg-icon,
[b-8wl3tct0zf] .session-tabs .k-tabstrip-item.k-selected .k-svg-icon {
    color: #ffffff !important;
}

[b-8wl3tct0zf] .session-tabs .k-tabstrip-content,
[b-8wl3tct0zf] .session-tabs .k-content,
[b-8wl3tct0zf] .session-tabs .k-tabstrip-content:focus,
[b-8wl3tct0zf] .session-tabs .k-content:focus,
[b-8wl3tct0zf] .session-tabs .k-tabstrip-content:focus-visible,
[b-8wl3tct0zf] .session-tabs .k-content:focus-visible,
[b-8wl3tct0zf] .session-tabs .k-tabstrip-content.k-focus,
[b-8wl3tct0zf] .session-tabs .k-content.k-focus {
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    box-shadow: none !important;
    outline: none !important;
}

.session-tab-counter[b-8wl3tct0zf] {
    background: rgba(0, 0, 0, 0.08);
    color: inherit;
    font-size: 0.72rem;
    padding: 1px 7px;
    border-radius: 999px;
    font-weight: 700;
}

[b-8wl3tct0zf] .session-tabs .k-tabstrip-item.k-active .session-tab-counter {
    background: rgba(255, 255, 255, 0.25);
    color: #ffffff;
}

/* ==========================================================================
   Tarjeta Superior: Información General de la Sesión
   ========================================================================== */
.session-info-card[b-8wl3tct0zf] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 14px 16px;
}

.info-label[b-8wl3tct0zf] {
    display: block;
    font-size: 0.72rem;
    font-weight: 500;
    color: #64748b;
    margin-bottom: 2px;
}

.info-value[b-8wl3tct0zf] {
    font-size: 0.88rem;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.35;
}

.info-value-highlight[b-8wl3tct0zf] {
    font-size: 1.15rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.25;
}

.info-icon[b-8wl3tct0zf] {
    font-size: 0.92rem;
    color: #64748b;
    flex-shrink: 0;
}

.info-subtext[b-8wl3tct0zf] {
    font-size: 0.7rem;
    color: #64748b;
    margin-top: 2px;
    font-style: italic;
}

.status-badge-pill[b-8wl3tct0zf] {
    padding: 3px 10px !important;
    border-radius: 20px !important;
    font-size: 0.75rem !important;
    font-weight: 600 !important;
}

.status-dot[b-8wl3tct0zf] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: currentColor;
    display: inline-block;
    flex-shrink: 0;
}

/* ==========================================================================
   Rejilla Simétrica 2x3 de Métricas Financieras
   ========================================================================== */
.metrics-grid[b-8wl3tct0zf] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}

.metric-card[b-8wl3tct0zf] {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 12px 14px;
    display: flex;
    align-items: center;
    gap: 10px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    transition: box-shadow 0.2s ease, border-color 0.2s ease, transform 0.15s ease;
    min-width: 0;
}

.metric-card:hover[b-8wl3tct0zf] {
    border-color: #cbd5e1;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.06);
}

.metric-icon-wrapper[b-8wl3tct0zf] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1rem;
}

/* Variantes temáticas de iconos */
.metric-icon--base[b-8wl3tct0zf] {
    background-color: #ecfdf5;
    color: #059669;
    border: 1px solid #d1fae5;
}

.metric-icon--incomes[b-8wl3tct0zf] {
    background-color: #ecfdf5;
    color: #059669;
    border: 1px solid #d1fae5;
}

.metric-icon--outcomes[b-8wl3tct0zf] {
    background-color: #fef2f2;
    color: #dc2626;
    border: 1px solid #fee2e2;
}

.metric-icon--expected[b-8wl3tct0zf] {
    background-color: #eff6ff;
    color: #2563eb;
    border: 1px solid #dbeafe;
}

.metric-icon--actual[b-8wl3tct0zf] {
    background-color: #f1f5f9;
    color: #334155;
    border: 1px solid #e2e8f0;
}

.metric-icon--diff[b-8wl3tct0zf] {
    background-color: #f1f5f9;
    color: #334155;
    border: 1px solid #e2e8f0;
}

.metric-content[b-8wl3tct0zf] {
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
    flex: 1 1 auto;
}

.metric-label[b-8wl3tct0zf] {
    font-size: 0.68rem;
    font-weight: 600;
    color: #64748b;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.2;
}

.metric-value[b-8wl3tct0zf] {
    font-size: 1.1rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 2px;
}

/* ==========================================================================
   Desglose por Método de Pago y Notas
   ========================================================================== */
.session-breakdown-card[b-8wl3tct0zf] {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 14px 16px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}

.session-breakdown-title[b-8wl3tct0zf] {
    font-weight: 700;
    font-size: 0.92rem;
    color: #1e293b;
    margin-bottom: 0.75rem;
}

.session-notes-card[b-8wl3tct0zf] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 12px 14px;
}

/* ==========================================================================
   Barra de Filtros Segmentados de Métodos de Pago
   ========================================================================== */
.session-filter-bar[b-8wl3tct0zf] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    width: 100%;
}

.session-filter-pills[b-8wl3tct0zf] {
    display: flex;
    align-items: center;
    background: #f1f5f9;
    padding: 3px 3px 5px 3px;
    border-radius: 10px;
    gap: 3px;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 transparent;
    flex: 1 1 0%;
    min-width: 0;
}

.session-filter-pills[b-8wl3tct0zf]::-webkit-scrollbar {
    height: 4px;
}

.session-filter-pills[b-8wl3tct0zf]::-webkit-scrollbar-track {
    background: transparent;
}

.session-filter-pills[b-8wl3tct0zf]::-webkit-scrollbar-thumb {
    background-color: #cbd5e1;
    border-radius: 999px;
}

.session-filter-pills[b-8wl3tct0zf]::-webkit-scrollbar-thumb:hover {
    background-color: #94a3b8;
}

[b-8wl3tct0zf] .btn-session-reload {
    width: 34px !important;
    min-width: 34px !important;
    max-width: 34px !important;
    height: 34px !important;
    padding: 0 !important;
    flex: 0 0 34px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.session-filter-pill[b-8wl3tct0zf] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border: none;
    background: transparent;
    border-radius: 8px;
    font-size: 0.8rem;
    font-weight: 500;
    color: #64748b;
    cursor: pointer;
    transition: all 0.18s ease;
    user-select: none;
    white-space: nowrap;
    flex-shrink: 0;
}

.session-filter-pill:hover:not(.active)[b-8wl3tct0zf] {
    color: #1e293b;
    background: rgba(255, 255, 255, 0.6);
}

.session-filter-pill.active[b-8wl3tct0zf] {
    background: #ffffff;
    color: var(--primary-color, #034C48);
    font-weight: 600;
    box-shadow: 0 2px 6px rgba(15, 23, 42, 0.08);
}

.session-filter-badge[b-8wl3tct0zf] {
    padding: 1px 6px;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 700;
    background: #e2e8f0;
    color: #334155;
    transition: background 0.15s ease, color 0.15s ease;
}

.session-filter-pill.active .session-filter-badge[b-8wl3tct0zf] {
    background: color-mix(in srgb, var(--primary-color, #034C48) 12%, #ffffff);
    color: var(--primary-color, #034C48);
}

/* ==========================================================================
   Barra Resumen de Totales Generales en Pestaña Movimientos
   ========================================================================== */
.session-movements-totals-card[b-8wl3tct0zf] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 8px 14px;
}

.totals-label[b-8wl3tct0zf] {
    font-size: 0.65rem;
    font-weight: 600;
    color: #64748b;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    line-height: 1.2;
}

.totals-value[b-8wl3tct0zf] {
    font-size: 0.95rem;
    font-weight: 700;
    line-height: 1.2;
    margin-top: 1px;
}

.movement-change-hint[b-8wl3tct0zf] {
    font-size: 0.68rem;
    color: #64748b;
    margin-top: 2px;
    line-height: 1;
    white-space: nowrap;
}

.movement-change-hint strong[b-8wl3tct0zf] {
    color: var(--primary-color, #034C48);
    font-weight: 600;
}

.movement-change-container[b-8wl3tct0zf] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.67rem;
    line-height: 1.1;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    padding: 2px 5px;
    margin-top: 3px;
    white-space: nowrap;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
}

.movement-change-item[b-8wl3tct0zf] {
    display: inline-flex;
    align-items: center;
    gap: 2px;
}

.movement-change-divider[b-8wl3tct0zf] {
    color: #cbd5e1;
    font-size: 0.65rem;
    user-select: none;
}

/* ==========================================================================
   Tabla de Movimientos (TelerikGrid)
   ========================================================================== */
[b-8wl3tct0zf] .session-movements-grid.k-grid {
    border-radius: 12px !important;
    border: none !important;
    background: #ffffff !important;
    box-shadow: none !important;
    overflow: hidden !important;
}

[b-8wl3tct0zf] .session-movements-grid .k-grid-header {
    background-color: #f8fafc !important;
    border-bottom: 1px solid #e2e8f0 !important;
    padding-right: 0 !important;
}

[b-8wl3tct0zf] .session-movements-grid .k-grid-header th {
    font-size: 0.74rem !important;
    font-weight: 700 !important;
    color: #64748b !important;
    text-transform: uppercase !important;
    letter-spacing: 0.3px !important;
    padding: 9px 8px !important;
    border-color: #f1f5f9 !important;
    background-color: transparent !important;
}

[b-8wl3tct0zf] .session-movements-grid .k-grid-table td {
    padding: 7px 8px !important;
    font-size: 0.82rem !important;
    border-color: #f1f5f9 !important;
    vertical-align: middle !important;
}

[b-8wl3tct0zf] .session-movements-grid .k-grid-pager {
    border-top: 1px solid #e2e8f0 !important;
    background: #ffffff !important;
    padding: 6px 12px !important;
}

/* Badges semánticos de montos y avatares */
.movement-qty-badge[b-8wl3tct0zf] {
    display: inline-flex;
    align-items: center;
    font-weight: 700;
    font-size: 0.8rem;
    padding: 2px 8px;
    border-radius: 6px;
    white-space: nowrap;
}

.movement-qty-badge--positive[b-8wl3tct0zf] {
    background-color: #ecfdf5;
    color: #059669;
    border: 1px solid #a7f3d0;
}

.movement-qty-badge--negative[b-8wl3tct0zf] {
    background-color: #fef2f2;
    color: #dc2626;
    border: 1px solid #fecaca;
}

.user-avatar-circle[b-8wl3tct0zf] {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--primary-color, #034C48) 12%, #ffffff);
    color: var(--primary-color, #034C48);
    font-weight: 700;
    font-size: 0.7rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid color-mix(in srgb, var(--primary-color, #034C48) 25%, #ffffff);
}

.user-avatar-circle--system[b-8wl3tct0zf] {
    background: #f1f5f9;
    color: #64748b;
    border-color: #cbd5e1;
}

/* ==========================================================================
   Pie del Modal y Botones de Acción
   ========================================================================== */
.session-detail-footer[b-8wl3tct0zf] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    width: 100%;
}

[b-8wl3tct0zf] .btn-session-detail-action {
    min-width: auto !important;
    padding: 6px 14px !important;
    font-size: 0.85rem !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ==========================================================================
   Adaptabilidad Móvil (Pantallas Angostas 320px - 480px)
   ========================================================================== */
@media (max-width: 480px) {
    .session-tab-content[b-8wl3tct0zf] {
        padding: 6px 0 0 0;
    }

    [b-8wl3tct0zf] .session-tabs .k-tabstrip-item .k-link {
        padding: 6px 10px !important;
        font-size: 0.78rem !important;
    }

    .session-info-card[b-8wl3tct0zf] {
        padding: 10px 12px;
    }

    .info-label[b-8wl3tct0zf] {
        font-size: 0.66rem;
    }

    .info-value[b-8wl3tct0zf] {
        font-size: 0.78rem;
    }

    .info-value-highlight[b-8wl3tct0zf] {
        font-size: 0.95rem;
    }

    .metrics-grid[b-8wl3tct0zf] {
        gap: 6px;
    }

    .metric-card[b-8wl3tct0zf] {
        padding: 8px 6px;
        gap: 6px;
    }

    .metric-icon-wrapper[b-8wl3tct0zf] {
        width: 26px;
        height: 26px;
        font-size: 0.75rem;
    }

    .metric-label[b-8wl3tct0zf] {
        font-size: 0.58rem;
        letter-spacing: 0;
    }

    .metric-value[b-8wl3tct0zf] {
        font-size: 0.84rem;
    }

    .session-breakdown-card[b-8wl3tct0zf] {
        padding: 10px 12px;
    }

    .session-notes-card[b-8wl3tct0zf] {
        padding: 8px 10px;
    }

    .session-filter-pill[b-8wl3tct0zf] {
        padding: 4px 8px;
        font-size: 0.74rem;
    }

    .session-detail-footer[b-8wl3tct0zf] {
        gap: 6px !important;
    }

    [b-8wl3tct0zf] .btn-session-detail-action {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        padding: 6px 8px !important;
        font-size: 0.78rem !important;
        letter-spacing: -0.2px !important;
    }

    [b-8wl3tct0zf] .btn-session-detail-action .k-button-text {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

@media (max-width: 360px) {
    .metrics-grid[b-8wl3tct0zf] {
        gap: 4px;
    }

    .metric-card[b-8wl3tct0zf] {
        padding: 6px 4px;
        gap: 4px;
    }

    .metric-icon-wrapper[b-8wl3tct0zf] {
        width: 22px;
        height: 22px;
        font-size: 0.7rem;
    }

    .metric-label[b-8wl3tct0zf] {
        font-size: 0.54rem;
    }

    .metric-value[b-8wl3tct0zf] {
        font-size: 0.78rem;
    }

    .session-info-card[b-8wl3tct0zf] {
        padding: 8px 10px;
    }
}

/* ==========================================================================
   Overlay y contenedor de carga para movimientos
   ========================================================================== */
.session-movements-grid-wrapper[b-8wl3tct0zf] {
    min-height: 220px;
}

.session-movements-loading-overlay[b-8wl3tct0zf] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(255, 255, 255, 0.78);
    backdrop-filter: blur(1.5px);
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
}
/* /Pages/PointOfSale/Components/CloseSessionModal.razor.rz.scp.css */
/* Estilos aislados y responsivos para botones del modal de cierre de caja */
.close-session-footer[b-cmply4txj2],
[b-cmply4txj2] .close-session-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.close-session-content[b-cmply4txj2] {
    width: 100%;
}

/* 1. Tarjeta de Información Básica (Caja, Cajero, Apertura, Base) */
.session-info-card[b-cmply4txj2] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px 20px;
}

.session-info-icon-badge[b-cmply4txj2] {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    color: #64748b;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1.1rem;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.session-info-label[b-cmply4txj2] {
    display: block;
    font-size: 0.76rem;
    font-weight: 500;
    color: #64748b;
    line-height: 1.25;
    margin-bottom: 2px;
}

.session-info-value[b-cmply4txj2] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.3;
}

/* 2. Tarjeta: Efectivo Físico Esperado */
.expected-cash-card[b-cmply4txj2] {
    background-color: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 12px;
    padding: 18px 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.expected-cash-icon-badge[b-cmply4txj2] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background-color: #dcfce7;
    color: #059669;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1.25rem;
}

.expected-cash-title[b-cmply4txj2] {
    font-size: 0.92rem;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.2;
}

.expected-cash-amount[b-cmply4txj2] {
    font-size: 1.85rem;
    font-weight: 800;
    color: #059669;
    line-height: 1.2;
    margin-top: 4px;
    margin-bottom: 3px;
}

.expected-cash-subtitle[b-cmply4txj2] {
    font-size: 0.74rem;
    color: #64748b;
    line-height: 1.2;
}

/* 3. Tarjeta: Desglose de Ventas */
.sales-breakdown-card[b-cmply4txj2] {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.sales-breakdown-icon[b-cmply4txj2] {
    color: #0f172a;
    font-size: 1.05rem;
}

.sales-breakdown-title[b-cmply4txj2] {
    font-size: 0.92rem;
    font-weight: 700;
    color: #0f172a;
}

.sales-breakdown-list[b-cmply4txj2] {
    display: flex;
    flex-direction: column;
}

.sales-breakdown-row[b-cmply4txj2] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 5px 0;
}

.sales-breakdown-row.border-bottom[b-cmply4txj2] {
    border-bottom: 1px solid #f1f5f9 !important;
}

.sales-breakdown-method[b-cmply4txj2] {
    font-size: 0.82rem;
    color: #475569;
}

.sales-breakdown-value[b-cmply4txj2] {
    font-size: 0.88rem;
    font-weight: 600;
    color: #0f172a;
}

/* 4. Tarjetas de Sección (Efectivo Real y Observaciones) */
.session-section-card[b-cmply4txj2] {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px 20px;
}

.section-card-icon-badge[b-cmply4txj2] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background-color: #f1f5f9;
    color: #475569;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1.05rem;
}

.section-card-title[b-cmply4txj2] {
    font-size: 0.92rem;
    font-weight: 700;
    color: #0f172a;
}

/* 5. Indicador / Píldora de Diferencia de Arqueo */
.difference-pill[b-cmply4txj2] {
    padding: 9px 14px;
    border-radius: 8px;
    font-size: 0.88rem;
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

.difference-label[b-cmply4txj2] {
    font-weight: 600;
}

.difference-value[b-cmply4txj2] {
    font-size: 0.92rem;
}

.difference-pill--exact[b-cmply4txj2] {
    background-color: #ecfdf5;
    border: 1px solid #a7f3d0;
    color: #065f46;
}

.difference-pill--exact .difference-value[b-cmply4txj2] {
    color: #059669;
    font-weight: 700;
}

.difference-pill--missing[b-cmply4txj2] {
    background-color: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
}

.difference-pill--missing .difference-value[b-cmply4txj2] {
    color: #dc2626;
    font-weight: 700;
}

.difference-pill--extra[b-cmply4txj2] {
    background-color: #fffbeb;
    border: 1px solid #fde68a;
    color: #92400e;
}

.difference-pill--extra .difference-value[b-cmply4txj2] {
    color: #d97706;
    font-weight: 700;
}

.difference-pill--neutral[b-cmply4txj2] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    color: #64748b;
}

[b-cmply4txj2] .btn-close-session {
    min-width: auto !important;
    padding: 6px 14px !important;
    font-size: 0.85rem !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Estilo y contorno delimitado para botón de Cerrar Caja (Opción 1 Outline) */
[b-cmply4txj2] .btn-close-session-confirm,
[b-cmply4txj2] .btn-outline-danger-arregly {
    min-width: auto !important;
    padding: 6px 14px !important;
    font-size: 0.85rem !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-color: transparent !important;
    color: var(--danger-color, #dc2626) !important;
    border: 1px solid var(--danger-color, #dc2626) !important;
    transition: all 0.25s ease !important;
}

[b-cmply4txj2] .btn-close-session-confirm .k-button-text,
[b-cmply4txj2] .btn-close-session-confirm .k-svg-icon,
[b-cmply4txj2] .btn-close-session-confirm svg,
[b-cmply4txj2] .btn-outline-danger-arregly .k-button-text,
[b-cmply4txj2] .btn-outline-danger-arregly .k-svg-icon,
[b-cmply4txj2] .btn-outline-danger-arregly svg {
    color: var(--danger-color, #dc2626) !important;
    fill: var(--danger-color, #dc2626) !important;
}

/* Estado Hover: Fondo rojo sólido y texto/icono en blanco inmutable para evitar blanco sobre blanco */
[b-cmply4txj2] .btn-close-session-confirm:hover,
[b-cmply4txj2] .btn-outline-danger-arregly:hover {
    background-color: var(--danger-color, #dc2626) !important;
    color: #ffffff !important;
    border-color: var(--danger-color, #dc2626) !important;
    box-shadow: 0 4px 12px rgba(220, 38, 38, 0.25) !important;
}

[b-cmply4txj2] .btn-close-session-confirm:hover .k-button-text,
[b-cmply4txj2] .btn-close-session-confirm:hover .k-svg-icon,
[b-cmply4txj2] .btn-close-session-confirm:hover svg,
[b-cmply4txj2] .btn-outline-danger-arregly:hover .k-button-text,
[b-cmply4txj2] .btn-outline-danger-arregly:hover .k-svg-icon,
[b-cmply4txj2] .btn-outline-danger-arregly:hover svg {
    color: #ffffff !important;
    fill: #ffffff !important;
}

/* Optimización móvil: Reducción de paddings excesivos en pantallas estrechas */
@media (max-width: 480px) {
    [b-cmply4txj2] .modal-body-custom {
        padding: 12px 14px !important;
    }

    [b-cmply4txj2] .modal-header-custom {
        padding: 14px 16px !important;
    }

    [b-cmply4txj2] .modal-footer-custom {
        padding: 12px 14px !important;
    }

    .close-session-footer[b-cmply4txj2],
    [b-cmply4txj2] .close-session-footer {
        gap: 6px !important;
    }

    [b-cmply4txj2] .btn-close-session,
    [b-cmply4txj2] .btn-close-session-confirm {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        padding: 6px 8px !important;
        font-size: 0.78rem !important;
        letter-spacing: -0.2px !important;
    }

    [b-cmply4txj2] .btn-close-session .k-button-text,
    [b-cmply4txj2] .btn-close-session-confirm .k-button-text {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

@media (max-width: 360px) {
    [b-cmply4txj2] .modal-body-custom {
        padding: 10px 10px !important;
    }

    [b-cmply4txj2] .modal-header-custom {
        padding: 10px 12px !important;
    }

    [b-cmply4txj2] .modal-footer-custom {
        padding: 10px 10px !important;
    }
}
/* /Pages/PointOfSale/Components/OpenSessionModal.razor.rz.scp.css */
/* Estilos responsivos y de contorno para botones del modal de apertura de caja */
.open-session-footer[b-gijnw01xq3] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

[b-gijnw01xq3] .btn-open-session {
    min-width: auto !important;
    padding: 6px 14px !important;
    font-size: 0.85rem !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

@media (max-width: 480px) {
    .open-session-footer[b-gijnw01xq3] {
        gap: 6px !important;
    }

    [b-gijnw01xq3] .btn-open-session {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        padding: 6px 8px !important;
        font-size: 0.78rem !important;
        letter-spacing: -0.2px !important;
    }

    [b-gijnw01xq3] .btn-open-session .k-button-text {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}
/* /Pages/PointOfSale/Components/PaymentModal.razor.rz.scp.css */
.payment-modal-body[b-cuu01sz3ho] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.payment-total-banner[b-cuu01sz3ho] {
    background: var(--primary-color);
    background-image: linear-gradient(135deg, var(--primary-color) 0%, color-mix(in srgb, var(--primary-color) 85%, #000000) 100%);
    border-radius: 12px;
    padding: 16px 20px;
    color: #ffffff;
    display: flex;
    flex-direction: column;
    align-items: center;
    box-shadow: 0 4px 12px color-mix(in srgb, var(--primary-color) 20%, transparent);
}

.total-label[b-cuu01sz3ho] {
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    opacity: 0.9;
}

.total-value[b-cuu01sz3ho] {
    font-size: 2rem;
    font-weight: 800;
    line-height: 1.2;
    margin: 4px 0;
}

.client-sublabel[b-cuu01sz3ho] {
    font-size: 0.85rem;
    opacity: 0.85;
}

.method-buttons-grid[b-cuu01sz3ho] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}

.method-btn[b-cuu01sz3ho] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1.2;
    min-width: 0;
    gap: 6px;
    padding: 12px 8px;
    background: #f8fafc;
    border: 1.5px solid #e2e8f0;
    border-radius: 10px;
    font-weight: 600;
    font-size: 0.875rem;
    color: #475569;
    cursor: pointer;
    transition: all 0.2s ease;
}

.method-btn:hover[b-cuu01sz3ho] {
    border-color: var(--primary-color);
    background: color-mix(in srgb, var(--primary-color) 8%, #ffffff);
    color: var(--primary-color);
}

.method-btn.active[b-cuu01sz3ho] {
    border-color: var(--primary-color);
    background: color-mix(in srgb, var(--primary-color) 8%, #ffffff);
    color: var(--primary-color);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--primary-color) 15%, transparent);
}

.cash-section[b-cuu01sz3ho] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 14px;
}

.cash-input-wrapper[b-cuu01sz3ho] {
    display: flex;
    align-items: center;
    position: relative;
}

.currency-symbol[b-cuu01sz3ho] {
    position: absolute;
    left: 12px;
    font-weight: 700;
    font-size: 1.1rem;
    color: #64748b;
    z-index: 2;
    pointer-events: none;
}

.cash-input-wrapper[b-cuu01sz3ho]  .k-input-inner {
    padding-left: 28px !important;
    font-size: 1.25rem !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    border-radius: 10px !important;
}

.quick-amounts-row[b-cuu01sz3ho] {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.quick-btn[b-cuu01sz3ho] {
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    padding: 5px 12px;
    font-size: 0.78rem;
    font-weight: 600;
    color: #475569;
    cursor: pointer;
    transition: all 0.15s ease;
}

.quick-btn:hover[b-cuu01sz3ho] {
    background: var(--primary-color);
    color: #ffffff;
    border-color: var(--primary-color);
}

.change-display[b-cuu01sz3ho] {
    border-radius: 10px;
    padding: 10px 14px;
}

.change-ok[b-cuu01sz3ho] {
    background: #ecfdf5;
    border: 1px solid #a7f3d0;
}

.change-warning[b-cuu01sz3ho] {
    background: #fffbeb;
    border: 1px solid #fde68a;
}

.change-item[b-cuu01sz3ho] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.change-label[b-cuu01sz3ho] {
    font-weight: 600;
    font-size: 0.95rem;
    color: #065f46;
}

.change-val[b-cuu01sz3ho] {
    font-size: 1.35rem;
    font-weight: 800;
    color: #059669;
}

.change-hint[b-cuu01sz3ho] {
    font-size: 0.8rem;
    color: #64748b;
}

.non-cash-info-card[b-cuu01sz3ho] {
    display: flex;
    align-items: center;
    gap: 10px;
    background: color-mix(in srgb, var(--primary-color) 8%, #ffffff);
    border: 1px solid color-mix(in srgb, var(--primary-color) 20%, #ffffff);
    border-radius: 10px;
    padding: 14px;
    font-size: 0.875rem;
    color: color-mix(in srgb, var(--primary-color) 85%, #000000);
}

.info-icon[b-cuu01sz3ho] {
    color: var(--primary-color);
    font-size: 1.25rem;
    flex-shrink: 0;
}

/* Estado de éxito */
.sale-success-container[b-cuu01sz3ho] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 12px 8px 4px 8px;
    text-align: center;
}

.success-icon-badge[b-cuu01sz3ho] {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: #ecfdf5;
    border: 2px solid #34d399;
    color: #059669;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    margin-bottom: 12px;
    animation: scaleUp-b-cuu01sz3ho 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

@keyframes scaleUp-b-cuu01sz3ho {
    from { transform: scale(0.5); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
}

.success-title[b-cuu01sz3ho] {
    font-size: 1.35rem;
    font-weight: 700;
    color: #065f46;
    margin: 0;
}

.success-details-card[b-cuu01sz3ho] {
    width: 100%;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 14px 18px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 14px;
}

.detail-row[b-cuu01sz3ho] {
    display: flex;
    justify-content: space-between;
    font-size: 0.875rem;
    color: #475569;
}

.detail-label[b-cuu01sz3ho] {
    font-weight: 500;
    color: #64748b;
}

.total-highlight[b-cuu01sz3ho] {
    font-size: 1.15rem;
    font-weight: 800;
}

.change-highlight[b-cuu01sz3ho] {
    background: #ecfdf5;
    padding: 6px 10px;
    border-radius: 8px;
    border: 1px solid #a7f3d0;
}

.bold-options-container[b-cuu01sz3ho] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px;
}

/* Footer del modal de pago */
.payment-modal-footer[b-cuu01sz3ho] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    width: 100%;
}

@media (max-width: 768px) {
    .payment-modal-body[b-cuu01sz3ho] {
        gap: 12px;
    }

    .payment-total-banner[b-cuu01sz3ho] {
        padding: 12px 14px;
        border-radius: 10px;
    }

    .total-label[b-cuu01sz3ho] {
        font-size: 0.78rem;
    }

    .total-value[b-cuu01sz3ho] {
        font-size: 1.65rem;
        margin: 2px 0;
    }

    .client-sublabel[b-cuu01sz3ho] {
        font-size: 0.78rem;
    }

    .method-buttons-grid[b-cuu01sz3ho] {
        gap: 8px;
    }

    .method-btn[b-cuu01sz3ho] {
        padding: 10px 6px;
        font-size: 0.8rem;
        gap: 4px;
    }

    .cash-section[b-cuu01sz3ho] {
        padding: 10px 12px;
        gap: 6px;
    }

    .cash-input-wrapper[b-cuu01sz3ho]  .k-input-inner {
        font-size: 1.1rem !important;
    }

    .quick-btn[b-cuu01sz3ho] {
        padding: 4px 10px;
        font-size: 0.75rem;
    }

    .change-display[b-cuu01sz3ho] {
        padding: 8px 12px;
    }

    .change-label[b-cuu01sz3ho] {
        font-size: 0.85rem;
    }

    .change-val[b-cuu01sz3ho] {
        font-size: 1.15rem;
    }

    .bold-options-container[b-cuu01sz3ho],
    .non-cash-info-card[b-cuu01sz3ho] {
        padding: 10px 12px;
        font-size: 0.82rem;
    }

    .payment-modal-footer[b-cuu01sz3ho] {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        justify-content: space-between !important;
        gap: 8px !important;
        width: 100% !important;
    }

    .payment-modal-footer[b-cuu01sz3ho]  .btn-arregly,
    .payment-modal-footer[b-cuu01sz3ho]  .k-button {
        flex: 1 1 calc(50% - 4px) !important;
        min-width: 0 !important;
        width: auto !important;
        margin: 0 !important;
        min-height: 34px !important;
        height: auto !important;
        padding: 8px 10px !important;
        font-size: 0.84rem !important;
        font-weight: 500 !important;
        border-radius: 12px !important;
        justify-content: center !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 6px !important;
        white-space: nowrap !important;
    }

    .payment-modal-footer[b-cuu01sz3ho]  .k-button svg,
    .payment-modal-footer[b-cuu01sz3ho]  .k-button .k-svg-icon {
        width: 15px !important;
        height: 15px !important;
        flex-shrink: 0 !important;
    }

    .payment-modal-footer[b-cuu01sz3ho]  .k-button .k-button-text {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

@media (max-width: 380px) {
    .method-buttons-grid[b-cuu01sz3ho] {
        gap: 6px;
    }

    .method-btn[b-cuu01sz3ho] {
        padding: 8px 4px;
        font-size: 0.74rem;
        word-break: break-word;
    }

    .total-value[b-cuu01sz3ho] {
        font-size: 1.5rem;
    }

    .quick-btn[b-cuu01sz3ho] {
        padding: 4px 8px;
        font-size: 0.72rem;
    }
}
/* /Pages/PointOfSale/Components/PosTicketListTab.razor.rz.scp.css */
.pos-history-container[b-434nsadzvj] {
    width: 100%;
}

.pos-toolbar-branch-filter[b-434nsadzvj] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.filter-label-text[b-434nsadzvj] {
    font-weight: 600;
    font-size: 0.85rem;
    color: var(--color-text-secondary, #6b7280);
}

.badge-cash[b-434nsadzvj] {
    background: #ecfdf5;
    color: #059669;
    border: 1px solid #a7f3d0;
}

.badge-card[b-434nsadzvj] {
    background: #eff6ff;
    color: #2563eb;
    border: 1px solid #bfdbfe;
}

.badge-transfer[b-434nsadzvj] {
    background: #faf5ff;
    color: #7e22ce;
    border: 1px solid #e9d5ff;
}

.badge-default[b-434nsadzvj] {
    background: #f3f4f6;
    color: #4b5563;
    border: 1px solid #e5e7eb;
}

.pos-payment-badge[b-434nsadzvj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    letter-spacing: 0.3px;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.pos-status-badge[b-434nsadzvj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    white-space: nowrap;
}

.pos-status-badge--pending[b-434nsadzvj] {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fde68a;
}

.status-dot[b-434nsadzvj] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: currentColor;
}

.pos-action-btn[b-434nsadzvj] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    border-radius: 50%;
    border: 1px solid #e5e7eb;
    background: #ffffff;
    color: #4b5563;
    cursor: pointer;
    transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.12s ease;
}

.pos-action-btn.is-pay[b-434nsadzvj] {
    color: #15803d;
    border-color: #bbf7d0;
    background: #f0fdf4;
}

.pos-action-btn.is-pay:hover[b-434nsadzvj] {
    background: #dcfce7;
    border-color: #86efac;
    transform: translateY(-1px);
    box-shadow: 0 2px 6px rgba(21, 128, 61, 0.15);
}

.pos-ticket-card-header[b-434nsadzvj]  .btn-arregly {
    min-width: 0 !important;
    padding: 6px 14px !important;
    height: 32px !important;
    min-height: 32px !important;
    font-size: 0.82rem !important;
    border-radius: 10px !important;
    white-space: nowrap !important;
}

@media (max-width: 768px) {
    [b-434nsadzvj] .toolbar-left {
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: 4px !important;
        width: 100% !important;
        margin: 0 !important;
    }

    [b-434nsadzvj] .toolbar-left .toolbar-extra {
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: 80px !important;
        min-width: 0 !important;
    }

    [b-434nsadzvj] .toolbar-left .pos-toolbar-branch-filter,
    .pos-toolbar-branch-filter[b-434nsadzvj] {
        display: block !important;
        width: 80px !important;
        max-width: 80px !important;
        min-width: 80px !important;
        margin: 0 !important;
        gap: 0 !important;
    }

    [b-434nsadzvj] .toolbar-left .pos-toolbar-branch-filter .filter-label-text,
    .filter-label-text[b-434nsadzvj] {
        display: none !important;
    }

    [b-434nsadzvj] .toolbar-left .pos-toolbar-branch-filter .dropdownlist-arregly,
    [b-434nsadzvj] .toolbar-left .pos-toolbar-branch-filter .k-dropdownlist,
    [b-434nsadzvj] .toolbar-left .pos-toolbar-branch-filter .k-picker,
    .pos-toolbar-branch-filter[b-434nsadzvj]  .dropdownlist-arregly,
    .pos-toolbar-branch-filter[b-434nsadzvj]  .k-dropdownlist,
    .pos-toolbar-branch-filter[b-434nsadzvj]  .k-picker {
        width: 80px !important;
        max-width: 80px !important;
        min-width: 80px !important;
        display: block !important;
    }

    [b-434nsadzvj] .toolbar-left .pos-toolbar-branch-filter .k-input-inner,
    .pos-toolbar-branch-filter[b-434nsadzvj]  .k-input-inner {
        padding: 2px 4px 2px 6px !important;
        font-size: 0.8rem !important;
    }

    [b-434nsadzvj] .toolbar-left .pos-toolbar-branch-filter .k-input-button,
    .pos-toolbar-branch-filter[b-434nsadzvj]  .k-input-button {
        padding: 0 4px !important;
    }

    [b-434nsadzvj] .toolbar-left .toolbar-search-group {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        width: auto !important;
        display: flex !important;
        align-items: center !important;
        gap: 4px !important;
    }

    [b-434nsadzvj] .toolbar-left .toolbar-utility-btn {
        flex: 0 0 28px !important;
        width: 28px !important;
        height: 28px !important;
        min-width: 28px !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}
/* /Pages/PointOfSale/Components/QuickWeightModal.razor.rz.scp.css */
/* QuickWeightModal.razor.css - Aurocore POS Weight Modal */

.quick-weight-container[b-967qt2ntgt] {
    background-color: var(--card-bg, #ffffff);
}

.weight-product-summary[b-967qt2ntgt] {
    border: 1px solid rgba(0, 0, 0, 0.06);
    background: #f8fafc;
}

.scale-live-card[b-967qt2ntgt] {
    background: linear-gradient(135deg, #f0fdf4 0%, #ecfdf5 100%);
    border: 1px solid #86efac;
    box-shadow: 0 2px 8px rgba(16, 185, 129, 0.08);
}

.scale-icon-circle[b-967qt2ntgt] {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #dcfce7;
    color: #166534;
    transition: all 0.3s ease;
}

.scale-icon-circle.stable[b-967qt2ntgt] {
    background: #bbf7d0;
    color: #15803d;
    box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.2);
}

.scale-icon-circle.moving[b-967qt2ntgt] {
    background: #fef08a;
    color: #854d0e;
    animation: scalePulse-b-967qt2ntgt 1.5s infinite;
}

.scale-icon-circle.warning[b-967qt2ntgt] {
    background: #fef3c7;
    color: #b45309;
}

.scale-validating-card[b-967qt2ntgt] {
    background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
    border: 1px solid #7dd3fc;
    box-shadow: 0 2px 8px rgba(14, 165, 233, 0.08);
}

.scale-warning-card[b-967qt2ntgt] {
    background: #fffbeb;
    border: 1px solid #fde68a;
    box-shadow: 0 2px 8px rgba(245, 158, 11, 0.08);
}

@keyframes scalePulse-b-967qt2ntgt {
    0%, 100% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.08);
    }
}

.scale-live-label[b-967qt2ntgt] {
    color: #166534;
    font-weight: 600;
}

.scale-live-value[b-967qt2ntgt] {
    color: #0f172a;
    font-variant-numeric: tabular-nums;
}

.scale-connect-banner[b-967qt2ntgt] {
    border-style: dashed !important;
}

.weight-presets .btn[b-967qt2ntgt] {
    font-size: 0.85rem;
    padding: 0.35rem 0.75rem;
    font-weight: 500;
    border-color: #cbd5e1;
    color: #334155;
    transition: all 0.15s ease-in-out;
}

.weight-presets .btn:hover[b-967qt2ntgt] {
    background-color: #f1f5f9;
    border-color: #94a3b8;
    color: #0f172a;
}
/* /Pages/PointOfSale/Components/VoidCashSessionModal.razor.rz.scp.css */
/* Estilos responsivos y de contorno para botones del modal de anulación de caja */
.void-session-footer[b-ln95kdp1ip] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

[b-ln95kdp1ip] .btn-void-session {
    min-width: auto !important;
    padding: 6px 14px !important;
    font-size: 0.85rem !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

@media (max-width: 480px) {
    .void-session-footer[b-ln95kdp1ip] {
        gap: 6px !important;
    }

    [b-ln95kdp1ip] .btn-void-session {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        padding: 6px 8px !important;
        font-size: 0.78rem !important;
        letter-spacing: -0.2px !important;
    }

    [b-ln95kdp1ip] .btn-void-session .k-button-text {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}
/* /Pages/PointOfSale/Configuration/CashRegistersConfig.razor.rz.scp.css */
/* Estilos responsivos y de contorno para botones en modales de configuración de cajas */
@media (max-width: 480px) {
    [b-gxcxn8u4so] .modal-footer-custom .btn-arregly {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        padding: 6px 8px !important;
        font-size: 0.78rem !important;
        letter-spacing: -0.2px !important;
    }

    [b-gxcxn8u4so] .modal-footer-custom .btn-arregly .k-button-text {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}

/* Cabecera estilizada del modal de caja */
.register-header-icon-badge[b-gxcxn8u4so] {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background-color: #e6f4f1;
    border: 1px solid #cce8e2;
    color: #0b5a51;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 1.3rem;
}

.register-header-subtitle[b-gxcxn8u4so] {
    font-size: 0.82rem;
    color: #64748b;
    display: block;
    margin-top: 2px;
}

/* Altura de fila, espaciado y centrado vertical idéntico a la grid de órdenes */
[b-gxcxn8u4so] .custom-base-grid tbody tr > td {
    vertical-align: middle !important;
    height: 52px !important;
}

/* /Pages/PointOfSale/PointOfSale.razor.rz.scp.css */
/* ==========================================================================
   ESTILOS PRINCIPALES: PUNTO DE VENTA (POS) Y TICKET TÉRMICO FÍSICO
   ========================================================================== */

.pos-main-container[b-oma8uzm48a] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

/* --------------------------------------------------------------------------
   BARRA SUPERIOR: PESTAÑAS Y ACCIONES DE VENTA A LA MISMA ALTURA
   -------------------------------------------------------------------------- */
.pos-top-header-row[b-oma8uzm48a] {
    width: 100%;
    margin-bottom: 12px;
    flex-wrap: wrap;
    gap: 12px;
}

.pos-tabs-nav[b-oma8uzm48a] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.pos-nav-tab[b-oma8uzm48a] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 12px;
    padding: 8px 18px;
    font-size: 0.875rem;
    font-weight: 600;
    color: #6b7280;
    cursor: pointer;
    transition: all 0.15s ease;
    box-shadow: rgba(0, 0, 0, 0.04) 0px 1px 2px;
}

.pos-nav-tab .tab-icon[b-oma8uzm48a] {
    font-size: 1rem;
    color: #6b7280;
    transition: color 0.15s ease;
}

.pos-nav-tab:hover[b-oma8uzm48a] {
    color: var(--primary-color);
    border-color: var(--primary-color);
    background: #ffffff;
}

.pos-nav-tab:hover .tab-icon[b-oma8uzm48a] {
    color: var(--primary-color);
}

.pos-nav-tab.active[b-oma8uzm48a] {
    background: #ffffff;
    color: #111827;
    border: 1.5px solid #111827;
    box-shadow: none;
}

.pos-nav-tab.active .tab-icon[b-oma8uzm48a] {
    color: #111827;
}

@media (max-width: 768px) {
    .pos-top-header-row[b-oma8uzm48a] {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
    }

    .pos-tabs-nav[b-oma8uzm48a] {
        overflow-x: auto !important;
        flex-wrap: nowrap !important;
        -webkit-overflow-scrolling: touch !important;
        width: 100% !important;
        padding-bottom: 4px !important;
        scrollbar-width: none !important;
    }

    .pos-tabs-nav[b-oma8uzm48a]::-webkit-scrollbar {
        display: none !important;
    }

    .pos-nav-tab[b-oma8uzm48a] {
        white-space: nowrap !important;
        flex-shrink: 0 !important;
        padding: 7px 12px !important;
        font-size: 0.8rem !important;
    }
}


.pos-top-actions[b-oma8uzm48a] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex: 1 1 auto;
    min-width: 0;
    flex-wrap: wrap;
}

.pos-top-actions[b-oma8uzm48a]  .k-button:not(.k-hidden),
.pos-top-actions[b-oma8uzm48a]  .btn-arregly:not(.k-hidden),
.pos-top-actions .pos-top-btn-park:not(.k-hidden)[b-oma8uzm48a],
.pos-top-actions .pos-top-btn-clear:not(.k-hidden)[b-oma8uzm48a],
.pos-top-actions .pos-top-btn-pay:not(.k-hidden)[b-oma8uzm48a],
.pos-top-actions .btn-parked-badge[b-oma8uzm48a] {
    flex-shrink: 0 !important;
    width: auto !important;
    max-width: max-content !important;
    min-width: 0 !important;
    height: 32px !important;
    min-height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 5px 12px !important;
    border-radius: 8px !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
    gap: 5px !important;
    white-space: nowrap !important;
    transition: all 0.2s ease !important;
}

.pos-top-actions[b-oma8uzm48a]  .k-button .k-svg-icon,
.pos-top-actions[b-oma8uzm48a]  .btn-arregly .k-svg-icon,
.pos-top-actions[b-oma8uzm48a]  .k-button svg,
.pos-top-actions[b-oma8uzm48a]  .btn-arregly svg {
    width: 14px !important;
    height: 14px !important;
    font-size: 14px !important;
    flex-shrink: 0 !important;
}

.pos-top-actions[b-oma8uzm48a]  .btn-outline-danger-arregly {
    background-color: transparent !important;
    color: var(--danger-color, #dc2626) !important;
    border: 1px solid var(--danger-color, #dc2626) !important;
    box-shadow: none !important;
}

.pos-top-actions[b-oma8uzm48a]  .btn-outline-danger-arregly:hover:not(.k-disabled):not(:disabled) {
    background-color: var(--danger-color, #dc2626) !important;
    color: #ffffff !important;
    border-color: var(--danger-color, #dc2626) !important;
    box-shadow: 0 2px 8px rgba(220, 38, 38, 0.2) !important;
    transform: translateY(-1px);
}

.pos-top-actions[b-oma8uzm48a]  .btn-outline-danger-arregly:hover:not(.k-disabled):not(:disabled) .k-svg-icon,
.pos-top-actions[b-oma8uzm48a]  .btn-outline-danger-arregly:hover:not(.k-disabled):not(:disabled) svg {
    fill: #ffffff !important;
    color: #ffffff !important;
}

.pos-top-actions[b-oma8uzm48a]  .btn-gradient-primary-arregly {
    background: var(--primary-gradient, linear-gradient(135deg, #0d9488 0%, #042f2e 100%)) !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 2px 8px rgba(13, 148, 136, 0.2) !important;
}

.pos-top-actions[b-oma8uzm48a]  .btn-gradient-primary-arregly:hover:not(.k-disabled):not(:disabled) {
    opacity: 0.92 !important;
    box-shadow: 0 4px 12px rgba(13, 148, 136, 0.3) !important;
    transform: translateY(-1px);
}

.pos-top-actions[b-oma8uzm48a]  .k-button.k-disabled,
.pos-top-actions[b-oma8uzm48a]  .btn-arregly.k-disabled,
.pos-top-actions[b-oma8uzm48a]  .k-button:disabled,
.pos-top-actions[b-oma8uzm48a]  .btn-arregly:disabled {
    opacity: 0.5 !important;
    cursor: not-allowed !important;
    transform: none !important;
    box-shadow: none !important;
    pointer-events: none !important;
}

@media (max-width: 1200px) {
    .pos-top-actions[b-oma8uzm48a] {
        width: auto !important;
    }
}

@media (max-width: 768px) {
    .pos-top-actions[b-oma8uzm48a] {
        width: 100% !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        gap: 8px !important;
    }
}

.pos-workspace[b-oma8uzm48a] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* --------------------------------------------------------------------------
   LAYOUT PRINCIPAL 2 COLUMNAS: CATÁLOGO vs TICKET TÉRMICO
   -------------------------------------------------------------------------- */
.pos-grid-layout[b-oma8uzm48a] {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 20px;
    align-items: start;
}

@media (max-width: 1200px) {
    .pos-grid-layout[b-oma8uzm48a] {
        grid-template-columns: 1fr 350px;
    }
}

@media (max-width: 900px) {
    .pos-grid-layout[b-oma8uzm48a] {
        grid-template-columns: 1fr;
    }
}

/* --------------------------------------------------------------------------
   COLUMNA IZQUIERDA: CONTROLES SUPERIORES + BUSCADOR + CATÁLOGO
   -------------------------------------------------------------------------- */
.pos-catalog-column[b-oma8uzm48a] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Barra superior: Sede, Mostrador y Cliente */
.pos-top-controls[b-oma8uzm48a] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 16px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 16px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.branch-box[b-oma8uzm48a], .location-box[b-oma8uzm48a] {
    flex: 1 1 200px;
    min-width: 180px;
}

.client-box[b-oma8uzm48a] {
    flex: 2 1 300px;
    min-width: 250px;
}

.control-box[b-oma8uzm48a] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.control-label[b-oma8uzm48a] {
    display: flex;
    align-items: center;
    font-size: 0.85rem;
    font-weight: 600;
    color: #374151;
    margin: 0;
}

.client-input-group[b-oma8uzm48a] {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.client-search-wrapper[b-oma8uzm48a] {
    display: flex;
    align-items: center;
    position: relative;
    flex: 1;
    min-width: 220px;
}

.client-doc-input[b-oma8uzm48a] {
    width: 100%;
}

.client-doc-input[b-oma8uzm48a]  .k-input-inner {
    padding-right: 38px !important;
}

.btn-search-client[b-oma8uzm48a] {
    position: absolute;
    right: 4px;
    background: transparent;
    border: none;
    color: var(--primary-color);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    cursor: pointer;
    border-radius: 8px;
    transition: background 0.15s ease;
    z-index: 2;
}

.btn-search-client:hover[b-oma8uzm48a] {
    background: color-mix(in srgb, var(--primary-color) 8%, #ffffff);
}

.client-badge[b-oma8uzm48a] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 0.825rem;
    font-weight: 600;
    white-space: nowrap;
}

.client-resolved[b-oma8uzm48a] {
    background: #ecfdf5;
    color: #065f46;
    border: 1px solid #a7f3d0;
}

.client-cf[b-oma8uzm48a] {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fde68a;
}

.client-default[b-oma8uzm48a] {
    background: #f3f4f6;
    color: #4b5563;
    border: 1px solid #e5e7eb;
}

.btn-clear-client[b-oma8uzm48a] {
    background: transparent;
    border: none;
    color: currentColor;
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
    padding: 0 2px;
    margin-left: 2px;
    font-weight: bold;
}

.btn-quick-client[b-oma8uzm48a] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 0.825rem;
    font-weight: 600;
    white-space: nowrap;
    background: color-mix(in srgb, var(--primary-color) 10%, #ffffff);
    color: var(--primary-color);
    border: 1px solid color-mix(in srgb, var(--primary-color) 30%, #ffffff);
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-quick-client:hover[b-oma8uzm48a] {
    background: var(--primary-color);
    color: #ffffff;
    border-color: var(--primary-color);
    box-shadow: 0 2px 6px color-mix(in srgb, var(--primary-color) 25%, transparent);
}

/* Buscador de productos (limpio) */
.catalog-search-card[b-oma8uzm48a] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 12px 16px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.scanner-input-wrapper[b-oma8uzm48a] {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
}

.pos-search-input[b-oma8uzm48a] {
    width: 100%;
}

.pos-search-input[b-oma8uzm48a]  .k-input-inner {
    padding-right: 36px !important;
}

.btn-clear-search[b-oma8uzm48a] {
    position: absolute;
    right: 8px;
    background: transparent;
    border: none;
    color: #9ca3af;
    font-size: 1.2rem;
    cursor: pointer;
    z-index: 2;
    padding: 0 4px;
}

.btn-clear-search:hover[b-oma8uzm48a] {
    color: #4b5563;
}

/* Catálogo de Productos */
.products-cards-grid[b-oma8uzm48a] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 14px;
}

.product-card[b-oma8uzm48a] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 14px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 12px;
    transition: all 0.2s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.product-card:hover[b-oma8uzm48a] {
    border-color: var(--primary-color);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px color-mix(in srgb, var(--primary-color) 15%, transparent);
}

.product-card.in-cart[b-oma8uzm48a] {
    border-color: var(--primary-color);
    background: color-mix(in srgb, var(--primary-color) 8%, #ffffff);
}

.product-card-header[b-oma8uzm48a] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.product-name[b-oma8uzm48a] {
    font-weight: 700;
    font-size: 0.925rem;
    color: #1f2937;
    line-height: 1.3;
}

.product-sku-badge[b-oma8uzm48a] {
    align-self: flex-start;
    font-family: monospace;
    font-size: 0.72rem;
    font-weight: 600;
    color: #4b5563;
    background: #f3f4f6;
    padding: 2px 6px;
    border-radius: 4px;
}

.product-stock-badge[b-oma8uzm48a] {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 0.72rem;
    font-weight: 600;
    padding: 2px 6px;
    border-radius: 4px;
}

.product-stock-badge--in-stock[b-oma8uzm48a] {
    background: #dcfce7;
    color: #15803d;
}

.product-stock-badge--low[b-oma8uzm48a] {
    background: #fef3c7;
    color: #b45309;
}

.product-stock-badge--out[b-oma8uzm48a] {
    background: #fee2e2;
    color: #b91c1c;
}

.product-stock-badge--warehouse[b-oma8uzm48a] {
    background: #eef2ff;
    color: #4338ca;
    border: 1px dashed #a5b4fc;
}

.product-brand[b-oma8uzm48a] {
    font-size: 0.78rem;
    color: #6b7280;
    font-weight: 500;
}

.product-pricing[b-oma8uzm48a] {
    display: flex;
    align-items: baseline;
    gap: 6px;
    flex-wrap: wrap;
    margin-top: 4px;
}

.product-price[b-oma8uzm48a] {
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--primary-color);
}

.product-tax-rate[b-oma8uzm48a] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #9ca3af;
}

.btn-add-product[b-oma8uzm48a] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    background: var(--primary-color);
    color: #ffffff;
    border: none;
    padding: 8px 12px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.85rem;
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-add-product:hover[b-oma8uzm48a] {
    background: color-mix(in srgb, var(--primary-color) 85%, #000000);
}

.btn-add-product:disabled[b-oma8uzm48a],
.btn-add-product--disabled[b-oma8uzm48a] {
    background: #f3f4f6 !important;
    color: #9ca3af !important;
    cursor: not-allowed !important;
    border: 1px solid #e5e7eb !important;
    box-shadow: none !important;
}

.btn-add-product:disabled:hover[b-oma8uzm48a],
.btn-add-product--disabled:hover[b-oma8uzm48a] {
    background: #f3f4f6 !important;
    color: #9ca3af !important;
}

.btn-add-product--from-warehouse[b-oma8uzm48a] {
    background: #0d9488 !important;
    color: #ffffff !important;
    border: 1px solid #0f766e !important;
}

.btn-add-product--from-warehouse:hover[b-oma8uzm48a] {
    background: #0f766e !important;
    box-shadow: 0 4px 10px rgba(13, 148, 136, 0.3);
}

.btn-add-product--request-warehouse[b-oma8uzm48a] {
    background: #d97706 !important;
    color: #ffffff !important;
    border: 1px solid #b45309 !important;
}

.btn-add-product--request-warehouse:hover[b-oma8uzm48a] {
    background: #b45309 !important;
    box-shadow: 0 4px 10px rgba(217, 119, 6, 0.3);
}

.warehouse-supply-badge[b-oma8uzm48a] {
    background-color: #e0f2fe;
    border: 1px solid #38bdf8;
    color: #0369a1;
    font-size: 0.72rem;
}

.product-card.in-cart .btn-add-product[b-oma8uzm48a] {
    background: color-mix(in srgb, var(--primary-color) 85%, #000000);
}

.pos-loading-state[b-oma8uzm48a],
.pos-empty-products[b-oma8uzm48a] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    background: #ffffff;
    border: 1px dashed #e5e7eb;
    border-radius: 12px;
    padding: 48px 24px;
    color: #6b7280;
    text-align: center;
}

.empty-icon[b-oma8uzm48a] {
    font-size: 2.5rem;
    color: #cbd5e1;
}

/* --------------------------------------------------------------------------
   COLUMNA DERECHA: TICKET TÉRMICO FÍSICO REAL (PAPER RECEIPT)
   -------------------------------------------------------------------------- */
.pos-ticket-column[b-oma8uzm48a] {
    position: sticky;
    top: 20px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.thermal-receipt-paper[b-oma8uzm48a] {
    background: #ffffff;
    border-radius: 4px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12), 0 2px 6px rgba(0, 0, 0, 0.06);
    position: relative;
    overflow: hidden;
    font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: #1a1a1a;
}

/* Bordes dentados estilo papel cortado (sawtooth) */
.receipt-sawtooth-top[b-oma8uzm48a] {
    height: 10px;
    background: linear-gradient(135deg, #f3f4f6 5px, transparent 0) 0 0,
                linear-gradient(225deg, #f3f4f6 5px, transparent 0) 0 0;
    background-size: 10px 10px;
    background-repeat: repeat-x;
}

.receipt-sawtooth-bottom[b-oma8uzm48a] {
    height: 10px;
    background: linear-gradient(45deg, #f3f4f6 5px, transparent 0) 0 0,
                linear-gradient(-45deg, #f3f4f6 5px, transparent 0) 0 0;
    background-size: 10px 10px;
    background-repeat: repeat-x;
}

.receipt-paper-content[b-oma8uzm48a] {
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.receipt-header[b-oma8uzm48a] {
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.store-name[b-oma8uzm48a] {
    font-family: 'Poppins', sans-serif;
    font-size: 1.15rem;
    font-weight: 800;
    letter-spacing: 0.5px;
    margin: 0;
    text-transform: uppercase;
    color: #111827;
}

.store-info-line[b-oma8uzm48a] {
    font-size: 0.78rem;
    color: #4b5563;
}

.receipt-stars-divider[b-oma8uzm48a] {
    text-align: center;
    font-size: 0.8rem;
    letter-spacing: 2px;
    color: #6b7280;
    user-select: none;
    margin: 2px 0;
}

.receipt-dash-divider[b-oma8uzm48a] {
    text-align: center;
    font-size: 0.8rem;
    letter-spacing: 1px;
    color: #9ca3af;
    user-select: none;
    margin: 2px 0;
}

.receipt-type-title[b-oma8uzm48a] {
    text-align: center;
    font-weight: 800;
    font-size: 0.95rem;
    letter-spacing: 1px;
    color: #111827;
    margin: 2px 0;
}

.receipt-meta[b-oma8uzm48a] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 0.8rem;
    color: #374151;
}

.receipt-items-header[b-oma8uzm48a] {
    display: flex;
    justify-content: space-between;
    font-weight: 800;
    font-size: 0.8rem;
    color: #111827;
    padding: 2px 0;
}

.col-desc[b-oma8uzm48a] { flex: 1; }
.col-qty[b-oma8uzm48a] { width: 50px; text-align: center; }
.col-price[b-oma8uzm48a] { width: 80px; text-align: right; }

.receipt-items-body[b-oma8uzm48a] {
    max-height: 360px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-right: 4px;
}

.receipt-empty-state[b-oma8uzm48a] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 24px 0;
    color: #9ca3af;
    text-align: center;
    gap: 4px;
}

.receipt-empty-state .empty-icon[b-oma8uzm48a] {
    font-size: 1.8rem;
}

.receipt-item-row[b-oma8uzm48a] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding-bottom: 4px;
    border-bottom: 1px dotted #e5e7eb;
}

.item-name-row[b-oma8uzm48a] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.item-product-name[b-oma8uzm48a] {
    font-weight: 700;
    font-size: 0.82rem;
    color: #1f2937;
    line-height: 1.2;
}

.btn-receipt-delete[b-oma8uzm48a] {
    background: transparent;
    border: none;
    color: #ef4444;
    font-size: 1.1rem;
    font-weight: bold;
    cursor: pointer;
    line-height: 1;
    padding: 0 4px;
}

.btn-receipt-delete:hover[b-oma8uzm48a] {
    color: #b91c1c;
}

.item-details-row[b-oma8uzm48a] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 0.78rem;
}

.item-qty-adjust[b-oma8uzm48a] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.btn-receipt-qty[b-oma8uzm48a] {
    background: #f3f4f6;
    border: 1px solid #d1d5db;
    width: 20px;
    height: 20px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    cursor: pointer;
    font-size: 0.8rem;
}

.btn-receipt-qty:hover[b-oma8uzm48a] {
    background: #e5e7eb;
}

.qty-number-input[b-oma8uzm48a] {
    font-weight: 700;
    min-width: 24px;
    max-width: 45px;
    text-align: center;
    border: 1px solid transparent;
    border-radius: 4px;
    background: transparent;
    padding: 0;
    font-size: 0.8rem;
    color: #111827;
}

.qty-number-input:focus[b-oma8uzm48a] {
    border-color: #0d6efd;
    background: #ffffff;
    outline: none;
}

.qty-number-input[b-oma8uzm48a]::-webkit-outer-spin-button,
.qty-number-input[b-oma8uzm48a]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.qty-number-input[type=number][b-oma8uzm48a] {
    -moz-appearance: textfield;
}

.unit-calc[b-oma8uzm48a] {
    color: #6b7280;
    margin-left: 2px;
}

.item-row-total[b-oma8uzm48a] {
    font-weight: 700;
    color: #111827;
}

.receipt-totals-block[b-oma8uzm48a] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    font-size: 0.82rem;
}

.total-line[b-oma8uzm48a] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #374151;
}

.discount-line[b-oma8uzm48a] {
    color: #059669;
}

.major-total[b-oma8uzm48a] {
    font-size: 1.05rem;
    font-weight: 800;
    color: #111827;
    padding-top: 4px;
}

.major-value[b-oma8uzm48a] {
    font-size: 1.25rem;
    font-weight: 900;
    color: var(--primary-color);
}

/* Botones de acción inferiores */
.receipt-checkout-actions[b-oma8uzm48a] {
    display: flex;
    gap: 10px;
}

.btn-clear-receipt[b-oma8uzm48a] {
    display: flex;
    align-items: center;
    justify-content: center;
    background: #ffffff;
    border: 1px solid #d1d5db;
    color: #4b5563;
    padding: 10px 16px;
    border-radius: 12px;
    font-weight: 600;
    font-size: 0.875rem;
    cursor: pointer;
    transition: all 0.15s ease;
}

.btn-clear-receipt:hover:not(:disabled)[b-oma8uzm48a] {
    background: #f3f4f6;
    color: #dc2626;
    border-color: #fca5a5;
}

.btn-pay-receipt[b-oma8uzm48a] {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--primary-color);
    border: 1px solid var(--primary-color);
    color: #ffffff;
    padding: 10px 18px;
    border-radius: 12px;
    font-weight: 700;
    font-size: 0.95rem;
    cursor: pointer;
    transition: all 0.15s ease;
    box-shadow: 0 2px 6px color-mix(in srgb, var(--primary-color) 25%, transparent);
}

.btn-pay-receipt:hover:not(:disabled)[b-oma8uzm48a] {
    background: color-mix(in srgb, var(--primary-color) 85%, #000000);
    transform: translateY(-1px);
    box-shadow: 0 4px 10px color-mix(in srgb, var(--primary-color) 35%, transparent);
}

/* ==========================================================================
   FASE 2: ESTILOS CATCH WEIGHT, PROMOCIONES Y GS1 2D
   ========================================================================== */

.product-catch-weight-badge[b-oma8uzm48a] {
    display: inline-flex;
    align-items: center;
    background: #eef2ff;
    color: #4f46e5;
    font-size: 0.68rem;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 6px;
    margin-bottom: 4px;
    border: 1px solid #c7d2fe;
    width: fit-content;
}

.product-promo-badge[b-oma8uzm48a] {
    display: inline-flex;
    align-items: center;
    background: #ecfdf5;
    color: #047857;
    font-size: 0.68rem;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 6px;
    margin-bottom: 4px;
    border: 1px solid #a7f3d0;
    width: fit-content;
}

.item-catch-weight-row[b-oma8uzm48a] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 6px;
    padding: 3px 6px;
    font-size: 0.75rem;
}

.weight-tag-label[b-oma8uzm48a] {
    font-weight: 700;
    color: #475569;
}

.receipt-weight-input[b-oma8uzm48a] {
    width: 65px;
    padding: 2px 4px;
    font-size: 0.78rem;
    font-weight: 700;
    text-align: right;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    background: #ffffff;
    color: #0f172a;
}

.receipt-weight-input:focus[b-oma8uzm48a] {
    outline: none;
    border-color: #6366f1;
    box-shadow: 0 0 0 1px #6366f1;
}

.weight-unit-label[b-oma8uzm48a] {
    font-weight: 700;
    color: #334155;
}

.weight-pieces-label[b-oma8uzm48a] {
    font-size: 0.7rem;
    color: #64748b;
    margin-left: 2px;
}

.item-batch-row[b-oma8uzm48a] {
    font-size: 0.68rem;
    color: #475569;
    margin-top: 1px;
}

.receipt-batch-badge[b-oma8uzm48a] {
    font-family: monospace;
    font-weight: 600;
    background: #f1f5f9;
    padding: 1px 4px;
    border-radius: 3px;
    color: #334155;
}

.receipt-expiry-badge[b-oma8uzm48a] {
    color: #b45309;
    font-weight: 600;
}

.item-promo-row[b-oma8uzm48a] {
    margin-top: 2px;
}

.receipt-promo-badge[b-oma8uzm48a] {
    display: inline-block;
    background: #ecfdf5;
    color: #047857;
    border: 1px solid #a7f3d0;
    font-size: 0.68rem;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 4px;
    line-height: 1.3;
}

/* --------------------------------------------------------------------------
   BARRA DE ATAJOS RÁPIDOS DE MOSTRADOR (CALM UX)
   -------------------------------------------------------------------------- */
.pos-hotkeys-bar[b-oma8uzm48a] {
    background: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.06);
    border-radius: 10px;
    font-size: 0.75rem;
    color: #6b7280;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
}

.hotkeys-list[b-oma8uzm48a] {
    flex-wrap: wrap;
}

.hotkey-item[b-oma8uzm48a] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.75rem;
    color: #4b5563;
}

.pos-hotkeys-bar kbd[b-oma8uzm48a] {
    background: #f3f4f6;
    border: 1px solid #d1d5db;
    border-bottom: 2px solid #9ca3af;
    border-radius: 4px;
    padding: 1px 5px;
    font-family: inherit;
    font-weight: 700;
    color: #1f2937;
    font-size: 0.68rem;
}

.pos-status-indicator[b-oma8uzm48a] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #10b981;
    display: inline-block;
}

.pulse-green[b-oma8uzm48a] {
    box-shadow: 0 0 0 rgba(16, 185, 129, 0.4);
    animation: posPulseIndicator-b-oma8uzm48a 2s infinite;
}

@keyframes posPulseIndicator-b-oma8uzm48a {
    0% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.6); }
    70% { box-shadow: 0 0 0 6px rgba(16, 185, 129, 0); }
    100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); }
}

.pos-status-text[b-oma8uzm48a] {
    font-size: 0.72rem;
    color: #059669;
    font-weight: 600;
}

/* --------------------------------------------------------------------------
   BOTONES DE VENTAS EN ESPERA Y PAUSA
   -------------------------------------------------------------------------- */
.btn-parked-badge[b-oma8uzm48a] {
    background: #fef3c7;
    color: #92400e;
    border: 1px solid #fde68a;
    padding: 5px 12px;
    border-radius: 8px;
    font-weight: 700;
    font-size: 0.8rem;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    transition: all 0.15s ease;
    height: 32px;
    white-space: nowrap;
}

.btn-parked-badge:hover[b-oma8uzm48a] {
    background: #fde68a;
    color: #78350f;
    box-shadow: 0 2px 6px rgba(217, 119, 6, 0.2);
}

.pos-top-actions[b-oma8uzm48a]  .btn-outline-warning-arregly {
    background-color: transparent !important;
    color: #d97706 !important;
    border: 1px solid #d97706 !important;
    box-shadow: none !important;
}

.pos-top-actions[b-oma8uzm48a]  .btn-outline-warning-arregly:hover:not(.k-disabled):not(:disabled) {
    background-color: #d97706 !important;
    color: #ffffff !important;
    border-color: #d97706 !important;
    box-shadow: 0 2px 8px rgba(217, 119, 6, 0.2) !important;
}

/* --------------------------------------------------------------------------
   DIVISOR MICRO-DASHED Y ASISTENTE DE PESAJE EN TICKET
   -------------------------------------------------------------------------- */
.receipt-micro-divider[b-oma8uzm48a] {
    width: 100%;
    height: 1px;
    background-image: repeating-linear-gradient(to right, #9ca3af 0, #9ca3af 4px, transparent 4px, transparent 8px);
    margin: 4px 0;
}

.btn-quick-weight-trigger[b-oma8uzm48a] {
    background: #ecfdf5;
    border: 1.5px solid #10b981;
    color: #065f46;
    padding: 3px 10px;
    border-radius: 8px;
    font-size: 0.78rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    transition: all 0.15s ease;
    box-shadow: 0 1px 2px rgba(16, 185, 129, 0.12);
}

.btn-quick-weight-trigger:hover[b-oma8uzm48a] {
    background: #d1fae5;
    border-color: #059669;
    color: #047857;
    box-shadow: 0 2px 5px rgba(16, 185, 129, 0.22);
    transform: translateY(-1px);
}

.weight-rectify-hint[b-oma8uzm48a] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #059669;
    background: #d1fae5;
    padding: 1px 5px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    gap: 3px;
}

.presentation-pack-badge[b-oma8uzm48a] {
    background: rgba(102, 126, 234, 0.12) !important;
    color: #4338ca !important;
    border: 1px solid rgba(102, 126, 234, 0.25) !important;
    font-weight: 600;
}

/* --------------------------------------------------------------------------
   MODAL DE VENTAS EN ESPERA (PARKED SALES)
   -------------------------------------------------------------------------- */
.parked-sales-list[b-oma8uzm48a] {
    max-height: 400px;
    overflow-y: auto;
}

.parked-sale-card[b-oma8uzm48a] {
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    transition: all 0.2s ease;
}

.parked-sale-card:hover[b-oma8uzm48a] {
    border-color: #cbd5e1;
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.parked-sale-id[b-oma8uzm48a] {
    color: var(--primary-color, #667eea);
    font-family: monospace;
    font-size: 0.95rem;
}

.btn-primary-arregly[b-oma8uzm48a] {
    background: var(--primary-color, #667eea);
    color: #ffffff;
    border: none;
    border-radius: 6px;
    padding: 5px 12px;
    font-weight: 600;
    font-size: 0.82rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.btn-primary-arregly:hover[b-oma8uzm48a] {
    background: #5a67d8;
    color: #ffffff;
    box-shadow: 0 2px 6px rgba(102, 126, 234, 0.3);
}

/* Barra de Atajos Rápidos de Mostrador */
.hotkeys-list[b-oma8uzm48a] {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.hotkey-item-btn[b-oma8uzm48a] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 4px 10px;
    font-size: 0.8rem;
    font-weight: 500;
    color: #475569;
    cursor: pointer;
    transition: all 0.15s ease;
    user-select: none;
}

.hotkey-item-btn:hover[b-oma8uzm48a] {
    background: #ffffff;
    border-color: #cbd5e1;
    color: #0f172a;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.04);
    transform: translateY(-1px);
}

.hotkey-item-btn:active[b-oma8uzm48a] {
    transform: translateY(0);
}

.hotkey-item-btn kbd[b-oma8uzm48a] {
    background: #ffffff;
    color: #1e293b;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    padding: 1px 6px;
    font-size: 0.72rem;
    font-weight: 700;
    font-family: inherit;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}

/* Indicador de Balanza en Barra de Atajos */
.scale-hotkey-badge[b-oma8uzm48a] {
    border-radius: 20px;
    padding: 3px 10px;
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease;
    border: 1px solid transparent;
    text-decoration: none;
}

.scale-hotkey-badge.connected[b-oma8uzm48a] {
    background: #ecfdf5;
    color: #065f46;
    border-color: #a7f3d0;
}

.scale-hotkey-badge.connected:hover[b-oma8uzm48a] {
    background: #d1fae5;
    border-color: #6ee7b7;
}

.scale-hotkey-badge.disconnected[b-oma8uzm48a] {
    background: #f1f5f9;
    color: #475569;
    border-color: #cbd5e1;
}

.scale-hotkey-badge.disconnected:hover[b-oma8uzm48a] {
    background: #e2e8f0;
    color: #1e293b;
    border-color: #94a3b8;
}

.scale-weight-reading[b-oma8uzm48a] {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.scale-stability-tag[b-oma8uzm48a] {
    font-size: 0.7rem;
    padding: 1px 6px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.7);
}

.scale-pulse-dot[b-oma8uzm48a] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
}

.scale-pulse-dot.stable[b-oma8uzm48a] {
    background: #10b981;
    box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.3);
}

.scale-pulse-dot.moving[b-oma8uzm48a] {
    background: #f59e0b;
    animation: scaleBlink-b-oma8uzm48a 1s infinite alternate;
}

.scale-pulse-dot.validating[b-oma8uzm48a] {
    background: #3b82f6;
    animation: scaleBlink-b-oma8uzm48a 0.6s infinite alternate;
}

.scale-pulse-dot.simulated[b-oma8uzm48a] {
    background: #8b5cf6;
    box-shadow: 0 0 0 2px rgba(139, 92, 246, 0.3);
}

.scale-hotkey-badge.simulated[b-oma8uzm48a] {
    background: #f5f3ff;
    color: #6d28d9;
    border-color: #ddd6fe;
}

.scale-hotkey-badge.simulated:hover[b-oma8uzm48a] {
    background: #ede9fe;
    border-color: #c4b5fd;
}

.scale-hotkey-badge.validating[b-oma8uzm48a] {
    background: #eff6ff;
    color: #1d4ed8;
    border-color: #bfdbfe;
    cursor: default;
}

.scale-hotkey-badge.no-scale[b-oma8uzm48a] {
    background: #fffbeb;
    color: #b45309;
    border-color: #fde68a;
    cursor: default;
}

.btn-scale-mini-action[b-oma8uzm48a] {
    background: transparent;
    border: none;
    padding: 0 3px;
    margin: 0;
    line-height: 1;
    color: #92400e;
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.15s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.btn-scale-mini-action:hover[b-oma8uzm48a] {
    background-color: rgba(180, 83, 9, 0.15);
}

.btn-scale-mini-action.text-danger:hover[b-oma8uzm48a] {
    background-color: rgba(220, 38, 38, 0.15);
    color: #dc2626 !important;
}

@keyframes scaleBlink-b-oma8uzm48a {
    0% { opacity: 0.4; }
    100% { opacity: 1; }
}

.scanner-ready-box[b-oma8uzm48a] {
    padding-left: 8px;
    border-left: 1px solid #e2e8f0;
}


/* /Pages/Products/ProductDetail.razor.rz.scp.css */
.product-master-container[b-97lr29pryk] {
    padding: 0.5rem 0 2rem 0;
}

/* ==========================================================================
   BANNER BUTTONS (HIGH CONTRAST & GLASSMORPHISM)
   ========================================================================== */
.product-detail-actions[b-97lr29pryk] {
    display: flex;
    align-items: center;
    gap: 0.625rem;
    flex-wrap: wrap;
}

.banner-btn-primary[b-97lr29pryk] {
    background: #ffffff !important;
    border: 1px solid #ffffff !important;
    color: var(--primary-color, #034C48) !important;
    font-weight: 600;
    font-size: 0.875rem;
    padding: 0.55rem 1.15rem;
    min-height: 44px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    cursor: pointer;
    touch-action: manipulation;
}

.banner-btn-primary:hover[b-97lr29pryk] {
    background: #f8fafc !important;
    color: var(--primary-color, #034C48) !important;
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
}

.banner-btn-secondary[b-97lr29pryk] {
    background: rgba(255, 255, 255, 0.16) !important;
    border: 1px solid rgba(255, 255, 255, 0.38) !important;
    color: #ffffff !important;
    font-weight: 500;
    font-size: 0.875rem;
    padding: 0.55rem 1rem;
    min-height: 44px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    cursor: pointer;
    touch-action: manipulation;
}

.banner-btn-secondary:hover[b-97lr29pryk] {
    background: rgba(255, 255, 255, 0.28) !important;
    border-color: rgba(255, 255, 255, 0.6) !important;
    color: #ffffff !important;
    transform: translateY(-1px);
}

/* ==========================================================================
   BENTO KPI CARDS (TOP 4 METRICS)
   ========================================================================== */
.bento-kpi-card[b-97lr29pryk] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 1.15rem 1.25rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
}

.bento-kpi-card:hover[b-97lr29pryk] {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.06), 0 8px 10px -6px rgba(0, 0, 0, 0.04);
    border-color: #cbd5e1;
}

.bento-kpi-header[b-97lr29pryk] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.5rem;
}

.bento-kpi-label[b-97lr29pryk] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
}

.bento-kpi-icon-wrap[b-97lr29pryk] {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1rem;
    flex-shrink: 0;
}

.icon-total[b-97lr29pryk] {
    background: #eff6ff;
    color: #2563eb;
}

.icon-available[b-97lr29pryk] {
    background: #ecfdf5;
    color: #059669;
}

.icon-reserved[b-97lr29pryk] {
    background: #fffbeb;
    color: #d97706;
}

.icon-price[b-97lr29pryk] {
    background: #f0fdf4;
    color: #0d9488;
}

.bento-kpi-value[b-97lr29pryk] {
    font-size: 1.85rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.15;
    letter-spacing: -0.02em;
    margin: 0.25rem 0;
}

.text-available[b-97lr29pryk] {
    color: #059669 !important;
}

.text-reserved[b-97lr29pryk] {
    color: #d97706 !important;
}

.text-price[b-97lr29pryk] {
    color: #0f172a !important;
}

.bento-kpi-hint[b-97lr29pryk] {
    font-size: 0.78rem;
    color: #64748b;
    display: flex;
    align-items: center;
    gap: 0.375rem;
    margin-top: 0.25rem;
}

.bento-kpi-unit[b-97lr29pryk] {
    font-weight: 600;
    color: #334155;
}

.badge-profit-pill[b-97lr29pryk] {
    background: #ecfdf5;
    color: #047857;
    font-size: 0.72rem;
    font-weight: 600;
    padding: 2px 8px;
    border-radius: 999px;
    border: 1px solid #a7f3d0;
}

.status-indicator-dot[b-97lr29pryk] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    display: inline-block;
}

.status-indicator-dot.online[b-97lr29pryk] {
    background: #10b981;
    box-shadow: 0 0 0 2px rgba(16, 185, 129, 0.2);
}

/* ==========================================================================
   TAB STRIP & BENTO CONTENT SURFACE
   ========================================================================== */
.bento-content-surface[b-97lr29pryk] {
    border: 1px solid #e2e8f0;
    border-top: none;
}

/* ==========================================================================
   PORTADA & BADGES
   ========================================================================== */
.product-cover-wrapper[b-97lr29pryk] {
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid #e2e8f0;
    background: #ffffff;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.product-cover-img[b-97lr29pryk] {
    max-height: 230px;
    object-fit: cover;
    width: 100%;
    display: block;
}

.product-cover-placeholder[b-97lr29pryk] {
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    border: 1.5px dashed #cbd5e1;
    border-radius: 16px;
    min-height: 190px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1.5rem;
}

.placeholder-icon-circle[b-97lr29pryk] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
    margin-bottom: 0.5rem;
}

.placeholder-text[b-97lr29pryk] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #64748b;
}

.placeholder-subtext[b-97lr29pryk] {
    font-size: 0.72rem;
    color: #94a3b8;
    margin-top: 2px;
}

.product-pills-row[b-97lr29pryk] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: center;
}

.modern-status-pill[b-97lr29pryk] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 0.25rem 0.65rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 500;
}

.pill-active[b-97lr29pryk] {
    background: #ecfdf5;
    color: #065f46;
    border: 1px solid #a7f3d0;
}

.pill-inactive[b-97lr29pryk] {
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

.pill-secondary[b-97lr29pryk] {
    background: #f8fafc;
    color: #475569;
    border: 1px solid #e2e8f0;
}

.pill-info[b-97lr29pryk] {
    background: #eff6ff;
    color: #1e40af;
    border: 1px solid #bfdbfe;
}

.pill-dot[b-97lr29pryk] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #10b981;
}

/* ==========================================================================
   BENTO SECTION CARDS
   ========================================================================== */
.bento-section-card[b-97lr29pryk] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 1.25rem;
}

.bento-section-header[b-97lr29pryk] {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    margin-bottom: 1rem;
}

.bento-header-icon-wrap[b-97lr29pryk] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--primary-color, #034C48);
    flex-shrink: 0;
}

.bento-header-icon-wrap.icon-finance[b-97lr29pryk] {
    color: #059669;
}

.bento-section-title[b-97lr29pryk] {
    font-size: 0.92rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
}

.bento-grid-fields[b-97lr29pryk] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
}

.bento-field-item[b-97lr29pryk] {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.bento-field-label[b-97lr29pryk] {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
}

.bento-field-value[b-97lr29pryk] {
    font-size: 0.88rem;
    font-weight: 600;
    color: #1e293b;
}

.bento-sku-badge[b-97lr29pryk] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    background: #ffffff;
    border: 1px solid #cbd5e1;
    border-radius: 6px;
    padding: 2px 7px;
    width: fit-content;
}

.sku-icon[b-97lr29pryk] {
    font-size: 0.8rem;
    color: #64748b;
}

.sku-text[b-97lr29pryk] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #0f172a;
}

.role-highlight[b-97lr29pryk] {
    color: var(--primary-color, #034C48);
    font-weight: 700;
}

/* ==========================================================================
   FINANCIAL CELLS
   ========================================================================== */
.finance-cell[b-97lr29pryk] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 0.85rem 1rem;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.finance-cell.highlight-sale[b-97lr29pryk] {
    border-color: rgba(3, 76, 72, 0.35);
    background: linear-gradient(to bottom, #ffffff, #f0fdf4);
}

.finance-label[b-97lr29pryk] {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: #64748b;
}

.finance-value[b-97lr29pryk] {
    font-size: 1.15rem;
    font-weight: 700;
    color: #0f172a;
    margin: 4px 0 2px 0;
}

.finance-hint[b-97lr29pryk] {
    font-size: 0.7rem;
    color: #94a3b8;
}

.profit-badge[b-97lr29pryk] {
    background: #ecfdf5;
    color: #047857;
    font-weight: 700;
    font-size: 0.82rem;
    padding: 2px 8px;
    border-radius: 999px;
    border: 1px solid #a7f3d0;
}

/* ==========================================================================
   TABLES & ACCESSIBILITY
   ========================================================================== */
.table th[b-97lr29pryk] {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
    color: #64748b;
    background-color: #f8fafc;
    border-bottom: 1px solid #e2e8f0;
    padding: 0.75rem 1rem;
}

.table td[b-97lr29pryk] {
    padding: 0.75rem 1rem;
    vertical-align: middle;
}

.font-size-xs[b-97lr29pryk] {
    font-size: 0.75rem;
}

/* ==========================================================================
   MOBILE-FIRST RESPONSIVENESS
   ========================================================================== */
@media (max-width: 992px) {
    .bento-grid-fields[b-97lr29pryk] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .product-detail-actions[b-97lr29pryk] {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.5rem;
    }

    .banner-btn-primary[b-97lr29pryk],
    .banner-btn-secondary[b-97lr29pryk] {
        width: 100%;
        font-size: 0.82rem;
        padding: 0.5rem;
    }

    .bento-grid-fields[b-97lr29pryk] {
        grid-template-columns: 1fr;
    }

    .bento-kpi-value[b-97lr29pryk] {
        font-size: 1.5rem;
    }
}

@media (max-width: 576px) {
    .product-detail-actions[b-97lr29pryk] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Products/Products.razor.rz.scp.css */
.form-footer[b-ctsvqlufno] {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
    padding: 0.75rem;
}

.products-context-mode[b-ctsvqlufno] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.products-context-branch[b-ctsvqlufno] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.products-toolbar-context-controls[b-ctsvqlufno] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 36px;
    flex-shrink: 0;
}

.products-context-branch-animated[b-ctsvqlufno] {
    overflow: hidden;
    transform-origin: left center;
    transition: max-width 0.26s ease, opacity 0.26s ease, transform 0.26s ease, margin-left 0.26s ease;
    max-width: 230px;
    opacity: 1;
    transform: translateX(0);
    margin-left: 0;
    will-change: max-width, opacity, transform;
}

.products-context-branch-animated.is-hidden[b-ctsvqlufno] {
    max-width: 0;
    opacity: 0;
    transform: translateX(-8px);
    margin-left: -0.25rem;
    pointer-events: none;
}

.products-context-branch-animated.is-visible[b-ctsvqlufno] {
    max-width: 230px;
    opacity: 1;
    transform: translateX(0);
    margin-left: 0;
    pointer-events: auto;
}

.products-context-branch-animated[b-ctsvqlufno]  .k-animation-container {
    width: 220px !important;
}

.products-context-branch-animated.is-hidden[b-ctsvqlufno]  .k-animation-container {
    visibility: hidden;
}

[b-ctsvqlufno] .toolbar-left .toolbar-extra {
    display: inline-flex;
    align-items: center;
}

[b-ctsvqlufno] .toolbar-left .search-input-container {
    flex: 1;
    min-width: 240px;
}

[b-ctsvqlufno] .toolbar-left {
    flex-wrap: nowrap;
}

@media (max-width: 768px) {
    [b-ctsvqlufno] .accordion-toolbar {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        padding: 12px !important;
    }

    .dashboard-container[b-ctsvqlufno]  .toolbar-left {
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
    }

    .dashboard-container[b-ctsvqlufno]  .toolbar-left .toolbar-extra {
        flex: 1 1 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        order: 1 !important;
    }

    .dashboard-container[b-ctsvqlufno]  .toolbar-left .toolbar-search-group {
        width: 100% !important;
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        order: 2 !important;
    }

    [b-ctsvqlufno] .toolbar-left .toolbar-info {
        order: 4;
        flex: 1 1 auto;
        min-width: fit-content;
    }

    [b-ctsvqlufno] .toolbar-right {
        order: 4;
        flex: 0 0 auto;
        width: auto;
        display: inline-flex;
        align-items: center;
        gap: 4px;
    }

    .products-toolbar-context-controls[b-ctsvqlufno] {
        width: 100% !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        min-width: 0 !important;
        gap: 8px;
    }

    .products-toolbar-context-controls.with-mode .products-context-mode[b-ctsvqlufno] {
        flex: 0 0 100px !important;
        min-width: 100px !important;
        max-width: 100px !important;
    }

    .products-toolbar-context-controls.with-mode .products-context-branch[b-ctsvqlufno] {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        width: auto !important;
    }

    .products-toolbar-context-controls.branch-only .products-context-branch[b-ctsvqlufno] {
        flex: 1 1 100% !important;
        min-width: 0 !important;
        width: auto !important;
    }

    .products-context-branch-animated[b-ctsvqlufno],
    .products-context-branch-animated.is-visible[b-ctsvqlufno],
    .products-context-branch-animated.is-hidden[b-ctsvqlufno] {
        max-width: 100% !important;
        opacity: 1 !important;
        transform: none !important;
        margin-left: 0 !important;
        pointer-events: auto !important;
        display: flex !important;
    }

    .products-context-branch-animated[b-ctsvqlufno]  .k-animation-container {
        width: 100% !important;
    }

    .products-context-mode[b-ctsvqlufno] {
        overflow: hidden;
    }

    .products-context-mode[b-ctsvqlufno]  .radio-pill.quote-item-type-toggle {
        width: 100px !important;
        min-width: 100px !important;
        max-width: 100px !important;
        min-height: 28px !important;
        height: 28px !important;
        border-radius: 999px !important;
    }

    .products-context-mode[b-ctsvqlufno]  .radio-pill.quote-item-type-toggle::before {
        top: 2px !important;
        left: 2px !important;
        width: calc(50% - 2px) !important;
        height: calc(100% - 4px) !important;
    }

    .products-context-mode[b-ctsvqlufno]  .radio-pill.quote-item-type-toggle .k-radio-item-label,
    .products-context-mode[b-ctsvqlufno]  .radio-pill.quote-item-type-toggle .k-radio-label,
    .products-context-mode[b-ctsvqlufno]  .radio-pill.quote-item-type-toggle .k-label,
    .products-context-mode[b-ctsvqlufno]  .radio-pill.quote-item-type-toggle label {
        min-height: 100% !important;
        height: 100% !important;
        padding: 0 !important;
        font-size: 0.72rem !important;
        white-space: nowrap !important;
        line-height: 1 !important;
        transform: none !important;
        text-shadow: none !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .products-context-mode[b-ctsvqlufno]  .k-radio-list {
        flex-wrap: nowrap;
    }

    .products-context-branch[b-ctsvqlufno]  .k-picker,
    [b-ctsvqlufno] .toolbar-extra .products-context-branch .k-picker {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    [b-ctsvqlufno] .records-badge {
        width: 100%;
        justify-content: center;
    }
}

[b-ctsvqlufno] .records-badge {
    padding: 5px 12px;
    border-radius: 12px;
    font-weight: 500;
    font-size: 0.8125rem;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background-color: #f3f4f6;
    color: #475467;
    border: 1px solid #e5e7eb;
    white-space: nowrap;
    height: 30px;
    box-sizing: border-box;
}

[b-ctsvqlufno] .filtered-badge {
    background-color: #f0fdf4;
    color: #166534;
    border-color: #bbf7d0;
}

.btn[b-ctsvqlufno] {
    display: inline-flex;
    align-items: center;
    padding: 0.5rem 0.75rem;
    border-radius: 0.375rem;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    font-size: 0.875rem;
    font-weight: 500;
    gap: 0.5rem;
    cursor: pointer;
    transition: all 0.30s;
    border: none;
}

.btn svg[b-ctsvqlufno] {
    height: 1rem;
    width: 1rem;
}

.btn-secondary[b-ctsvqlufno] {
    border: 1px solid #d1d5db;
    color: #374151;
    background-color: white;
}

.btn-secondary:hover[b-ctsvqlufno] {
    background-color: #f9fafb;
}

.btn-danger[b-ctsvqlufno] {
    border: 1px solid transparent;
    color: white;
    background-color: #dc2626;
}

.btn-danger:hover[b-ctsvqlufno] {
    background-color: #b91c1c;
}

.btn-secondary:focus[b-ctsvqlufno], .btn-danger:focus[b-ctsvqlufno] {
    outline: none;
    ring: 2px;
    ring-offset: 2px;
    ring-color: #3b82f6;
}

.btn:disabled[b-ctsvqlufno] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-loading[b-ctsvqlufno] {
    animation: spin-b-ctsvqlufno 1s linear infinite;
}

@keyframes spin-b-ctsvqlufno {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* Delete Confirmation Modal */
.delete-confirmation-content[b-ctsvqlufno] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 1rem;
    padding: 1rem;
}

.warning-icon[b-ctsvqlufno] {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 4rem;
    height: 4rem;
    border-radius: 50%;
    background-color: #fef2f2;
    border: 2px solid #fecaca;
}

.warning-svg[b-ctsvqlufno] {
    width: 2rem;
    height: 2rem;
    color: #dc2626;
}

.delete-text h3[b-ctsvqlufno] {
    margin: 0 0 0.5rem 0;
    font-size: 1.125rem;
    font-weight: 600;
    color: #374151;
    line-height: 1.4;
}

.delete-text p[b-ctsvqlufno] {
    margin: 0;
    font-size: 0.875rem;
    color: #6b7280;
}

[b-ctsvqlufno] .modal-title-text {
    font-size: 1.125rem;
    font-weight: 600;
    color: #374151;
}

[b-ctsvqlufno] .modal-title-icon,
[b-ctsvqlufno] .modal-close-btn .k-svg-icon {
    color: #6b7280;
}

@media (max-width: 340px) {
    .products-toolbar-context-controls[b-ctsvqlufno] {
        gap: 6px !important;
    }
}

[b-ctsvqlufno] .badge-theme-tax-extra {
    background-color: #f8fafc;
    color: #475569;
    border: 1px solid #cbd5e1;
    font-weight: 600;
}

[b-ctsvqlufno] .badge-theme-tax-extra:hover {
    background-color: #f1f5f9;
    border-color: #94a3b8;
}


/* /Pages/Product/Product.razor.rz.scp.css */
/* ==========================================================================
   AuroCore — Product & Features Page Scoped Styles (2026)
   Alternating High-Contrast Rhythms: Corporate Dark Navy ↔ Crisp Light
   STRICT: No alterations to app.css. Everything is scoped here.
   ========================================================================== */

/* --------------------------------------------------------------------------
   0. DESIGN TOKENS & GENERAL WRAPPER
   -------------------------------------------------------------------------- */
.product-page[b-ool4cnj57j] {
    --brand-blue: #093d93;
    --brand-blue-dark: #09224f;
    --brand-blue-navy: #061633;
    --brand-blue-light: #1a5bc4;
    --brand-blue-glow: rgba(9, 61, 147, 0.25);

    --brand-orange: #FF6B00;
    --brand-orange-light: #fd8c1d;
    --brand-orange-glow: rgba(255, 107, 0, 0.35);

    --slate-900: #09224f;
    --slate-800: #13376b;
    --slate-700: #334155;
    --slate-600: #475569;
    --slate-500: #64748b;
    --slate-300: #cbd5e1;
    --slate-200: #e2e8f0;
    --slate-100: #f1f5f9;
    --slate-50: #f8fafc;

    --emerald: #10b981;
    --emerald-dark: #059669;
    --emerald-bg: rgba(16, 185, 129, 0.1);

    --warning-yellow: #f59e0b;
    --warning-bg: rgba(245, 158, 11, 0.1);

    --danger-red: #ef4444;
    --danger-bg: rgba(239, 68, 68, 0.1);

    --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);

    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: #f8fafc;
    color: var(--slate-900);
    font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}

.product-main[b-ool4cnj57j] {
    flex: 1 0 auto;
    width: 100%;
}

.product-container[b-ool4cnj57j] {
    width: 100%;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 clamp(1rem, 3vw, 2rem);
}

.text-highlight[b-ool4cnj57j] {
    background: linear-gradient(135deg, var(--brand-orange) 0%, var(--brand-orange-light) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
    font-weight: 800;
}

.badge-dot-orange[b-ool4cnj57j] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--brand-orange);
    box-shadow: 0 0 8px var(--brand-orange-glow);
    animation: dotPulse-b-ool4cnj57j 2s ease-in-out infinite;
    flex-shrink: 0;
}

@keyframes dotPulse-b-ool4cnj57j {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.6; transform: scale(1.3); }
}

/* --------------------------------------------------------------------------
   1. HERO SECTION
   -------------------------------------------------------------------------- */
.product-hero[b-ool4cnj57j] {
    position: relative;
    padding: clamp(6.5rem, 12vw, 8.5rem) 0 clamp(3rem, 6vw, 5rem);
    background: linear-gradient(180deg, #f8fafc 0%, #edf2f9 100%);
    overflow: hidden;
    border-bottom: 1px solid var(--slate-200);
}

.hero-ambient-mesh[b-ool4cnj57j] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

.mesh-orb[b-ool4cnj57j] {
    position: absolute;
    border-radius: 50%;
    filter: blur(90px);
    opacity: 0.55;
    will-change: transform;
    animation: orbFloat-b-ool4cnj57j 18s ease-in-out infinite alternate;
}

.orb-blue[b-ool4cnj57j] {
    top: -15%;
    left: 10%;
    width: clamp(300px, 40vw, 600px);
    height: clamp(300px, 40vw, 600px);
    background: radial-gradient(circle, rgba(9, 61, 147, 0.18) 0%, transparent 70%);
}

.orb-orange[b-ool4cnj57j] {
    bottom: -10%;
    right: 5%;
    width: clamp(250px, 35vw, 500px);
    height: clamp(250px, 35vw, 500px);
    background: radial-gradient(circle, rgba(255, 107, 0, 0.16) 0%, transparent 70%);
    animation-delay: -9s;
}

.orb-azure[b-ool4cnj57j] {
    top: 30%;
    left: 45%;
    width: clamp(200px, 25vw, 380px);
    height: clamp(200px, 25vw, 380px);
    background: radial-gradient(circle, rgba(56, 189, 248, 0.12) 0%, transparent 70%);
    animation-delay: -5s;
}

@keyframes orbFloat-b-ool4cnj57j {
    0% { transform: translate(0, 0) scale(1); }
    100% { transform: translate(25px, -20px) scale(1.08); }
}

.hero-grid-pattern[b-ool4cnj57j] {
    position: absolute;
    inset: 0;
    background-image: 
        linear-gradient(to right, rgba(9, 34, 79, 0.03) 1px, transparent 1px),
        linear-gradient(to bottom, rgba(9, 34, 79, 0.03) 1px, transparent 1px);
    background-size: 36px 36px;
    pointer-events: none;
    z-index: 0;
}

.hero-header[b-ool4cnj57j] {
    position: relative;
    z-index: 1;
    max-width: 880px;
    margin: 0 auto;
}

.hero-badge[b-ool4cnj57j] {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 0.45rem 1.15rem;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(255, 107, 0, 0.25);
    box-shadow: 0 4px 14px rgba(255, 107, 0, 0.08);
    backdrop-filter: blur(12px);
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--slate-900);
    margin-bottom: 1.5rem;
}

.hero-title[b-ool4cnj57j] {
    font-size: clamp(2.1rem, 4.8vw, 3.6rem);
    font-weight: 800;
    line-height: 1.15;
    color: var(--slate-900);
    margin: 0 0 1.35rem;
    letter-spacing: -0.025em;
}

.hero-lead[b-ool4cnj57j] {
    font-size: clamp(1.05rem, 1.9vw, 1.22rem);
    color: var(--slate-600);
    line-height: 1.7;
    margin: 0 0 2.25rem;
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
}

.hero-actions[b-ool4cnj57j] {
    display: flex;
    gap: 1rem;
    justify-content: center;
    flex-wrap: wrap;
    align-items: center;
}

.btn-hero-primary[b-ool4cnj57j] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.9rem 2.2rem;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--brand-orange), var(--brand-orange-light));
    color: #ffffff !important;
    font-weight: 700;
    font-size: 0.96rem;
    text-decoration: none;
    box-shadow: 0 6px 20px var(--brand-orange-glow);
    transition: all 0.3s var(--ease-spring);
    border: none;
}

.btn-hero-primary:hover[b-ool4cnj57j] {
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(255, 107, 0, 0.45);
    color: #ffffff !important;
}

.btn-hero-solid-blue[b-ool4cnj57j],
.btn-hero-outline[b-ool4cnj57j] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.9rem 2.2rem;
    border-radius: 9999px;
    background: #093d93 !important;
    border: 1.5px solid #093d93 !important;
    color: #ffffff !important;
    font-weight: 700;
    font-size: 0.96rem;
    text-decoration: none;
    box-shadow: 0 4px 14px rgba(9, 61, 147, 0.28) !important;
    transition: all 0.25s var(--ease-spring);
    cursor: pointer;
}

.btn-hero-solid-blue:hover[b-ool4cnj57j],
.btn-hero-outline:hover[b-ool4cnj57j] {
    background: #0b49ac !important;
    border-color: #0b49ac !important;
    color: #ffffff !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(9, 61, 147, 0.45) !important;
}

/* Stats Row */
.hero-stats-row[b-ool4cnj57j] {
    position: relative;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0;
    margin-top: clamp(2.5rem, 5vw, 4rem);
    padding: 1.35rem 2rem;
    border-radius: 20px;
    background: #ffffff;
    border: 1px solid var(--slate-200);
    box-shadow: 0 14px 40px -10px rgba(9, 61, 147, 0.08);
    backdrop-filter: blur(20px);
    max-width: 780px;
    margin-left: auto;
    margin-right: auto;
}

.stat-item[b-ool4cnj57j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.2rem;
    flex: 1;
}

.stat-number[b-ool4cnj57j] {
    font-size: clamp(1.4rem, 2.5vw, 1.85rem);
    font-weight: 800;
    color: var(--slate-900);
    letter-spacing: -0.02em;
}

.stat-label[b-ool4cnj57j] {
    font-size: 0.8rem;
    color: var(--slate-500);
    font-weight: 500;
    text-align: center;
}

.stat-divider[b-ool4cnj57j] {
    width: 1px;
    height: 38px;
    background: var(--slate-200);
    flex-shrink: 0;
}

/* --------------------------------------------------------------------------
   2. SECCIÓN PRINCIPAL: FLUJO OPERATIVO EN ZIG-ZAG (RITMO OSCURO ↔ CLARO)
   -------------------------------------------------------------------------- */
.workflow-section[b-ool4cnj57j] {
    padding: 0;
    background-color: transparent;
    scroll-margin-top: 85px;
}

.block-with-intro[b-ool4cnj57j] {
    padding-top: clamp(5.5rem, 9vw, 7.5rem) !important;
}

.section-header[b-ool4cnj57j] {
    margin-bottom: clamp(3rem, 5vw, 4.5rem);
}

.section-kicker-badge[b-ool4cnj57j] {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.35rem 1.1rem;
    border-radius: 100px;
    background: #ffffff;
    border: 1px solid rgba(9, 61, 147, 0.16);
    font-size: 0.82rem;
    font-weight: 700;
    color: #09224f;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 0.9rem;
    box-shadow: 0 2px 8px rgba(9, 34, 79, 0.06);
}

.section-title[b-ool4cnj57j] {
    font-size: clamp(1.85rem, 4vw, 2.85rem);
    font-weight: 800;
    color: #09224f;
    line-height: 1.2;
    margin: 0 0 1rem;
    letter-spacing: -0.02em;
}

.section-subtitle[b-ool4cnj57j] {
    font-size: clamp(1rem, 1.8vw, 1.15rem);
    color: #475569;
    line-height: 1.7;
    max-width: 660px;
    margin: 0 auto;
}

/* Encabezado en modo oscuro (Bloque 1 Flujo de Trabajo) */
.workflow-intro-header[b-ool4cnj57j] {
    margin-bottom: clamp(3.5rem, 6vw, 5rem);
}

.workflow-intro-header .section-kicker-badge[b-ool4cnj57j],
.theme-dark .section-kicker-badge[b-ool4cnj57j] {
    background: rgba(255, 255, 255, 0.12) !important;
    border: 1px solid rgba(255, 255, 255, 0.22) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25) !important;
    backdrop-filter: blur(10px);
}

.workflow-intro-header .section-title[b-ool4cnj57j],
.theme-dark .section-title[b-ool4cnj57j] {
    color: #ffffff !important;
}

.workflow-intro-header .section-subtitle[b-ool4cnj57j],
.theme-dark .section-subtitle[b-ool4cnj57j] {
    color: #cbd5e1 !important;
}

.zigzag-flow[b-ool4cnj57j] {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.zigzag-block[b-ool4cnj57j] {
    position: relative;
    width: 100%;
    padding: clamp(4.5rem, 8vw, 7rem) 0;
    overflow: hidden;
}

/* --------------------------------------------------------------------------
   THEME DARK (Azul Marino Corporativo #09224f / #061633)
   Texto en BLANCO PURO y contrastes nítidos
   -------------------------------------------------------------------------- */
.zigzag-block.theme-dark[b-ool4cnj57j] {
    background: linear-gradient(180deg, #09224f 0%, #061633 100%);
    border-top: none;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    color: #ffffff;
}

.zigzag-block.theme-dark:not(:first-child)[b-ool4cnj57j] {
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.block-mesh-ambient[b-ool4cnj57j] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

.orb-orange-glow[b-ool4cnj57j] {
    top: -20%;
    right: -10%;
    width: 420px;
    height: 420px;
    background: radial-gradient(circle, rgba(255, 107, 0, 0.16) 0%, transparent 70%);
}

.orb-blue-glow[b-ool4cnj57j] {
    bottom: -20%;
    left: -10%;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(9, 61, 147, 0.28) 0%, transparent 70%);
}

.orb-azure-glow[b-ool4cnj57j] {
    top: -15%;
    left: -5%;
    width: 420px;
    height: 420px;
    background: radial-gradient(circle, rgba(56, 189, 248, 0.14) 0%, transparent 70%);
}

.orb-emerald-glow[b-ool4cnj57j] {
    bottom: -15%;
    right: -5%;
    width: 400px;
    height: 400px;
    background: radial-gradient(circle, rgba(16, 185, 129, 0.15) 0%, transparent 70%);
}

/* Forzar Texto Blanco en Secciones Oscuras */
.theme-dark .block-badge[b-ool4cnj57j],
.zigzag-block.theme-dark .block-badge[b-ool4cnj57j] {
    background: rgba(255, 255, 255, 0.12) !important;
    border: 1px solid rgba(255, 255, 255, 0.22) !important;
    color: #ffffff !important;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25) !important;
    backdrop-filter: blur(10px);
}

.theme-dark .block-title[b-ool4cnj57j],
.zigzag-block.theme-dark .block-title[b-ool4cnj57j],
.theme-dark h2.block-title[b-ool4cnj57j] {
    color: #ffffff !important;
}

.theme-dark .block-description[b-ool4cnj57j],
.zigzag-block.theme-dark .block-description[b-ool4cnj57j],
.theme-dark p.block-description[b-ool4cnj57j] {
    color: #e2e8f0 !important;
}

.theme-dark .block-feature-list li[b-ool4cnj57j],
.zigzag-block.theme-dark .block-feature-list li[b-ool4cnj57j] {
    color: #cbd5e1 !important;
}

.theme-dark .block-feature-list li strong[b-ool4cnj57j],
.zigzag-block.theme-dark .block-feature-list li strong[b-ool4cnj57j] {
    color: #ffffff !important;
}

.theme-dark .feature-icon-bullet[b-ool4cnj57j] {
    background: rgba(16, 185, 129, 0.22) !important;
    color: #34d399 !important;
    border: 1px solid rgba(16, 185, 129, 0.35) !important;
}

/* --------------------------------------------------------------------------
   THEME LIGHT (Blanco Puro / Slate-50)
   -------------------------------------------------------------------------- */
.zigzag-block.theme-light[b-ool4cnj57j] {
    background: #ffffff;
    border-top: 1px solid var(--slate-200);
    border-bottom: 1px solid var(--slate-200);
    color: var(--slate-900);
}

.theme-light .block-badge[b-ool4cnj57j],
.zigzag-block.theme-light .block-badge[b-ool4cnj57j] {
    background: var(--slate-100) !important;
    border: 1px solid var(--slate-200) !important;
    color: var(--slate-800) !important;
}

.theme-light .block-title[b-ool4cnj57j],
.zigzag-block.theme-light .block-title[b-ool4cnj57j],
.theme-light h2.block-title[b-ool4cnj57j] {
    color: var(--slate-900) !important;
}

.theme-light .block-description[b-ool4cnj57j],
.zigzag-block.theme-light .block-description[b-ool4cnj57j],
.theme-light p.block-description[b-ool4cnj57j] {
    color: var(--slate-600) !important;
}

.theme-light .block-feature-list li[b-ool4cnj57j],
.zigzag-block.theme-light .block-feature-list li[b-ool4cnj57j] {
    color: var(--slate-700) !important;
}

.theme-light .block-feature-list li strong[b-ool4cnj57j],
.zigzag-block.theme-light .block-feature-list li strong[b-ool4cnj57j] {
    color: var(--slate-900) !important;
}

.theme-light .feature-icon-bullet[b-ool4cnj57j] {
    background: var(--emerald-bg) !important;
    color: var(--emerald-dark) !important;
}

/* Block Content Common */
.block-content[b-ool4cnj57j] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    z-index: 1;
}

.block-badge[b-ool4cnj57j] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.9rem;
    border-radius: 100px;
    font-size: 0.82rem;
    font-weight: 700;
    margin-bottom: 1.1rem;
    width: fit-content;
}

.block-title[b-ool4cnj57j] {
    font-size: clamp(1.5rem, 3.2vw, 2.1rem);
    font-weight: 800;
    line-height: 1.25;
    margin: 0 0 1.1rem;
    letter-spacing: -0.02em;
}

.block-description[b-ool4cnj57j] {
    font-size: 1.02rem;
    line-height: 1.7;
    margin: 0 0 1.5rem;
}

.block-feature-list[b-ool4cnj57j] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.block-feature-list li[b-ool4cnj57j] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    font-size: 0.93rem;
    line-height: 1.55;
}

.feature-icon-bullet[b-ool4cnj57j] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-top: 2px;
}

.feature-icon-bullet[b-ool4cnj57j]  svg {
    width: 13px;
    height: 13px;
    stroke-width: 2.5;
}

/* --------------------------------------------------------------------------
   SOFTWARE WINDOW MOCKUP CONTAINER (TODOS CON FONDO BLANCO LIMPIO)
   Diseño homogéneo estilo macOS para máximo contraste sobre azul o blanco
   -------------------------------------------------------------------------- */
.software-window[b-ool4cnj57j] {
    width: 100%;
    border-radius: 20px;
    background: #ffffff !important;
    border: 1px solid var(--slate-200);
    box-shadow: 0 20px 50px -12px rgba(9, 34, 79, 0.18), 0 4px 16px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    position: relative;
    z-index: 1;
    transition: transform 0.3s var(--ease-spring), box-shadow 0.3s var(--ease-spring);
}

.theme-dark .software-window[b-ool4cnj57j] {
    box-shadow: 0 25px 60px -10px rgba(0, 0, 0, 0.45), 0 6px 24px rgba(0, 0, 0, 0.25);
    border: 1px solid rgba(255, 255, 255, 0.15);
}

.software-window:hover[b-ool4cnj57j] {
    transform: translateY(-3px);
    box-shadow: 0 28px 65px -12px rgba(9, 34, 79, 0.25), 0 8px 24px rgba(0, 0, 0, 0.15);
}

.window-header[b-ool4cnj57j] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1.15rem;
    background: #f8fafc !important;
    border-bottom: 1px solid var(--slate-200) !important;
}

.window-controls[b-ool4cnj57j] {
    display: flex;
    align-items: center;
    gap: 7px;
}

.control-dot[b-ool4cnj57j] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.control-dot.red[b-ool4cnj57j] { background: #ff5f57; }
.control-dot.yellow[b-ool4cnj57j] { background: #ffbd2e; }
.control-dot.green[b-ool4cnj57j] { background: #28c840; }

.window-title[b-ool4cnj57j] {
    font-size: 0.76rem;
    font-weight: 600;
    color: #475569 !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0 0.5rem;
}

.window-body[b-ool4cnj57j] {
    padding: clamp(1.25rem, 2.5vw, 1.75rem);
    background: #ffffff !important;
    color: var(--slate-900) !important;
}

.window-badge-live[b-ool4cnj57j] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.68rem;
    font-weight: 700;
    color: #059669;
    background: rgba(16, 185, 129, 0.12);
    border: 1px solid rgba(16, 185, 129, 0.25);
    padding: 0.2rem 0.55rem;
    border-radius: 100px;
}

.pulse-live[b-ool4cnj57j] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--emerald);
    box-shadow: 0 0 6px var(--emerald);
    animation: dotPulse-b-ool4cnj57j 1.8s infinite;
}

.window-badge-locked[b-ool4cnj57j] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--brand-blue);
    background: rgba(9, 61, 147, 0.08);
    border: 1px solid rgba(9, 61, 147, 0.18);
    padding: 0.2rem 0.55rem;
    border-radius: 100px;
}

.window-badge-success[b-ool4cnj57j] {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    font-size: 0.68rem;
    font-weight: 700;
    color: #059669;
    background: rgba(16, 185, 129, 0.12);
    border: 1px solid rgba(16, 185, 129, 0.25);
    padding: 0.2rem 0.55rem;
    border-radius: 100px;
}

/* --------------------------------------------------------------------------
   MOCKUP 1: AGENDAMIENTO & CITAS (FONDO BLANCO)
   -------------------------------------------------------------------------- */
.mockup-tab-bar[b-ool4cnj57j] {
    display: flex;
    gap: 0.5rem;
    padding-bottom: 0.85rem;
    border-bottom: 1px solid var(--slate-200);
    margin-bottom: 1.15rem;
}

.tab-item[b-ool4cnj57j] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--slate-500);
    padding: 0.3rem 0.7rem;
    border-radius: 8px;
    cursor: default;
}

.tab-item.active[b-ool4cnj57j] {
    color: var(--slate-900);
    background: var(--slate-100);
    border: 1px solid var(--slate-200);
}

.tab-count-badge[b-ool4cnj57j] {
    background: var(--brand-orange);
    color: #ffffff;
    font-size: 0.65rem;
    font-weight: 700;
    padding: 0.1rem 0.4rem;
    border-radius: 100px;
}

.tab-count-neutral[b-ool4cnj57j] {
    background: var(--slate-200);
    color: var(--slate-600);
    font-size: 0.65rem;
    font-weight: 700;
    padding: 0.1rem 0.4rem;
    border-radius: 100px;
}

.appointment-card[b-ool4cnj57j] {
    border-radius: 14px;
    background: #ffffff;
    border: 1.5px solid rgba(245, 158, 11, 0.35);
    box-shadow: 0 6px 18px rgba(245, 158, 11, 0.08);
    padding: 1.15rem;
    margin-bottom: 0.85rem;
}

.appointment-card-top[b-ool4cnj57j] {
    margin-bottom: 0.75rem;
}

.id-tag[b-ool4cnj57j] {
    font-size: 0.75rem;
    font-weight: 800;
    color: var(--slate-900);
    margin-right: 0.5rem;
}

.slot-time[b-ool4cnj57j] {
    font-size: 0.75rem;
    color: var(--slate-500);
    font-weight: 500;
}

.badge-status-warning[b-ool4cnj57j] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.7rem;
    font-weight: 700;
    color: #b45309;
    background: #fef3c7;
    border: 1px solid #fde68a;
    padding: 0.25rem 0.65rem;
    border-radius: 100px;
}

.status-pulse-yellow[b-ool4cnj57j] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #d97706;
    animation: dotPulse-b-ool4cnj57j 2s infinite;
}

.appointment-customer-info[b-ool4cnj57j] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.85rem;
}

.customer-avatar[b-ool4cnj57j] {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--brand-blue), var(--brand-blue-light));
    color: #ffffff;
    font-size: 0.85rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.customer-name[b-ool4cnj57j] {
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--slate-900);
}

.customer-subtext[b-ool4cnj57j] {
    font-size: 0.74rem;
    color: var(--slate-500);
}

.appointment-service-pill[b-ool4cnj57j] {
    background: var(--slate-50);
    border: 1px solid var(--slate-200);
    border-radius: 10px;
    padding: 0.65rem 0.85rem;
    margin-bottom: 1rem;
}

.service-label[b-ool4cnj57j] {
    display: block;
    font-size: 0.68rem;
    color: var(--slate-500);
    text-transform: uppercase;
    font-weight: 600;
}

.service-name[b-ool4cnj57j] {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--slate-800);
}

.deposit-tag[b-ool4cnj57j] {
    font-size: 0.74rem;
    font-weight: 700;
    color: #059669;
    background: rgba(16, 185, 129, 0.1);
    border: 1px solid rgba(16, 185, 129, 0.25);
    padding: 0.25rem 0.6rem;
    border-radius: 6px;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    white-space: nowrap;
}

.appointment-card-actions[b-ool4cnj57j] {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 0.65rem;
}

.btn-mockup-reject[b-ool4cnj57j] {
    padding: 0.55rem 0.85rem;
    border-radius: 8px;
    background: #ffffff;
    border: 1px solid var(--slate-300);
    color: var(--slate-600);
    font-size: 0.78rem;
    font-weight: 600;
    cursor: default;
    transition: all 0.2s;
}

.btn-mockup-reject:hover[b-ool4cnj57j] {
    background: #fee2e2;
    color: #b91c1c;
}

.btn-mockup-accept[b-ool4cnj57j] {
    padding: 0.55rem 0.85rem;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--brand-blue), var(--brand-blue-light));
    border: none;
    color: #ffffff;
    font-size: 0.78rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    cursor: default;
}

.appointment-card-mini[b-ool4cnj57j] {
    padding: 0.65rem 0.85rem;
    border-radius: 10px;
    background: var(--slate-50);
    border: 1px solid var(--slate-200);
}

.mini-code[b-ool4cnj57j] {
    font-size: 0.74rem;
    font-weight: 700;
    color: var(--slate-700);
    margin-right: 0.35rem;
}

.mini-name[b-ool4cnj57j] {
    font-size: 0.74rem;
    color: var(--slate-800);
    font-weight: 600;
}

.mini-time[b-ool4cnj57j] {
    font-size: 0.72rem;
    color: var(--slate-500);
}

.mini-deposit[b-ool4cnj57j] {
    font-size: 0.72rem;
    font-weight: 700;
    color: #059669;
}

/* --------------------------------------------------------------------------
   MOCKUP 2: CUSTODIA SEGURA & FIRMA (FONDO BLANCO)
   -------------------------------------------------------------------------- */
.custody-item-banner[b-ool4cnj57j] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 0.95rem;
    border-radius: 12px;
    background: var(--slate-50);
    border: 1px solid var(--slate-200);
    margin-bottom: 1rem;
}

.item-icon-box[b-ool4cnj57j] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: rgba(9, 61, 147, 0.1);
    color: var(--brand-blue);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.item-title[b-ool4cnj57j] {
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--slate-900);
}

.item-serial[b-ool4cnj57j] {
    font-size: 0.72rem;
    color: var(--slate-500);
}

.photo-evidence-grid[b-ool4cnj57j] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.65rem;
    margin-bottom: 1rem;
}

.photo-slot[b-ool4cnj57j] {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.slot-image-simulated[b-ool4cnj57j] {
    position: relative;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid var(--slate-200);
    background: #f1f5f9;
}

.photo-svg[b-ool4cnj57j] {
    width: 100%;
    height: 52px;
    display: block;
}

.photo-indicator-dot[b-ool4cnj57j] {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--brand-orange);
    box-shadow: 0 0 6px var(--brand-orange);
}

.photo-caption[b-ool4cnj57j] {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--slate-600);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.signature-box-validated[b-ool4cnj57j] {
    border-radius: 12px;
    background: rgba(16, 185, 129, 0.04);
    border: 1.5px solid rgba(16, 185, 129, 0.4);
    padding: 0.75rem 0.95rem;
    margin-bottom: 1rem;
}

.signature-box-header[b-ool4cnj57j] {
    margin-bottom: 0.4rem;
}

.signature-label[b-ool4cnj57j] {
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--slate-700);
}

.badge-signature-valid[b-ool4cnj57j] {
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--emerald-dark);
    background: var(--emerald-bg);
    padding: 0.15rem 0.5rem;
    border-radius: 100px;
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}

.signature-canvas-simulated[b-ool4cnj57j] {
    height: 40px;
    display: flex;
    align-items: center;
    border-bottom: 1px dashed rgba(16, 185, 129, 0.4);
    margin-bottom: 0.4rem;
}

.signature-vector[b-ool4cnj57j] {
    width: 100%;
    height: 32px;
}

.signature-meta-row[b-ool4cnj57j] {
    display: flex;
    justify-content: space-between;
    font-size: 0.66rem;
    color: var(--slate-500);
}

.btn-mockup-unlocked-action[b-ool4cnj57j] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--emerald-dark), #059669);
    color: #ffffff;
    font-size: 0.84rem;
    font-weight: 700;
    border: none;
    cursor: default;
    box-shadow: 0 4px 14px rgba(16, 185, 129, 0.25);
}

/* --------------------------------------------------------------------------
   MOCKUP 3: RASTREO PÚBLICO EN VIVO (FONDO BLANCO)
   -------------------------------------------------------------------------- */
.tracking-mobile-view[b-ool4cnj57j] {
    max-width: 480px;
    margin: 0 auto;
}

.tracking-device-time[b-ool4cnj57j] {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--slate-500);
}

.tracking-top-card[b-ool4cnj57j] {
    border-radius: 14px;
    background: var(--slate-50);
    border: 1px solid var(--slate-200);
    padding: 1rem 1.15rem;
    margin-bottom: 1.15rem;
}

.tracking-kicker[b-ool4cnj57j] {
    font-size: 0.65rem;
    font-weight: 700;
    color: var(--slate-500);
    letter-spacing: 0.05em;
    display: block;
}

.tracking-code[b-ool4cnj57j] {
    font-size: 1.2rem;
    font-weight: 800;
    color: var(--slate-900);
}

.badge-status-in-progress[b-ool4cnj57j] {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    font-size: 0.72rem;
    font-weight: 700;
    color: var(--brand-blue);
    background: rgba(9, 61, 147, 0.08);
    border: 1px solid rgba(9, 61, 147, 0.18);
    padding: 0.25rem 0.65rem;
    border-radius: 100px;
}

.pulse-blue[b-ool4cnj57j] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--brand-blue);
    animation: dotPulse-b-ool4cnj57j 1.8s infinite;
}

.tracking-eta[b-ool4cnj57j] {
    margin-top: 0.6rem;
    font-size: 0.78rem;
    color: var(--slate-600);
    display: flex;
    align-items: center;
    gap: 0.35rem;
}

.stepper-horizontal[b-ool4cnj57j] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.25rem;
    padding: 0 0.5rem;
}

.step-point[b-ool4cnj57j] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.3rem;
    z-index: 1;
}

.step-circle[b-ool4cnj57j] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.72rem;
    font-weight: 700;
}

.step-point.done .step-circle[b-ool4cnj57j] {
    background: var(--emerald-bg);
    color: var(--emerald-dark);
    border: 1.5px solid var(--emerald);
}

.step-point.active .step-circle[b-ool4cnj57j] {
    background: var(--brand-orange);
    color: #ffffff;
    box-shadow: 0 0 10px var(--brand-orange-glow);
}

.step-pulse[b-ool4cnj57j] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #ffffff;
    animation: dotPulse-b-ool4cnj57j 1.5s infinite;
}

.step-point.pending .step-circle[b-ool4cnj57j] {
    background: var(--slate-100);
    color: var(--slate-400);
    border: 1.5px solid var(--slate-200);
}

.step-name[b-ool4cnj57j] {
    font-size: 0.66rem;
    font-weight: 600;
    color: var(--slate-600);
}

.step-point.active .step-name[b-ool4cnj57j] {
    color: var(--brand-orange);
    font-weight: 700;
}

.step-line[b-ool4cnj57j] {
    flex: 1;
    height: 2px;
    background: var(--slate-200);
    margin: 0 4px 18px 4px;
}

.step-line.done[b-ool4cnj57j] {
    background: var(--emerald);
}

.step-line.active[b-ool4cnj57j] {
    background: linear-gradient(to right, var(--emerald), var(--brand-orange));
}

.tracking-services-list[b-ool4cnj57j] {
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    margin-bottom: 1rem;
}

.tracking-service-item[b-ool4cnj57j] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.65rem 0.85rem;
    border-radius: 10px;
    background: var(--slate-50);
    border: 1px solid var(--slate-200);
}

.service-status-icon[b-ool4cnj57j] {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
    flex-shrink: 0;
}

.tracking-service-item.completed .service-status-icon[b-ool4cnj57j] {
    background: var(--emerald-bg);
    color: var(--emerald-dark);
}

.tracking-service-item.in-progress .service-status-icon.current[b-ool4cnj57j] {
    background: rgba(255, 107, 0, 0.15);
}

.status-pulse-orange[b-ool4cnj57j] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--brand-orange);
    animation: dotPulse-b-ool4cnj57j 1.6s infinite;
}

.service-details[b-ool4cnj57j] {
    flex: 1;
}

.tracking-service-item .service-name[b-ool4cnj57j] {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--slate-800);
}

.tracking-service-item .service-sub[b-ool4cnj57j] {
    font-size: 0.68rem;
    color: var(--slate-500);
}

.service-badge-done[b-ool4cnj57j] {
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--emerald-dark);
    background: var(--emerald-bg);
    padding: 0.15rem 0.45rem;
    border-radius: 6px;
}

.service-badge-progress[b-ool4cnj57j] {
    font-size: 0.68rem;
    font-weight: 700;
    color: var(--brand-orange);
    background: rgba(255, 107, 0, 0.12);
    padding: 0.15rem 0.45rem;
    border-radius: 6px;
}

.tracking-sms-notice[b-ool4cnj57j] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.65rem 0.85rem;
    border-radius: 8px;
    background: rgba(9, 61, 147, 0.05);
    border: 1px solid rgba(9, 61, 147, 0.12);
    font-size: 0.72rem;
    color: var(--brand-blue);
    font-weight: 500;
}

/* --------------------------------------------------------------------------
   MOCKUP 4: POS & BOM FRACCIONADO (FONDO BLANCO)
   -------------------------------------------------------------------------- */
.pos-user-badge[b-ool4cnj57j] {
    font-size: 0.72rem;
    color: var(--slate-600);
    font-weight: 600;
}

.pos-scanner-bar[b-ool4cnj57j] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.65rem 0.95rem;
    border-radius: 10px;
    background: var(--slate-50);
    border: 1px dashed var(--slate-300);
    margin-bottom: 0.85rem;
}

.barcode-icon[b-ool4cnj57j] {
    font-family: monospace;
    font-weight: 800;
    letter-spacing: 2px;
    color: var(--slate-700);
}

.scanner-text[b-ool4cnj57j] {
    font-size: 0.74rem;
    color: var(--slate-500);
}

.badge-barcode-active[b-ool4cnj57j] {
    font-size: 0.66rem;
    font-weight: 700;
    color: var(--emerald-dark);
    background: var(--emerald-bg);
    padding: 0.15rem 0.5rem;
    border-radius: 6px;
}

.pos-ticket-items[b-ool4cnj57j] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 0.85rem;
}

.pos-item-row[b-ool4cnj57j] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.65rem 0.85rem;
    border-radius: 8px;
    background: #ffffff;
    border: 1px solid var(--slate-200);
}

.pos-item-name[b-ool4cnj57j] {
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--slate-900);
}

.pos-item-bom[b-ool4cnj57j] {
    font-size: 0.7rem;
    color: var(--slate-500);
    margin-top: 2px;
}

.badge-bom-tag[b-ool4cnj57j] {
    font-size: 0.64rem;
    font-weight: 700;
    color: var(--brand-orange);
    background: rgba(255, 107, 0, 0.1);
    padding: 0.1rem 0.4rem;
    border-radius: 4px;
    margin-right: 0.25rem;
}

.pos-item-price[b-ool4cnj57j] {
    font-size: 0.85rem;
    font-weight: 800;
    color: var(--slate-900);
}

.pos-totals-panel[b-ool4cnj57j] {
    border-top: 1px solid var(--slate-200);
    padding-top: 0.65rem;
    margin-bottom: 0.85rem;
}

.pos-total-row[b-ool4cnj57j] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.76rem;
    color: var(--slate-600);
    margin-bottom: 0.35rem;
}

.pos-total-row.highlight-net[b-ool4cnj57j] {
    font-size: 0.95rem;
    font-weight: 800;
    color: var(--slate-900);
    border-top: 1px dashed var(--slate-200);
    padding-top: 0.45rem;
    margin-top: 0.45rem;
}

.total-big-number[b-ool4cnj57j] {
    font-size: 1.15rem;
    color: var(--slate-900);
}

.pos-payment-box[b-ool4cnj57j] {
    border-radius: 12px;
    background: var(--slate-50);
    border: 1px solid var(--slate-200);
    padding: 0.75rem 0.95rem;
    margin-bottom: 0.85rem;
}

.payment-method-label[b-ool4cnj57j] {
    font-size: 0.74rem;
    color: var(--slate-600);
}

.received-amount-pill[b-ool4cnj57j] {
    font-size: 0.74rem;
    color: var(--slate-700);
}

.change-green-banner[b-ool4cnj57j] {
    border-radius: 8px;
    background: #ecfdf5;
    border: 1.5px solid #10b981;
    padding: 0.55rem 0.85rem;
}

.change-icon-circle[b-ool4cnj57j] {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #10b981;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.7rem;
}

.change-label[b-ool4cnj57j] {
    font-size: 0.76rem;
    font-weight: 700;
    color: #065f46;
}

.change-amount[b-ool4cnj57j] {
    font-size: 1.05rem;
    font-weight: 800;
    color: #047857;
}

.pos-actions-row[b-ool4cnj57j] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.65rem;
}

.btn-pos-print[b-ool4cnj57j] {
    padding: 0.55rem 0.85rem;
    border-radius: 8px;
    background: #ffffff;
    border: 1px solid var(--slate-300);
    color: var(--slate-700);
    font-size: 0.76rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    cursor: default;
}

.btn-pos-complete[b-ool4cnj57j] {
    padding: 0.55rem 0.85rem;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--brand-orange), var(--brand-orange-light));
    border: none;
    color: #ffffff;
    font-size: 0.76rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    cursor: default;
}

/* --------------------------------------------------------------------------
   MOCKUP 5: COMISIONES & FINANZAS (FONDO BLANCO)
   -------------------------------------------------------------------------- */
.settlement-user-card[b-ool4cnj57j] {
    border-radius: 12px;
    background: var(--slate-50);
    border: 1px solid var(--slate-200);
    padding: 0.85rem 1rem;
    margin-bottom: 0.85rem;
}

.user-avatar-tag[b-ool4cnj57j] {
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--brand-blue), var(--brand-blue-light));
    color: #ffffff;
    font-size: 0.82rem;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.user-title[b-ool4cnj57j] {
    font-size: 0.86rem;
    font-weight: 700;
    color: var(--slate-900);
}

.user-sub[b-ool4cnj57j] {
    font-size: 0.72rem;
    color: var(--slate-500);
}

.settlement-total-kicker[b-ool4cnj57j] {
    font-size: 0.62rem;
    font-weight: 700;
    color: var(--slate-500);
    letter-spacing: 0.05em;
    display: block;
}

.settlement-total-val[b-ool4cnj57j] {
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--brand-blue);
}

.settlement-table-wrapper[b-ool4cnj57j] {
    border-radius: 10px;
    border: 1px solid var(--slate-200);
    overflow: hidden;
    margin-bottom: 0.85rem;
}

.settlement-table[b-ool4cnj57j] {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.74rem;
}

.settlement-table th[b-ool4cnj57j] {
    background: var(--slate-100);
    color: var(--slate-600);
    font-weight: 600;
    padding: 0.5rem 0.75rem;
    text-align: left;
    border-bottom: 1px solid var(--slate-200);
}

.settlement-table td[b-ool4cnj57j] {
    padding: 0.55rem 0.75rem;
    color: var(--slate-700);
    border-bottom: 1px solid var(--slate-100);
}

.order-link[b-ool4cnj57j] {
    font-weight: 700;
    color: var(--brand-blue);
}

.commission-earn[b-ool4cnj57j] {
    color: var(--emerald-dark);
    font-weight: 800;
}

.warranty-status-badge[b-ool4cnj57j] {
    padding: 0.55rem 0.85rem;
    border-radius: 8px;
    background: rgba(16, 185, 129, 0.06);
    border: 1px solid rgba(16, 185, 129, 0.2);
    font-size: 0.72rem;
    color: var(--emerald-dark);
    margin-bottom: 0.85rem;
}

.badge-status-ok[b-ool4cnj57j] {
    font-size: 0.65rem;
    font-weight: 700;
    background: #10b981;
    color: #ffffff;
    padding: 0.15rem 0.45rem;
    border-radius: 4px;
}

.settlement-actions-row[b-ool4cnj57j] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.65rem;
}

.btn-settlement-pdf[b-ool4cnj57j] {
    padding: 0.55rem 0.85rem;
    border-radius: 8px;
    background: #ffffff;
    border: 1px solid var(--slate-300);
    color: var(--slate-700);
    font-size: 0.76rem;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    cursor: default;
}

.btn-settlement-pay[b-ool4cnj57j] {
    padding: 0.55rem 0.85rem;
    border-radius: 8px;
    background: linear-gradient(135deg, var(--emerald-dark), #059669);
    border: none;
    color: #ffffff;
    font-size: 0.76rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    cursor: default;
}

/* --------------------------------------------------------------------------
   3. ESPECIFICACIONES TÉCNICAS Y COMPATIBILIDAD
   -------------------------------------------------------------------------- */
.tech-specs-section[b-ool4cnj57j] {
    padding: clamp(4.5rem, 8vw, 7rem) 0;
    background-color: var(--slate-50);
    border-top: 1px solid var(--slate-200);
    border-bottom: 1px solid var(--slate-200);
}

.tech-specs-section .section-kicker-badge[b-ool4cnj57j] {
    background: #ffffff !important;
    border: 1px solid rgba(9, 61, 147, 0.16) !important;
    color: #09224f !important;
    box-shadow: 0 4px 12px rgba(9, 34, 79, 0.05) !important;
}

.tech-specs-section .section-title[b-ool4cnj57j] {
    color: #09224f !important;
    font-weight: 800;
}

.tech-specs-section .section-subtitle[b-ool4cnj57j] {
    color: #475569 !important;
}

.spec-card[b-ool4cnj57j] {
    padding: 2rem 1.75rem;
    border-radius: 20px;
    background: #ffffff;
    border: 1px solid var(--slate-200);
    box-shadow: 0 6px 20px -4px rgba(9, 34, 79, 0.05);
    height: 100%;
    display: flex;
    flex-direction: column;
    transition: all 0.35s var(--ease-spring);
}

.spec-card:hover[b-ool4cnj57j] {
    transform: translateY(-4px);
    box-shadow: 0 16px 36px -8px rgba(9, 61, 147, 0.12);
    border-color: var(--slate-300);
}

.spec-icon-box[b-ool4cnj57j] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: linear-gradient(135deg, rgba(9, 61, 147, 0.08), rgba(255, 107, 0, 0.08));
    border: 1px solid rgba(9, 61, 147, 0.12);
    color: var(--brand-blue);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.25rem;
    flex-shrink: 0;
}

.spec-icon-box[b-ool4cnj57j]  svg {
    width: 24px;
    height: 24px;
}

.spec-title[b-ool4cnj57j] {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--slate-900);
    margin: 0 0 0.65rem;
}

.spec-description[b-ool4cnj57j] {
    font-size: 0.9rem;
    color: var(--slate-600);
    line-height: 1.65;
    margin: 0;
    flex: 1;
}

/* --------------------------------------------------------------------------
   4. CALL TO ACTION FINAL (BANNER INFERIOR AZUL MARINO)
   -------------------------------------------------------------------------- */
.product-cta-section[b-ool4cnj57j] {
    padding: clamp(4rem, 8vw, 6.5rem) 0;
    background-color: #ffffff;
}

.cta-banner-navy[b-ool4cnj57j] {
    position: relative;
    border-radius: 28px;
    padding: clamp(3rem, 6vw, 5rem) clamp(1.5rem, 4vw, 3.5rem);
    background: linear-gradient(135deg, var(--slate-900) 0%, #061633 100%);
    color: #ffffff;
    overflow: hidden;
    box-shadow: 0 24px 60px -15px rgba(6, 22, 51, 0.4);
}

.cta-ambient-elements[b-ool4cnj57j] {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.cta-glow[b-ool4cnj57j] {
    position: absolute;
    border-radius: 50%;
    filter: blur(75px);
    opacity: 0.35;
}

.cta-banner-content[b-ool4cnj57j] {
    position: relative;
    z-index: 1;
    max-width: 820px;
    margin: 0 auto;
}

.cta-banner-title[b-ool4cnj57j] {
    font-size: clamp(1.75rem, 4.2vw, 2.85rem);
    font-weight: 800;
    line-height: 1.2;
    margin: 0 0 1.25rem;
    letter-spacing: -0.02em;
    color: #ffffff;
}

.cta-banner-subtitle[b-ool4cnj57j] {
    font-size: clamp(1rem, 1.8vw, 1.18rem);
    color: rgba(241, 245, 249, 0.85);
    line-height: 1.7;
    max-width: 680px;
    margin: 0 auto 2.25rem;
}

.cta-banner-actions[b-ool4cnj57j] {
    display: flex;
    justify-content: center;
    margin-bottom: 1.25rem;
}

.btn-cta-main[b-ool4cnj57j] {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    padding: 1rem 2.5rem;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--brand-orange), var(--brand-orange-light));
    color: #ffffff !important;
    font-weight: 700;
    font-size: 1.05rem;
    text-decoration: none;
    box-shadow: 0 8px 24px var(--brand-orange-glow);
    transition: all 0.3s var(--ease-spring);
    border: none;
}

.btn-cta-main:hover[b-ool4cnj57j] {
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(255, 107, 0, 0.5);
    color: #ffffff !important;
}

.cta-banner-microtext[b-ool4cnj57j] {
    font-size: 0.84rem;
    color: rgba(203, 213, 225, 0.7);
    margin: 0;
}

/* --------------------------------------------------------------------------
   5. RESPONSIVE OPTIMIZATIONS
   -------------------------------------------------------------------------- */
@media (max-width: 991px) {
    .block-content[b-ool4cnj57j] {
        margin-bottom: 2rem;
    }
}

@media (max-width: 767px) {
    .hero-stats-row[b-ool4cnj57j] {
        flex-wrap: wrap;
        gap: 1rem;
        padding: 1.25rem 1rem;
    }

    .stat-divider[b-ool4cnj57j] {
        display: none;
    }

    .stat-item[b-ool4cnj57j] {
        min-width: 42%;
    }

    .appointment-card-actions[b-ool4cnj57j],
    .pos-actions-row[b-ool4cnj57j],
    .settlement-actions-row[b-ool4cnj57j] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .hero-actions[b-ool4cnj57j] {
        flex-direction: column;
        align-items: stretch;
    }

    .btn-hero-primary[b-ool4cnj57j],
    .btn-hero-outline[b-ool4cnj57j],
    .btn-cta-main[b-ool4cnj57j] {
        justify-content: center;
        width: 100%;
    }

    .photo-evidence-grid[b-ool4cnj57j] {
        grid-template-columns: 1fr;
    }

    .stepper-horizontal[b-ool4cnj57j] {
        overflow-x: auto;
    }
}
/* /Pages/PropertyManagement/Belonging/BelongingDetail.razor.rz.scp.css */
.belonging-detail-container[b-dq1i1z42hj] {
    padding: 1.5rem;
    max-width: 1300px;
    margin: 0 auto;
    font-family: inherit;
}

.card-glass[b-dq1i1z42hj] {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(226, 232, 240, 0.8);
    border-radius: 16px;
    box-shadow: 0 8px 32px rgba(15, 23, 42, 0.04);
}

/* Hero Section */
.belonging-hero[b-dq1i1z42hj] {
    padding: 2rem;
}

.hero-content[b-dq1i1z42hj] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 1.5rem;
}

.hero-badge[b-dq1i1z42hj] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.75rem;
    background: rgba(16, 185, 129, 0.1);
    color: #059669;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    margin-bottom: 0.75rem;
}

.hero-title[b-dq1i1z42hj] {
    font-size: 2rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 0.75rem 0;
    letter-spacing: -0.02em;
}

.hero-tags[b-dq1i1z42hj] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.tag[b-dq1i1z42hj] {
    display: inline-flex;
    align-items: center;
    padding: 0.35rem 0.85rem;
    border-radius: 8px;
    font-size: 0.85rem;
    font-weight: 500;
}

.tag-identifier[b-dq1i1z42hj] {
    background: #f1f5f9;
    color: #334155;
    border: 1px solid #cbd5e1;
    font-family: monospace;
    font-size: 0.95rem;
}

.tag-spec[b-dq1i1z42hj] {
    background: #e0f2fe;
    color: #0369a1;
}

.tag-color[b-dq1i1z42hj] {
    background: #fdf2f8;
    color: #be185d;
}

.hero-client-card[b-dq1i1z42hj] {
    display: flex;
    align-items: center;
    gap: 1rem;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 1rem 1.25rem;
}

.client-avatar[b-dq1i1z42hj] {
    width: 48px;
    height: 48px;
    background: #0284c7;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
}

.client-label[b-dq1i1z42hj] {
    display: block;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748b;
    font-weight: 600;
}

.client-name[b-dq1i1z42hj] {
    font-size: 1.1rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0.1rem 0;
}

.client-phone[b-dq1i1z42hj] {
    font-size: 0.85rem;
    color: #475569;
}

/* KPI Grid */
.kpi-grid[b-dq1i1z42hj] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1rem;
}

.kpi-card[b-dq1i1z42hj] {
    padding: 1.25rem;
    display: flex;
    align-items: center;
    gap: 1rem;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.kpi-card:hover[b-dq1i1z42hj] {
    transform: translateY(-2px);
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.08);
}

.kpi-icon[b-dq1i1z42hj] {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
}

.kpi-orders[b-dq1i1z42hj] { background: rgba(59, 130, 246, 0.1); color: #2563eb; }
.kpi-services[b-dq1i1z42hj] { background: rgba(139, 92, 246, 0.1); color: #7c3aed; }
.kpi-materials[b-dq1i1z42hj] { background: rgba(245, 158, 11, 0.1); color: #d97706; }
.kpi-cost[b-dq1i1z42hj] { background: rgba(16, 185, 129, 0.1); color: #059669; }

.kpi-card-highlight[b-dq1i1z42hj] {
    background: linear-gradient(135deg, rgba(236, 253, 245, 0.9), rgba(209, 250, 229, 0.7));
    border-color: rgba(52, 211, 153, 0.5);
}

.kpi-label[b-dq1i1z42hj] {
    display: block;
    font-size: 0.8rem;
    color: #64748b;
    font-weight: 500;
}

.kpi-value[b-dq1i1z42hj] {
    display: block;
    font-size: 1.7rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.2;
}

.kpi-hint[b-dq1i1z42hj] {
    display: block;
    font-size: 0.75rem;
    color: #94a3b8;
}

/* Tabs & Content */
.tabs-container[b-dq1i1z42hj] {
    padding: 1.5rem;
}

.tabs-header[b-dq1i1z42hj] {
    display: flex;
    gap: 0.5rem;
    border-bottom: 2px solid #e2e8f0;
    margin-bottom: 1.5rem;
}

.tab-button[b-dq1i1z42hj] {
    background: none;
    border: none;
    padding: 0.75rem 1.25rem;
    font-size: 0.95rem;
    font-weight: 600;
    color: #64748b;
    cursor: pointer;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    transition: all 0.2s ease;
}

.tab-button:hover[b-dq1i1z42hj] {
    color: #0284c7;
}

.tab-button.active[b-dq1i1z42hj] {
    color: #0284c7;
    border-bottom-color: #0284c7;
}

/* Orders Accordion */
.order-visit-card[b-dq1i1z42hj] {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    overflow: hidden;
    background: white;
}

.order-header[b-dq1i1z42hj] {
    padding: 1rem 1.25rem;
    background: #f8fafc;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: background 0.2s ease;
}

.order-header:hover[b-dq1i1z42hj] {
    background: #f1f5f9;
}

.order-header-left[b-dq1i1z42hj] {
    display: flex;
    align-items: center;
    gap: 1rem;
    flex-wrap: wrap;
}

.order-code[b-dq1i1z42hj] {
    font-weight: 700;
    color: #0f172a;
    font-size: 1.05rem;
}

.badge-soft[b-dq1i1z42hj] {
    padding: 0.25rem 0.6rem;
    border-radius: 6px;
    font-size: 0.8rem;
    font-weight: 600;
    background: #e0f2fe;
    color: #0369a1;
}

.order-date[b-dq1i1z42hj] {
    font-size: 0.85rem;
    color: #64748b;
}

.order-header-right[b-dq1i1z42hj] {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.order-cost-preview[b-dq1i1z42hj] {
    text-align: right;
}

.cost-label[b-dq1i1z42hj] {
    display: block;
    font-size: 0.75rem;
    color: #64748b;
}

.cost-val[b-dq1i1z42hj] {
    font-weight: 700;
    color: #059669;
    font-size: 1.05rem;
}

.order-details[b-dq1i1z42hj] {
    padding: 1.25rem;
    border-top: 1px solid #e2e8f0;
    background: #ffffff;
}

.details-section[b-dq1i1z42hj] {
    margin-bottom: 1.5rem;
}

.details-section:last-child[b-dq1i1z42hj] {
    margin-bottom: 0;
}

.section-title[b-dq1i1z42hj] {
    font-size: 0.9rem;
    font-weight: 700;
    color: #334155;
    margin-bottom: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.services-list[b-dq1i1z42hj] {
    list-style: none;
    padding: 0;
    margin: 0;
}

.service-item[b-dq1i1z42hj] {
    display: flex;
    justify-content: space-between;
    padding: 0.5rem 0;
    border-bottom: 1px dashed #e2e8f0;
    font-size: 0.9rem;
}

.service-name[b-dq1i1z42hj] {
    color: #1e293b;
}

.service-price[b-dq1i1z42hj] {
    font-weight: 600;
    color: #475569;
}

.table-modern[b-dq1i1z42hj] {
    font-size: 0.9rem;
    margin: 0;
}

.table-modern thead th[b-dq1i1z42hj] {
    background: #f8fafc;
    color: #64748b;
    font-weight: 600;
    border-bottom: 1px solid #e2e8f0;
}

/* Evidences Grid */
.evidences-grid[b-dq1i1z42hj] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 1rem;
}

.evidence-card[b-dq1i1z42hj] {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.evidence-card:hover[b-dq1i1z42hj] {
    transform: scale(1.02);
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.08);
}

.evidence-thumb[b-dq1i1z42hj] {
    width: 100%;
    height: 120px;
    object-fit: cover;
    display: block;
}

.evidence-placeholder[b-dq1i1z42hj] {
    height: 120px;
    background: #f1f5f9;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    font-size: 2rem;
}

.evidence-meta[b-dq1i1z42hj] {
    padding: 0.5rem 0.75rem;
    background: white;
}

.evidence-type[b-dq1i1z42hj] {
    display: block;
    font-size: 0.7rem;
    font-weight: 700;
    color: #0284c7;
    text-transform: uppercase;
}

.evidence-note[b-dq1i1z42hj] {
    display: block;
    font-size: 0.8rem;
    color: #334155;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.evidence-time[b-dq1i1z42hj] {
    display: block;
    font-size: 0.7rem;
    color: #94a3b8;
}

/* Timeline Tab */
.timeline-tree[b-dq1i1z42hj] {
    position: relative;
    padding-left: 2rem;
}

.timeline-tree[b-dq1i1z42hj]::before {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 11px;
    width: 2px;
    background: #cbd5e1;
}

.timeline-node[b-dq1i1z42hj] {
    position: relative;
    margin-bottom: 1.5rem;
}

.timeline-point[b-dq1i1z42hj] {
    position: absolute;
    left: -2rem;
    top: 6px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #0284c7;
    border: 3px solid white;
    box-shadow: 0 0 0 2px #0284c7;
}

.timeline-card[b-dq1i1z42hj] {
    padding: 1rem 1.25rem;
}

.timeline-header[b-dq1i1z42hj] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 0.25rem;
}

.timeline-tag[b-dq1i1z42hj] {
    font-size: 0.75rem;
    font-weight: 700;
    color: #0284c7;
    text-transform: uppercase;
}

.timeline-date[b-dq1i1z42hj] {
    font-size: 0.75rem;
    color: #64748b;
}

.timeline-desc[b-dq1i1z42hj] {
    margin: 0;
    font-size: 0.9rem;
    color: #1e293b;
}

.timeline-order-ref[b-dq1i1z42hj] {
    display: inline-block;
    margin-top: 0.5rem;
    font-size: 0.75rem;
    font-family: monospace;
    color: #64748b;
}

/* Preview Modal */
.modal-backdrop-custom[b-dq1i1z42hj] {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(15, 23, 42, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.modal-preview-content[b-dq1i1z42hj] {
    max-width: 600px;
    width: 90%;
    padding: 1.5rem;
}

.preview-header[b-dq1i1z42hj] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.btn-close-custom[b-dq1i1z42hj] {
    background: none;
    border: none;
    font-size: 1.25rem;
    cursor: pointer;
    color: #64748b;
}
/* /Pages/PropertyManagement/Belonging/BelongingModal.razor.rz.scp.css */
/* /Pages/PublicBooking/PublicBookingWizard.razor.rz.scp.css */
.public-booking-spinner[b-1mc6d20c63] {
    animation: public-booking-spin-b-1mc6d20c63 0.85s linear infinite;
}

@keyframes public-booking-spin-b-1mc6d20c63 {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}
/* /Pages/Quotes/AcceptQuote.razor.rz.scp.css */
.accept-quote-page-wrapper[b-dcvw15feeh] {
    --primary-color: var(--tenant-theme-color, #667eea);
    --primary-dark: color-mix(in srgb, var(--tenant-theme-color, #667eea) 80%, black);
    --primary-gradient: linear-gradient(135deg, var(--tenant-theme-color, #667eea) 0%, color-mix(in srgb, var(--tenant-theme-color, #667eea) 80%, black) 100%);
    --primary-rgba-color: color-mix(in srgb, var(--tenant-theme-color, #667eea) 15%, transparent);

    position: relative;
    min-height: 100vh;
    width: 100%;
    background: #f8fafc;
    overflow-x: hidden;
    z-index: 1;
}

/* Background blob decorations for a modern, fluid visual style */
.background-decorations[b-dcvw15feeh] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}

.blob[b-dcvw15feeh] {
    position: fixed;
    border-radius: 50%;
    filter: blur(120px);
    opacity: 0.12;
    z-index: 0;
}

.blob-1[b-dcvw15feeh] {
    top: -10%;
    right: -10%;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, var(--primary-color) 0%, var(--primary-dark) 100%);
}

.blob-2[b-dcvw15feeh] {
    bottom: -10%;
    left: -10%;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, var(--primary-dark) 0%, var(--primary-color) 100%);
}

.content-container[b-dcvw15feeh] {
    position: relative;
    z-index: 2;
}

/* Glassmorphism card styles */
.glass-card[b-dcvw15feeh] {
    background: rgba(255, 255, 255, 0.82);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.45);
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04), 0 1px 3px rgba(0, 0, 0, 0.02);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Header customization */
.quote-header[b-dcvw15feeh] {
    border-left: 6px solid var(--primary-color);
}

.tenant-logo[b-dcvw15feeh] {
    max-height: 50px;
    width: auto;
    object-fit: contain;
    border-radius: 8px;
}

.tenant-logo-placeholder[b-dcvw15feeh] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: var(--primary-gradient);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: 700;
    box-shadow: 0 4px 10px rgba(102, 126, 234, 0.25);
}

.tenant-name[b-dcvw15feeh] {
    font-size: 1.35rem;
    font-weight: 700;
    color: #1e293b;
    letter-spacing: -0.025em;
}

.branch-name[b-dcvw15feeh] {
    font-size: 0.875rem;
    font-weight: 500;
}

.quote-code[b-dcvw15feeh] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.01em;
}

.status-badge[b-dcvw15feeh] {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
}

.status-badge-sent[b-dcvw15feeh] {
    background-color: var(--warning-arregly);
    color: var(--warning-color);
}

.expiration-date[b-dcvw15feeh] {
    font-size: 0.85rem;
}

.expiration-date strong[b-dcvw15feeh] {
    color: #334155;
}

/* Section elements styling */
.card-section-title[b-dcvw15feeh] {
    font-size: 1.15rem;
    font-weight: 700;
    color: #1e293b;
    display: flex;
    align-items: center;
    gap: 8px;
}

.card-section-title[b-dcvw15feeh]  svg {
    color: var(--primary-color);
    width: 20px;
    height: 20px;
}

/* Custom table styling for items */
.table-arregly[b-dcvw15feeh] {
    margin-bottom: 0;
}

.table-arregly thead th[b-dcvw15feeh] {
    background-color: #f1f5f9;
    color: #475569;
    font-weight: 600;
    font-size: 0.825rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 12px 16px;
    border-bottom: 2px solid #e2e8f0;
}

.table-arregly tbody td[b-dcvw15feeh] {
    padding: 16px;
    border-bottom: 1px solid #e2e8f0;
    color: #334155;
    font-size: 0.9rem;
}

.table-arregly tbody tr:last-child td[b-dcvw15feeh] {
    border-bottom: none;
}

.item-description-block[b-dcvw15feeh] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.item-name[b-dcvw15feeh] {
    color: #1e293b;
    font-size: 0.95rem;
}

.item-subtext[b-dcvw15feeh] {
    font-size: 0.8rem;
}

.item-type-badge[b-dcvw15feeh] {
    align-self: flex-start;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
}

.badge-service[b-dcvw15feeh] {
    background-color: var(--info-arregly);
    color: #1d4ed8;
}

.badge-product[b-dcvw15feeh] {
    background-color: #f3e8ff;
    color: #7e22ce;
}

/* Notes section styling */
.quote-notes-section .notes-title[b-dcvw15feeh] {
    font-size: 1rem;
    font-weight: 600;
    color: #334155;
    display: flex;
    align-items: center;
    gap: 6px;
}

.quote-notes-section .notes-title[b-dcvw15feeh]  svg {
    width: 18px;
    height: 18px;
    color: #64748b;
}

.notes-content[b-dcvw15feeh] {
    background-color: #f8fafc;
    border-left: 4px solid #cbd5e1;
    font-size: 0.875rem;
    line-height: 1.5;
}

/* Client Details card style */
.client-details-list[b-dcvw15feeh] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.client-detail-item[b-dcvw15feeh] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.client-detail-item .label[b-dcvw15feeh] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    color: #64748b;
    letter-spacing: 0.025em;
}

.client-detail-item .value[b-dcvw15feeh] {
    font-size: 0.9rem;
    color: #334155;
    word-break: break-all;
}

/* Summary and totals styling */
.summary-card[b-dcvw15feeh] {
    border-top: 5px solid var(--primary-color);
}

.summary-totals-list[b-dcvw15feeh] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.total-row[b-dcvw15feeh] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.925rem;
    color: #475569;
}

.total-row strong[b-dcvw15feeh] {
    color: #0f172a;
}

.grand-total[b-dcvw15feeh] {
    background: linear-gradient(135deg, rgba(102, 126, 234, 0.05) 0%, rgba(118, 75, 162, 0.05) 100%);
    border: 1px solid rgba(102, 126, 234, 0.15);
}

.grand-total span[b-dcvw15feeh] {
    font-size: 1rem;
    color: #1e293b;
}

.text-primary-gradient[b-dcvw15feeh] {
    font-size: 1.35rem;
    background: var(--primary-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}

/* Interactive elements */
.cursor-pointer[b-dcvw15feeh] {
    cursor: pointer;
}

/* Loading & Error States */
.loading-state[b-dcvw15feeh], .error-state[b-dcvw15feeh], .success-state[b-dcvw15feeh] {
    max-width: 600px;
    margin: 60px auto;
    border-top: 5px solid var(--primary-color);
}

.error-state[b-dcvw15feeh] {
    border-top-color: var(--danger-color);
}

.remote-blocked-state[b-dcvw15feeh] {
    max-width: 700px;
    margin: 60px auto;
    border: 1px solid color-mix(in srgb, var(--tenant-theme-color, #667eea) 22%, #ffffff 78%);
    border-top: 5px solid var(--tenant-theme-color, #667eea);
    box-shadow: 0 18px 40px color-mix(in srgb, var(--tenant-theme-color, #667eea) 18%, transparent);
    overflow: hidden;
}

.error-state-header[b-dcvw15feeh] {
    background: linear-gradient(
        165deg,
        color-mix(in srgb, var(--tenant-theme-color, #667eea) 12%, #ffffff 88%) 0%,
        #ffffff 70%
    );
}

.error-state-icon[b-dcvw15feeh] {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    font-weight: 700;
    color: var(--tenant-theme-color, #667eea);
    background: color-mix(in srgb, var(--tenant-theme-color, #667eea) 14%, #ffffff 86%);
    border: 1px solid color-mix(in srgb, var(--tenant-theme-color, #667eea) 30%, #ffffff 70%);
}

.error-state-chip[b-dcvw15feeh] {
    padding: 0.35rem 0.9rem;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    color: var(--tenant-theme-color, #667eea);
    border: 1px solid color-mix(in srgb, var(--tenant-theme-color, #667eea) 30%, #ffffff 70%);
    background: color-mix(in srgb, var(--tenant-theme-color, #667eea) 10%, #ffffff 90%);
}

.blocked-tenant-summary[b-dcvw15feeh] {
    border: 1px solid #e2e8f0;
    background: #f8fafc;
    border-radius: 14px;
    display: flex;
    align-items: center;
    gap: 14px;
}

.blocked-tenant-logo[b-dcvw15feeh] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    object-fit: cover;
    border: 1px solid #e2e8f0;
    flex-shrink: 0;
}

.blocked-tenant-logo-placeholder[b-dcvw15feeh] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 1.1rem;
    color: #ffffff;
    background: var(--primary-gradient);
    flex-shrink: 0;
}

.blocked-tenant-name[b-dcvw15feeh] {
    color: #0f172a;
    font-size: 0.95rem;
}

.blocked-tenant-detail[b-dcvw15feeh] {
    color: #64748b;
    font-size: 0.82rem;
    line-height: 1.35;
}

.error-actions[b-dcvw15feeh] {
    border-top: 1px dashed #e2e8f0;
}

.error-help-text[b-dcvw15feeh] {
    color: #64748b;
    font-size: 0.84rem;
    max-width: 460px;
    margin-left: auto;
    margin-right: auto;
}

.success-state[b-dcvw15feeh] {
    border-top-color: var(--success-color);
}

.loading-title[b-dcvw15feeh], .error-title[b-dcvw15feeh], .success-title[b-dcvw15feeh] {
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
}

.spinner-container[b-dcvw15feeh] {
    display: inline-block;
}

.spinner[b-dcvw15feeh] {
    width: 48px;
    height: 48px;
    border: 4px solid rgba(102, 126, 234, 0.15);
    border-top-color: var(--primary-color);
    border-radius: 50%;
    animation: spin-b-dcvw15feeh 1s infinite linear;
}

@keyframes spin-b-dcvw15feeh {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.error-icon-wrapper[b-dcvw15feeh] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background-color: #fee2e2;
}

.error-svg-icon[b-dcvw15feeh]  svg {
    color: var(--danger-color);
    width: 32px;
    height: 32px;
}

.error-text[b-dcvw15feeh] {
    font-size: 1rem;
    color: #64748b;
    max-width: 450px;
    margin-left: auto;
    margin-right: auto;
}

/* Success page elements (migrados a SignatureSuccessCard compartido) */



/* Canvas Drawing Block style */
.signature-canvas-container[b-dcvw15feeh] {
    position: relative;
    width: 100%;
    border-radius: 12px;
    overflow: hidden;
    border: 2px dashed #cbd5e1;
    background-color: #fafafa;
    transition: border-color 0.2s ease;
}

.signature-canvas-container:hover[b-dcvw15feeh] {
    border-color: var(--primary-color);
}

.signature-canvas[b-dcvw15feeh] {
    display: block;
    width: 100%;
    height: 200px;
    cursor: crosshair;
    touch-action: none;
}

.btn-clear-signature[b-dcvw15feeh] {
    position: absolute;
    bottom: 12px;
    right: 12px;
    background-color: rgba(255, 255, 255, 0.95);
    border: 1px solid #e2e8f0;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
    border-radius: 8px;
    padding: 6px 12px;
    font-size: 0.75rem;
    font-weight: 600;
    color: #dc2626;
    display: flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    transition: background-color 0.2s, transform 0.1s;
    backdrop-filter: blur(4px);
}

.btn-clear-signature:hover[b-dcvw15feeh] {
    background-color: #fff1f2;
    transform: translateY(-1px);
}

.btn-clear-signature:active[b-dcvw15feeh] {
    transform: translateY(0);
}

.btn-clear-signature[b-dcvw15feeh]  svg {
    width: 14px;
    height: 14px;
    fill: currentColor;
}

/* Terms Acceptance layout styling */
.terms-acceptance-block[b-dcvw15feeh] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}

.terms-text[b-dcvw15feeh] {
    font-size: 0.85rem;
    color: #475569;
    line-height: 1.5;
}

.checkbox-custom[b-dcvw15feeh] {
    width: 16px;
    height: 16px;
    border-radius: 4px;
    border: 1px solid #cbd5e1;
    accent-color: var(--primary-color);
    flex-shrink: 0;
}

/* Loader modal when saving */
.submitting-loader[b-dcvw15feeh] {
    width: 100%;
    max-width: 450px;
    border-top: 5px solid var(--primary-color);
    animation: scaleUp-b-dcvw15feeh 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes scaleUp-b-dcvw15feeh {
    from {
        opacity: 0;
        transform: scale(0.95);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.submitting-loader .spinner[b-dcvw15feeh] {
    margin: 0 auto;
}

.submitting-loader h4[b-dcvw15feeh] {
    font-weight: 700;
    color: #0f172a;
}

.submitting-loader p[b-dcvw15feeh] {
    font-size: 0.875rem;
}

/* Responsive adjustment rules */
@media (max-width: 768px) {
    .quote-header[b-dcvw15feeh] {
        flex-direction: column;
        align-items: flex-start !important;
    }
    
    .quote-meta-badges[b-dcvw15feeh] {
        width: 100%;
        text-align: left !important;
    }
    
    .quote-meta-badges div[b-dcvw15feeh] {
        justify-content: flex-start !important;
    }
    
    .table-arregly thead[b-dcvw15feeh] {
        display: none;
    }
    
    .table-arregly tbody tr[b-dcvw15feeh] {
        display: block;
        border-bottom: 2px solid #e2e8f0;
        padding: 12px 0;
    }
    
    .table-arregly tbody td[b-dcvw15feeh] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 8px 0;
        border-bottom: none;
        text-align: right;
    }
    
    .table-arregly tbody td[b-dcvw15feeh]::before {
        content: attr(data-label);
        font-weight: 600;
        text-transform: uppercase;
        font-size: 0.75rem;
        color: #64748b;
        text-align: left;
    }
    
    .table-arregly tbody td:first-child[b-dcvw15feeh] {
        display: block;
        text-align: left;
        padding-bottom: 12px;
        border-bottom: 1px dashed #e2e8f0;
    }
    
    .table-arregly tbody td:first-child[b-dcvw15feeh]::before {
        display: none;
    }
}

/* Custom central styles for buttons with Blazor isolation override */
[b-dcvw15feeh] .btn-gradient-primary-arregly {
    background: var(--primary-gradient) !important;
    color: white !important;
    border: none !important;
}

[b-dcvw15feeh] .btn-gradient-primary-arregly:hover {
    opacity: 0.85 !important;
}

[b-dcvw15feeh] .btn-outline-primary-arregly {
    background-color: transparent !important;
    color: var(--primary-color) !important;
    border: 1px solid var(--primary-color) !important;
}

[b-dcvw15feeh] .btn-outline-primary-arregly:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
    border-color: var(--primary-color) !important;
}

[b-dcvw15feeh] .btn-outline-danger-arregly {
    background-color: transparent !important;
    color: var(--danger-color, #dc2626) !important;
    border: 1px solid var(--danger-color, #dc2626) !important;
}

[b-dcvw15feeh] .btn-outline-danger-arregly:hover {
    background-color: var(--danger-color, #dc2626) !important;
    color: white !important;
    border-color: var(--danger-color, #dc2626) !important;
}

[b-dcvw15feeh] .btn-arregly.k-disabled,
[b-dcvw15feeh] .btn-arregly:disabled {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
}

.rejected-state[b-dcvw15feeh] {
    max-width: 600px;
    margin: 60px auto;
    border-top: 5px solid var(--danger-color, #dc2626);
}

.rejected-title[b-dcvw15feeh] {
    font-weight: 700;
    color: var(--danger-color, #dc2626);
    letter-spacing: -0.02em;
}

.rejected-subtitle[b-dcvw15feeh] {
    font-size: 1.1rem;
    color: #475569;
}

.rejected-details[b-dcvw15feeh] {
    max-width: 450px;
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
}

.rejected-details p[b-dcvw15feeh] {
    font-size: 0.9rem;
    color: #334155;
}

.rejected-details p strong[b-dcvw15feeh] {
    color: #0f172a;
}

.info-note-rejected[b-dcvw15feeh] {
    font-size: 0.8rem !important;
    line-height: 1.4;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed #cbd5e1;
}

/* Grid layout rules for dynamic responsive order */
.accept-quote-grid[b-dcvw15feeh] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

@media (min-width: 992px) {
    .accept-quote-grid[b-dcvw15feeh] {
        display: grid;
        grid-template-columns: 8fr 4fr;
        grid-template-rows: auto auto;
        gap: 1.5rem;
        align-items: start;
    }
    
    .grid-details[b-dcvw15feeh] {
        grid-column: 1;
        grid-row: 1 / span 2;
    }
    
    .grid-client[b-dcvw15feeh] {
        grid-column: 2;
        grid-row: 1;
    }
    
    .grid-totals[b-dcvw15feeh] {
        grid-column: 2;
        grid-row: 2;
    }
}

/* Display controls for desktop and mobile views */
.desktop-view[b-dcvw15feeh] {
    display: block;
}
.mobile-view[b-dcvw15feeh] {
    display: none;
}

@media (max-width: 768px) {
    .desktop-view[b-dcvw15feeh] {
        display: none !important;
    }
    .mobile-view[b-dcvw15feeh] {
        display: block !important;
    }

    /* Enforce exact rendering order on mobile: Banner -> Client -> Details -> Totals */
    .accept-quote-grid[b-dcvw15feeh] {
        display: flex;
        flex-direction: column;
        gap: 1rem !important;
    }

    .grid-client[b-dcvw15feeh] {
        order: 1 !important;
    }

    .grid-details[b-dcvw15feeh] {
        order: 2 !important;
    }

    .grid-totals[b-dcvw15feeh] {
        order: 3 !important;
    }

    /* Tighter padding on mobile for cards */
    .glass-card[b-dcvw15feeh] {
        padding: 16px !important;
    }
}

/* Compact mobile cards for products & services */
.mobile-items-list[b-dcvw15feeh] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.mobile-item-card[b-dcvw15feeh] {
    border: 1px solid #e2e8f0 !important;
    border-left: 4px solid var(--primary-color) !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02) !important;
    background: #ffffff;
    transition: transform 0.2s ease;
    padding: 12px !important;
    border-radius: 8px;
}

.mobile-item-card:hover[b-dcvw15feeh] {
    transform: translateY(-1px);
}

.font-size-sm[b-dcvw15feeh] {
    font-size: 0.75rem !important;
}

.item-name-block[b-dcvw15feeh] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
}

.item-name[b-dcvw15feeh] {
    color: #1e293b;
    font-size: 0.9rem !important;
    font-weight: 600;
}
/* /Pages/Quotes/Quotes.razor.rz.scp.css */
@media (max-width: 768px) {
    [b-1l0jflwgwo] .toolbar-extra .quotes-toolbar-filters,
    [b-1l0jflwgwo] .quotes-toolbar-filters,
    .quotes-toolbar-filters[b-1l0jflwgwo],
    .inventory-toolbar-branch-filter[b-1l0jflwgwo] {
        display: grid !important;
        grid-auto-flow: column !important;
        grid-auto-columns: 1fr !important;
        grid-template-columns: none !important;
        gap: 4px !important;
        width: 100% !important;
    }

    [b-1l0jflwgwo] .toolbar-extra .quotes-toolbar-filters > *,
    [b-1l0jflwgwo] .quotes-toolbar-filters > *,
    .quotes-toolbar-filters > *[b-1l0jflwgwo],
    .inventory-toolbar-branch-filter > *[b-1l0jflwgwo] {
        grid-column: auto !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    [b-1l0jflwgwo] .toolbar-extra .quotes-toolbar-filters .dropdownlist-arregly,
    [b-1l0jflwgwo] .toolbar-extra .quotes-toolbar-filters .k-dropdownlist,
    [b-1l0jflwgwo] .toolbar-extra .quotes-toolbar-filters .k-picker,
    [b-1l0jflwgwo] .quotes-toolbar-filters .dropdownlist-arregly,
    [b-1l0jflwgwo] .quotes-toolbar-filters .k-dropdownlist,
    [b-1l0jflwgwo] .quotes-toolbar-filters .k-picker,
    .quotes-toolbar-filters[b-1l0jflwgwo]  .dropdownlist-arregly,
    .quotes-toolbar-filters[b-1l0jflwgwo]  .k-dropdownlist,
    .quotes-toolbar-filters[b-1l0jflwgwo]  .k-picker,
    .inventory-toolbar-branch-filter[b-1l0jflwgwo]  .dropdownlist-arregly,
    .inventory-toolbar-branch-filter[b-1l0jflwgwo]  .k-dropdownlist,
    .inventory-toolbar-branch-filter[b-1l0jflwgwo]  .k-picker {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    [b-1l0jflwgwo] .toolbar-extra .quotes-toolbar-filters .k-input-inner,
    [b-1l0jflwgwo] .quotes-toolbar-filters .k-input-inner,
    .quotes-toolbar-filters[b-1l0jflwgwo]  .k-input-inner,
    .inventory-toolbar-branch-filter[b-1l0jflwgwo]  .k-input-inner {
        padding: 2px 4px 2px 6px !important;
        font-size: 0.78rem !important;
    }

    [b-1l0jflwgwo] .toolbar-extra .quotes-toolbar-filters .k-input-button,
    [b-1l0jflwgwo] .quotes-toolbar-filters .k-input-button,
    .quotes-toolbar-filters[b-1l0jflwgwo]  .k-input-button,
    .inventory-toolbar-branch-filter[b-1l0jflwgwo]  .k-input-button {
        padding: 0 3px !important;
    }
}

[b-1l0jflwgwo] .custom-base-grid tbody tr > td:first-child {
    padding: 0 !important;
    cursor: pointer !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
}

[b-1l0jflwgwo] .custom-base-grid tbody tr > td:first-child:hover {
    background-color: rgba(99, 102, 241, 0.12) !important;
}

[b-1l0jflwgwo] .custom-base-grid tbody tr > td:first-child:hover .badge-theme-theme {
    background-color: rgba(99, 102, 241, 0.25) !important;
    color: #4f46e5 !important;
    text-decoration: underline solid !important;
}
/* /Pages/Refunds/AcceptRefund.razor.rz.scp.css */
.accept-quote-page-wrapper[b-fo1vfedvll] {
    --primary-color: var(--tenant-theme-color, #667eea);
    --primary-dark: color-mix(in srgb, var(--tenant-theme-color, #667eea) 80%, black);
    --primary-gradient: linear-gradient(135deg, var(--tenant-theme-color, #667eea) 0%, color-mix(in srgb, var(--tenant-theme-color, #667eea) 80%, black) 100%);
    --primary-rgba-color: color-mix(in srgb, var(--tenant-theme-color, #667eea) 15%, transparent);

    position: relative;
    min-height: 100vh;
    width: 100%;
    background: #f8fafc;
    overflow-x: hidden;
    z-index: 1;
}

/* Background blob decorations for a modern, fluid visual style */
.background-decorations[b-fo1vfedvll] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}

.blob[b-fo1vfedvll] {
    position: fixed;
    border-radius: 50%;
    filter: blur(120px);
    opacity: 0.12;
    z-index: 0;
}

.blob-1[b-fo1vfedvll] {
    top: -10%;
    right: -10%;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, var(--primary-color) 0%, var(--primary-dark) 100%);
}

.blob-2[b-fo1vfedvll] {
    bottom: -10%;
    left: -10%;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, var(--primary-dark) 0%, var(--primary-color) 100%);
}

.content-container[b-fo1vfedvll] {
    position: relative;
    z-index: 2;
}

/* Glassmorphism card styles */
.glass-card[b-fo1vfedvll] {
    background: rgba(255, 255, 255, 0.82);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.45);
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04), 0 1px 3px rgba(0, 0, 0, 0.02);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Header customization */
.quote-header[b-fo1vfedvll] {
    border-left: 6px solid var(--primary-color);
}

.tenant-logo[b-fo1vfedvll] {
    max-height: 50px;
    width: auto;
    object-fit: contain;
    border-radius: 8px;
}

.tenant-logo-placeholder[b-fo1vfedvll] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: var(--primary-gradient);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: 700;
    box-shadow: 0 4px 10px rgba(102, 126, 234, 0.25);
}

.tenant-name[b-fo1vfedvll] {
    font-size: 1.35rem;
    font-weight: 700;
    color: #1e293b;
    letter-spacing: -0.025em;
}

.branch-name[b-fo1vfedvll] {
    font-size: 0.875rem;
    font-weight: 500;
}

.quote-code[b-fo1vfedvll] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.01em;
}

.status-badge[b-fo1vfedvll] {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
}

.status-badge-sent[b-fo1vfedvll] {
    background-color: var(--warning-arregly);
    color: var(--warning-color);
}

.expiration-date[b-fo1vfedvll] {
    font-size: 0.85rem;
}

.expiration-date strong[b-fo1vfedvll] {
    color: #334155;
}

/* Section elements styling */
.card-section-title[b-fo1vfedvll] {
    font-size: 1.15rem;
    font-weight: 700;
    color: #1e293b;
    display: flex;
    align-items: center;
    gap: 8px;
}

.card-section-title[b-fo1vfedvll]  svg {
    color: var(--primary-color);
    width: 20px;
    height: 20px;
}

/* Custom table styling for items */
.table-arregly[b-fo1vfedvll] {
    margin-bottom: 0;
}

.table-arregly thead th[b-fo1vfedvll] {
    background-color: #f1f5f9;
    color: #475569;
    font-weight: 600;
    font-size: 0.825rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 12px 16px;
    border-bottom: 2px solid #e2e8f0;
}

.table-arregly tbody td[b-fo1vfedvll] {
    padding: 16px;
    border-bottom: 1px solid #e2e8f0;
    color: #334155;
    font-size: 0.9rem;
}

.table-arregly tbody tr:last-child td[b-fo1vfedvll] {
    border-bottom: none;
}

.item-description-block[b-fo1vfedvll] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.item-name[b-fo1vfedvll] {
    color: #1e293b;
    font-size: 0.95rem;
}

.item-subtext[b-fo1vfedvll] {
    font-size: 0.8rem;
}

.item-type-badge[b-fo1vfedvll] {
    align-self: flex-start;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
}

.badge-service[b-fo1vfedvll] {
    background-color: var(--info-arregly);
    color: #1d4ed8;
}

.badge-product[b-fo1vfedvll] {
    background-color: #f3e8ff;
    color: #7e22ce;
}

/* Notes section styling */
.quote-notes-section .notes-title[b-fo1vfedvll] {
    font-size: 1rem;
    font-weight: 600;
    color: #334155;
    display: flex;
    align-items: center;
    gap: 6px;
}

.quote-notes-section .notes-title[b-fo1vfedvll]  svg {
    width: 18px;
    height: 18px;
    color: #64748b;
}

.notes-content[b-fo1vfedvll] {
    background-color: #f8fafc;
    border-left: 4px solid #cbd5e1;
    font-size: 0.875rem;
    line-height: 1.5;
}

/* Client Details card style */
.client-details-list[b-fo1vfedvll] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.client-detail-item[b-fo1vfedvll] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.client-detail-item .label[b-fo1vfedvll] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    color: #64748b;
    letter-spacing: 0.025em;
}

.client-detail-item .value[b-fo1vfedvll] {
    font-size: 0.9rem;
    color: #334155;
    word-break: break-all;
}

/* Summary and totals styling */
.summary-card[b-fo1vfedvll] {
    border-top: 5px solid var(--primary-color);
}

.summary-totals-list[b-fo1vfedvll] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.total-row[b-fo1vfedvll] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.925rem;
    color: #475569;
}

.total-row strong[b-fo1vfedvll] {
    color: #0f172a;
}

.grand-total[b-fo1vfedvll] {
    background: linear-gradient(135deg, rgba(102, 126, 234, 0.05) 0%, rgba(118, 75, 162, 0.05) 100%);
    border: 1px solid rgba(102, 126, 234, 0.15);
}

.grand-total span[b-fo1vfedvll] {
    font-size: 1rem;
    color: #1e293b;
}

.text-primary-gradient[b-fo1vfedvll] {
    font-size: 1.35rem;
    background: var(--primary-gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
}

/* Interactive elements */
.cursor-pointer[b-fo1vfedvll] {
    cursor: pointer;
}

/* Loading & Error States */
.loading-state[b-fo1vfedvll], .error-state[b-fo1vfedvll], .success-state[b-fo1vfedvll] {
    max-width: 600px;
    margin: 60px auto;
    border-top: 5px solid var(--primary-color);
}

.error-state[b-fo1vfedvll] {
    border-top-color: var(--danger-color);
}

.success-state[b-fo1vfedvll] {
    border-top-color: var(--success-color);
}

.loading-title[b-fo1vfedvll], .error-title[b-fo1vfedvll], .success-title[b-fo1vfedvll] {
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
}

.spinner-container[b-fo1vfedvll] {
    display: inline-block;
}

.spinner[b-fo1vfedvll] {
    width: 48px;
    height: 48px;
    border: 4px solid rgba(102, 126, 234, 0.15);
    border-top-color: var(--primary-color);
    border-radius: 50%;
    animation: spin-b-fo1vfedvll 1s infinite linear;
}

@keyframes spin-b-fo1vfedvll {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.error-icon-wrapper[b-fo1vfedvll] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background-color: #fee2e2;
}

.error-svg-icon[b-fo1vfedvll]  svg {
    color: var(--danger-color);
    width: 32px;
    height: 32px;
}

.error-text[b-fo1vfedvll] {
    font-size: 1rem;
    color: #64748b;
    max-width: 450px;
    margin-left: auto;
    margin-right: auto;
}

/* Success page elements (migrados a SignatureSuccessCard compartido) */



/* Canvas Drawing Block style */
.signature-canvas-container[b-fo1vfedvll] {
    position: relative;
    width: 100%;
    border-radius: 12px;
    overflow: hidden;
    border: 2px dashed #cbd5e1;
    background-color: #fafafa;
    transition: border-color 0.2s ease;
}

.signature-canvas-container:hover[b-fo1vfedvll] {
    border-color: var(--primary-color);
}

.signature-canvas[b-fo1vfedvll] {
    display: block;
    width: 100%;
    height: 200px;
    cursor: crosshair;
    touch-action: none;
}

.btn-clear-signature[b-fo1vfedvll] {
    position: absolute;
    bottom: 12px;
    right: 12px;
    background-color: rgba(255, 255, 255, 0.95);
    border: 1px solid #e2e8f0;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
    border-radius: 8px;
    padding: 6px 12px;
    font-size: 0.75rem;
    font-weight: 600;
    color: #dc2626;
    display: flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    transition: background-color 0.2s, transform 0.1s;
    backdrop-filter: blur(4px);
}

.btn-clear-signature:hover[b-fo1vfedvll] {
    background-color: #fff1f2;
    transform: translateY(-1px);
}

.btn-clear-signature:active[b-fo1vfedvll] {
    transform: translateY(0);
}

.btn-clear-signature[b-fo1vfedvll]  svg {
    width: 14px;
    height: 14px;
    fill: currentColor;
}

/* Terms Acceptance layout styling */
.terms-acceptance-block[b-fo1vfedvll] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}

.terms-text[b-fo1vfedvll] {
    font-size: 0.85rem;
    color: #475569;
    line-height: 1.5;
}

.checkbox-custom[b-fo1vfedvll] {
    width: 16px;
    height: 16px;
    border-radius: 4px;
    border: 1px solid #cbd5e1;
    accent-color: var(--primary-color);
    flex-shrink: 0;
}

/* Loader modal when saving */
.submitting-loader[b-fo1vfedvll] {
    width: 100%;
    max-width: 450px;
    border-top: 5px solid var(--primary-color);
    animation: scaleUp-b-fo1vfedvll 0.3s cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

@keyframes scaleUp-b-fo1vfedvll {
    from {
        opacity: 0;
        transform: scale(0.95);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.submitting-loader .spinner[b-fo1vfedvll] {
    margin: 0 auto;
}

.submitting-loader h4[b-fo1vfedvll] {
    font-weight: 700;
    color: #0f172a;
}

.submitting-loader p[b-fo1vfedvll] {
    font-size: 0.875rem;
}

/* Responsive adjustment rules */
@media (max-width: 768px) {
    .quote-header[b-fo1vfedvll] {
        flex-direction: column;
        align-items: flex-start !important;
    }
    
    .quote-meta-badges[b-fo1vfedvll] {
        width: 100%;
        text-align: left !important;
    }
    
    .quote-meta-badges div[b-fo1vfedvll] {
        justify-content: flex-start !important;
    }
    
    .table-arregly thead[b-fo1vfedvll] {
        display: none;
    }
    
    .table-arregly tbody tr[b-fo1vfedvll] {
        display: block;
        border-bottom: 2px solid #e2e8f0;
        padding: 12px 0;
    }
    
    .table-arregly tbody td[b-fo1vfedvll] {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 8px 0;
        border-bottom: none;
        text-align: right;
    }
    
    .table-arregly tbody td[b-fo1vfedvll]::before {
        content: attr(data-label);
        font-weight: 600;
        text-transform: uppercase;
        font-size: 0.75rem;
        color: #64748b;
        text-align: left;
    }
    
    .table-arregly tbody td:first-child[b-fo1vfedvll] {
        display: block;
        text-align: left;
        padding-bottom: 12px;
        border-bottom: 1px dashed #e2e8f0;
    }
    
    .table-arregly tbody td:first-child[b-fo1vfedvll]::before {
        display: none;
    }
}

/* Custom central styles for buttons with Blazor isolation override */
[b-fo1vfedvll] .btn-gradient-primary-arregly {
    background: var(--primary-gradient) !important;
    color: white !important;
    border: none !important;
}

[b-fo1vfedvll] .btn-gradient-primary-arregly:hover {
    opacity: 0.85 !important;
}

[b-fo1vfedvll] .btn-outline-primary-arregly {
    background-color: transparent !important;
    color: var(--primary-color) !important;
    border: 1px solid var(--primary-color) !important;
}

[b-fo1vfedvll] .btn-outline-primary-arregly:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
    border-color: var(--primary-color) !important;
}

[b-fo1vfedvll] .btn-outline-danger-arregly {
    background-color: transparent !important;
    color: var(--danger-color, #dc2626) !important;
    border: 1px solid var(--danger-color, #dc2626) !important;
}

[b-fo1vfedvll] .btn-outline-danger-arregly:hover {
    background-color: var(--danger-color, #dc2626) !important;
    color: white !important;
    border-color: var(--danger-color, #dc2626) !important;
}

[b-fo1vfedvll] .btn-arregly.k-disabled,
[b-fo1vfedvll] .btn-arregly:disabled {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
}

.rejected-state[b-fo1vfedvll] {
    max-width: 600px;
    margin: 60px auto;
    border-top: 5px solid var(--danger-color, #dc2626);
}

.rejected-title[b-fo1vfedvll] {
    font-weight: 700;
    color: var(--danger-color, #dc2626);
    letter-spacing: -0.02em;
}

.rejected-subtitle[b-fo1vfedvll] {
    font-size: 1.1rem;
    color: #475569;
}

.rejected-details[b-fo1vfedvll] {
    max-width: 450px;
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
}

.rejected-details p[b-fo1vfedvll] {
    font-size: 0.9rem;
    color: #334155;
}

.rejected-details p strong[b-fo1vfedvll] {
    color: #0f172a;
}

.info-note-rejected[b-fo1vfedvll] {
    font-size: 0.8rem !important;
    line-height: 1.4;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed #cbd5e1;
}

/* Grid layout rules for dynamic responsive order */
.accept-quote-grid[b-fo1vfedvll] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

@media (min-width: 992px) {
    .accept-quote-grid[b-fo1vfedvll] {
        display: grid;
        grid-template-columns: 8fr 4fr;
        grid-template-rows: auto auto;
        gap: 1.5rem;
        align-items: start;
    }
    
    .grid-details[b-fo1vfedvll] {
        grid-column: 1;
        grid-row: 1 / span 2;
    }
    
    .grid-client[b-fo1vfedvll] {
        grid-column: 2;
        grid-row: 1;
    }
    
    .grid-totals[b-fo1vfedvll] {
        grid-column: 2;
        grid-row: 2;
    }
}

/* Display controls for desktop and mobile views */
.desktop-view[b-fo1vfedvll] {
    display: block;
}
.mobile-view[b-fo1vfedvll] {
    display: none;
}

@media (max-width: 768px) {
    .desktop-view[b-fo1vfedvll] {
        display: none !important;
    }
    .mobile-view[b-fo1vfedvll] {
        display: block !important;
    }

    /* Enforce exact rendering order on mobile: Banner -> Client -> Details -> Totals */
    .accept-quote-grid[b-fo1vfedvll] {
        display: flex;
        flex-direction: column;
        gap: 1rem !important;
    }

    .grid-client[b-fo1vfedvll] {
        order: 1 !important;
    }

    .grid-details[b-fo1vfedvll] {
        order: 2 !important;
    }

    .grid-totals[b-fo1vfedvll] {
        order: 3 !important;
    }

    /* Tighter padding on mobile for cards */
    .glass-card[b-fo1vfedvll] {
        padding: 16px !important;
    }
}

/* Compact mobile cards for products & services */
.mobile-items-list[b-fo1vfedvll] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.mobile-item-card[b-fo1vfedvll] {
    border: 1px solid #e2e8f0 !important;
    border-left: 4px solid var(--primary-color) !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02) !important;
    background: #ffffff;
    transition: transform 0.2s ease;
    padding: 12px !important;
    border-radius: 8px;
}

.mobile-item-card:hover[b-fo1vfedvll] {
    transform: translateY(-1px);
}

.font-size-sm[b-fo1vfedvll] {
    font-size: 0.75rem !important;
}

.item-name-block[b-fo1vfedvll] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
}

.item-name[b-fo1vfedvll] {
    color: #1e293b;
    font-size: 0.9rem !important;
    font-weight: 600;
}
/* /Pages/Refunds/Components/AcceptRefundClientCard.razor.rz.scp.css */
.grid-client[b-vbtbapnq9g] {
}
/* /Pages/Refunds/Components/AcceptRefundHeader.razor.rz.scp.css */
.quote-header[b-3pmuysvpt6] {
}
/* /Pages/Refunds/Components/AcceptRefundItemsSection.razor.rz.scp.css */
.accept-refund-items-section__badge-overpayment[b-03qdkjdnzz] {
    background-color: #d1fae5;
    color: #065f46;
}

.accept-refund-items-section__badge-adjustment[b-03qdkjdnzz] {
    background-color: #fef3c7;
    color: #92400e;
}

.accept-refund-items-section__item-notes[b-03qdkjdnzz] {
    font-weight: normal;
}
/* /Pages/Refunds/Components/AcceptRefundSignatureModal.razor.rz.scp.css */
.accept-refund-signature-modal[b-ydsgzsoq4n] {
}
/* /Pages/Refunds/Components/AcceptRefundSummaryCard.razor.rz.scp.css */
.summary-card[b-4ounarfema] {
}
/* /Pages/Refunds/Components/ApproveCreditNoteModal.razor.rz.scp.css */
.approve-credit-note-modal[b-352ddxp8q5] {
}
/* /Pages/Refunds/Components/CreditNoteCreateModal.razor.rz.scp.css */
.credit-note-create-modal-help[b-lcehsiq0tk] {
    font-size: 0.8rem;
    color: #64748b;
}

.amount-group-card[b-lcehsiq0tk] {
    border: 1px solid #e5e7eb;
    background-color: #ffffff;
    border-radius: 12px;
    padding: 1rem !important;
}

.amount-group-card > .row[b-lcehsiq0tk] {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
/* /Pages/Refunds/Components/RefundCancelModal.razor.rz.scp.css */
.refund-cancel-modal[b-v7jwbakp92] {
}
/* /Pages/Refunds/Components/RefundCreditNoteHeader.razor.rz.scp.css */
/* Estilos del banner/cabecera movidos desde la página padre para mantener aislamiento CSS */
.order-detail-header-row[b-c65fdcrkg9] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    flex-wrap: wrap;
    gap: 16px;
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px 14px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05), 0 1px 2px 0 rgba(0, 0, 0, 0.03);
    margin-bottom: 20px;
}

.order-header-main-info[b-c65fdcrkg9] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.order-header-title[b-c65fdcrkg9] {
    font-size: 1.65rem;
    font-weight: 800;
    color: #0f172a !important;
    letter-spacing: 1px;
    margin: 0;
}

.order-header-subtitle[b-c65fdcrkg9] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 0.9rem;
    color: #475569;
    line-height: 1.2;
    margin-top: 4px;
}

.subtitle-item[b-c65fdcrkg9] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.subtitle-separator[b-c65fdcrkg9] {
    color: #94a3b8;
}

.order-header-subtitle[b-c65fdcrkg9]  .k-svg-icon {
    align-self: center;
    position: relative;
    top: -1px;
}

.order-detail-header-row[b-c65fdcrkg9]  .order-back-link-btn,
.order-detail-header-row[b-c65fdcrkg9]  .order-back-link-btn.k-button {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-color: transparent !important;
    padding: 4px !important;
    color: var(--primary-color, #667eea) !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: none !important;
    transition: opacity 0.2s ease;
}

.order-detail-header-row[b-c65fdcrkg9]  .order-back-link-btn:hover,
.order-detail-header-row[b-c65fdcrkg9]  .order-back-link-btn.k-button:hover {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-color: transparent !important;
    opacity: 0.7 !important;
    box-shadow: none !important;
}

.order-detail-header-row[b-c65fdcrkg9]  .order-back-link-btn:focus,
.order-detail-header-row[b-c65fdcrkg9]  .order-back-link-btn:active,
.order-detail-header-row[b-c65fdcrkg9]  .order-back-link-btn.k-button:focus,
.order-detail-header-row[b-c65fdcrkg9]  .order-back-link-btn.k-button:active {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

.order-detail-header-row[b-c65fdcrkg9]  .order-back-link-btn .k-svg-icon,
.order-detail-header-row[b-c65fdcrkg9]  .order-back-link-btn.k-button .k-svg-icon {
    color: var(--primary-color, #667eea) !important;
}

.quote-code-highlight[b-c65fdcrkg9] {
    color: var(--primary-color, #667eea) !important;
    font-weight: 700;
    text-decoration: none;
}

.quote-code-highlight:hover[b-c65fdcrkg9] {
    text-decoration: underline;
    opacity: 0.85;
}

@media (max-width: 768px) {
    .order-detail-header-row[b-c65fdcrkg9] {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    .order-header-main-info[b-c65fdcrkg9] {
        align-items: flex-start !important;
    }

    .order-detail-header-actions[b-c65fdcrkg9] {
        display: flex;
        flex-direction: column;
        gap: 8px !important;
        border-top: 1px solid #e2e8f0;
        padding-top: 12px;
        margin-top: 4px;
        width: 100%;
        justify-content: flex-start !important;
    }

    .order-detail-header-actions[b-c65fdcrkg9]  .k-button {
        width: 100% !important;
    }

    .order-header-title[b-c65fdcrkg9] {
        font-size: 1.4rem !important;
    }
}

@media (max-width: 576px) {
    .order-header-subtitle[b-c65fdcrkg9] {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .subtitle-separator[b-c65fdcrkg9] {
        display: none !important;
    }
}
/* /Pages/Refunds/Components/RefundCreditNoteHistoryTab.razor.rz.scp.css */
.refund-timeline-container[b-q94rdgol5v] {
    min-height: 120px;
    min-width: 0;
}

.timeline-item[b-q94rdgol5v] {
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: 10px;
    position: relative;
    padding-bottom: 22px;
    min-width: 0;
}

.timeline-item[b-q94rdgol5v]::after {
    content: "";
    position: absolute;
    left: 16px;
    top: 34px;
    bottom: -2px;
    width: 2px;
    background: #dbe3ee;
}

.timeline-item:last-child[b-q94rdgol5v]::after {
    display: none;
}

.timeline-dot[b-q94rdgol5v] {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.timeline-card[b-q94rdgol5v] {
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
    padding: 0 12px 0 8px;
    min-width: 0;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.timeline-card-head[b-q94rdgol5v] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
}

.timeline-title[b-q94rdgol5v] {
    font-size: 0.95rem;
    color: #111827;
}

.timeline-date[b-q94rdgol5v] {
    font-size: 0.85rem;
    color: #6b7280;
}

.timeline-description[b-q94rdgol5v] {
    font-size: 0.9rem;
    color: #4b5563;
    word-break: break-word;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

.timeline-meta[b-q94rdgol5v] {
    font-size: 0.85rem;
}

/* Icon Colors matching Order History */
.timeline-icon-blue[b-q94rdgol5v] {
    background-color: #dbeafe !important;
    border: 1px solid #93c5fd !important;
}

[b-q94rdgol5v] .timeline-icon-blue .k-svg-icon {
    color: #1d4ed8 !important;
    width: 14px !important;
    height: 14px !important;
}

.timeline-icon-green[b-q94rdgol5v] {
    background-color: #dcfce7 !important;
    border: 1px solid #86efac !important;
}

[b-q94rdgol5v] .timeline-icon-green .k-svg-icon {
    color: #166534 !important;
    width: 14px !important;
    height: 14px !important;
}

.timeline-icon-orange[b-q94rdgol5v] {
    background-color: #fef3c7 !important;
    border: 1px solid #fcd34d !important;
}

[b-q94rdgol5v] .timeline-icon-orange .k-svg-icon {
    color: #92400e !important;
    width: 14px !important;
    height: 14px !important;
}

.timeline-icon-red[b-q94rdgol5v] {
    background-color: #fee2e2 !important;
    border: 1px solid #fca5a5 !important;
}

[b-q94rdgol5v] .timeline-icon-red .k-svg-icon {
    color: #991b1b !important;
    width: 14px !important;
    height: 14px !important;
}

.timeline-icon-purple[b-q94rdgol5v] {
    background-color: #ede9fe !important;
    border: 1px solid #c4b5fd !important;
}

[b-q94rdgol5v] .timeline-icon-purple .k-svg-icon {
    color: #6d28d9 !important;
    width: 14px !important;
    height: 14px !important;
}

.timeline-icon-grey[b-q94rdgol5v] {
    background-color: #f3f4f6 !important;
    border: 1px solid #d1d5db !important;
}

[b-q94rdgol5v] .timeline-icon-grey .k-svg-icon {
    color: #374151 !important;
    width: 14px !important;
    height: 14px !important;
}

@media (max-width: 768px) {
    .timeline-card-head[b-q94rdgol5v] {
        flex-direction: column;
        align-items: flex-start;
        gap: 2px;
    }
}
/* /Pages/Refunds/Components/RefundCreditNotesTab.razor.rz.scp.css */
.refund-tab-content[b-6utm8xn8cv] {
    display: block;
}

.refund-customer-cell[b-6utm8xn8cv] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    line-height: 1.2;
}

.refund-customer-name[b-6utm8xn8cv] {
    font-weight: 600;
    color: #0f172a;
}

.refund-customer-meta[b-6utm8xn8cv] {
    font-size: 0.78rem;
    color: #64748b;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.refund-contact-cell[b-6utm8xn8cv] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    line-height: 1.2;
    padding: 0.5rem;
}

.credit-note-action-btn[b-6utm8xn8cv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    border-radius: 999px;
    border: 1px solid #e5e7eb;
    background: #ffffff;
    color: #4b5563;
    cursor: pointer;
    transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.12s ease;
}

.credit-note-action-btn:hover[b-6utm8xn8cv] {
    transform: translateY(-1px);
    background: #f9fafb;
}

.refund-status-badge[b-6utm8xn8cv] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1;
    border: 1px solid transparent;
}

.refund-status-badge.is-draft[b-6utm8xn8cv] {
    background-color: #f3f4f6 !important;
    color: #374151 !important;
    border-color: #d1d5db !important;
}

.refund-status-badge.is-pending[b-6utm8xn8cv] {
    background-color: #fef3c7 !important;
    color: #92400e !important;
    border-color: #fcd34d !important;
}

.refund-status-badge.is-approved[b-6utm8xn8cv] {
    background-color: #dcfce7 !important;
    color: #166534 !important;
    border-color: #86efac !important;
}

.refund-status-badge.is-refunded[b-6utm8xn8cv] {
    background-color: #dbeafe !important;
    color: #1d4ed8 !important;
    border-color: #93c5fd !important;
}

.refund-status-badge.is-cancelled[b-6utm8xn8cv],
.refund-status-badge.is-rejected[b-6utm8xn8cv] {
    background-color: #fee2e2 !important;
    color: #991b1b !important;
    border-color: #fca5a5 !important;
}

@media (max-width: 1200px) {
    .refund-customer-cell[b-6utm8xn8cv] {
        max-width: 220px;
    }
}
/* /Pages/Refunds/Components/RefundInPersonSignatureModal.razor.rz.scp.css */
.refund-in-person-signature-modal[b-yja1pcwj8s] {
}
/* /Pages/Refunds/Components/RefundPayoutModal.razor.rz.scp.css */
.refund-payout-modal[b-resyb5b9kr] {
}
/* /Pages/Refunds/RefundCreditNotePage.razor.rz.scp.css */
.order-edit-layout[b-0g2g614pwi] {
    align-items: stretch;
}

.order-section-card[b-0g2g614pwi],
.order-aside-card[b-0g2g614pwi] {
    border-radius: 16px;
}

.order-section-card__header[b-0g2g614pwi],
.order-aside-card__header[b-0g2g614pwi] {
    background-color: #fff;
    border-bottom: 1px solid #edf0f4;
}

.order-section-card__body[b-0g2g614pwi],
.order-aside-card__body[b-0g2g614pwi] {
    background-color: #fff;
}

.order-aside-data-row[b-0g2g614pwi] {
    font-size: 0.95rem;
}

.order-aside-data-label[b-0g2g614pwi] {
    color: #667085;
}

.order-aside-data-value[b-0g2g614pwi] {
    color: #111827;
    font-weight: 600;
}

.credit-note-history-list[b-0g2g614pwi] {
    min-height: 120px;
}

.timeline-item[b-0g2g614pwi] {
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: 10px;
    position: relative;
    padding-bottom: 20px;
}

.timeline-item[b-0g2g614pwi]::after {
    content: "";
    position: absolute;
    left: 17px;
    top: 36px;
    bottom: -2px;
    width: 1px;
    background: #dbe3ee;
}

.timeline-item:last-child[b-0g2g614pwi]::after {
    display: none;
}

.timeline-dot[b-0g2g614pwi] {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
}

.timeline-card[b-0g2g614pwi] {
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
    padding: 0 12px 0 8px;
}

.timeline-card.timeline-card--bubble[b-0g2g614pwi] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
    padding: 14px 16px;
    margin-left: 6px;
    position: relative;
}

.timeline-card.timeline-card--bubble[b-0g2g614pwi]::before {
    content: "";
    position: absolute;
    left: -6px;
    top: 14px;
    width: 10px;
    height: 10px;
    background: #ffffff;
    border-left: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
    transform: rotate(45deg);
}

.timeline-card.timeline-card--bubble-created[b-0g2g614pwi] {
    border-color: #93c5fd;
}

.timeline-card.timeline-card--bubble-created[b-0g2g614pwi]::before {
    border-left-color: #93c5fd;
    border-bottom-color: #93c5fd;
}

.timeline-card.timeline-card--bubble-progress[b-0g2g614pwi] {
    border-color: #fcd34d;
}

.timeline-card.timeline-card--bubble-progress[b-0g2g614pwi]::before {
    border-left-color: #fcd34d;
    border-bottom-color: #fcd34d;
}

.timeline-card.timeline-card--bubble-completed[b-0g2g614pwi] {
    border-color: #86efac;
}

.timeline-card.timeline-card--bubble-completed[b-0g2g614pwi]::before {
    border-left-color: #86efac;
    border-bottom-color: #86efac;
}

.timeline-card.timeline-card--bubble-invoiced[b-0g2g614pwi] {
    border-color: #c4b5fd;
}

.timeline-card.timeline-card--bubble-invoiced[b-0g2g614pwi]::before {
    border-left-color: #c4b5fd;
    border-bottom-color: #c4b5fd;
}

.timeline-card.timeline-card--bubble-cancelled[b-0g2g614pwi] {
    border-color: #fca5a5;
}

.timeline-card.timeline-card--bubble-cancelled[b-0g2g614pwi]::before {
    border-left-color: #fca5a5;
    border-bottom-color: #fca5a5;
}

.timeline-card-head[b-0g2g614pwi] {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

.timeline-icon-blue[b-0g2g614pwi] {
    background-color: #dbeafe;
    border: 1px solid #93c5fd;
}

[b-0g2g614pwi] .timeline-icon-blue .k-svg-icon { color: #1d4ed8; }

.timeline-icon-green[b-0g2g614pwi] {
    background-color: #dcfce7;
    border: 1px solid #86efac;
}

[b-0g2g614pwi] .timeline-icon-green .k-svg-icon { color: #166534; }

.timeline-icon-orange[b-0g2g614pwi] {
    background-color: #fef3c7;
    border: 1px solid #fcd34d;
}

[b-0g2g614pwi] .timeline-icon-orange .k-svg-icon { color: #92400e; }

.timeline-icon-red[b-0g2g614pwi] {
    background-color: #fee2e2;
    border: 1px solid #fca5a5;
}

[b-0g2g614pwi] .timeline-icon-red .k-svg-icon { color: #991b1b; }

.timeline-icon-purple[b-0g2g614pwi] {
    background-color: #ede9fe;
    border: 1px solid #c4b5fd;
}

[b-0g2g614pwi] .timeline-icon-purple .k-svg-icon { color: #6d28d9; }

.timeline-icon-grey[b-0g2g614pwi] {
    background-color: #f3f4f6;
    border: 1px solid #d1d5db;
}

[b-0g2g614pwi] .timeline-icon-grey .k-svg-icon { color: #374151; }

[b-0g2g614pwi] .timeline-icon .k-svg-icon {
    width: 14px;
    height: 14px;
}

.credit-note-actions[b-0g2g614pwi] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
}

.credit-note-action-btn[b-0g2g614pwi] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    border-radius: 999px;
    border: 1px solid #e5e7eb;
    background: #ffffff;
    color: #4b5563;
    cursor: pointer;
    transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.12s ease;
}

.credit-note-action-btn:hover[b-0g2g614pwi] {
    transform: translateY(-1px);
    background: #f9fafb;
}

.credit-note-action-btn:disabled[b-0g2g614pwi] {
    opacity: 0.5;
    cursor: not-allowed;
    transform: none;
}

.credit-note-action-btn.is-send[b-0g2g614pwi] {
    color: #1d4ed8;
    border-color: #bfdbfe;
    background: #eff6ff;
}

.credit-note-action-btn.is-send:hover[b-0g2g614pwi] {
    background: #dbeafe;
    border-color: #93c5fd;
}

.credit-note-action-btn.is-accept[b-0g2g614pwi] {
    color: #15803d;
    border-color: #bbf7d0;
    background: #f0fdf4;
}

.credit-note-action-btn.is-accept:hover[b-0g2g614pwi] {
    background: #dcfce7;
    border-color: #86efac;
}

.credit-note-action-btn.is-reopen[b-0g2g614pwi] {
    color: #4338ca;
    border-color: #c7d2fe;
    background: #eef2ff;
}

.credit-note-action-btn.is-reopen:hover[b-0g2g614pwi] {
    background: #e0e7ff;
    border-color: #a5b4fc;
}

.credit-note-action-btn.is-reject[b-0g2g614pwi] {
    color: #b91c1c;
    border-color: #fecaca;
    background: #fef2f2;
}

.credit-note-action-btn.is-reject:hover[b-0g2g614pwi] {
    background: #fee2e2;
    border-color: #fca5a5;
}

/* Order status badges */
[b-0g2g614pwi] .order-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1;
    border: 1px solid transparent;
}

[b-0g2g614pwi] .order-status-badge--created {
    color: #1d4ed8 !important;
    background-color: #dbeafe !important;
    border-color: #93c5fd !important;
}

[b-0g2g614pwi] .order-status-badge--progress {
    color: #92400e !important;
    background-color: #fef3c7 !important;
    border-color: #fcd34d !important;
}

[b-0g2g614pwi] .order-status-badge--completed {
    color: #166534 !important;
    background-color: #dcfce7 !important;
    border-color: #86efac !important;
}

[b-0g2g614pwi] .order-status-badge--invoiced {
    color: #6d28d9 !important;
    background-color: #ede9fe !important;
    border-color: #c4b5fd !important;
}

[b-0g2g614pwi] .order-status-badge--cancelled {
    color: #991b1b !important;
    background-color: #fee2e2 !important;
    border-color: #fca5a5 !important;
}

[b-0g2g614pwi] .order-status-badge--default {
    color: #374151 !important;
    background-color: #f3f4f6 !important;
    border-color: #d1d5db !important;
}

/* Header styling and Layout consistency from orders/warranties */
.order-detail-header-row[b-0g2g614pwi] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    flex-wrap: wrap;
    gap: 16px;
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px 14px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05), 0 1px 2px 0 rgba(0, 0, 0, 0.03);
    margin-bottom: 20px;
}
@media (max-width: 768px) {
    .order-detail-header-row[b-0g2g614pwi] {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    .order-header-main-info[b-0g2g614pwi] {
        align-items: flex-start !important;
    }

    .order-detail-header-actions[b-0g2g614pwi] {
        display: flex;
        flex-direction: column;
        gap: 8px !important;
        border-top: 1px solid #e2e8f0;
        padding-top: 12px;
        margin-top: 4px;
        width: 100%;
        justify-content: flex-start !important;
    }

    .order-detail-header-actions[b-0g2g614pwi]  .k-button {
        width: 100% !important;
    }

    .order-header-title[b-0g2g614pwi] {
        font-size: 1.4rem !important;
    }
}

.order-header-main-info[b-0g2g614pwi] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.order-header-title[b-0g2g614pwi] {
    font-size: 1.65rem;
    font-weight: 800;
    color: #0f172a !important;
    letter-spacing: 1px;
    margin: 0;
}

.order-header-subtitle[b-0g2g614pwi] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 0.9rem;
    color: #475569;
    line-height: 1.2;
    margin-top: 4px;
}

.subtitle-item[b-0g2g614pwi] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.subtitle-separator[b-0g2g614pwi] {
    color: #94a3b8;
}

.order-header-subtitle[b-0g2g614pwi]  .k-svg-icon {
    align-self: center;
    position: relative;
    top: -1px;
}

@media (max-width: 576px) {
    .order-header-subtitle[b-0g2g614pwi] {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .subtitle-separator[b-0g2g614pwi] {
        display: none !important;
    }
}

.order-detail-header-row[b-0g2g614pwi]  .order-back-link-btn,
.order-detail-header-row[b-0g2g614pwi]  .order-back-link-btn.k-button {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-color: transparent !important;
    padding: 4px !important;
    color: var(--primary-color, #667eea) !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: none !important;
    transition: opacity 0.2s ease;
}

.order-detail-header-row[b-0g2g614pwi]  .order-back-link-btn:hover,
.order-detail-header-row[b-0g2g614pwi]  .order-back-link-btn.k-button:hover {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-color: transparent !important;
    opacity: 0.7 !important;
    box-shadow: none !important;
}

.order-detail-header-row[b-0g2g614pwi]  .order-back-link-btn:focus,
.order-detail-header-row[b-0g2g614pwi]  .order-back-link-btn:active,
.order-detail-header-row[b-0g2g614pwi]  .order-back-link-btn.k-button:focus,
.order-detail-header-row[b-0g2g614pwi]  .order-back-link-btn.k-button:active {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

.order-detail-header-row[b-0g2g614pwi]  .order-back-link-btn .k-svg-icon,
.order-detail-header-row[b-0g2g614pwi]  .order-back-link-btn.k-button .k-svg-icon {
    color: var(--primary-color, #667eea) !important;
}

.quote-code-highlight[b-0g2g614pwi] {
    color: var(--primary-color, #667eea) !important;
    font-weight: 700;
    text-decoration: none;
}

.quote-code-highlight:hover[b-0g2g614pwi] {
    text-decoration: underline;
    opacity: 0.85;
}

.order-module-card[b-0g2g614pwi] {
    border: none;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    background-color: #fff;
}

.order-edit-page-shell[b-0g2g614pwi]  .employee-tabstrip,
.order-edit-page-shell[b-0g2g614pwi]  .employee-tabstrip .k-tabstrip-content,
.order-edit-page-shell[b-0g2g614pwi]  .employee-tabstrip .k-content,
.order-edit-page-shell[b-0g2g614pwi]  .tab-content {
    overflow: visible !important;
    overflow-y: visible !important;
    height: auto !important;
}

.order-edit-page-shell[b-0g2g614pwi]  .custom-tab-strip-container {
    padding-bottom: 0 !important;
}

/* Items Table */
.items-table[b-0g2g614pwi] {
    border-collapse: collapse;
}

.items-table th[b-0g2g614pwi] {
    background-color: #f8fafc;
    color: #475569;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border-bottom: 1.5px solid #e2e8f0;
}

.items-table td[b-0g2g614pwi] {
    border-bottom: 1px solid #f1f5f9;
    font-size: 0.9rem;
}

.items-total-value[b-0g2g614pwi] {
    font-size: 1.15rem;
    color: #1e293b;
}

.text-success-green[b-0g2g614pwi] {
    color: #166534 !important;
}

/* Carrusel horizontal para tarjetas de información en responsive */
@media (max-width: 767.98px) {
    .responsive-carousel-row[b-0g2g614pwi] {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        scroll-snap-type: x mandatory !important;
        scroll-behavior: smooth !important;
        -webkit-overflow-scrolling: touch !important;
        gap: 12px !important;
        padding-bottom: 12px !important;
        padding-left: 4px !important;
        padding-right: 4px !important;
    }
    
    .responsive-carousel-row[b-0g2g614pwi]::-webkit-scrollbar {
        height: 5px;
    }
    
    .responsive-carousel-row[b-0g2g614pwi]::-webkit-scrollbar-track {
        background: #f1f5f9;
        border-radius: 999px;
    }
    
    .responsive-carousel-row[b-0g2g614pwi]::-webkit-scrollbar-thumb {
        background: #cbd5e1;
        border-radius: 999px;
    }

    .responsive-carousel-row > [class*="col-"][b-0g2g614pwi] {
        flex: 0 0 290px !important;
        max-width: 290px !important;
        scroll-snap-align: start !important;
    }
}
/* /Pages/Roles/Roles.razor.rz.scp.css */
.roles-page[b-e43ag5wx9d] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.roles-stats-grid[b-e43ag5wx9d] {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.roles-stat-card[b-e43ag5wx9d] {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    padding: 16px 18px;
    min-height: 130px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
}

.roles-stat-header[b-e43ag5wx9d] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #374151;
    font-size: 0.92rem;
    font-weight: 600;
}

.roles-stat-value[b-e43ag5wx9d] {
    font-size: 2rem;
    line-height: 1;
    font-weight: 700;
    color: #111827;
}

.roles-stat-subtitle[b-e43ag5wx9d] {
    color: #6b7280;
    font-size: 0.85rem;
}

.roles-tabs-container[b-e43ag5wx9d] {
    display: flex;
    gap: 8px;
    align-items: center;
}

.roles-tab-button[b-e43ag5wx9d] {
    border: 1px solid #d1d5db;
    background: #fff;
    color: #374151;
    border-radius: 10px;
    padding: 6px 10px;
    font-size: 0.9rem;
    font-weight: 600;
}

.roles-tab-button.active[b-e43ag5wx9d] {
    border-color: #111827;
    color: #111827;
}

.roles-search-row[b-e43ag5wx9d] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.roles-search-row[b-e43ag5wx9d]  .search-input-container {
    flex: 1;
    min-width: 250px;
    max-width: 90%;
}

.roles-active-toggle[b-e43ag5wx9d] {
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    flex-shrink: 0;
}

@media (max-width: 576px) {
    .roles-search-row[b-e43ag5wx9d] {
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        gap: 12px !important;
        flex-wrap: nowrap !important;
    }
    
    .roles-active-toggle[b-e43ag5wx9d] {
        flex-shrink: 0 !important;
        width: auto !important;
        justify-content: flex-end !important;
    }

    /* Estadísticas en cuadrícula de 2x2 de aspecto Premium */
    .roles-stats-grid[b-e43ag5wx9d] {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 10px !important;
    }

    .roles-stat-card[b-e43ag5wx9d] {
        padding: 12px !important;
        min-height: 100px !important;
        gap: 6px !important;
    }

    .roles-stat-value[b-e43ag5wx9d] {
        font-size: 1.5rem !important;
    }

    .roles-stat-header[b-e43ag5wx9d] {
        font-size: 0.82rem !important;
    }

    .roles-stat-subtitle[b-e43ag5wx9d] {
        font-size: 0.76rem !important;
    }

    /* Pestañas táctiles fluidas con scroll horizontal oculto */
    .roles-tabs-container[b-e43ag5wx9d] {
        overflow-x: auto !important;
        white-space: nowrap !important;
        flex-wrap: nowrap !important;
        padding-bottom: 4px;
        -webkit-overflow-scrolling: touch;
        width: 100%;
    }

    .roles-tabs-container[b-e43ag5wx9d]::-webkit-scrollbar {
        display: none;
    }

    .roles-tab-button[b-e43ag5wx9d] {
        flex-shrink: 0 !important;
    }

    /* Input de Búsqueda flexible ocupando el espacio restante */
    .roles-search-row[b-e43ag5wx9d]  .search-input-container {
        flex: 1 !important;
        min-width: 0 !important;
        max-width: none !important;
        width: auto !important;
    }

    /* Cabecera de la tarjeta estirada para el grid de botones */
    .role-card-header[b-e43ag5wx9d] {
        flex-direction: column;
        align-items: stretch !important;
        gap: 12px;
    }

    /* Título con envoltura en caso de nombres largos */
    .role-title-row[b-e43ag5wx9d] {
        flex-wrap: wrap !important;
        gap: 6px !important;
    }

    /* Cuadrícula de Botones de Acción inteligente (Sin Desbordes) */
    .role-card-actions[b-e43ag5wx9d] {
        display: grid !important;
        grid-template-columns: 1fr 1fr;
        width: 100% !important;
        gap: 8px !important;
        margin-top: 8px;
    }

    .role-card-actions .btn-arregly-add[b-e43ag5wx9d] {
        width: 100% !important;
        justify-content: center !important;
        gap: 8px !important;
        padding: 6px 10px !important;
        font-size: 0.85rem !important;
    }

    .role-card-actions .btn-arregly-add:last-child[b-e43ag5wx9d] {
        grid-column: span 2;
    }

    /* Resumen de tarjeta adaptado */
    .role-card-summary[b-e43ag5wx9d] {
        gap: 12px !important;
        font-size: 0.84rem !important;
    }
}

.roles-list[b-e43ag5wx9d] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.role-card[b-e43ag5wx9d] {
    border: 1px solid #e5e7eb;
    background: #fff;
    border-radius: 14px;
    padding: 16px;
}

.role-card-header[b-e43ag5wx9d] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.role-main-info[b-e43ag5wx9d] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.role-icon[b-e43ag5wx9d] {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: #eef2ff;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #2563eb;
    border: 1px solid #dbeafe;
    flex-shrink: 0;
}

.role-title-group h3[b-e43ag5wx9d] {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 700;
    color: #111827;
}

.role-title-group p[b-e43ag5wx9d] {
    margin: 4px 0 0;
    color: #6b7280;
    font-size: 0.92rem;
}

.role-title-row[b-e43ag5wx9d] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.role-badge[b-e43ag5wx9d] {
    background: #f3f4f6;
    color: #374151;
    border: 1px solid #e5e7eb;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 3px 8px;
}

.role-expand-button[b-e43ag5wx9d] {
    border: none;
    background: transparent;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.92rem;
    font-weight: 600;
    color: #111827;
}

.role-card-summary[b-e43ag5wx9d] {
    margin-top: 14px;
    padding-top: 10px;
    border-top: 1px solid #eef2f7;
    display: flex;
    align-items: center;
    gap: 16px;
    color: #4b5563;
    font-size: 0.9rem;
    flex-wrap: wrap;
}

.role-card-summary span[b-e43ag5wx9d] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.role-modules-grid[b-e43ag5wx9d] {
    margin-top: 12px;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
}

.role-module-item[b-e43ag5wx9d] {
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 8px 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.role-module-name[b-e43ag5wx9d] {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #111827;
    font-size: 0.88rem;
    font-weight: 600;
}

.role-module-actions[b-e43ag5wx9d] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.role-module-action[b-e43ag5wx9d] {
    width: 20px;
    height: 20px;
    border-radius: 999px;
    border: 1px solid #d1d5db;
    color: #9ca3af;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
}

.role-module-action.enabled[b-e43ag5wx9d] {
    color: #059669;
    border-color: #6ee7b7;
    background: #ecfdf5;
}

.roles-placeholder[b-e43ag5wx9d] {
    border: 1px dashed #d1d5db;
    border-radius: 12px;
    background: #fff;
    padding: 20px;
    color: #6b7280;
}

.role-modal-body[b-e43ag5wx9d] {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.role-modal-subtitle[b-e43ag5wx9d] {
    margin: 0;
    color: #6b7280;
}

.role-modal-tabs[b-e43ag5wx9d] {
    display: inline-flex;
    background: #f3f4f6;
    border-radius: 10px;
    padding: 3px;
    width: fit-content;
    gap: 4px;
}

.role-modal-tab-button[b-e43ag5wx9d] {
    border: none;
    background: transparent;
    border-radius: 8px;
    padding: 7px 12px;
    font-size: 0.9rem;
    font-weight: 600;
    color: #374151;
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.role-modal-tab-button.active[b-e43ag5wx9d] {
    background: #fff;
    box-shadow: 0 0 0 1px #d1d5db inset;
    color: #111827;
}

.role-modal-tab-badge[b-e43ag5wx9d] {
    background: #f3f4f6;
    border: 1px solid #d1d5db;
    color: #111827;
    border-radius: 999px;
    min-width: 20px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.72rem;
    font-weight: 700;
}

.role-modal-form-grid[b-e43ag5wx9d] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.role-form-field[b-e43ag5wx9d] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.role-form-field label[b-e43ag5wx9d] {
    font-size: 0.92rem;
    font-weight: 600;
    color: #111827;
}

.role-draft-summary-card[b-e43ag5wx9d] {
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #f9fafb;
    padding: 14px;
}

.role-draft-summary-card h5[b-e43ag5wx9d] {
    margin: 0 0 10px;
    color: #111827;
}

.role-draft-summary-content[b-e43ag5wx9d] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    color: #374151;
}

.role-modal-permissions-list[b-e43ag5wx9d] {
    max-height: 52vh;
    overflow: auto;
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-right: 4px;
}

.role-modal-permission-card[b-e43ag5wx9d] {
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 12px;
}

.role-modal-permission-header[b-e43ag5wx9d] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.role-modal-permission-title[b-e43ag5wx9d] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.role-modal-permission-title strong[b-e43ag5wx9d] {
    display: block;
    color: #111827;
}

.role-modal-permission-title span[b-e43ag5wx9d] {
    color: #6b7280;
    font-size: 0.85rem;
}

.role-modal-full-access[b-e43ag5wx9d] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #6b7280;
    font-size: 0.86rem;
}

.role-modal-actions-row[b-e43ag5wx9d] {
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #eef2f7;
    display: flex;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
}

.role-modal-action-item[b-e43ag5wx9d] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.92rem;
    color: #111827;
}

.role-modal-action-icon[b-e43ag5wx9d] {
    color: #6b7280;
}

:deep(.role-modal-action-item:hover .role-modal-action-icon)[b-e43ag5wx9d] {
    color: var(--primary-color);
}

.roles-table-wrapper[b-e43ag5wx9d] {
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #fff;
    overflow: auto;
}

.roles-data-table[b-e43ag5wx9d] {
    width: 100%;
    border-collapse: collapse;
    min-width: 760px;
}

.roles-data-table thead th[b-e43ag5wx9d] {
    background: #f8fafc;
    color: #374151;
    font-size: 0.82rem;
    font-weight: 700;
    padding: 10px 12px;
    border-bottom: 1px solid #e5e7eb;
    text-align: left;
}

.roles-data-table tbody td[b-e43ag5wx9d] {
    padding: 10px 12px;
    border-bottom: 1px solid #f1f5f9;
    color: #111827;
    font-size: 0.88rem;
}

.roles-data-table tbody tr:last-child td[b-e43ag5wx9d] {
    border-bottom: none;
}

.role-status-chip[b-e43ag5wx9d] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    padding: 2px 8px;
    font-size: 0.74rem;
    font-weight: 700;
    border: 1px solid transparent;
}

.role-status-chip.active[b-e43ag5wx9d] {
    color: #047857;
    background: #ecfdf5;
    border-color: #6ee7b7;
}

.role-status-chip.inactive[b-e43ag5wx9d] {
    color: #b91c1c;
    background: #fef2f2;
    border-color: #fecaca;
}

.permission-chip[b-e43ag5wx9d] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    border-radius: 999px;
    padding: 2px 8px;
    font-size: 0.74rem;
    font-weight: 700;
    border: 1px solid transparent;
}

.permission-chip.enabled[b-e43ag5wx9d] {
    color: #047857;
    background: #ecfdf5;
    border-color: #6ee7b7;
}

.permission-chip.disabled[b-e43ag5wx9d] {
    color: #6b7280;
    background: #f3f4f6;
    border-color: #d1d5db;
}

@media (max-width: 1199.98px) {
    .roles-stats-grid[b-e43ag5wx9d] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .role-modules-grid[b-e43ag5wx9d] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .roles-stats-grid[b-e43ag5wx9d] {
        grid-template-columns: 1fr;
    }

    .role-modules-grid[b-e43ag5wx9d] {
        grid-template-columns: 1fr;
    }

    .role-card-header[b-e43ag5wx9d] {
        flex-direction: column;
        align-items: flex-start;
    }
}
/* /Pages/Services/Services.razor.rz.scp.css */
.services-list-container[b-k9gypiy2ud] {
    width: 100%;
    display: flex;
    flex-direction: column;
}

.services-context-toolbar[b-k9gypiy2ud] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-bottom: 1rem;
    padding: 0.75rem 1rem;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    background-color: #ffffff;
}

.services-context-mode[b-k9gypiy2ud] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.services-context-branch[b-k9gypiy2ud] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.services-toolbar-context-controls[b-k9gypiy2ud] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 36px;
    flex-shrink: 0;
}

.services-context-branch-animated[b-k9gypiy2ud] {
    overflow: hidden;
    transform-origin: left center;
    transition: max-width 0.26s ease, opacity 0.26s ease, transform 0.26s ease, margin-left 0.26s ease;
    max-width: 230px;
    opacity: 1;
    transform: translateX(0);
    margin-left: 0;
    will-change: max-width, opacity, transform;
}

.services-context-branch-animated.is-hidden[b-k9gypiy2ud] {
    max-width: 0;
    opacity: 0;
    transform: translateX(-8px);
    margin-left: -0.25rem;
    pointer-events: none;
}

.services-context-branch-animated.is-visible[b-k9gypiy2ud] {
    max-width: 230px;
    opacity: 1;
    transform: translateX(0);
    margin-left: 0;
    pointer-events: auto;
}

.services-context-branch-animated[b-k9gypiy2ud]  .k-animation-container {
    width: 220px !important;
}

.services-context-branch-animated.is-hidden[b-k9gypiy2ud]  .k-animation-container {
    visibility: hidden;
}

[b-k9gypiy2ud] .toolbar-left .toolbar-extra {
    order: 1;
    display: inline-flex;
    align-items: center;
}

[b-k9gypiy2ud] .toolbar-left .search-input-container {
    order: 2;
    flex: 1;
    min-width: 240px;
}

[b-k9gypiy2ud] .toolbar-left .toolbar-utility-btn,
[b-k9gypiy2ud] .toolbar-left > .k-button {
    order: 3;
}

[b-k9gypiy2ud] .toolbar-right {
    order: 4;
}

[b-k9gypiy2ud] .toolbar-left {
    flex-wrap: nowrap;
}

/* --- Mobile Responsive Toolbar --- */
@media (max-width: 768px) {
    .dashboard-container[b-k9gypiy2ud]  .toolbar-left {
        width: 100% !important;
        display: flex !important;
        flex-wrap: wrap !important;
        align-items: center !important;
        gap: 8px !important;
    }

    .dashboard-container[b-k9gypiy2ud]  .toolbar-left .toolbar-extra {
        order: 1 !important;
        flex: 1 1 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
        display: flex !important;
        flex-wrap: nowrap !important;
    }

    .dashboard-container[b-k9gypiy2ud]  .toolbar-left .search-input-container {
        order: 2 !important;
        flex: 1 1 calc(100% - 120px) !important;
        min-width: 0 !important;
    }

    .dashboard-container[b-k9gypiy2ud]  .toolbar-left .toolbar-utility-btn,
    .dashboard-container[b-k9gypiy2ud]  .toolbar-left > .k-button {
        order: 3 !important;
        flex: 0 0 32px !important;
    }

    [b-k9gypiy2ud] .toolbar-left .toolbar-info {
        order: 4;
        flex: 1 1 auto;
        min-width: fit-content;
    }

    [b-k9gypiy2ud] .toolbar-right {
        order: 4;
        flex: 0 0 auto;
        width: auto;
        display: inline-flex;
        align-items: center;
        gap: 4px;
    }

    .services-toolbar-context-controls[b-k9gypiy2ud] {
        width: 100% !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        min-width: 0 !important;
        gap: 8px;
    }

    .services-toolbar-context-controls.with-mode .services-context-mode[b-k9gypiy2ud] {
        flex: 0 0 100px !important;
        min-width: 100px !important;
        max-width: 100px !important;
    }

    .services-toolbar-context-controls.with-mode .services-context-branch[b-k9gypiy2ud] {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        width: auto !important;
    }

    .services-toolbar-context-controls.branch-only .services-context-branch[b-k9gypiy2ud] {
        flex: 1 1 100% !important;
        min-width: 0 !important;
        width: auto !important;
    }

    .services-context-branch-animated[b-k9gypiy2ud],
    .services-context-branch-animated.is-visible[b-k9gypiy2ud],
    .services-context-branch-animated.is-hidden[b-k9gypiy2ud] {
        max-width: 100% !important;
        opacity: 1 !important;
        transform: none !important;
        margin-left: 0 !important;
        pointer-events: auto !important;
        display: flex !important;
    }

    .services-context-branch-animated[b-k9gypiy2ud]  .k-animation-container {
        width: 100% !important;
    }

    .services-context-mode[b-k9gypiy2ud] {
        overflow: hidden;
    }

    .services-context-mode[b-k9gypiy2ud]  .radio-pill.quote-item-type-toggle {
        width: 100% !important;
        min-width: 100% !important;
        max-width: 100% !important;
        min-height: 28px !important;
        height: 28px !important;
        border-radius: 999px !important;
    }

    .services-context-mode[b-k9gypiy2ud]  .radio-pill.quote-item-type-toggle::before {
        top: 2px !important;
        left: 2px !important;
        width: calc(50% - 2px) !important;
        height: calc(100% - 4px) !important;
    }

    .services-context-mode[b-k9gypiy2ud]  .radio-pill.quote-item-type-toggle .k-radio-item-label,
    .services-context-mode[b-k9gypiy2ud]  .radio-pill.quote-item-type-toggle .k-radio-label,
    .services-context-mode[b-k9gypiy2ud]  .radio-pill.quote-item-type-toggle .k-label,
    .services-context-mode[b-k9gypiy2ud]  .radio-pill.quote-item-type-toggle label {
        min-height: 100% !important;
        height: 100% !important;
        padding: 0 !important;
        font-size: 0.72rem !important;
        white-space: nowrap !important;
        line-height: 1 !important;
        transform: none !important;
        text-shadow: none !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .services-context-mode[b-k9gypiy2ud]  .k-radio-item-label {
        white-space: nowrap;
        font-size: 0.72rem !important;
        line-height: 1 !important;
    }

    .services-context-branch[b-k9gypiy2ud]  .k-picker,
    [b-k9gypiy2ud] .toolbar-extra .services-context-branch .k-picker {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    [b-k9gypiy2ud] .records-badge {
        width: 100%;
        justify-content: center;
    }
}

[b-k9gypiy2ud] .records-badge {
    padding: 5px 12px;
    border-radius: 12px;
    font-weight: 500;
    font-size: 0.8125rem;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background-color: #f3f4f6;
    color: #475467;
    border: 1px solid #e5e7eb;
    white-space: nowrap;
    height: 30px;
    box-sizing: border-box;
}

[b-k9gypiy2ud] .filtered-badge {
    background-color: #f0fdf4;
    color: #166534;
    border-color: #bbf7d0;
}

@media (max-width: 340px) {
    .dashboard-container[b-k9gypiy2ud]  .toolbar-left .toolbar-info {
        display: none !important;
    }

    .services-toolbar-context-controls[b-k9gypiy2ud] {
        gap: 6px !important;
    }
}

.services-list-container[b-k9gypiy2ud]  .accordion-pager {
    order: 5;
}

.service-list-row[b-k9gypiy2ud] {
    display: grid;
    grid-template-columns: 2.2fr 0.9fr 0.9fr 0.9fr 1fr 1fr 0.7fr;
    gap: 12px;
    align-items: center;
    padding: 12px 18px;
    border: 1px solid #f1f5f9;
    border-radius: 14px;
    background: #fff;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    min-width: 980px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.02);
}

.service-list-row.is-branch-mode[b-k9gypiy2ud] {
    grid-template-columns: 2.2fr 0.9fr 0.9fr 1fr 1fr 0.7fr;
}

.service-list-row:hover[b-k9gypiy2ud] {
    border-color: #e2e8f0;
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.02);
}

.service-cell[b-k9gypiy2ud] {
    min-width: 0;
    font-size: 0.875rem;
    color: #111827;
}

.service-main-cell[b-k9gypiy2ud] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.service-icon-box[b-k9gypiy2ud] {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: #f3f4f6;
    flex-shrink: 0;
}

.service-main-content[b-k9gypiy2ud] {
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.service-title[b-k9gypiy2ud] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #111827;
    line-height: 1.2;
}

.service-price-cell[b-k9gypiy2ud] {
    font-weight: normal;
}

.service-branches-cell[b-k9gypiy2ud] {
    display: flex;
    align-items: center;
}

.service-metric-value[b-k9gypiy2ud] {
    font-size: 0.875rem;
    font-weight: normal;
    color: #111827;
    line-height: 1;
}

.service-metric-unit[b-k9gypiy2ud] {
    font-size: 0.875rem;
    font-weight: 500;
    color: #111827;
    line-height: 1;
}

.service-signature-cell[b-k9gypiy2ud] {
    display: flex;
    align-items: center;
}

.signature-tag[b-k9gypiy2ud] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1;
}

.signature-tag-required[b-k9gypiy2ud] {
    background: #ecfdf3;
    color: #067647;
    border: 1px solid #a6f4c5;
}

.signature-tag-not-required[b-k9gypiy2ud] {
    background: #fef3f2;
    color: #b42318;
    border: 1px solid #fecdca;
}

.signature-tag[b-k9gypiy2ud]  .k-svg-icon {
    width: 14px !important;
    height: 14px !important;
}

.service-actions-cell[b-k9gypiy2ud] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    position: relative;
}

/* =================== MENÚ DE ACCIONES (DropDownButton - Idéntico a BaseGrid) =================== */

[b-k9gypiy2ud] .action-menu-container {
    display: flex;
    justify-content: center;
    align-items: center;
    position: static;
}

[b-k9gypiy2ud] .action-menu-button,
[b-k9gypiy2ud] .k-button.action-menu-button,
[b-k9gypiy2ud] .k-menu-button.action-menu-button,
[b-k9gypiy2ud] .service-action-menu-button {
    border-radius: 12px !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    padding: 0 !important;
    background: transparent !important;
    background-color: transparent !important;
    border: 1px solid transparent !important;
    box-shadow: none !important;
    color: var(--primary-color, #6d28d9) !important;
    transition: all 0.25s ease !important;
    position: relative !important;
}

[b-k9gypiy2ud] .action-menu-button:hover,
[b-k9gypiy2ud] .k-button.action-menu-button:hover,
[b-k9gypiy2ud] .k-menu-button.action-menu-button:hover,
[b-k9gypiy2ud] .service-action-menu-button:hover {
    background: var(--RgbaColor03, rgba(109, 40, 217, 0.08)) !important;
    background-color: var(--RgbaColor03, rgba(109, 40, 217, 0.08)) !important;
    color: var(--primary-color, #6d28d9) !important;
    border-color: transparent !important;
    transform: none !important;
    box-shadow: none !important;
}

[b-k9gypiy2ud] .action-menu-button:focus,
[b-k9gypiy2ud] .service-action-menu-button:focus {
    box-shadow: none !important;
    background: transparent !important;
}

[b-k9gypiy2ud] .action-menu-button:focus-visible,
[b-k9gypiy2ud] .service-action-menu-button:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(109, 40, 217, 0.25) !important;
}

[b-k9gypiy2ud] .action-menu-button .k-svg-icon,
[b-k9gypiy2ud] .service-action-menu-button .k-svg-icon {
    width: 16px !important;
    height: 16px !important;
    color: var(--primary-color, #6d28d9) !important;
    fill: currentColor !important;
    opacity: 1 !important;
}

[b-k9gypiy2ud] .action-menu-button .k-button-text,
[b-k9gypiy2ud] .service-action-menu-button .k-button-text {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
}

[b-k9gypiy2ud] .action-menu-button .k-button-icon,
[b-k9gypiy2ud] .service-action-menu-button .k-button-icon {
    margin: 0 !important;
}

[b-k9gypiy2ud] .action-menu-button .k-menu-button-arrow,
[b-k9gypiy2ud] .service-action-menu-button .k-menu-button-arrow {
    display: none !important;
}

[b-k9gypiy2ud] .action-menu-button,
[b-k9gypiy2ud] .action-menu-button:hover,
[b-k9gypiy2ud] .action-menu-button:focus,
[b-k9gypiy2ud] .action-menu-button:active,
[b-k9gypiy2ud] .service-action-menu-button,
[b-k9gypiy2ud] .service-action-menu-button:hover,
[b-k9gypiy2ud] .service-action-menu-button:focus,
[b-k9gypiy2ud] .service-action-menu-button:active {
    transform: none !important;
}

.btn-arregly.btn-primary-arregly:hover[b-k9gypiy2ud],
.btn-arregly.btn-primary-arregly:focus[b-k9gypiy2ud],
.btn-arregly.btn-primary-arregly:active[b-k9gypiy2ud] {
    color: #ffffff !important;
    background: #059669 !important;
    border-color: #059669 !important;
}

.services-list-container[b-k9gypiy2ud]  .status-badge {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    padding: 5px;
    border-radius: 999px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: capitalize;
    letter-spacing: 0.3px;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.services-list-container[b-k9gypiy2ud]  .status-active {
    background: linear-gradient(135deg, #d4edda 0%, #c3e6cb 100%);
    color: #155724;
}

.services-list-container[b-k9gypiy2ud]  .status-inactive {
    background: linear-gradient(135deg, #f8d7da 0%, #f5c6cb 100%);
    color: #721c24;
}

.services-list-container[b-k9gypiy2ud]  .status-dot {
    width: 0.4rem;
    height: 0.4rem;
    border-radius: 50%;
    background: currentColor;
    display: inline-block;
}

.services-summary-badge[b-k9gypiy2ud] {
    font-size: 14px;
    font-weight: 400;
}

.service-details-container[b-k9gypiy2ud] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.service-details-section[b-k9gypiy2ud] {
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    padding: 16px;
    background: #ffffff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
}

.service-details-section-header[b-k9gypiy2ud] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 1px solid #f1f5f9;
    color: #1e293b;
    font-size: 0.95rem;
    font-weight: 700;
}

.service-details-section-header[b-k9gypiy2ud]  .k-svg-icon {
    width: 18px !important;
    height: 18px !important;
    color: var(--primary-color, #50150a);
}

.service-details-grid[b-k9gypiy2ud] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 14px;
}

.service-detail-item[b-k9gypiy2ud] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.service-detail-item label[b-k9gypiy2ud] {
    font-size: 0.88rem;
    font-weight: 400;
    color: #374151;
}

.service-detail-item span[b-k9gypiy2ud] {
    color: #111827;
}

.service-detail-value[b-k9gypiy2ud] {
    font-weight: 700;
    color: #111827;
}

.service-detail-item-full[b-k9gypiy2ud] {
    grid-column: 1 / -1;
}

.service-detail-value-row[b-k9gypiy2ud] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.service-detail-strong[b-k9gypiy2ud] {
    font-weight: 600;
    color: #111827;
}

.service-details-signature-tag[b-k9gypiy2ud] {
    width: fit-content;
    max-width: fit-content;
}

.service-tax-row[b-k9gypiy2ud],
.service-product-row[b-k9gypiy2ud],
.service-employee-row[b-k9gypiy2ud],
.service-branch-row[b-k9gypiy2ud] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    padding: 10px 14px;
    background: #f8fafc;
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

.service-tax-row:hover[b-k9gypiy2ud],
.service-product-row:hover[b-k9gypiy2ud],
.service-employee-row:hover[b-k9gypiy2ud],
.service-branch-row:hover[b-k9gypiy2ud] {
    background: #f1f5f9;
    border-color: #cbd5e1;
}

.service-branch-list[b-k9gypiy2ud],
.service-products-list[b-k9gypiy2ud],
.service-employees-list[b-k9gypiy2ud] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

@media (max-width: 767.98px) {
    .service-details-grid[b-k9gypiy2ud] {
        grid-template-columns: 1fr;
    }

    .service-tax-row[b-k9gypiy2ud],
    .service-product-row[b-k9gypiy2ud],
    .service-employee-row[b-k9gypiy2ud],
    .service-branch-row[b-k9gypiy2ud] {
        flex-wrap: wrap;
    }
}



@media (max-width: 767.98px) {
    .services-search-header-separator[b-k9gypiy2ud] {
        display: none;
    }

    .services-list-container[b-k9gypiy2ud] {
        overflow-x: visible;
    }

    .services-list-header[b-k9gypiy2ud] {
        display: none !important;
    }
}

/* Tablet screens (768px - 991.98px) allow smooth horizontal scrolling of table */
@media (min-width: 768px) and (max-width: 991.98px) {
    .services-list-container[b-k9gypiy2ud] {
        overflow-x: auto;
    }
}

@media (max-width: 340px) {
    .dashboard-container[b-k9gypiy2ud]  .toolbar-left .toolbar-info {
        display: none !important;
    }

    .services-toolbar-context-controls[b-k9gypiy2ud] {
        gap: 6px !important;
    }
}

/* ===== ESTILOS DE COLUMNAS ENRIQUECIDAS DE LA TABLA DE SERVICIOS ===== */

/* Columna Precio */
[b-k9gypiy2ud] .svc-price-value {
    font-size: 0.9rem;
    font-weight: 700;
    line-height: 1.2;
}

.svc-tax-badge[b-k9gypiy2ud] {
    display: inline-flex;
    align-items: center;
    font-size: 0.65rem;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 999px;
    letter-spacing: 0.3px;
    white-space: nowrap;
    width: fit-content;
}

.svc-tax-badge--inclusive[b-k9gypiy2ud] {
    background: #ecfdf5;
    color: #059669;
    border: 1px solid #a7f3d0;
}

.svc-tax-badge--extra[b-k9gypiy2ud] {
    background: #fff7ed;
    color: #c2410c;
    border: 1px solid #fed7aa;
}

.svc-tax-badge--exempt[b-k9gypiy2ud] {
    background: #f1f5f9;
    color: #475569;
    border: 1px solid #cbd5e1;
}

/* Centrado de headers en la grilla de servicios */
[b-k9gypiy2ud] th.text-center,
[b-k9gypiy2ud] th.text-center .k-cell-inner,
[b-k9gypiy2ud] th.text-center .k-link {
    justify-content: center !important;
    text-align: center !important;
}

/* Banner de portada del modal de detalles */
.service-detail-cover-banner[b-k9gypiy2ud] {
    width: 100%;
    height: 140px;
    border-radius: 12px;
    overflow: hidden;
    position: relative;
    border: 1px solid #e2e8f0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    background: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: center;
}

.service-detail-cover-img[b-k9gypiy2ud] {
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
}

/* Columna Duración */
[b-k9gypiy2ud] .svc-duration-icon {
    width: 14px !important;
    height: 14px !important;
    color: #94a3b8;
    flex-shrink: 0;
}

.svc-duration-value[b-k9gypiy2ud] {
    font-size: 0.85rem;
    font-weight: 600;
}

/* Columna Sedes */
[b-k9gypiy2ud] .svc-branch-icon {
    width: 14px !important;
    height: 14px !important;
    color: #6366f1;
    flex-shrink: 0;
}

.svc-branch-count[b-k9gypiy2ud] {
    font-size: 0.875rem;
    font-weight: 700;
}

/* Columna Estado */
.svc-status-badge[b-k9gypiy2ud] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    white-space: nowrap;
}

.svc-status-badge--active[b-k9gypiy2ud] {
    background: linear-gradient(135deg, #dcfce7, #bbf7d0);
    color: #166534;
    border: 1px solid #86efac;
}

.svc-status-badge--inactive[b-k9gypiy2ud] {
    background: linear-gradient(135deg, #fee2e2, #fecaca);
    color: #991b1b;
    border: 1px solid #fca5a5;
}

.svc-status-dot[b-k9gypiy2ud] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
    flex-shrink: 0;
}

/* ===== MODAL DE DETALLES DEL SERVICIO (HERO & KPI CHIPS) ===== */
.service-detail-hero[b-k9gypiy2ud] {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
}

.service-detail-hero-icon[b-k9gypiy2ud] {
    width: 52px;
    height: 52px;
    min-width: 52px;
    border-radius: 14px;
    background: var(--primary-rgba-color, rgba(80, 21, 10, 0.1));
    color: var(--primary-color, #50150a);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.4rem;
    flex-shrink: 0;
}

.service-detail-hero-avatar[b-k9gypiy2ud] {
    width: 64px;
    height: 64px;
    min-width: 64px;
    border-radius: 14px;
    background: #ffffff;
    border: 1.5px solid #e2e8f0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    overflow: hidden;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
}

.service-detail-hero-avatar img[b-k9gypiy2ud] {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.service-section-item-icon[b-k9gypiy2ud] {
    width: 36px;
    height: 36px;
    min-width: 36px;
    border-radius: 10px;
    background: #f1f5f9;
    color: #475569;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.service-section-item-icon[b-k9gypiy2ud]  .k-svg-icon {
    width: 16px !important;
    height: 16px !important;
    color: currentColor !important;
}

.service-detail-hero-content[b-k9gypiy2ud] {
    flex: 1;
    min-width: 0;
}

.service-detail-hero-title[b-k9gypiy2ud] {
    font-size: 1.15rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.3;
}

.service-detail-hero-desc[b-k9gypiy2ud] {
    font-size: 0.825rem;
    color: #64748b;
    line-height: 1.4;
}

.service-kpi-grid[b-k9gypiy2ud] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 10px;
}

.service-kpi-chip[b-k9gypiy2ud] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.service-kpi-chip:hover[b-k9gypiy2ud] {
    border-color: #cbd5e1;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
}

.service-kpi-chip-icon[b-k9gypiy2ud] {
    width: 34px;
    height: 34px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.95rem;
    flex-shrink: 0;
}

.service-kpi-chip-icon--price[b-k9gypiy2ud] {
    background: #ecfdf5;
    color: #059669;
}

.service-kpi-chip-icon--duration[b-k9gypiy2ud] {
    background: #eef2ff;
    color: #4f46e5;
}

.service-kpi-chip-icon--tax-inc[b-k9gypiy2ud] {
    background: #f0fdf4;
    color: #16a34a;
}

.service-kpi-chip-icon--tax-exc[b-k9gypiy2ud] {
    background: #fff7ed;
    color: #ea580c;
}

.service-kpi-chip-icon--branches[b-k9gypiy2ud] {
    background: #f8fafc;
    color: #6366f1;
    border: 1px solid #e0e7ff;
}

.service-kpi-chip-info[b-k9gypiy2ud] {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.service-kpi-chip-label[b-k9gypiy2ud] {
    font-size: 0.72rem;
    font-weight: 500;
    color: #64748b;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    line-height: 1.2;
}

.service-kpi-chip-value[b-k9gypiy2ud] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #0f172a;
    line-height: 1.3;
    margin-top: 2px;
}

@media (max-width: 576px) {
    .service-kpi-grid[b-k9gypiy2ud] {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ===== BADGES DEL MODAL DE DETALLES (ALTA LEGIBILIDAD WCAG AAA) ===== */
.svc-detail-tax-badge[b-k9gypiy2ud] {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.2px;
    background: #eff6ff;
    color: #1d4ed8;
    border: 1px solid #bfdbfe;
    box-shadow: 0 1px 2px rgba(29, 78, 216, 0.05);
}

.svc-branch-badge[b-k9gypiy2ud] {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.2px;
    white-space: nowrap;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}

.svc-branch-badge--standard[b-k9gypiy2ud] {
    background: #f0fdf4;
    color: #15803d;
    border: 1px solid #bbf7d0;
}

.svc-branch-badge--custom[b-k9gypiy2ud] {
    background: #fffbeb;
    color: #92400e;
    border: 1px solid #fde68a;
}

/* /Pages/Subscription/PlansAndAddonsInfo.razor.rz.scp.css */
/* Contenedor Navegación por Pestañas */
.custom-nav-tabs[b-zwi8dut793] {
    display: inline-flex;
    background: #f1f5f9;
    padding: 6px;
    border-radius: 12px;
    gap: 6px;
    border: 1px solid #e2e8f0;
}

.tab-btn[b-zwi8dut793] {
    border: none;
    background: transparent;
    padding: 10px 24px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.9rem;
    color: #64748b;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

.tab-btn:hover[b-zwi8dut793] {
    color: #1e293b;
    background: rgba(255, 255, 255, 0.5);
}

.tab-btn.active[b-zwi8dut793] {
    background: #ffffff;
    color: var(--primary-color, #667eea);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

/* Contenedor Grilla de Planes */
.plans-cards-grid[b-zwi8dut793] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
    gap: 1.5rem;
    margin-top: 1rem;
}

.current-plan-card[b-zwi8dut793] {
    border: 2px solid var(--primary-color, #667eea) !important;
    box-shadow: 0 8px 24px rgba(102, 126, 234, 0.18) !important;
}

.badge-current-plan[b-zwi8dut793] {
    background: var(--primary-color, #667eea) !important;
    color: #ffffff !important;
    font-size: 0.75rem !important;
    font-weight: 700 !important;
}

.badge-popular[b-zwi8dut793] {
    background: #ffedd5 !important;
    color: #c2410c !important;
    border: 1px solid #fed7aa !important;
    font-weight: 600 !important;
    font-size: 0.75rem;
    padding: 3px 10px;
    border-radius: 20px;
}

/* Grilla de Adicionales */
.addons-cards-grid[b-zwi8dut793] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
    gap: 1.5rem;
    margin-top: 1rem;
}

.addon-card[b-zwi8dut793] {
    background: #ffffff;
    border-radius: 16px;
    padding: 1.5rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    border: 1px solid #e2e8f0 !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.addon-card:hover[b-zwi8dut793] {
    transform: translateY(-3px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08) !important;
    border-color: #cbd5e1 !important;
}

.focused-addon-card[b-zwi8dut793] {
    border: 2px solid #0f766e !important;
    animation: pulse-border-b-zwi8dut793 1.5s infinite;
}

@keyframes pulse-border-b-zwi8dut793 {
    0% { box-shadow: 0 0 0 0 rgba(15, 118, 110, 0.4); }
    70% { box-shadow: 0 0 0 8px rgba(15, 118, 110, 0); }
    100% { box-shadow: 0 0 0 0 rgba(15, 118, 110, 0); }
}

.addon-card-header[b-zwi8dut793] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.addon-icon-circle[b-zwi8dut793] {
    width: 42px;
    height: 42px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    flex-shrink: 0;
    transition: transform 0.2s ease;
}

.addon-card .limit-card-mini[b-zwi8dut793],
.addon-card .feature-card-mini[b-zwi8dut793] {
    width: 100%;
    padding: 0.65rem 0.9rem;
    border: 1px solid #e2e8f0;
}

.addon-icon-orders[b-zwi8dut793] {
    background: #e6f4ea;
    color: #0f766e;
}

.addon-icon-quotes[b-zwi8dut793] {
    background: #eff6ff;
    color: #2563eb;
}

.addon-icon-users[b-zwi8dut793] {
    background: #f5f3ff;
    color: #7c3aed;
}

.addon-icon-branches[b-zwi8dut793] {
    background: #fffbeb;
    color: #d97706;
}

.addon-icon-inventory[b-zwi8dut793] {
    background: #ecfeff;
    color: #0891b2;
}

.addon-icon-invoices[b-zwi8dut793] {
    background: #fdf2f8;
    color: #db2777;
}

.addon-icon-default[b-zwi8dut793] {
    background: #f1f5f9;
    color: #475569;
}

.addon-card:hover .addon-icon-circle[b-zwi8dut793] {
    transform: scale(1.05);
}

.addon-title[b-zwi8dut793] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #1e293b;
    margin: 0;
    letter-spacing: -0.01em;
    line-height: 1.25;
}

.addon-desc[b-zwi8dut793] {
    font-size: 0.85rem;
    color: #64748b;
    margin-top: 0.2rem;
    margin-bottom: 0;
    line-height: 1.35;
}

.addon-price-section[b-zwi8dut793] {
    margin-top: 0.75rem;
    margin-bottom: 0.75rem;
}

.addon-price-amount[b-zwi8dut793] {
    font-size: 1.75rem;
    font-weight: 800;
    color: #0f172a;
}

.addon-price-period[b-zwi8dut793] {
    font-size: 0.875rem;
    color: #64748b;
}

/* Reutilización de estilos de planes */
.plan-card[b-zwi8dut793] {
    background: #ffffff;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    padding: 1.5rem;
    position: relative;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
}



.plan-card-header[b-zwi8dut793] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.plan-icon-circle[b-zwi8dut793] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
}

.card-basic .plan-icon-circle[b-zwi8dut793] { background-color: #2563eb; }
.card-professional .plan-icon-circle[b-zwi8dut793] { background-color: #6366f1; }
.card-enterprise .plan-icon-circle[b-zwi8dut793] { background-color: #8b5cf6; }

.plan-title[b-zwi8dut793] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #1e293b;
    margin: 0;
}

.plan-desc[b-zwi8dut793] {
    font-size: 0.875rem;
    color: #64748b;
    margin-top: 0.25rem;
    min-height: 40px;
}

.plan-price-amount[b-zwi8dut793] {
    font-size: 1.75rem;
    font-weight: 800;
    color: #0f172a;
}

.plan-price-period[b-zwi8dut793], .plan-price-yearly[b-zwi8dut793] {
    font-size: 0.875rem;
    color: #64748b;
}

.savings-badge[b-zwi8dut793] {
    display: inline-flex;
    align-items: center;
    background: #ecfdf5;
    color: #047857;
    border: 1px solid #a7f3d0;
    font-size: 0.78rem;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 9999px;
}

.card-divider[b-zwi8dut793] {
    border-top: 1px solid #f1f5f9;
    margin: 0.85rem 0;
}

.plan-section-title[b-zwi8dut793] {
    font-size: 0.75rem;
    font-weight: 700;
    color: #94a3b8;
    letter-spacing: 0.5px;
    margin-bottom: 0.75rem;
}

.plan-limits-grid[b-zwi8dut793] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
}

.limit-card-mini[b-zwi8dut793] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #f8fafc;
    border: 1px solid transparent;
    border-radius: 10px;
    padding: 0.5rem 0.65rem;
    transition: all 0.2s ease-in-out;
    min-width: 0;
    gap: 0.35rem;
}

.limit-card-mini:hover[b-zwi8dut793] {
    background: #ffffff;
    border-color: var(--primary-color, #667eea);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.12);
    transform: translateY(-1px);
}

.limit-card-mini-left[b-zwi8dut793] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    overflow: hidden;
    min-width: 0;
    flex: 1;
}

.limit-mini-avatar[b-zwi8dut793] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #ffffff;
    color: var(--primary-color, #667eea);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

.limit-card-mini:hover .limit-mini-avatar[b-zwi8dut793] {
    background: #f0f3ff;
}

.limit-mini-avatar[b-zwi8dut793]  svg {
    width: 14px;
    height: 14px;
}

.limit-mini-name[b-zwi8dut793] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #475569;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
}

.limit-card-mini:hover .limit-mini-name[b-zwi8dut793] {
    color: #1e293b;
}

.limit-mini-value[b-zwi8dut793] {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--primary-color, #667eea);
    background: #f0f3ff;
    padding: 2px 8px;
    border-radius: 6px;
    flex-shrink: 0;
    min-width: 28px;
    text-align: center;
}

.limit-mini-value.unlimited[b-zwi8dut793] {
    color: #15803d;
    background: #dcfce7;
    font-size: 1rem;
}

.btn-toggle-limits[b-zwi8dut793] {
    background: transparent;
    border: 1px dashed #cbd5e1;
    border-radius: 8px;
    color: var(--primary-color, #667eea);
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.4rem 0.85rem;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

.btn-toggle-limits:hover[b-zwi8dut793] {
    background: #f0f3ff;
    border-color: var(--primary-color, #667eea);
}

/* Cuadrícula de Funcionalidades/Módulos Incluidos */
.plan-features-grid[b-zwi8dut793] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
}

.feature-card-mini[b-zwi8dut793] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: #f8fafc;
    border: 1px solid transparent;
    border-radius: 10px;
    padding: 0.45rem 0.65rem;
    transition: all 0.2s ease-in-out;
}

.feature-card-mini:hover[b-zwi8dut793] {
    background: #ffffff;
    border-color: #22c55e;
    box-shadow: 0 4px 12px rgba(34, 197, 94, 0.12);
    transform: translateY(-1px);
}

.feature-card-mini.benefit-feature:hover[b-zwi8dut793] {
    border-color: #a855f7;
    box-shadow: 0 4px 12px rgba(168, 85, 247, 0.12);
}

.feature-mini-check[b-zwi8dut793] {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.feature-mini-check[b-zwi8dut793]  svg {
    width: 12px;
    height: 12px;
}

.feature-mini-check.form-check-icon[b-zwi8dut793] {
    background-color: #dcfce7;
    color: #15803d;
}

.feature-mini-check.benefit-check-icon[b-zwi8dut793] {
    background-color: #f3e8ff;
    color: #7e22ce;
}

.feature-mini-name[b-zwi8dut793] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #475569;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.feature-card-mini:hover .feature-mini-name[b-zwi8dut793] {
    color: #1e293b;
}

.remaining-features-wrapper[b-zwi8dut793] {
    margin-top: 0.5rem;
}

.remaining-badge[b-zwi8dut793] {
    display: inline-block;
    background: #f1f5f9;
    color: #64748b;
    border-radius: 12px;
    padding: 4px 12px;
    font-size: 0.75rem;
    font-weight: 600;
}

/* Reglas Responsivas Móviles (320px - 576px) */
@media (max-width: 576px) {
    .plans-cards-grid[b-zwi8dut793],
    .addons-cards-grid[b-zwi8dut793] {
        grid-template-columns: 1fr;
    }

    .plan-limits-grid[b-zwi8dut793],
    .plan-features-grid[b-zwi8dut793] {
        grid-template-columns: 1fr;
    }

    .custom-nav-tabs[b-zwi8dut793] {
        display: flex;
        flex-direction: column;
        width: 100%;
    }

    .tab-btn[b-zwi8dut793] {
        width: 100%;
        text-align: center;
    }

    .plan-card[b-zwi8dut793],
    .addon-card[b-zwi8dut793] {
        padding: 0.85rem 1rem;
    }

    .addon-card-header[b-zwi8dut793] {
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .addon-icon-circle[b-zwi8dut793] {
        width: 36px;
        height: 36px;
        font-size: 1.05rem;
        border-radius: 8px;
    }

    .addon-title[b-zwi8dut793] {
        font-size: 1.1rem;
    }

    .addon-desc[b-zwi8dut793] {
        font-size: 0.78rem;
    }

    .addon-card-actions .btn-arregly[b-zwi8dut793] {
        padding: 0.35rem 0.75rem;
        font-size: 0.8rem;
    }

    .addon-card-actions .badge[b-zwi8dut793] {
        padding: 0.35rem 0.65rem !important;
        font-size: 0.75rem !important;
    }

    .addon-price-amount[b-zwi8dut793] {
        font-size: 1.45rem;
    }

    .addon-card .limit-card-mini[b-zwi8dut793],
    .addon-card .feature-card-mini[b-zwi8dut793] {
        padding: 0.5rem 0.75rem;
    }

    .limit-mini-name[b-zwi8dut793],
    .feature-mini-name[b-zwi8dut793] {
        font-size: 0.78rem;
    }

    .limit-mini-value[b-zwi8dut793] {
        font-size: 0.75rem;
        padding: 2px 6px;
    }
}

@media (max-width: 360px) {
    .addon-card[b-zwi8dut793] {
        padding: 0.75rem 0.85rem;
    }

    .addon-title[b-zwi8dut793] {
        font-size: 1.02rem;
    }

    .addon-card-header[b-zwi8dut793] {
        gap: 0.35rem;
    }
}
/* /Pages/SuperAdmin/Addons/Addons.razor.rz.scp.css */
/* Estilos específicos de métricas de Adicionales */

.stats-grid[b-yt0xxytf35] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
}

@media (max-width: 768px) {
    .stats-grid[b-yt0xxytf35] {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        gap: 0.75rem;
        padding-bottom: 0.5rem;
        margin-bottom: 1rem !important;
        scrollbar-width: thin;
    }

    .stats-grid .stat-card[b-yt0xxytf35] {
        flex: 0 0 75%;
        min-width: 220px;
        scroll-snap-align: start;
    }
}

.stat-card[b-yt0xxytf35] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 0.75rem;
    padding: 1.25rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.stat-card-body[b-yt0xxytf35] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.stat-label[b-yt0xxytf35] {
    font-size: 0.875rem;
    color: #64748b;
    font-weight: 500;
}

.stat-value[b-yt0xxytf35] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #0f172a;
    display: block;
    margin-top: 0.25rem;
}

.stat-icon-wrapper[b-yt0xxytf35] {
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
}

.stat-icon-total[b-yt0xxytf35] {
    background: #f1f5f9;
    color: #475569;
}

.stat-icon-active[b-yt0xxytf35] {
    background: #dcfce7;
    color: #166534;
}

.stat-icon-revenue[b-yt0xxytf35] {
    background: #dbeafe;
    color: #1e40af;
}

.truncate-2-lines[b-yt0xxytf35] {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.max-h-350[b-yt0xxytf35] {
    max-height: 350px;
}

.cursor-pointer[b-yt0xxytf35] {
    cursor: pointer;
}

/* Icono de entidad para Adicionales en Grilla */
.grid-addon-icon[b-yt0xxytf35] {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: #f1f5f9;
    color: var(--primary-color, #093d93);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    flex-shrink: 0;
    transition: all 0.2s ease;
}

.grid-addon-icon:hover[b-yt0xxytf35] {
    background: rgba(9, 61, 147, 0.1);
}
/* /Pages/SuperAdmin/Billing/Billing.razor.rz.scp.css */
.dashboard-container[b-relcba7xbq] {
    padding: 1.5rem;
    background-color: #f8f9fa;
    min-height: 100vh;
}

.stats-grid[b-relcba7xbq] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1.25rem;
}

@media (max-width: 768px) {
    .dashboard-container[b-relcba7xbq] {
        padding: 0.75rem;
    }

    .stats-grid[b-relcba7xbq] {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        gap: 0.75rem;
        padding-bottom: 0.5rem;
        margin-bottom: 1rem !important;
        scrollbar-width: thin;
    }

    .stats-grid .stat-card[b-relcba7xbq] {
        flex: 0 0 75%;
        min-width: 220px;
        scroll-snap-align: start;
    }

    [b-relcba7xbq] .toolbar-filters {
        width: 100% !important;
    }

    [b-relcba7xbq] .toolbar-filters .k-dropdownlist {
        width: 100% !important;
    }
}

.stat-card[b-relcba7xbq] {
    background: #ffffff;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
    border: 1px solid rgba(0, 0, 0, 0.05);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.stat-card:hover[b-relcba7xbq] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.stat-card-body[b-relcba7xbq] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.stat-info[b-relcba7xbq] {
    display: flex;
    flex-direction: column;
}

.stat-label[b-relcba7xbq] {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #6c757d;
    letter-spacing: 0.5px;
}

.stat-value[b-relcba7xbq] {
    font-size: 1.6rem;
    font-weight: 800;
    line-height: 1.2;
    margin-top: 0.25rem;
}

.stat-icon-wrapper[b-relcba7xbq] {
    width: 46px;
    height: 46px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
}

.stat-icon-total[b-relcba7xbq] {
    background-color: #dbeafe;
    color: #3b82f6;
}

.stat-icon-active[b-relcba7xbq] {
    background-color: #d1fae5;
    color: #10b981;
}

.stat-icon-warning[b-relcba7xbq] {
    background-color: #ffedd5;
    color: #f97316;
}

.stat-icon-danger[b-relcba7xbq] {
    background-color: #fee2e2;
    color: #ef4444;
}

.stat-value-total[b-relcba7xbq] {
    color: #1f2937;
}

.stat-value-active[b-relcba7xbq] {
    color: #059669;
}

.stat-value-warning[b-relcba7xbq] {
    color: #ea580c;
}

.stat-value-danger[b-relcba7xbq] {
    color: #dc2626;
}

/* Badges de estado */
.modern-badge[b-relcba7xbq] {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.6rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 600;
    line-height: 1;
    text-transform: uppercase;
}

.badge-active[b-relcba7xbq] {
    background-color: #def7ec;
    color: #03543f;
    border: 1px solid #a7f3d0;
}

.badge-expired[b-relcba7xbq] {
    background-color: #fde8e8;
    color: #9b1c1c;
    border: 1px solid #fca5a5;
}

.badge-suspended[b-relcba7xbq] {
    background-color: #fef3c7;
    color: #92400e;
    border: 1px solid #fde68a;
}

.badge-grey[b-relcba7xbq] {
    background-color: #f3f4f6;
    color: #4b5563;
    border: 1px solid #e5e7eb;
}

.badge-pending[b-relcba7xbq] {
    background-color: #e0f2fe;
    color: #0369a1;
    border: 1px solid #bae6fd;
}

[b-relcba7xbq] .grid-row-avatar {
    margin-bottom: 4px !important;
}

/* Espaciado adecuado para la primera columna de la grilla de facturación */
[b-relcba7xbq] .custom-base-grid .k-grid-header th:first-child,
[b-relcba7xbq] .custom-base-grid .k-grid-header .k-table-th:first-child,
[b-relcba7xbq] .custom-base-grid .k-grid-header .k-header:first-child,
[b-relcba7xbq] .custom-base-grid th:first-child {
    padding-left: 24px !important;
    text-align: left !important;
}

[b-relcba7xbq] .custom-base-grid tbody tr > td:first-child,
[b-relcba7xbq] .custom-base-grid tbody tr > .k-table-td:first-child,
[b-relcba7xbq] .custom-base-grid .k-table-row > .k-table-td:first-child,
[b-relcba7xbq] .custom-base-grid td:first-child {
    padding-left: 24px !important;
}
/* /Pages/SuperAdmin/Contacts/Contacts.razor.rz.scp.css */
.dashboard-container[b-s0rp9clpgp] {
    padding: 1rem 0;
    background: transparent;
}

.stats-grid[b-s0rp9clpgp] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.stat-card[b-s0rp9clpgp] {
    background: #ffffff;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
    border: 1px solid #f1f3f5;
    transition: transform 0.2s, box-shadow 0.2s;
}

.stat-card:hover[b-s0rp9clpgp] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
}

.stat-card-body[b-s0rp9clpgp] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.stat-info[b-s0rp9clpgp] {
    display: flex;
    flex-direction: column;
}

.stat-label[b-s0rp9clpgp] {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 500;
}

.stat-value[b-s0rp9clpgp] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #212529;
    margin-top: 0.25rem;
}

.stat-icon-wrapper[b-s0rp9clpgp] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.stat-icon-total[b-s0rp9clpgp] {
    background-color: rgba(9, 61, 147, 0.08);
    color: var(--brand-blue, #093d93);
}

.stat-icon-pending[b-s0rp9clpgp] {
    background-color: #fef3c7;
    color: #d97706;
}

.stat-icon-active[b-s0rp9clpgp] {
    background-color: #dcfce7;
    color: #15803d;
}

.stat-icon-revenue[b-s0rp9clpgp] {
    background-color: #f3e8ff;
    color: #7e22ce;
}

.message-box-preview[b-s0rp9clpgp] {
    max-height: 180px;
    overflow-y: auto;
}
/* /Pages/SuperAdmin/Dashboard/SuperAdminDashboard.razor.rz.scp.css */
/* Contenedor principal sin fondo forzado (transparente) */
.dashboard-container[b-9hj2h7nso8] {
    padding: 1rem 0;
    background: transparent;
    min-height: auto;
}

/* Filtro de período: card de diseño premium (mismo estilo que Sede en Tenant Dashboard) */
.analytics-filters-panel[b-9hj2h7nso8] {
    margin-top: 0;
    margin-bottom: 1.25rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #ffffff;
    border-radius: 16px;
    border: 1px solid #e5e7eb;
    padding: 0.85rem 1.5rem;
    gap: 1rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
}

.analytics-filters-left[b-9hj2h7nso8] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.analytics-filters-icon-container[b-9hj2h7nso8] {
    width: 42px;
    height: 42px;
    background-color: #edf5ed;
    color: #1e4620;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.analytics-filters-icon-container[b-9hj2h7nso8]  .k-svg-icon {
    font-size: 20px;
    width: 20px;
    height: 20px;
}

.analytics-filters-text[b-9hj2h7nso8] {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}

.analytics-filters-title[b-9hj2h7nso8] {
    font-weight: 600;
    color: #111827;
    font-size: 0.95rem;
    line-height: 1.2;
}

.analytics-filters-subtitle[b-9hj2h7nso8] {
    font-size: 0.75rem;
    color: #6b7280;
    line-height: 1.2;
}

.analytics-filters-right[b-9hj2h7nso8] {
    display: flex;
    align-items: center;
}

@media (max-width: 576px) {
    .analytics-filters-panel[b-9hj2h7nso8] {
        margin-top: 0;
        flex-direction: column;
        align-items: stretch;
        padding: 16px;
        gap: 1rem;
    }

    .analytics-filters-right[b-9hj2h7nso8] {
        width: 100%;
    }

    .analytics-filters-right[b-9hj2h7nso8]  .k-dropdownlist {
        width: 100% !important;
    }
}

/* Tarjetas de Estadísticas */
.stats-grid[b-9hj2h7nso8] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
}

@media (max-width: 768px) {
    .stats-grid[b-9hj2h7nso8] {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        gap: 0.75rem;
        padding-bottom: 0.5rem;
        margin-bottom: 1rem !important;
        scrollbar-width: thin;
    }

    .stats-grid .stat-card[b-9hj2h7nso8] {
        flex: 0 0 75%;
        min-width: 220px;
        scroll-snap-align: start;
    }
}

.stat-card[b-9hj2h7nso8] {
    background: #ffffff;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
    border: 1px solid #f1f3f5;
    transition: transform 0.2s, box-shadow 0.2s;
}

.stat-card:hover[b-9hj2h7nso8] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
}

.stat-card-body[b-9hj2h7nso8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.stat-info[b-9hj2h7nso8] {
    display: flex;
    flex-direction: column;
}

.stat-label[b-9hj2h7nso8] {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 500;
}

.stat-value[b-9hj2h7nso8] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #212529;
    margin-top: 0.25rem;
}

.stat-icon-wrapper[b-9hj2h7nso8] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.stat-icon-wrapper[b-9hj2h7nso8]  svg {
    width: 24px;
    height: 24px;
}

/* Colores de Iconos */
.stat-icon-total[b-9hj2h7nso8] {
    background-color: #e0f2fe;
    color: #0284c7;
}

.stat-icon-plans[b-9hj2h7nso8] {
    background-color: rgba(9, 61, 147, 0.08);
    color: var(--brand-blue, #093d93);
}

.stat-icon-active[b-9hj2h7nso8] {
    background-color: #dcfce7;
    color: #15803d;
}

.stat-icon-warning[b-9hj2h7nso8] {
    background-color: #fef3c7;
    color: #d97706;
}

.stat-icon-danger[b-9hj2h7nso8] {
    background-color: #fee2e2;
    color: #dc2626;
}

.text-brand-orange[b-9hj2h7nso8] {
    color: var(--brand-orange, #ed7024) !important;
}

/* Estilos de Tarjeta Moderna */
.modern-card[b-9hj2h7nso8] {
    background: #ffffff;
    border-radius: 16px;
    border: 1px solid #e9ecef;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
    overflow: hidden;
}

.modern-card-header[b-9hj2h7nso8] {
    background: #fafafa;
    border-bottom: 1px solid #f0f0f0;
    padding: 1.1rem 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.modern-card-title h3[b-9hj2h7nso8] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #1e293b;
    margin: 0;
}

.modern-card-header-icon[b-9hj2h7nso8] {
    color: var(--primary-color, #093d93);
}
/* /Pages/SuperAdmin/Plans/PlanForm.razor.rz.scp.css */
/* Dimensiones Fijas del Modal */
.plan-tab-content[b-s2c71h964f] {
    height: 450px;
    overflow-y: auto;
    padding: 1.25rem;
}

/* Sección de Títulos y Separación */
.section-title[b-s2c71h964f] {
    display: flex;
    align-items: center;
    color: var(--text-heading-primary, #09224f);
}

.section-title h4[b-s2c71h964f] {
    margin: 0;
    color: inherit;
}

.section-title[b-s2c71h964f]  svg,
.section-title svg[b-s2c71h964f] {
    color: var(--primary-color, #093d93);
    width: 22px;
    height: 22px;
}

/* Switch personalización */
[b-s2c71h964f] .switch-arregly.k-switch {
    width: 72px !important;
}

[b-s2c71h964f] .switch-arregly .k-switch-label-on,
[b-s2c71h964f] .switch-arregly .k-switch-label-off {
    font-size: 0.7rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    padding: 0 6px !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

[b-s2c71h964f] .k-switch.k-switch-on .k-switch-track,
[b-s2c71h964f] .switch-arregly.k-switch-on .k-switch-track {
    background-color: var(--primary-color, #093d93) !important;
    border-color: var(--primary-color, #093d93) !important;
    box-shadow: none !important;
}

/* Checkbox personalizado */
.checkbox-theme-arregly[b-s2c71h964f] {
    accent-color: var(--primary-color, #093d93);
    width: 18px;
    height: 18px;
    cursor: pointer;
    margin-top: 3px;
}

/* Checklist Módulos y Beneficios */
.tab-instruction-text[b-s2c71h964f] {
    font-size: 0.9rem;
    color: #6c757d;
    margin-bottom: 1.25rem;
}

.modules-checklist-grid[b-s2c71h964f], .benefits-checklist-grid[b-s2c71h964f] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 1rem;
}

.checklist-item-box[b-s2c71h964f] {
    border: 1px solid #dee2e6;
    border-radius: 12px;
    padding: 1rem;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    background: #ffffff;
    transition: all 0.15s;
    cursor: pointer;
}

.checklist-item-box:hover[b-s2c71h964f] {
    border-color: var(--primary-color, #093d93);
    background: #f8fafc;
}

.checklist-item-box.checked[b-s2c71h964f] {
    border-color: var(--primary-color, #093d93);
    background: #eef4ff;
}

.checklist-label-wrapper[b-s2c71h964f] {
    display: flex;
    gap: 12px;
    cursor: pointer;
    flex-grow: 1;
    margin-bottom: 0;
}

.checklist-icon-wrap[b-s2c71h964f] {
    width: 38px;
    height: 38px;
    border-radius: 8px;
    background: #f1f3f5;
    color: #495057;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    flex-shrink: 0;
}

.checked .checklist-icon-wrap[b-s2c71h964f] {
    background: var(--primary-color, #093d93);
    color: #ffffff;
}

.checklist-info[b-s2c71h964f] {
    display: flex;
    flex-direction: column;
}

.checklist-name[b-s2c71h964f] {
    font-weight: 600;
    font-size: 0.92rem;
    color: #212529;
}

.checklist-desc[b-s2c71h964f] {
    font-size: 0.78rem;
    color: #6c757d;
    margin-top: 2px;
    line-height: 1.3;
}

/* Árbol de Capacidades */
.capability-module-group[b-s2c71h964f] {
    background: #f8f9fa;
    border-radius: 12px;
    padding: 1.25rem;
    border: 1px solid #e9ecef;
    width: 100%;
    box-sizing: border-box;
}

.capability-module-header[b-s2c71h964f] {
    display: flex;
    align-items: center;
    gap: 8px;
    border-bottom: 1px solid #dee2e6;
    padding-bottom: 0.5rem;
    margin-bottom: 1rem;
}

.capability-module-header .module-icon[b-s2c71h964f] {
    font-size: 1.2rem;
    color: var(--primary-color, #093d93);
}

.capability-module-header .module-title[b-s2c71h964f] {
    font-weight: 700;
    font-size: 1rem;
    color: #212529;
}

.capability-items-grid[b-s2c71h964f] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 0.75rem;
    width: 100%;
    box-sizing: border-box;
}

.capability-checkbox-card[b-s2c71h964f] {
    background: #ffffff;
    border: 1px solid #dee2e6;
    border-radius: 12px;
    padding: 0.75rem 1rem;
    display: flex;
    align-items: center;
    gap: 12px;
    transition: all 0.15s;
    width: 100%;
    box-sizing: border-box;
}

.capability-checkbox-card:hover[b-s2c71h964f] {
    border-color: var(--primary-color, #093d93);
}

.capability-checkbox-card.checked[b-s2c71h964f] {
    border-color: var(--primary-color, #093d93);
    background: #eef4ff;
}

.capability-label-info[b-s2c71h964f] {
    display: flex;
    flex-direction: column;
    cursor: pointer;
    margin-bottom: 0;
}

.cap-name[b-s2c71h964f] {
    font-weight: 600;
    font-size: 0.85rem;
    color: #212529;
}

.cap-desc[b-s2c71h964f] {
    font-size: 0.75rem;
    color: #6c757d;
    margin-top: 1px;
}

/* Tarjetas de Límites */
.limits-cards-container[b-s2c71h964f] {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
}

.limits-card-item[b-s2c71h964f] {
    background: #ffffff;
    border: 1px solid #dee2e6;
    border-radius: 12px;
    padding: 1rem 1.25rem;
    transition: all 0.15s ease-in-out;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.02);
}

.limits-card-item:hover[b-s2c71h964f] {
    border-color: var(--primary-color, #093d93);
    box-shadow: 0 4px 12px rgba(9, 61, 147, 0.08);
}

.limit-icon-avatar[b-s2c71h964f] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #eef4ff;
    color: var(--primary-color, #093d93);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.limit-card-title[b-s2c71h964f] {
    font-weight: 700;
    font-size: 0.95rem;
    color: #212529;
}

.limit-card-code[b-s2c71h964f] {
    font-size: 0.7rem;
    font-weight: 700;
    color: #6c757d;
    background: #f1f3f5;
    padding: 2px 6px;
    border-radius: 4px;
    letter-spacing: 0.5px;
}

.limit-input-wrap[b-s2c71h964f] {
    min-width: 180px;
}

/* Elementos requeridos en etiquetas */
.required[b-s2c71h964f]::after {
    content: " *";
    color: #dc3545;
}

.form-label[b-s2c71h964f] {
    font-size: 0.85rem;
    font-weight: 600;
    color: #495057;
    margin-bottom: 0.4rem;
}

.empty-tab-state[b-s2c71h964f] {
    color: #6c757d;
}

.loading-caps-placeholder[b-s2c71h964f] {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #6c757d;
    font-size: 0.85rem;
    padding: 1rem 0;
}

@media (max-width: 768px) {
    [b-s2c71h964f] .k-tabstrip-items-wrapper,
    [b-s2c71h964f] .k-tabstrip-items {
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        white-space: nowrap !important;
        width: 100% !important;
    }

    [b-s2c71h964f] .k-tabstrip-items .k-item {
        flex-shrink: 0 !important;
    }
}

@media (max-width: 576px) {
    .plan-tab-content[b-s2c71h964f] {
        padding: 0.75rem !important;
        height: auto !important;
        max-height: 420px !important;
    }
    
    .modules-checklist-grid[b-s2c71h964f], .benefits-checklist-grid[b-s2c71h964f] {
        grid-template-columns: 1fr !important;
    }

    .checklist-item-box[b-s2c71h964f] {
        width: 100% !important;
        box-sizing: border-box;
    }
}

/* Estilos Arregly para Tabla Desktop */
[b-s2c71h964f] .table-arregly {
    width: 100%;
    margin: 0;
    border-collapse: separate;
    border-spacing: 0;
}

[b-s2c71h964f] .table-arregly thead th {
    background-color: #f8fafc;
    color: #475569;
    font-weight: 700;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 10px 14px;
    border-bottom: 2px solid #e2e8f0;
}

[b-s2c71h964f] .table-arregly tbody td {
    padding: 12px 14px;
    border-bottom: 1px solid #f1f5f9;
    color: #1e293b;
    vertical-align: middle;
    transition: background-color 0.15s ease;
}

[b-s2c71h964f] .table-arregly tbody tr:hover td {
    background-color: #f8fafc;
}

[b-s2c71h964f] .table-arregly tbody tr:last-child td {
    border-bottom: none;
}

[b-s2c71h964f] .table-arregly tbody tr.editing-row td {
    background-color: #eef4ff !important;
}

[b-s2c71h964f] .table-arregly tbody tr.editing-row td:first-child {
    border-left: 4px solid var(--primary-color, #093d93);
}

[b-s2c71h964f] .btn-action-circle {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    padding: 0;
}

[b-s2c71h964f] .btn-action-circle svg {
    width: 15px;
    height: 15px;
}

[b-s2c71h964f] .btn-action-edit {
    background-color: #eef4ff;
    color: var(--primary-color, #093d93);
}

[b-s2c71h964f] .btn-action-edit:hover {
    background-color: var(--primary-color, #093d93);
    color: #ffffff;
    transform: scale(1.1);
    box-shadow: 0 4px 10px rgba(9, 61, 147, 0.25);
}

[b-s2c71h964f] .btn-action-delete {
    background-color: #fef2f2;
    color: #dc2626;
}

[b-s2c71h964f] .btn-action-delete:hover {
    background-color: #dc2626;
    color: #ffffff;
    transform: scale(1.1);
    box-shadow: 0 4px 10px rgba(220, 38, 38, 0.25);
}

[b-s2c71h964f] .btn-action-view {
    background-color: #f1f5f9;
    color: #94a3b8;
}
/* /Pages/SuperAdmin/Plans/Plans.razor.rz.scp.css */
/* Contenedor principal sin fondo forzado (transparente) */
.dashboard-container[b-gjvw4zy5mr] {
    padding: 1rem 0;
    background: transparent;
    min-height: auto;
}

/* Tarjetas de Estadísticas */
.stats-grid[b-gjvw4zy5mr] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
}

@media (max-width: 768px) {
    .stats-grid[b-gjvw4zy5mr] {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        gap: 0.75rem;
        padding-bottom: 0.5rem;
        margin-bottom: 1rem !important;
        scrollbar-width: thin;
    }

    .stats-grid .stat-card[b-gjvw4zy5mr] {
        flex: 0 0 75%;
        min-width: 220px;
        scroll-snap-align: start;
    }
}

.stat-card[b-gjvw4zy5mr] {
    background: #ffffff;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
    border: 1px solid #f1f3f5;
    transition: transform 0.2s, box-shadow 0.2s;
}

.stat-card:hover[b-gjvw4zy5mr] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
}

.stat-card-body[b-gjvw4zy5mr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.stat-info[b-gjvw4zy5mr] {
    display: flex;
    flex-direction: column;
}

.stat-label[b-gjvw4zy5mr] {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 500;
}

.stat-value[b-gjvw4zy5mr] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #212529;
    margin-top: 0.25rem;
}

.stat-icon-wrapper[b-gjvw4zy5mr] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.stat-icon-wrapper[b-gjvw4zy5mr]  svg {
    width: 24px;
    height: 24px;
}

/* Colores de Iconos de Estadísticas */
.stat-icon-plans[b-gjvw4zy5mr] {
    background-color: rgba(9, 61, 147, 0.08);
    color: var(--brand-blue, #093d93);
}

.stat-icon-users[b-gjvw4zy5mr] {
    background-color: #dcfce7;
    color: #15803d;
}

.stat-icon-mrr[b-gjvw4zy5mr] {
    background-color: #fff7ed;
    color: var(--brand-orange, #ed7024);
}

.stat-icon-arpu[b-gjvw4zy5mr] {
    background-color: #ffedd5;
    color: #c2410c;
}

/* Grid de Tarjetas de Planes */
.plans-cards-grid[b-gjvw4zy5mr] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
}

@media (max-width: 1200px) {
    .plans-cards-grid[b-gjvw4zy5mr] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .plans-cards-grid[b-gjvw4zy5mr] {
        grid-template-columns: 1fr;
    }
}

/* Tarjeta del Plan */
.plan-card[b-gjvw4zy5mr] {
    background: #ffffff;
    border-radius: 16px;
    border: 1px solid #e9ecef;
    padding: 1.75rem;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.04);
    display: flex;
    flex-direction: column;
    position: relative;
    transition: transform 0.2s, box-shadow 0.2s;
    min-height: 560px;
}

.plan-card:hover[b-gjvw4zy5mr] {
    transform: translateY(-4px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08);
}

.plan-inactive[b-gjvw4zy5mr] {
    opacity: 0.7;
}

.plan-card.card-professional[b-gjvw4zy5mr] {
    border: 2px solid var(--primary-color, #093d93);
    border-top: 4px solid var(--primary-color, #093d93);
}

.plan-card.card-enterprise[b-gjvw4zy5mr] {
    border-top: 4px solid var(--brand-orange, #ed7024);
}



/* Cabecera de Tarjeta */
.plan-card-header[b-gjvw4zy5mr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1rem;
}

.plan-icon-circle[b-gjvw4zy5mr] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #ffffff;
}

.card-basic .plan-icon-circle[b-gjvw4zy5mr] {
    background-color: #2563eb;
}

.card-professional .plan-icon-circle[b-gjvw4zy5mr] {
    background-color: var(--primary-color, #093d93);
}

.card-enterprise .plan-icon-circle[b-gjvw4zy5mr] {
    background-color: var(--brand-orange, #ed7024);
}

.plan-icon-circle[b-gjvw4zy5mr]  svg {
    width: 24px;
    height: 24px;
}

.plan-card-actions[b-gjvw4zy5mr] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.switch-wrapper[b-gjvw4zy5mr] {
    display: flex;
    align-items: center;
}

/* Color y formateo del Switch heredando var(--primary-color) del sistema */
[b-gjvw4zy5mr] .switch-arregly.k-switch {
    width: 72px !important;
}

[b-gjvw4zy5mr] .switch-arregly .k-switch-label-on,
[b-gjvw4zy5mr] .switch-arregly .k-switch-label-off {
    font-size: 0.7rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    padding: 0 6px !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
}

[b-gjvw4zy5mr] .k-switch.k-switch-on .k-switch-track,
[b-gjvw4zy5mr] .switch-arregly.k-switch-on .k-switch-track {
    background-color: var(--primary-color, #093d93) !important;
    border-color: var(--primary-color, #093d93) !important;
    box-shadow: none !important;
}

[b-gjvw4zy5mr] .k-switch .k-switch-track {
    box-shadow: none !important;
}

/* Botón de lápiz sin cuadro/borde enmarcado */
.plan-action-btn[b-gjvw4zy5mr] {
    width: auto !important;
    height: auto !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 4px !important;
    color: #6b7280;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: color 0.15s ease, transform 0.15s ease;
}

.plan-action-btn:hover[b-gjvw4zy5mr] {
    background: transparent !important;
    color: var(--primary-color, #093d93) !important;
    border: none !important;
    box-shadow: none !important;
    transform: scale(1.15);
}

/* Contenido de Tarjeta */
.plan-title[b-gjvw4zy5mr] {
    font-size: 1.35rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 0.25rem 0;
}

.plan-desc[b-gjvw4zy5mr] {
    font-size: 0.88rem;
    color: #6b7280;
    margin: 0;
    line-height: 1.4;
    min-height: 40px;
}

.plan-price-section[b-gjvw4zy5mr] {
    margin-top: 1rem;
}

.plan-price-amount[b-gjvw4zy5mr] {
    font-size: 2rem;
    font-weight: 800;
    color: #111827;
}

.plan-price-period[b-gjvw4zy5mr] {
    font-size: 0.9rem;
    color: #6b7280;
    font-weight: 600;
}

.plan-price-yearly[b-gjvw4zy5mr] {
    font-size: 0.84rem;
    color: #4b5563;
    margin-top: 4px;
}

.discount-badge[b-gjvw4zy5mr] {
    color: #16a34a;
    font-weight: 600;
    background: #f0fdf4;
    padding: 2px 6px;
    border-radius: 4px;
}

.savings-badge[b-gjvw4zy5mr] {
    display: inline-flex;
    align-items: center;
    background: #ecfdf5;
    color: #047857;
    border: 1px solid #a7f3d0;
    font-size: 0.78rem;
    font-weight: 700;
    padding: 3px 10px;
    border-radius: 9999px;
}

.badge-popular[b-gjvw4zy5mr] {
    background: #ffedd5 !important;
    color: #c2410c !important;
    border: 1px solid #fed7aa !important;
    font-weight: 600 !important;
    font-size: 0.75rem;
    padding: 3px 10px;
    border-radius: 20px;
}

.card-divider[b-gjvw4zy5mr] {
    border: 0;
    border-top: 1px solid #f1f5f9;
    margin: 1rem 0;
}

.plan-section-title[b-gjvw4zy5mr] {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #9ca3af;
    letter-spacing: 0.5px;
    margin-bottom: 0.75rem;
    display: flex;
    align-items: center;
}

/* Límites en Mini Tarjetas */
.plan-limits-grid[b-gjvw4zy5mr] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
}

/* Botón Ver más / Ver menos para límites cuantitativos */
.btn-toggle-limits[b-gjvw4zy5mr] {
    background: transparent;
    border: 1px dashed #cbd5e1;
    border-radius: 8px;
    color: var(--primary-color, #093d93);
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.4rem 0.85rem;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

.btn-toggle-limits:hover[b-gjvw4zy5mr] {
    background: #eef4ff;
    border-color: var(--primary-color, #093d93);
    color: var(--primary-color, #093d93);
    transform: translateY(-1px);
}

.limit-card-mini[b-gjvw4zy5mr] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #f8fafc;
    border: 1px solid transparent;
    border-radius: 10px;
    padding: 0.5rem 0.65rem;
    transition: all 0.2s ease-in-out;
}

.limit-card-mini:hover[b-gjvw4zy5mr] {
    background: #ffffff;
    border-color: var(--primary-color, #093d93);
    box-shadow: 0 4px 12px rgba(9, 61, 147, 0.12);
    transform: translateY(-1px);
}

.limit-card-mini-left[b-gjvw4zy5mr] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    overflow: hidden;
}

.limit-mini-avatar[b-gjvw4zy5mr] {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #ffffff;
    color: var(--primary-color, #093d93);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 1px 3px rgba(0,0,0,0.06);
}

.limit-card-mini:hover .limit-mini-avatar[b-gjvw4zy5mr] {
    background: #f0f3ff;
}

.limit-mini-avatar[b-gjvw4zy5mr]  svg {
    width: 14px;
    height: 14px;
}

.limit-mini-name[b-gjvw4zy5mr] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #475569;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.limit-card-mini:hover .limit-mini-name[b-gjvw4zy5mr] {
    color: #1e293b;
}

.limit-mini-value[b-gjvw4zy5mr] {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--primary-color, #093d93);
    background: #eef4ff;
    padding: 2px 8px;
    border-radius: 6px;
    flex-shrink: 0;
    min-width: 28px;
    text-align: center;
}

.limit-mini-value.unlimited[b-gjvw4zy5mr] {
    color: #15803d;
    background: #dcfce7;
    font-size: 1rem;
}

/* Cuadrícula de Funcionalidades/Módulos Incluidos */
.plan-features-grid[b-gjvw4zy5mr] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
}

.feature-card-mini[b-gjvw4zy5mr] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    background: #f8fafc;
    border: 1px solid transparent;
    border-radius: 10px;
    padding: 0.45rem 0.65rem;
    transition: all 0.2s ease-in-out;
}

.feature-card-mini:hover[b-gjvw4zy5mr] {
    background: #ffffff;
    border-color: #22c55e;
    box-shadow: 0 4px 12px rgba(34, 197, 94, 0.12);
    transform: translateY(-1px);
}

.feature-card-mini.benefit-feature:hover[b-gjvw4zy5mr] {
    border-color: #a855f7;
    box-shadow: 0 4px 12px rgba(168, 85, 247, 0.12);
}

.feature-mini-check[b-gjvw4zy5mr] {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.feature-mini-check[b-gjvw4zy5mr]  svg {
    width: 12px;
    height: 12px;
}

.feature-mini-check.form-check-icon[b-gjvw4zy5mr] {
    background-color: #dcfce7;
    color: #15803d;
}

.feature-mini-check.benefit-check-icon[b-gjvw4zy5mr] {
    background-color: #f3e8ff;
    color: #7e22ce;
}

.feature-mini-name[b-gjvw4zy5mr] {
    font-size: 0.8rem;
    font-weight: 600;
    color: #475569;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.feature-card-mini:hover .feature-mini-name[b-gjvw4zy5mr] {
    color: #1e293b;
}

.remaining-features-wrapper[b-gjvw4zy5mr] {
    display: flex;
    justify-content: center;
}

.remaining-badge[b-gjvw4zy5mr] {
    font-weight: 600;
    color: #6b7280;
    font-size: 0.8rem;
    background: #f3f4f6;
    padding: 4px 12px;
    border-radius: 999px;
    display: inline-block;
}

/* Footer de Tarjeta */
.plan-card-footer[b-gjvw4zy5mr] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #f1f5f9;
    padding-top: 1rem;
    margin-top: 1rem;
}

.subscribers-pill[b-gjvw4zy5mr] {
    display: flex;
    align-items: center;
    gap: 6px;
    background: #f1f5f9;
    padding: 4px 10px 4px 8px;
    border-radius: 999px;
    font-size: 0.8rem;
}

.subscribers-pill .subscribers-icon[b-gjvw4zy5mr] {
    color: #64748b;
    width: 15px;
    height: 15px;
}

.subscribers-label[b-gjvw4zy5mr] {
    font-weight: 600;
    color: #475569;
}

.subscribers-count-badge[b-gjvw4zy5mr] {
    background: #ffffff;
    color: #0f172a;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 999px;
    font-size: 0.75rem;
    box-shadow: 0 1px 2px rgba(0,0,0,0.06);
}

.status-badge-pill[b-gjvw4zy5mr] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 600;
}

.status-badge-pill.active[b-gjvw4zy5mr] {
    background: #f0fdf4;
    color: #166534;
    border: 1px solid #bbf7d0;
}

.status-badge-pill.inactive[b-gjvw4zy5mr] {
    background: #f8fafc;
    color: #64748b;
    border: 1px solid #e2e8f0;
}

.status-pulse-dot[b-gjvw4zy5mr] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    display: inline-block;
}

.status-badge-pill.active .status-pulse-dot[b-gjvw4zy5mr] {
    background-color: #22c55e;
    box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.2);
}

.status-badge-pill.inactive .status-pulse-dot[b-gjvw4zy5mr] {
    background-color: #94a3b8;
}

/* Responsivo para Dispositivos Móviles */
@media (max-width: 576px) {
    .plan-card[b-gjvw4zy5mr] {
        padding: 1.15rem;
    }

    .plan-limits-grid[b-gjvw4zy5mr],
    .plan-features-grid[b-gjvw4zy5mr] {
        grid-template-columns: 1fr;
        gap: 0.45rem;
    }

    .limit-card-mini[b-gjvw4zy5mr],
    .feature-card-mini[b-gjvw4zy5mr] {
        padding: 0.5rem 0.75rem;
    }
}
/* /Pages/SuperAdmin/Reports/Reports.razor.rz.scp.css */
/* Contenedor principal sin fondo forzado (transparente) */
.dashboard-container[b-invxuts66g] {
    padding: 1rem 0;
    background: transparent;
    min-height: auto;
}

/* Tarjetas de Estadísticas */
.stats-grid[b-invxuts66g] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
    margin-bottom: 2rem;
}

@media (max-width: 768px) {
    .stats-grid[b-invxuts66g] {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        gap: 0.75rem;
        padding-bottom: 0.5rem;
        margin-bottom: 1rem !important;
        scrollbar-width: thin;
    }

    .stats-grid .stat-card[b-invxuts66g] {
        flex: 0 0 75%;
        min-width: 220px;
        scroll-snap-align: start;
    }
}

.stat-card[b-invxuts66g] {
    background: #ffffff;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
    border: 1px solid #f1f3f5;
    transition: transform 0.2s, box-shadow 0.2s;
}

.stat-card:hover[b-invxuts66g] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
}

.stat-card-body[b-invxuts66g] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.stat-info[b-invxuts66g] {
    display: flex;
    flex-direction: column;
}

.stat-label[b-invxuts66g] {
    font-size: 0.85rem;
    color: #6c757d;
    font-weight: 500;
}

.stat-value[b-invxuts66g] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #212529;
    margin-top: 0.25rem;
}

.stat-icon-wrapper[b-invxuts66g] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.stat-icon-wrapper[b-invxuts66g]  svg {
    width: 24px;
    height: 24px;
}

/* Colores de Iconos */
.stat-icon-total[b-invxuts66g] {
    background-color: #e0f2fe;
    color: #0284c7;
}

.stat-icon-plans[b-invxuts66g] {
    background-color: rgba(9, 61, 147, 0.08);
    color: var(--brand-blue, #093d93);
}

.stat-icon-active[b-invxuts66g] {
    background-color: #dcfce7;
    color: #15803d;
}

.stat-icon-warning[b-invxuts66g] {
    background-color: #fef3c7;
    color: #d97706;
}

.stat-icon-danger[b-invxuts66g] {
    background-color: #fee2e2;
    color: #dc2626;
}

/* Estilos de Tarjeta Moderna */
.modern-card[b-invxuts66g] {
    background: #ffffff;
    border-radius: 16px;
    border: 1px solid #e9ecef;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
    overflow: hidden;
    transition: box-shadow 0.3s ease;
}

.modern-card:hover[b-invxuts66g] {
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.06);
}

.modern-card-header[b-invxuts66g] {
    background: #fafafa;
    border-bottom: 1px solid #f0f0f0;
    padding: 1.1rem 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.modern-card-title h3[b-invxuts66g] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #1e293b;
    margin: 0;
}

.modern-card-header-icon[b-invxuts66g] {
    color: var(--primary-color, #093d93);
}

/* Estilos Leaderboard */
.rank-avatar[b-invxuts66g] {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 0.85rem;
    transition: transform 0.2s ease;
}

.rank-1[b-invxuts66g] {
    background: linear-gradient(135deg, #ffd700 0%, #ffa500 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(255, 215, 0, 0.4);
}

.rank-2[b-invxuts66g] {
    background: linear-gradient(135deg, #c0c0c0 0%, #808080 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(192, 192, 192, 0.4);
}

.rank-3[b-invxuts66g] {
    background: linear-gradient(135deg, #cd7f32 0%, #8b4513 100%) !important;
    color: #ffffff !important;
    box-shadow: 0 2px 8px rgba(205, 127, 50, 0.4);
}

.rank-default[b-invxuts66g] {
    background-color: #f1f3f5;
    color: #6c757d;
}

.leaderboard-item[b-invxuts66g] {
    transition: background-color 0.2s ease, transform 0.2s ease;
    border-radius: 8px;
    padding: 0.5rem;
}

.leaderboard-item:hover[b-invxuts66g] {
    background-color: #f8fafc;
    transform: translateX(4px);
}

/* Modern Progress bars */
.custom-progress[b-invxuts66g] {
    height: 8px;
    background-color: #f1f5f9;
    border-radius: 999px;
    overflow: hidden;
}

.custom-progress-bar[b-invxuts66g] {
    height: 100%;
    border-radius: 999px;
    transition: width 0.6s ease;
}

/* Estilos de Mapa Interactivo */
.map-card-container[b-invxuts66g] {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.map-toggle-group[b-invxuts66g] {
    display: flex;
    background-color: #f1f5f9;
    padding: 4px;
    border-radius: 8px;
}

.map-toggle-btn[b-invxuts66g] {
    border: none;
    background: transparent;
    padding: 6px 12px;
    font-size: 0.8rem;
    font-weight: 600;
    color: #64748b;
    border-radius: 6px;
    transition: all 0.2s ease;
}

.map-toggle-btn.active[b-invxuts66g] {
    background-color: #ffffff;
    color: var(--primary-color, #093d93);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.map-visual-wrapper[b-invxuts66g] {
    position: relative;
    width: 100%;
    height: 280px;
    background-color: #f8fafc;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.map-svg-bg[b-invxuts66g] {
    width: 90%;
    height: 90%;
    opacity: 0.95;
}

.map-svg-bg path[b-invxuts66g] {
    fill: #cbd5e1;
    stroke: #ffffff;
    stroke-width: 1.5;
    transition: fill 0.3s ease;
}

.map-svg-bg path:hover[b-invxuts66g] {
    fill: #94a3b8;
}

.map-pins-layer[b-invxuts66g] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

.map-pin[b-invxuts66g] {
    position: absolute;
    width: 14px;
    height: 14px;
    background: radial-gradient(circle, #ff3366 0%, #cc0033 100%);
    border: 2px solid #ffffff;
    border-radius: 50%;
    transform: translate(-50%, -50%);
    box-shadow: 0 0 8px rgba(204, 0, 51, 0.6);
    cursor: pointer;
    pointer-events: auto;
    z-index: 10;
}

.pin-radar[b-invxuts66g] {
    position: absolute;
    top: -5px;
    left: -5px;
    width: 20px;
    height: 20px;
    border: 2px solid #ff3366;
    border-radius: 50%;
    animation: map-pulse-b-invxuts66g 2s infinite ease-out;
    opacity: 0;
    pointer-events: none;
}

@keyframes map-pulse-b-invxuts66g {
    0% {
        transform: scale(0.5);
        opacity: 0;
    }
    50% {
        opacity: 0.5;
    }
    100% {
        transform: scale(2.5);
        opacity: 0;
    }
}

/* Tooltip personalizado */
.map-pin-tooltip[b-invxuts66g] {
    visibility: hidden;
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    background-color: #1e293b;
    color: #ffffff;
    padding: 6px 10px;
    border-radius: 6px;
    font-size: 0.75rem;
    white-space: nowrap;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    z-index: 20;
    opacity: 0;
    transition: opacity 0.2s ease, visibility 0.2s ease;
    pointer-events: none;
}

.map-pin:hover .map-pin-tooltip[b-invxuts66g] {
    visibility: visible;
    opacity: 1;
}

.map-pin-tooltip[b-invxuts66g]::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #1e293b transparent transparent transparent;
}

/* Clases específicas del Mockup */
.geo-header-icon-wrapper[b-invxuts66g] {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    background-color: #f0fdf4;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #10b981;
}

.geo-header-icon-wrapper[b-invxuts66g]  svg {
    width: 24px;
    height: 24px;
}

.geo-progress-container[b-invxuts66g] {
    width: 100%;
}

.geo-progress-bar-thick[b-invxuts66g] {
    height: 12px;
    background-color: #e2e8f0;
    border-radius: 999px;
    overflow: hidden;
    flex-grow: 1;
}

.geo-progress-bar-fill[b-invxuts66g] {
    height: 100%;
    background-color: #10b981;
    border-radius: 999px;
    transition: width 0.6s ease;
}

.geo-highlight-box[b-invxuts66g] {
    background-color: #f8fafc;
    border: 1px solid #f1f5f9;
    border-radius: 16px;
    padding: 1.5rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 180px;
    position: relative;
}

.geo-highlight-left[b-invxuts66g] {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    flex: 1;
}

.geo-highlight-icon[b-invxuts66g] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background-color: #10b981;
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.geo-highlight-icon[b-invxuts66g]  svg {
    width: 24px;
    height: 24px;
}

.geo-map-right[b-invxuts66g] {
    width: 220px;
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    flex-shrink: 0;
}

.geo-map-right .map-svg-bg[b-invxuts66g] {
    width: 100%;
    height: 100%;
    opacity: 1;
}

.geo-map-right .map-svg-bg path[b-invxuts66g] {
    fill: #10b981;
    fill-opacity: 0.85;
    stroke: #ffffff;
    stroke-width: 1.2;
}

.geo-map-right .map-svg-bg-world path[b-invxuts66g] {
    fill: #cbd5e1;
    fill-opacity: 0.5;
}

.geo-map-right .map-svg-bg-world path.highlight-world[b-invxuts66g] {
    fill: #10b981;
    fill-opacity: 0.85;
}



/* /Pages/SuperAdmin/Subscriptions/Subscriptions.razor.rz.scp.css */
.subscriptions-container[b-iixc9pc7f0] {
    padding: 1.5rem;
}

.subscriptions-title[b-iixc9pc7f0] {
    font-weight: 700;
    color: #2e1065;
}

/* Stats Cards Grid */
.stats-grid[b-iixc9pc7f0] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1.25rem;
}

@media (max-width: 768px) {
    .stats-grid[b-iixc9pc7f0] {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        gap: 0.75rem;
        padding-bottom: 0.5rem;
        margin-bottom: 1rem !important;
        scrollbar-width: thin;
    }

    .stats-grid .stat-card[b-iixc9pc7f0] {
        flex: 0 0 75%;
        min-width: 220px;
        scroll-snap-align: start;
    }
}

.stat-card[b-iixc9pc7f0] {
    background: #ffffff;
    border: 1px solid #f1f2f6;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03);
    transition: transform 0.2s, box-shadow 0.2s;
}

.stat-card:hover[b-iixc9pc7f0] {
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.08), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.stat-card-body[b-iixc9pc7f0] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.stat-info[b-iixc9pc7f0] {
    display: flex;
    flex-direction: column;
}

.stat-label[b-iixc9pc7f0] {
    font-size: 0.8rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6b7280;
    margin-bottom: 0.25rem;
}

.stat-value[b-iixc9pc7f0] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1f2937;
}

.stat-icon-wrapper[b-iixc9pc7f0] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
}

/* Icons styling */
.stat-icon-total[b-iixc9pc7f0] {
    background-color: #f3e8ff;
    color: #6b21a8;
}

.stat-icon-active[b-iixc9pc7f0] {
    background-color: #def7ec;
    color: #03543f;
}

.stat-icon-expired[b-iixc9pc7f0] {
    background-color: #fde8e8;
    color: #9b1c1c;
}

.stat-icon-suspended[b-iixc9pc7f0] {
    background-color: #fef3c7;
    color: #92400e;
}

.stat-icon-revenue[b-iixc9pc7f0] {
    background-color: #e0f2fe;
    color: #0369a1;
}

/* Table and Grids styling */
.table-container[b-iixc9pc7f0] {
    background: #ffffff;
    border: 1px solid #e6e8ef;
    border-radius: 12px;
    padding: 1.25rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.02);
}

/* Tenant logo and info cell */
.tenant-cell[b-iixc9pc7f0] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.tenant-logo-placeholder[b-iixc9pc7f0] {
    width: 38px;
    height: 38px;
    border-radius: 8px;
    background-color: #f9fafb;
    border: 1px solid #e5e7eb;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.tenant-logo-img[b-iixc9pc7f0] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tenant-logo-icon[b-iixc9pc7f0] {
    font-size: 1.1rem;
    color: #9ca3af;
}

.tenant-info[b-iixc9pc7f0] {
    display: flex;
    flex-direction: column;
}

.tenant-name[b-iixc9pc7f0] {
    font-size: 0.9rem;
    color: #1f2937;
}

.tenant-city[b-iixc9pc7f0] {
    font-size: 0.75rem;
    color: #6b7280;
}

/* Badges de planes */
[b-iixc9pc7f0] .badge-theme {
    display: inline-flex !important;
    align-items: center !important;
    padding: 4px 10px !important;
    border-radius: 20px !important;
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
}

[b-iixc9pc7f0] .badge-theme-theme {
    background: #f3e8ff !important;
    color: #6b21a8 !important;
}

[b-iixc9pc7f0] .badge-theme-success {
    background: #def7ec !important;
    color: #03543f !important;
}

[b-iixc9pc7f0] .badge-theme-warning {
    background: #ffedd5 !important;
    color: #ea580c !important;
}

[b-iixc9pc7f0] .badge-theme-neutral {
    background: #f3f4f6 !important;
    color: #4b5563 !important;
}

[b-iixc9pc7f0] .custom-plan-badge {
    padding: 0.15rem 0.4rem !important;
    border-radius: 4px !important;
    font-size: 0.7rem !important;
    font-weight: 700 !important;
    background-color: #ffedd5 !important;
    color: #ea580c !important;
    text-transform: uppercase !important;
}

/* Badges de estado estilo Productos */
[b-iixc9pc7f0] .status-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 4px 10px !important;
    border-radius: 999px !important;
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    white-space: nowrap !important;
    text-transform: capitalize !important;
}

[b-iixc9pc7f0] .status-active {
    background: #def7ec !important;
    color: #03543f !important;
}

[b-iixc9pc7f0] .status-inactive {
    background: #fde8e8 !important;
    color: #9b1c1c !important;
}

[b-iixc9pc7f0] .status-warning {
    background: #fef3c7 !important;
    color: #92400e !important;
}

[b-iixc9pc7f0] .status-dot {
    width: 8px !important;
    height: 8px !important;
    border-radius: 50% !important;
    flex-shrink: 0 !important;
}

[b-iixc9pc7f0] .status-active .status-dot {
    background: #31c48d !important;
}

[b-iixc9pc7f0] .status-inactive .status-dot {
    background: #f05252 !important;
}

[b-iixc9pc7f0] .status-warning .status-dot {
    background: #f59e0b !important;
}

/* Espaciado del avatar de empresa en tarjetas */
[b-iixc9pc7f0] .grid-row-avatar {
    margin-bottom: 4px !important;
}
/* /Pages/SystemStatus/SystemStatus.razor.rz.scp.css */
/* ==========================================================================
   Aurocore — System Status: Calm UX & Liquid Glass (2026)
   High-Availability, Subtle Toning, Mobile-First
   ========================================================================== */

.status-page[b-zya2ts8hma] {
    --glass-bg: rgba(255, 255, 255, 0.88);
    --glass-border: rgba(226, 232, 240, 0.9);
    --glass-specular: inset 0 1px 0 rgba(255, 255, 255, 0.9);
    --glass-shadow: 0 10px 30px -6px rgba(9, 61, 147, 0.05);
    --glass-shadow-hover: 0 16px 36px -6px rgba(9, 61, 147, 0.12);

    --brand-blue: #093d93;
    --brand-blue-light: #1a5bc4;
    --brand-orange: #ed7024;
    --brand-orange-light: #fd8c1d;

    --slate-900: #09224f;
    --slate-800: #13376b;
    --slate-700: #1e3a5f;
    --slate-600: #2c4d75;
    --slate-500: #476487;
    --slate-200: #e2e8f0;
    --slate-100: #f1f5f9;
    --slate-50: #f8fafc;

    --ease-spring: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-smooth: cubic-bezier(0.4, 0, 0.2, 1);

    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: #f8fafc;
    color: var(--text-heading-primary, #09224f);
    font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

.status-main[b-zya2ts8hma] { flex: 1 0 auto; width: 100%; }

.status-container[b-zya2ts8hma] {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 clamp(1rem, 3vw, 2rem);
}

/* Hero */
.status-hero[b-zya2ts8hma] {
    position: relative;
    padding: clamp(7rem, 14vw, 9rem) 0 clamp(3rem, 5vw, 4rem);
    background-color: #f8fafc;
    overflow: hidden;
}

.hero-ambient-mesh[b-zya2ts8hma] {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    overflow: hidden;
}

.mesh-orb[b-zya2ts8hma] {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.5;
    will-change: transform;
}

.orb-blue-primary[b-zya2ts8hma] {
    top: -15%;
    left: 15%;
    width: clamp(300px, 40vw, 600px);
    height: clamp(300px, 40vw, 600px);
    background: radial-gradient(circle, rgba(9, 61, 147, 0.08) 0%, transparent 70%);
}

.orb-blue-secondary[b-zya2ts8hma] {
    bottom: -15%;
    right: 15%;
    width: clamp(250px, 35vw, 500px);
    height: clamp(250px, 35vw, 500px);
    background: radial-gradient(circle, rgba(44, 77, 117, 0.06) 0%, transparent 70%);
}

.hero-grid-pattern[b-zya2ts8hma] {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(9, 61, 147, 0.04) 1px, transparent 1px);
    background-size: 32px 32px;
    pointer-events: none;
    z-index: 0;
}

.hero-header[b-zya2ts8hma] {
    position: relative;
    z-index: 1;
    max-width: 800px;
    margin: 0 auto;
}

.hero-badge[b-zya2ts8hma] {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.45rem 1rem;
    border-radius: 100px;
    background: rgba(255, 255, 255, 0.88);
    border: 1px solid rgba(226, 232, 240, 0.9);
    box-shadow: 0 4px 16px -4px rgba(9, 61, 147, 0.06);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    font-size: 0.82rem;
    font-weight: 500;
    color: var(--text-body-lead, #2c4d75);
    margin-bottom: 1.5rem;
}

.badge-dot-blue[b-zya2ts8hma] {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--brand-blue, #093d93);
    box-shadow: 0 0 6px rgba(9, 61, 147, 0.35);
}

.badge-separator[b-zya2ts8hma] { color: var(--slate-200); font-weight: 300; }
.badge-subtext[b-zya2ts8hma] { color: var(--brand-blue, #093d93); font-weight: 600; }

.hero-title[b-zya2ts8hma] {
    font-size: clamp(2rem, 5vw, 3.25rem);
    font-weight: 800;
    line-height: 1.15;
    color: var(--text-heading-primary, #09224f) !important;
    margin: 0 0 1.25rem;
    letter-spacing: -0.02em;
}

.highlight-orange[b-zya2ts8hma] {
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.hero-lead[b-zya2ts8hma] {
    font-size: clamp(1rem, 2vw, 1.18rem);
    color: var(--text-body-lead, #2c4d75) !important;
    line-height: 1.7;
    margin: 0 0 2.5rem;
}

/* Operational Banner — Calm UX Liquid Glass */
.main-status-banner[b-zya2ts8hma] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.25rem;
    padding: 1.4rem 2rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(226, 232, 240, 0.9);
    box-shadow: 0 10px 30px -6px rgba(9, 61, 147, 0.05), inset 0 1px 0 rgba(255, 255, 255, 0.9);
    max-width: 620px;
    margin: 0 auto;
}

.status-indicator-pulsing[b-zya2ts8hma] {
    position: relative;
    width: 18px;
    height: 18px;
    flex-shrink: 0;
}

.pulse-dot[b-zya2ts8hma] {
    position: absolute;
    top: 4px;
    left: 4px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #0ea5e9;
}

.pulse-ring[b-zya2ts8hma] {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid #0ea5e9;
    animation: statusRing-b-zya2ts8hma 2.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) infinite;
}

@keyframes statusRing-b-zya2ts8hma {
    0% { transform: scale(0.6); opacity: 0.8; }
    100% { transform: scale(1.6); opacity: 0; }
}

.status-banner-text[b-zya2ts8hma] {
    text-align: left;
}

.status-banner-text h3[b-zya2ts8hma] {
    font-size: 1.1rem;
    font-weight: 800;
    color: var(--text-heading-primary, #09224f);
    margin: 0 0 0.2rem;
    letter-spacing: -0.01em;
}

.status-banner-text span[b-zya2ts8hma] {
    font-size: 0.82rem;
    color: var(--text-body-muted, #476487);
    font-weight: 500;
}

/* Components Section */
.components-status-section[b-zya2ts8hma] {
    padding: clamp(3rem, 6vw, 5rem) 0 clamp(4rem, 8vw, 6rem);
    background: white;
}

.section-title-row[b-zya2ts8hma] {
    margin-bottom: 2rem;
}

.section-kicker[b-zya2ts8hma] {
    display: inline-block;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--brand-orange, #ed7024);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 0.5rem;
}

.section-title[b-zya2ts8hma] {
    font-size: clamp(1.5rem, 3.5vw, 2.25rem);
    font-weight: 800;
    color: var(--text-heading-primary, #09224f) !important;
    letter-spacing: -0.02em;
    margin: 0;
}

.components-grid[b-zya2ts8hma] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 4rem;
}

.component-card[b-zya2ts8hma] {
    padding: 1.4rem 1.6rem;
    border-radius: 18px;
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(226, 232, 240, 0.9);
    box-shadow: 0 8px 24px -4px rgba(9, 61, 147, 0.04), inset 0 1px 0 rgba(255, 255, 255, 0.9);
    transition: all 0.3s var(--ease-spring);
}

.component-card:hover[b-zya2ts8hma] {
    background: white;
    border-color: rgba(9, 61, 147, 0.22);
    box-shadow: 0 14px 32px -6px rgba(9, 61, 147, 0.1);
    transform: translateY(-2px);
}

.comp-header[b-zya2ts8hma] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.comp-icon[b-zya2ts8hma] {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(9, 61, 147, 0.08);
    color: var(--brand-blue, #093d93);
    border: 1px solid rgba(9, 61, 147, 0.14);
    font-size: 1.15rem;
    flex-shrink: 0;
    transition: transform 0.25s ease;
}

.component-card:hover .comp-icon[b-zya2ts8hma] {
    transform: scale(1.05);
}

.comp-info[b-zya2ts8hma] {
    flex: 1;
}

.comp-info h4[b-zya2ts8hma] {
    font-size: 1.02rem;
    font-weight: 700;
    color: var(--text-heading-secondary, #13376b);
    margin: 0 0 0.15rem;
    letter-spacing: -0.01em;
}

.comp-info span[b-zya2ts8hma] {
    font-size: 0.82rem;
    color: var(--text-body-muted, #476487);
}

.comp-status[b-zya2ts8hma] {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.35rem 0.8rem;
    border-radius: 100px;
}

.comp-status.operational[b-zya2ts8hma] {
    color: var(--text-heading-secondary, #13376b);
    background: rgba(9, 61, 147, 0.05);
    border: 1px solid rgba(9, 61, 147, 0.1);
}

.comp-status .dot[b-zya2ts8hma] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #10b981;
}

/* Uptime Bar — Thin, Calm & Elegant */
.uptime-bar[b-zya2ts8hma] {
    display: flex;
    gap: 4px;
    height: 4px;
    margin-top: 0.85rem;
}

.bar-segment[b-zya2ts8hma] {
    flex: 1;
    border-radius: 3px;
    background: rgba(226, 232, 240, 0.9);
}

.bar-segment.full[b-zya2ts8hma] {
    background: linear-gradient(90deg, rgba(9, 61, 147, 0.25), rgba(9, 61, 147, 0.38));
}

/* Incident History */
.incidents-history[b-zya2ts8hma] {
    margin-top: 2rem;
}

.incidents-title[b-zya2ts8hma] {
    font-size: 1.25rem;
    font-weight: 800;
    color: var(--text-heading-primary, #09224f);
    margin-bottom: 1.25rem;
}

.no-incidents-card[b-zya2ts8hma] {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 3rem 2rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.88);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(226, 232, 240, 0.9);
    box-shadow: 0 8px 24px -4px rgba(9, 61, 147, 0.04), inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.check-icon-large[b-zya2ts8hma] {
    font-size: 2.2rem;
    color: var(--brand-blue, #093d93);
    margin-bottom: 0.75rem;
}

.no-incidents-card h4[b-zya2ts8hma] {
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--text-heading-primary, #09224f);
    margin: 0 0 0.35rem;
}

.no-incidents-card p[b-zya2ts8hma] {
    font-size: 0.88rem;
    color: var(--text-body-muted, #476487);
    max-width: 500px;
    margin: 0;
    line-height: 1.6;
}

@media (max-width: 600px) {
    .main-status-banner[b-zya2ts8hma] {
        flex-direction: column;
        text-align: center;
    }

    .status-banner-text[b-zya2ts8hma] {
        text-align: center;
    }

    .comp-header[b-zya2ts8hma] {
        flex-wrap: wrap;
    }
}
/* /Pages/TenantBranch/TenantBranch.razor.rz.scp.css */

/* Header Corporativo - Integrado con Banner Style */

.enterprise-brand-section[b-02mf7v8rfx] {
    display: flex;
    align-items: center;
    gap: 24px;
    flex: 1;
}

.enterprise-logo-container[b-02mf7v8rfx] {
    position: relative;
    cursor: pointer;
}

.logo-hover-overlay[b-02mf7v8rfx] {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: rgba(15, 23, 42, 0.45);
    color: #fff;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
    pointer-events: none;
}

.enterprise-logo-container:hover .logo-hover-overlay[b-02mf7v8rfx] {
    opacity: 1;
}

.logo-change-btn[b-02mf7v8rfx],
.logo-save-btn[b-02mf7v8rfx] {
    width: 140px;
    text-align: center;
}

.logo-upload-modal-body[b-02mf7v8rfx] {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-top: 4px;
}

.logo-modal-description[b-02mf7v8rfx] {
    margin: 0;
    color: #475569;
    font-size: 14px;
    line-height: 1.45;
}

/* Logo Dropzone & Image Upload Styles (adapted from Belongings) */
.logo-dropzone-wrapper[b-02mf7v8rfx] {
    position: relative;
    border-radius: 18px;
    background: #edf4fc;
    padding: 14px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.logo-upload-trigger[b-02mf7v8rfx] {
    display: block;
    width: 100%;
    min-height: 120px;
    cursor: pointer;
    position: relative;
    z-index: 1;
}

.logo-upload-overlay[b-02mf7v8rfx] {
    position: absolute;
    inset: 0;
    border: 1.5px dashed #c1d2e6;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    pointer-events: none;
}

.logo-upload-overlay-icon[b-02mf7v8rfx] {
    width: 46px;
    height: 46px;
    border-radius: 8px;
    margin-bottom: 10px;
    background: linear-gradient(145deg, #dbeafe, #93c5fd);
    -webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 16 16"><path fill="black" d="M6.002 5.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z"/><path fill="black" d="M2.002 1a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2h-12zm12 1a1 1 0 0 1 1 1v6.5l-3.777-1.947a.5.5 0 0 0-.577.093l-3.71 3.71-2.66-1.772a.5.5 0 0 0-.63.062L1.002 12V3a1 1 0 0 1 1-1h12z"/></svg>') center / 24px 24px no-repeat;
    mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 16 16"><path fill="black" d="M6.002 5.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z"/><path fill="black" d="M2.002 1a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V3a2 2 0 0 0-2-2h-12zm12 1a1 1 0 0 1 1 1v6.5l-3.777-1.947a.5.5 0 0 0-.577.093l-3.71 3.71-2.66-1.772a.5.5 0 0 0-.63.062L1.002 12V3a1 1 0 0 1 1-1h12z"/></svg>') center / 24px 24px no-repeat;
}

.logo-upload-overlay-title[b-02mf7v8rfx] {
    color: #1e3a63;
    font-size: 0.98rem;
    font-weight: 600;
}

.logo-upload-overlay-title span[b-02mf7v8rfx] {
    color: #1665d8;
}

.logo-upload-overlay-subtitle[b-02mf7v8rfx] {
    color: #9caec4;
    font-size: 0.74rem;
    font-weight: 500;
    margin-top: 0.25rem;
}

.logo-file-card[b-02mf7v8rfx] {
    border: 1px solid #d7e2f0;
    border-radius: 12px;
    background: #ffffffcc;
    padding: 10px;
    height: 120px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.logo-thumbnail-btn[b-02mf7v8rfx] {
    border: none;
    background: transparent;
    padding: 0;
    border-radius: 8px;
    cursor: zoom-in;
    width: 86px;
    height: 86px;
    overflow: hidden;
    flex-shrink: 0;
}

.logo-thumbnail-img[b-02mf7v8rfx] {
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: cover;
    border-radius: 8px;
}

.logo-file-info[b-02mf7v8rfx] {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.logo-file-name[b-02mf7v8rfx] {
    font-size: 1.05rem;
    color: #28456f;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.logo-file-size[b-02mf7v8rfx] {
    font-size: 0.95rem;
    color: #6b87ac;
}

.logo-file-actions[b-02mf7v8rfx] {
    display: flex;
    gap: 6px;
}

.logo-action-btn[b-02mf7v8rfx] {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    border: 1px solid #d7e2f0;
    background: #f8fbff;
    color: #355f93;
    align-items: center;
    justify-content: center;
    display: inline-flex;
    padding: 0;
}

.logo-action-btn-danger[b-02mf7v8rfx] {
    color: #b42318;
    background: #fff5f4;
    border-color: #f3c2bd;
}

.logo-change-panel[b-02mf7v8rfx] {
    position: relative;
    border: 1.5px dashed #c1d2e6;
    border-radius: 12px;
    height: 120px;
    background: #ffffff;
    padding: 8px;
}

.logo-change-trigger[b-02mf7v8rfx] {
    display: block;
    width: 100%;
    min-height: 102px;
    cursor: pointer;
    position: relative;
}

@media (max-width: 768px) {
    .logo-upload-trigger[b-02mf7v8rfx],
    .logo-change-trigger[b-02mf7v8rfx] {
        min-height: 110px;
    }

    .logo-file-card[b-02mf7v8rfx],
    .logo-change-panel[b-02mf7v8rfx] {
        min-height: 110px;
    }
}


.logo-hint[b-02mf7v8rfx] {
    font-size: 12px;
    color: #64748b;
}

.logo-error[b-02mf7v8rfx] {
    color: #dc2626;
    font-weight: 600;
}

.enterprise-logo[b-02mf7v8rfx] {
    width: 80px;
    height: 80px;
    border-radius: 16px;
    object-fit: cover;
    border: 3px solid rgba(255, 255, 255, 0.2);
}

.enterprise-logo-placeholder[b-02mf7v8rfx] {
    width: 80px;
    height: 80px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.25) 0%, rgba(255, 255, 255, 0.15) 100%);
    border: 3px solid rgba(255, 255, 255, 0.4);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    backdrop-filter: blur(20px);
    color: rgba(255, 255, 255, 0.9);
}

.enterprise-identity[b-02mf7v8rfx] {
    flex: 1;
}

.enterprise-name[b-02mf7v8rfx] {
    font-size: 2.5rem;
    font-weight: 700;
    margin: 0 0 8px 0;
    color: #ffffff;
}

.enterprise-subtitle[b-02mf7v8rfx] {
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
}

.enterprise-legal-name[b-02mf7v8rfx] {
    font-size: 1.1rem;
    color: rgba(255, 255, 255, 0.8);
    font-weight: 500;
}

.enterprise-status-indicator[b-02mf7v8rfx] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 0.9rem;
    font-weight: 600;
}

.enterprise-status-indicator.active[b-02mf7v8rfx] {
    background: linear-gradient(135deg, rgba(34, 197, 94, 0.9) 0%, rgba(16, 185, 129, 0.8) 100%);
    color: white;
    border: 1px solid rgba(34, 197, 94, 0.6);
    box-shadow: 0 4px 15px rgba(34, 197, 94, 0.4);
    backdrop-filter: blur(10px);
}

.enterprise-status-indicator.inactive[b-02mf7v8rfx] {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.9) 0%, rgba(220, 38, 38, 0.8) 100%);
    color: white;
    border: 1px solid rgba(239, 68, 68, 0.6);
    box-shadow: 0 4px 15px rgba(239, 68, 68, 0.4);
    backdrop-filter: blur(10px);
}

.enterprise-actions[b-02mf7v8rfx] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 30px;
    width: 100%;
}

.info-card[b-02mf7v8rfx] {
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(20px);
    border-radius: 20px;
    padding: 28px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    box-shadow: 0 8px 32px rgba(102, 126, 234, 0.1);
    transition: all 0.3s ease;
}

.company-info-cards-row > [class*="col-"][b-02mf7v8rfx] {
    display: flex;
}

.company-info-cards-row .info-card[b-02mf7v8rfx] {
    width: 100%;
    height: 100%;
}

.info-card:hover[b-02mf7v8rfx] {
    box-shadow: 0 12px 40px rgba(102, 126, 234, 0.2);
    background: rgba(255, 255, 255, 0.95);
}

.info-card-header[b-02mf7v8rfx] {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 2px solid rgba(148, 163, 184, 0.1);
}

.info-card-header h3[b-02mf7v8rfx] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #1e293b;
    margin: 0;
}

.info-card-content[b-02mf7v8rfx] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.info-row[b-02mf7v8rfx] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px;
    border-radius: 12px;
    background: rgba(248, 250, 252, 0.8);
    transition: all 0.2s ease;
}

.info-row:hover[b-02mf7v8rfx] {
    background: rgba(241, 245, 249, 0.9);
}

.info-row svg[b-02mf7v8rfx] {
    color: #64748b;
    margin-top: 2px;
    flex-shrink: 0;
}

.info-details[b-02mf7v8rfx] {
    flex: 1;
}

.info-details label[b-02mf7v8rfx] {
    font-weight: 600;
    color: #475569;
    font-size: 0.875rem;
    display: block;
    margin-bottom: 4px;
}

.info-details span[b-02mf7v8rfx] {
    color: #1e293b;
    font-size: 1rem;
    line-height: 1.5;
}

.color-display[b-02mf7v8rfx] {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    width: 100%;
}

.color-change-btn[b-02mf7v8rfx] {
    margin-left: 0;
}

@media (max-width: 576px) {
    .info-card[b-02mf7v8rfx] {
        padding: 16px;
    }

    .info-card-header[b-02mf7v8rfx] {
        margin-bottom: 16px;
        padding-bottom: 12px;
        gap: 8px;
    }

    .info-card-content[b-02mf7v8rfx] {
        gap: 12px;
    }

    .info-row[b-02mf7v8rfx] {
        padding: 10px;
        gap: 8px;
    }

    .color-display[b-02mf7v8rfx] {
        flex-direction: row;
        flex-wrap: nowrap;
        align-items: center;
        justify-content: flex-start;
        gap: 8px;
    }

    .color-change-btn[b-02mf7v8rfx] {
        width: auto !important;
        margin-left: 0;
        justify-content: flex-start;
    }
}

.color-sample[b-02mf7v8rfx] {
    width: 24px;
    height: 24px;
    border-radius: 6px;
    border: 2px solid rgba(148, 163, 184, 0.3);
}

[b-02mf7v8rfx] .color-modal-title {
    margin-bottom: 8px;
    display: block;
}

/* Paleta de colores predefinidos visible en una sola vista. */
.color-modal-palette[b-02mf7v8rfx] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(78px, 1fr));
    gap: 10px;
}

.color-modal-preset-box[b-02mf7v8rfx] {
    margin-bottom: 0;
    padding: 12px;
    border: 1px solid #d9e2ef;
    border-radius: 10px;
    background-color: #f8fbff;
}

/* Cada opción muestra el círculo y su hexadecimal. */
.color-modal-palette-item[b-02mf7v8rfx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

/* Botón circular de color usando componente Telerik. */
[b-02mf7v8rfx] .color-modal-swatch-btn.k-button {
    width: 38px;
    min-width: 38px;
    height: 38px;
    border-radius: 999px;
    background-color: var(--swatch-color) !important;
    border: 2px solid #cbd5e1;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: none;
}

/* Estado visual cuando el color está seleccionado. */
[b-02mf7v8rfx] .color-modal-swatch-btn.k-button.is-selected {
    border-color: #0f172a;
    box-shadow: 0 0 0 3px rgba(15, 23, 42, 0.14);
}

/* El icono de check se mantiene legible sobre cualquier color. */
[b-02mf7v8rfx] .color-modal-swatch-btn.k-button svg {
    color: #ffffff;
    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.35));
}

/* Texto pequeño para identificar rápido el nombre del color. */
.color-modal-palette-name[b-02mf7v8rfx] {
    font-size: 11px;
    font-weight: 600;
    color: #64748b;
    text-align: center;
    letter-spacing: 0.03em;
}

.plan-badge[b-02mf7v8rfx] {
    background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
    color: white;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Responsive Design */
@media (max-width: 1024px) {


    .enterprise-header[b-02mf7v8rfx] {
        padding: 24px 32px;
    }

    .stats-grid[b-02mf7v8rfx] {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    .stat-card[b-02mf7v8rfx] {
        padding: 14px 16px;
        min-height: 65px;
    }

    .stat-icon[b-02mf7v8rfx] {
        width: 36px;
        height: 36px;
    }

    .stat-number[b-02mf7v8rfx] {
        font-size: 1.3rem;
    }
}

@media (max-width: 768px) {
    .enterprise-dashboard[b-02mf7v8rfx] {
        padding: 0 16px 16px 16px;
    }

    [b-02mf7v8rfx] .enterprise-body {
        padding: 16px !important;
    }

    .enterprise-brand-section[b-02mf7v8rfx] {
        flex-direction: column;
        text-align: center;
        gap: 16px;
    }

    .enterprise-name[b-02mf7v8rfx] {
        font-size: 1.6rem;
    }

    .enterprise-actions[b-02mf7v8rfx] {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
        width: 100%;
        margin-top: 16px;
    }

    .enterprise-actions[b-02mf7v8rfx]  .k-button {
        width: 100%;
        justify-content: center;
        font-size: 0.8rem;
        padding: 0.5rem 0.4rem;
    }

    .enterprise-header[b-02mf7v8rfx] {
        padding: 20px;
    }

    .stats-grid[b-02mf7v8rfx] {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .stat-card[b-02mf7v8rfx] {
        padding: 12px 14px;
        min-height: 60px;
        gap: 10px;
    }

    .stat-icon[b-02mf7v8rfx] {
        width: 32px;
        height: 32px;
    }

    .stat-number[b-02mf7v8rfx] {
        font-size: 1.2rem;
    }

    .stat-label[b-02mf7v8rfx] {
        font-size: 0.7rem;
    }
}

@media (max-width: 576px) {
    .enterprise-actions[b-02mf7v8rfx] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 400px) {
    .enterprise-actions[b-02mf7v8rfx] {
        grid-template-columns: 1fr;
    }

    .enterprise-name[b-02mf7v8rfx] {
        font-size: 1.4rem;
    }
}

.branches-section[b-02mf7v8rfx] {
    margin-top: 32px;
}

.branches-header[b-02mf7v8rfx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 2px solid rgba(148, 163, 184, 0.1);
}

.branches-grid[b-02mf7v8rfx] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 16px;
    grid-auto-rows: 1fr; /* This ensures all rows have the same height */
}

.branch-mini-card[b-02mf7v8rfx] {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.9) 0%, rgba(248, 250, 252, 0.8) 100%);
    backdrop-filter: blur(20px);
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.6);
    box-shadow: 0 4px 20px rgba(102, 126, 234, 0.08);
    transition: all 0.3s ease;
    padding: 20px;
    display: flex;
    flex-direction: column;
    height: 100%; /* Ensures it fills the grid cell height */
}

.branch-mini-card:hover[b-02mf7v8rfx] {
    transform: translateY(-2px);
    box-shadow: 0 8px 30px rgba(102, 126, 234, 0.15);
}

.branch-mini-card-header[b-02mf7v8rfx] {
    margin-bottom: 8px;
    flex-wrap: nowrap;
    align-items: flex-start;
}

.branch-title-container[b-02mf7v8rfx] {
    flex: 1;
    min-width: 0; /* Important for text truncation in flex items */
    margin-right: 8px;
}

.branch-name-title[b-02mf7v8rfx] {
    margin: 0;
    font-size: 1.1rem;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.3;
    /* Use display: -webkit-box for up to 2 lines instead of simple nowrap if desired,
       but simple nowrap with ellipsis is safer for alignment */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-height: 1.3rem;
}

.branch-text-truncate[b-02mf7v8rfx] {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    min-width: 0;
}


.branch-status[b-02mf7v8rfx] {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    /*flex-shrink: 0;*/
}

.branch-status.active[b-02mf7v8rfx] {
    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
    box-shadow: 0 0 8px rgba(16, 185, 129, 0.4);
}

.branch-status.inactive[b-02mf7v8rfx] {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
    box-shadow: 0 0 8px rgba(239, 68, 68, 0.4);
}

.branch-actions[b-02mf7v8rfx] {
    margin-left: auto;
}

.branch-content[b-02mf7v8rfx] {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    justify-content: flex-end; /* Pushes content to the bottom to align them */
}

.branch-content h4[b-02mf7v8rfx] {
    margin: 0 0 8px 0;
    font-size: 1.1rem;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.3;
}

.branch-location[b-02mf7v8rfx] {
    margin: 0 0 12px 0;
    font-size: 0.875rem;
    color: #64748b;
    line-height: 1.4;
    display: flex;
    align-items: center;
    gap: 6px;
}

.branch-location svg[b-02mf7v8rfx] {
    flex-shrink: 0;
}

.branch-contact[b-02mf7v8rfx] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: auto; /* Ensure this is always at the bottom */
}

.branch-contact span[b-02mf7v8rfx] {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 0.875rem;
    color: #475569;
    font-weight: 500;
}

.branch-contact svg[b-02mf7v8rfx] {
    width: 14px;
    height: 14px;
    color: var(--primary-color);
}

.add-branch-btn[b-02mf7v8rfx] {
    background: var(--RgbaColor01);
    border: 2px solid var(--RgbaColor03);
    color: var(--primary-color);
    backdrop-filter: blur(10px);
    transition: all 0.3s ease;
    border-radius: 12px;
    font-weight: 600;
}

.add-branch-btn:hover[b-02mf7v8rfx] {
    background: var(--RgbaColor02);
    border-color: var(--RgbaColor05);
    transform: translateY(-1px);
    box-shadow: 0 4px 15px var(--RgbaColor02);
}



/* Responsive para la sección de sucursales */
@media (max-width: 1024px) {
    .branches-grid[b-02mf7v8rfx] {
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
        gap: 14px;
    }

    .branch-mini-card[b-02mf7v8rfx] {
        padding: 16px;
    }
}

@media (max-width: 768px) {
    .branches-grid[b-02mf7v8rfx] {
        /* Mobile layout: force 2 columns, minimum width 140px so they fit on most screens */
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }

    .branch-mini-card[b-02mf7v8rfx] {
        padding: 12px;
    }
    
    .branch-name-title[b-02mf7v8rfx] {
        font-size: 0.95rem; /* Slightly smaller for mobile */
    }

    .branches-header[b-02mf7v8rfx] {
        flex-direction: column;
        gap: 16px;
        align-items: stretch;
    }

    .branches-title[b-02mf7v8rfx] {
        justify-content: center;
    }
}

@media (max-width: 576px) {
    .branches-grid[b-02mf7v8rfx] {
        grid-template-columns: 1fr !important;
    }

    .branch-mini-card[b-02mf7v8rfx] {
        width: 100%;
    }
}

@media (max-width: 360px) {
    /* For very small screens, drop to 1 column */
    .branches-grid[b-02mf7v8rfx] {
        grid-template-columns: 1fr;
    }
}

/* Estilos para modales modernos */
.error-alert[b-02mf7v8rfx] {
    background: linear-gradient(135deg, #fee2e2 0%, #fecaca 100%);
    border: 1px solid #fca5a5;
    color: #dc2626;
    padding: 12px 16px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 20px;
}

.modern-form-label[b-02mf7v8rfx] {
    font-weight: 600;
    color: #374151;
    font-size: 0.875rem;
}

.required-asterisk[b-02mf7v8rfx] {
    color: #dc2626;
}


.modern-checkbox-label[b-02mf7v8rfx] {
    font-weight: 600;
    color: #374151;
    cursor: pointer;
    display: block;
    margin-bottom: 4px;
}

.modern-checkbox-description[b-02mf7v8rfx] {
    color: #6b7280;
    font-size: 0.875rem;
    margin: 0;
}

.modern-cancel-btn[b-02mf7v8rfx] {
    background: #f3f4f6;
    border: 2px solid #d1d5db;
    color: #374151;
}

.modern-cancel-btn:hover[b-02mf7v8rfx] {
    background: #e5e7eb;
    border-color: #9ca3af;
}

.modern-save-btn[b-02mf7v8rfx] {
    background: var(--primary-gradient);
    border: none;
    color: white;
}

.modern-save-btn:hover[b-02mf7v8rfx] {
    background: var(--primary-gradient);
    opacity: 0.9;
}

.modern-save-btn:disabled[b-02mf7v8rfx] {
    opacity: 0.6;
    cursor: not-allowed;
}

.no-branches[b-02mf7v8rfx] {
    grid-column: 1 / -1;
    text-align: center;
    color: #6b7280;
    font-style: italic;
    padding: 20px;
}

.section-title[b-02mf7v8rfx] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 16px 0;
    font-size: 1.1rem;
    font-weight: 600;
    color: #1e293b;
    padding-bottom: 8px;
    border-bottom: 2px solid rgba(102, 126, 234, 0.2);
}

.section-title svg[b-02mf7v8rfx] {
    color: var(--primary-color);
    width: 20px;
    height: 20px;
}

/* Estilos para el modal de detalles de sucursal */
.branch-details-container[b-02mf7v8rfx] {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.detail-section[b-02mf7v8rfx] {
    background: rgba(248, 250, 252, 0.8);
    border-radius: 12px;
    padding: 20px;
    border: 1px solid rgba(229, 231, 235, 0.6);
}

.detail-section h4[b-02mf7v8rfx] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 16px 0;
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(229, 231, 235, 0.8);
}

.detail-section h4 svg[b-02mf7v8rfx] {
    color: var(--primary-color);
    width: 18px;
    height: 18px;
}

.detail-grid[b-02mf7v8rfx] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.detail-item[b-02mf7v8rfx] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.detail-item.full-width[b-02mf7v8rfx] {
    grid-column: 1 / -1;
}

.detail-item label[b-02mf7v8rfx] {
    font-weight: 600;
    font-size: 0.875rem;
    color: #6b7280;
}

.detail-item span[b-02mf7v8rfx] {
    font-size: 0.95rem;
    color: #374151;
    word-break: break-word;
}

.status-active[b-02mf7v8rfx] {
    color: #059669;
    font-weight: 600;
}

.status-inactive[b-02mf7v8rfx] {
    color: #dc2626;
    font-weight: 600;
}

/* Estilos para el modal de confirmación de eliminación */
.delete-confirmation[b-02mf7v8rfx] {
    text-align: center;
    padding: 20px;
}

.delete-icon-container[b-02mf7v8rfx] {
    display: flex;
    justify-content: center;
    margin-bottom: 16px;
}

.delete-warning-icon[b-02mf7v8rfx] {
    width: 48px;
    height: 48px;
    color: #f59e0b;
    background: rgba(245, 158, 11, 0.1);
    border-radius: 50%;
    padding: 12px;
}

.delete-confirmation h3[b-02mf7v8rfx] {
    margin: 0 0 12px 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #374151;
}

.delete-confirmation p[b-02mf7v8rfx] {
    margin: 8px 0;
    color: #6b7280;
    line-height: 1.5;
}

.modern-delete-btn[b-02mf7v8rfx] {
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
    border: none;
    color: white;
}

.modern-delete-btn:hover[b-02mf7v8rfx] {
    background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
}

.modern-delete-btn:disabled[b-02mf7v8rfx] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Estilos para el modal de cambio de sede principal */
.change-principal-confirmation[b-02mf7v8rfx] {
    text-align: center;
    padding: 20px;
}

.change-principal-icon-container[b-02mf7v8rfx] {
    display: flex;
    justify-content: center;
    margin-bottom: 16px;
}

.change-principal-icon[b-02mf7v8rfx] {
    width: 48px;
    height: 48px;
    color: #fbbf24;
    background: rgba(251, 191, 36, 0.1);
    border-radius: 50%;
    padding: 12px;
}

.change-principal-confirmation h3[b-02mf7v8rfx] {
    margin: 0 0 12px 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #374151;
}

.change-principal-confirmation p[b-02mf7v8rfx] {
    margin: 8px 0;
    color: #6b7280;
    line-height: 1.5;
}

.change-principal-warning[b-02mf7v8rfx] {
    background: rgba(245, 158, 11, 0.1);
    border: 1px solid rgba(245, 158, 11, 0.3);
    border-radius: 8px;
    padding: 12px;
    margin-top: 12px;
    color: #92400e !important;
    font-weight: 500;
}

.modern-principal-btn[b-02mf7v8rfx] {
    background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
    border: none;
    color: white;
}

    .modern-principal-btn:hover[b-02mf7v8rfx] {
        background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    }

    .modern-principal-btn:disabled[b-02mf7v8rfx] {
        opacity: 0.6;
        cursor: not-allowed;
    }

/* Responsive para los detalles */
@media (max-width: 768px) {
    .detail-grid[b-02mf7v8rfx] {
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .detail-item.full-width[b-02mf7v8rfx] {
        grid-column: 1;
    }

    .branch-details-container[b-02mf7v8rfx] {
        gap: 16px;
    }

    .detail-section[b-02mf7v8rfx] {
        padding: 16px;
    }
}

/* Estilos para el estado de reintento */
.retry-loading-container[b-02mf7v8rfx] {
    position: relative;
}

.retry-message[b-02mf7v8rfx] {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--primary-gradient);
    color: white;
    padding: 12px 20px;
    border-radius: 25px;
    display: flex;
    align-items: center;
    gap: 10px;
    box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    font-weight: 500;
    z-index: 1000;
}

.spinning-icon[b-02mf7v8rfx] {
    animation: spin-b-02mf7v8rfx 1s linear infinite;
}

@keyframes spin-b-02mf7v8rfx {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/* Estilos para el contenedor de error */
.error-container[b-02mf7v8rfx] {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
    padding: 20px;
}

.error-card[b-02mf7v8rfx] {
    max-width: 500px;
    width: 100%;
    border-radius: 16px;
    box-shadow: 0 8px 32px rgba(239, 68, 68, 0.2);
    border: 1px solid rgba(239, 68, 68, 0.2);
}

.error-content[b-02mf7v8rfx] {
    text-align: center;
    padding: 30px 20px;
}

.error-icon[b-02mf7v8rfx] {
    width: 60px;
    height: 60px;
    color: #ef4444;
    margin-bottom: 20px;
}

.error-content h3[b-02mf7v8rfx] {
    margin: 0 0 15px 0;
    font-size: 1.5rem;
    font-weight: 600;
    color: #374151;
}

.error-content p[b-02mf7v8rfx] {
    margin: 0 0 25px 0;
    color: #6b7280;
    line-height: 1.6;
}

.error-actions[b-02mf7v8rfx] {
    display: flex;
    justify-content: center;
}







/*************************************************************** CSS PARA EMPRESA Y SURUCSAL **************************************************************/
[b-02mf7v8rfx] .enterprise-main-card {
    background: transparent !important;
    border-radius: 24px !important;
    border: none !important;
    overflow: hidden !important;
    transition: all 0.3s ease !important;
    position: relative !important;
}

[b-02mf7v8rfx] .enterprise-main-card::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    width: 200px !important;
    height: 200px !important;
    background: rgba(255, 255, 255, 0.1) !important;
    border-radius: 50% !important;
    pointer-events: none !important;
    transform: translate(50px, -50px) !important;
}

    [b-02mf7v8rfx] .enterprise-main-card::after {
        content: '' !important;
        position: absolute !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 150px !important;
        height: 150px !important;
        background: rgba(255, 255, 255, 0.05) !important;
        border-radius: 50% !important;
        pointer-events: none !important;
        transform: translate(-50px, 50px) !important;
    }

[b-02mf7v8rfx] .enterprise-header {
    background: var(--primary-gradient) !important;

}

[b-02mf7v8rfx] .enterprise-color-btn {
    background: rgba(255, 255, 255, 0.15) !important;
    border: 2px solid rgba(255, 255, 255, 0.3) !important;
    color: white !important;
    backdrop-filter: blur(20px) !important;
    transition: all 0.3s ease !important;
    border-radius: 12px !important;
    font-weight: 600 !important;
}

    [b-02mf7v8rfx] .enterprise-color-btn:hover {
        background: rgba(255, 255, 255, 0.25) !important;
        border-color: rgba(255, 255, 255, 0.5) !important;
        transform: translateY(-2px) !important;
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.15) !important;
    }

[b-02mf7v8rfx] .enterprise-body {
    padding: 40px;
    background: rgba(255, 255, 255, 0.95) !important;
    backdrop-filter: blur(20px) !important;
    position: relative !important;
    z-index: 2 !important;
    margin: 0 !important;
}

[b-02mf7v8rfx] .branches-title {
    display: flex;
    align-items: center;
    gap: 10px;
}

[b-02mf7v8rfx] .branches-title svg {
    color: var(--primary-color) !important;
    width: 20px;
    height: 20px;
}

[b-02mf7v8rfx] .branches-title h2 {
    margin: 0;
    font-size: 1.2rem;
    font-weight: 700;
    color: #656565;
}

[b-02mf7v8rfx] .info-icon {
    width: 28px !important;
    height: 28px !important;
    padding: 8px !important;
    border-radius: 10px !important;
}

[b-02mf7v8rfx] .contact-icon {
    background: var(--primary-gradient) !important;
    color: white !important;
}

[b-02mf7v8rfx] .business-icon {
    background: var(--primary-gradient);
    color: white;
}

/* Posición del botón */
[b-02mf7v8rfx] .branch-actions {
    position: absolute;
    top: 12px;
    right: 12px;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

/*Desktop: oculto hasta hover */
@media (min-width: 768px) {
    [b-02mf7v8rfx] .branch-actions {
        opacity: 1;
        transform: scale(0.95);
    }

    [b-02mf7v8rfx] .branch-card:hover .branch-actions {
        opacity: 1;
        transform: scale(1);
    }
}

/*Mobile: siempre visible */
@media (max-width: 767px) {
    [b-02mf7v8rfx] .branch-actions {
        opacity: 1;
        transform: none;
    }
}

/*************************************************************** FIN DE CSS PARA EMPRESA Y SUCURSAL ********************************************************/

/* Estilos del nuevo diseño Modern Card */
.modern-card[b-02mf7v8rfx] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.025);
    overflow: hidden;
}

.modern-card-header[b-02mf7v8rfx] {
    background: #f8fafc;
    padding: 16px 24px;
    border-bottom: 1px solid #e2e8f0;
}

.modern-card-title h3[b-02mf7v8rfx] {
    margin: 0;
    font-size: 1.15rem;
    font-weight: 700;
    color: #1e293b;
}

.modern-card-header-icon[b-02mf7v8rfx] {
    color: #10b981;
    width: 20px;
    height: 20px;
}

.modern-card-body[b-02mf7v8rfx] {
    padding: 24px;
}

/* Campos de información */
.info-field[b-02mf7v8rfx] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.info-label[b-02mf7v8rfx] {
    font-size: 0.85rem;
    font-weight: 500;
    color: #64748b;
}

.info-value[b-02mf7v8rfx] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1e293b;
}

/* Badges / Etiquetas */
.modern-badge[b-02mf7v8rfx] {
    display: inline-flex;
    align-items: center;
    padding: 4px 10px;
    border-radius: 9999px;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1;
    width: fit-content;
}

.badge-plan[b-02mf7v8rfx] {
    background-color: #fef3c7;
    color: #d97706;
    border: 1px solid #fde68a;
}

.badge-active[b-02mf7v8rfx] {
    background-color: #d1fae5;
    color: #065f46;
    border: 1px solid #a7f3d0;
}

.badge-inactive[b-02mf7v8rfx] {
    background-color: #fee2e2;
    color: #991b1b;
    border: 1px solid #fca5a5;
}

.badge-count[b-02mf7v8rfx] {
    background-color: #e2e8f0;
    color: #475569;
}

.badge-light[b-02mf7v8rfx] {
    background-color: #f1f5f9;
    color: #475569;
    border: 1px solid #e2e8f0;
}

/* Logo de empresa */
.logo-preview-wrapper[b-02mf7v8rfx] {
    position: relative;
    width: 80px;
    height: 80px;
    border-radius: 10px;
    cursor: pointer;
    border: 1px solid #cbd5e1;
    overflow: hidden;
    background: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: center;
}

.modern-logo-img[b-02mf7v8rfx] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.modern-logo-placeholder[b-02mf7v8rfx] {
    color: #64748b;
}

.logo-edit-badge[b-02mf7v8rfx] {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.4);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.logo-preview-wrapper:hover .logo-edit-badge[b-02mf7v8rfx] {
    opacity: 1;
}

.color-preview-wrapper[b-02mf7v8rfx] {
    position: relative;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    cursor: pointer;
    border: 1px solid #cbd5e1;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}

.color-sample-box[b-02mf7v8rfx] {
    width: 100%;
    height: 100%;
}

.color-edit-overlay[b-02mf7v8rfx] {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.4);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.color-preview-wrapper:hover .color-edit-overlay[b-02mf7v8rfx] {
    opacity: 1;
}

/* Grid de sucursales */
.branches-grid-modern[b-02mf7v8rfx] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 20px;
    min-width: 0;
}

.branch-card-modern[b-02mf7v8rfx] {
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    min-width: 0;
}

.branch-card-modern:hover[b-02mf7v8rfx] {
    transform: translateY(-2px);
    box-shadow: 0 8px 16px -4px rgba(0, 0, 0, 0.1);
}

.branch-icon-container-modern[b-02mf7v8rfx] {
    width: 40px;
    height: 40px;
    border-radius: 8px;
    background-color: #f1f5f9;
    color: #64748b;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.branch-icon-container-modern.is-principal[b-02mf7v8rfx] {
    background-color: #d1fae5;
    color: #059669;
}

.branch-card-header-modern[b-02mf7v8rfx] {
    min-width: 0;
}

.branch-identity-modern[b-02mf7v8rfx] {
    min-width: 0;
}

.branch-card-body-modern[b-02mf7v8rfx] {
    min-width: 0;
}

.branch-name-modern[b-02mf7v8rfx] {
    margin: 0;
    font-size: 0.95rem;
    font-weight: 700;
    color: #1e293b;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    min-width: 0;
}

.principal-label[b-02mf7v8rfx] {
    font-size: 0.8rem;
    font-weight: 500;
    color: #059669;
}

.branch-code-modern[b-02mf7v8rfx] {
    font-size: 0.8rem;
    color: #64748b;
}

.branch-info-row-modern[b-02mf7v8rfx] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    color: #475569;
    margin-top: 8px;
    min-width: 0;
}

.branch-info-row-modern svg[b-02mf7v8rfx] {
    color: #94a3b8;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.branch-address-text[b-02mf7v8rfx] {
    min-width: 0;
    overflow-wrap: break-word;
    word-break: break-word;
    hyphens: auto;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.branch-card-footer-modern[b-02mf7v8rfx] {
    border-top: 1px solid #f1f5f9;
}

/* Logo Large Preview Modal (Mirrors Belonging Photo Preview) */
.logo-preview-modal[b-02mf7v8rfx] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.72);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.logo-preview-modal-content[b-02mf7v8rfx] {
    position: relative;
    width: min(900px, 95vw);
    max-height: 90vh;
    background: #fff;
    border-radius: 12px;
    padding: 0.75rem;
}

.logo-preview-modal-image[b-02mf7v8rfx] {
    width: 100%;
    max-height: calc(90vh - 2rem);
    object-fit: contain;
    border-radius: 8px;
}

.logo-preview-modal-close[b-02mf7v8rfx] {
    position: absolute;
    top: -12px;
    right: -12px;
    width: 32px;
    height: 32px;
    border: none;
    border-radius: 50%;
    background: #ffffff;
    color: #111827;
    font-size: 1.2rem;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25);
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Harmonize all modals on this page with the system's Poppins typography */
[b-02mf7v8rfx] .modal-header-custom,
[b-02mf7v8rfx] .modal-header-custom *,
[b-02mf7v8rfx] .modal-body-custom,
[b-02mf7v8rfx] .modal-body-custom *,
[b-02mf7v8rfx] .modal-footer-custom,
[b-02mf7v8rfx] .modal-footer-custom *,
[b-02mf7v8rfx] .custom-modal,
[b-02mf7v8rfx] .custom-modal * {
    font-family: 'Poppins', sans-serif !important;
}

/* Ajustes de responsividad para cabeceras y botones de tarjetas en móviles */
@media (max-width: 768px) {
    .booking-link-row[b-02mf7v8rfx] {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
        padding: 10px 0 !important;
        border-bottom: 1px solid #f1f5f9;
    }

    .booking-link-row:last-child[b-02mf7v8rfx] {
        border-bottom: none;
    }

    .booking-link-row .overflow-hidden[b-02mf7v8rfx] {
        margin-right: 0 !important;
        width: 100% !important;
    }

    .booking-link-row .d-flex[b-02mf7v8rfx] {
        width: 100% !important;
        justify-content: flex-start !important;
        gap: 8px !important;
        flex-wrap: wrap !important;
    }

    .booking-link-row .btn-arregly[b-02mf7v8rfx] {
        white-space: nowrap !important;
        min-width: 0 !important;
    }
}

@media (max-width: 576px) {
    .modern-card-header[b-02mf7v8rfx] {
        flex-wrap: wrap !important;
        gap: 8px !important;
        padding: 12px 16px !important;
    }

    .modern-card-title[b-02mf7v8rfx] {
        flex: 1 1 auto !important;
        align-items: center !important;
    }

    .modern-card-title h3[b-02mf7v8rfx] {
        font-size: 1rem !important;
    }

    .modern-card-header-icon[b-02mf7v8rfx] {
        width: 22px !important;
        height: 22px !important;
    }

    .modern-card-header .btn-arregly[b-02mf7v8rfx] {
        flex: 0 0 auto !important;
        width: auto !important;
        min-width: 0 !important;
        padding: 6px 12px !important;
        font-size: 0.82rem !important;
        height: 30px !important;
        min-height: 30px !important;
        white-space: nowrap !important;
        justify-content: center !important;
        margin: 0 !important;
    }

    .branches-grid-modern[b-02mf7v8rfx] {
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    .modern-card-body[b-02mf7v8rfx] {
        padding: 16px !important;
    }

    .branch-card-modern[b-02mf7v8rfx] {
        padding: 16px !important;
    }
}

/* Filtros de sucursales */
.branch-filters-container[b-02mf7v8rfx] {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 24px;
    background: #f8fafc;
    padding: 16px;
    border-radius: 12px;
    border: 1px solid #e2e8f0;
}

.branch-filters-container .search-box-wrapper[b-02mf7v8rfx] {
    flex: 1;
    min-width: 250px;
}

.branch-filters-container .filter-dropdown-wrapper[b-02mf7v8rfx] {
    width: 180px;
    flex-shrink: 0;
}

.custom-pager-container[b-02mf7v8rfx] {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 16px;
    margin-top: 24px;
    width: 100%;
}

.custom-pager-container[b-02mf7v8rfx]  .k-button {
    width: 36px !important;
    min-width: 36px !important;
    height: 36px !important;
    padding: 0 !important;
    border-radius: 8px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.pager-info-text[b-02mf7v8rfx] {
    font-size: 0.9rem;
    color: #475569;
}

/* Botón de recarga estilo Grid */
.toolbar-utility-btn[b-02mf7v8rfx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border-radius: 50%;
    border: 1px solid #cbd5e1;
    background: #ffffff;
    color: #475569;
    cursor: pointer;
    flex-shrink: 0;
    transition: all 0.2s ease;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05);
}

.toolbar-utility-btn:hover[b-02mf7v8rfx] {
    background: #f8fafc;
    border-color: #94a3b8;
    color: #0f172a;
}

.toolbar-utility-btn .k-svg-icon[b-02mf7v8rfx] {
    width: 16px !important;
    height: 16px !important;
}

.no-branches-found[b-02mf7v8rfx] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 24px;
    text-align: center;
    background: #f8fafc;
    border-radius: 12px;
    border: 1px dashed #cbd5e1;
    grid-column: 1 / -1;
}

.no-branches-found p[b-02mf7v8rfx] {
    margin: 8px 0 0 0;
    color: #64748b;
    font-size: 0.95rem;
}

@media (max-width: 576px) {
    .branch-filters-container[b-02mf7v8rfx] {
        flex-direction: row !important;
        align-items: center !important;
        gap: 6px !important;
        padding: 8px !important;
    }
    
    .branch-filters-container .search-box-wrapper[b-02mf7v8rfx] {
        min-width: 0 !important;
    }

    .branch-filters-container .filter-dropdown-wrapper[b-02mf7v8rfx] {
        width: 110px !important;
        flex-shrink: 0 !important;
    }

    .branch-filters-container .toolbar-utility-btn[b-02mf7v8rfx] {
        width: 36px !important;
        height: 36px !important;
        margin: 0 !important;
    }
}
/* Banner Empresarial Styles */
.banner-sample-box[b-02mf7v8rfx] {
    position: relative;
    width: 140px;
    height: 45px;
    border-radius: 8px;
    border: 2px solid #cbd5e1;
    overflow: hidden;
    cursor: pointer;
    background: #0f172a;
}

.banner-sample-img[b-02mf7v8rfx] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.banner-sample-placeholder[b-02mf7v8rfx] {
    width: 100%;
    height: 100%;
    background: #f1f5f9;
    color: #94a3b8;
}

.banner-edit-overlay[b-02mf7v8rfx] {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
}

.banner-sample-box:hover .banner-edit-overlay[b-02mf7v8rfx] {
    opacity: 1;
}

/* Estilos corporativos para TelerikSwitch */
[b-02mf7v8rfx] .switch-arregly.k-switch {
    border-radius: 9999px;
}

[b-02mf7v8rfx] .switch-arregly .k-switch-label-on,
[b-02mf7v8rfx] .switch-arregly .k-switch-label-off {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
}

[b-02mf7v8rfx] .switch-arregly.k-switch-on .k-switch-track {
    background-color: var(--primary-color, #059669) !important;
    border-color: var(--primary-color, #059669) !important;
}

.booking-config-panel[b-02mf7v8rfx] {
    border-top: 1px solid #e5e7eb;
    padding-top: 1.25rem;
    padding-bottom: 0.25rem;
}

.booking-config-panel-title[b-02mf7v8rfx] {
    color: #0f172a;
    font-size: 1.05rem;
    font-weight: 700;
    line-height: 1.3;
    margin-bottom: 1.25rem;
}

.booking-config-section[b-02mf7v8rfx] {
    border-top: 1px solid #e5e7eb;
    padding-top: 1.25rem;
    margin-top: 1.25rem;
}

.booking-config-section-first[b-02mf7v8rfx] {
    border-top: 0;
    padding-top: 0.25rem;
    margin-top: 0;
}

.booking-field-label[b-02mf7v8rfx] {
    color: #1f2937;
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    line-height: 1.3;
    margin-bottom: 0.5rem;
}

.booking-field-help[b-02mf7v8rfx] {
    color: #64748b;
    font-size: 0.82rem;
    font-weight: 400;
    line-height: 1.35;
    margin-top: 0.4rem;
}

/* Modalidad de Agendamiento en Tarjetas Lado a Lado */
.convert-booking-option-grid[b-02mf7v8rfx] {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

.convert-booking-option-card[b-02mf7v8rfx] {
    width: 100%;
    border: 1px solid #d1d5db;
    background: #ffffff;
    border-radius: 12px;
    padding: 0.9rem;
    text-align: left;
    min-height: 132px;
    display: flex;
    flex-direction: column;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease, transform 0.12s ease;
    cursor: pointer;
}

.convert-booking-option-card:hover[b-02mf7v8rfx] {
    border-color: #9ca3af;
    background: #f9fafb;
    transform: translateY(-1px);
}

.convert-booking-option-card.active[b-02mf7v8rfx] {
    border-color: #2563eb;
    background: #eff6ff;
    box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.18);
}

.convert-booking-option-title-row[b-02mf7v8rfx] {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
    margin-bottom: 0.4rem;
}

.convert-booking-option-title[b-02mf7v8rfx] {
    font-size: 0.92rem;
    font-weight: 700;
    color: #1f2937;
    min-height: 2.4rem;
    line-height: 1.3;
}

.convert-booking-option-description[b-02mf7v8rfx] {
    font-size: 0.82rem;
    line-height: 1.42;
    color: #4b5563;
}

.convert-booking-selected-pill[b-02mf7v8rfx] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 90px;
    border: 1px solid #bfdbfe;
    background: #dbeafe;
    color: #1d4ed8;
    border-radius: 999px;
    padding: 0.12rem 0.45rem;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    flex-shrink: 0;
}

.convert-booking-selected-pill.is-hidden[b-02mf7v8rfx] {
    visibility: hidden;
}

.convert-booking-selected-pill.is-visible[b-02mf7v8rfx] {
    visibility: visible;
}

@media (max-width: 768px) {
    .convert-booking-option-grid[b-02mf7v8rfx] {
        grid-template-columns: 1fr;
    }
}

.booking-input[b-02mf7v8rfx] {
    border-radius: 10px;
}

[b-02mf7v8rfx] .booking-input.k-numerictextbox .k-input-inner {
    text-align: left;
}

.booking-radio-content[b-02mf7v8rfx] {
    min-width: 0;
}

.booking-mode-title[b-02mf7v8rfx] {
    color: #0f172a;
    font-size: 0.95rem;
    font-weight: 700;
    line-height: 1.3;
}

.booking-mode-description[b-02mf7v8rfx] {
    color: #334155;
    font-size: 0.85rem;
    font-weight: 400;
    line-height: 1.32;
    margin-top: 0.1rem;
}

[b-02mf7v8rfx] .booking-mode-radiogroup .k-radio-item {
    align-items: flex-start;
    gap: 0.55rem;
    padding: 0.24rem 0;
}

[b-02mf7v8rfx] .booking-mode-radiogroup .k-radio-item-label {
    flex: 1;
}

.booking-mode-card[b-02mf7v8rfx] {
    border: 1px solid #dbe3ee;
    border-radius: 12px;
    background: #ffffff;
    padding: 0.58rem 0.72rem;
    transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

[b-02mf7v8rfx] .booking-mode-radiogroup .k-radio-item:hover .booking-mode-card {
    border-color: #b9cced;
    background: #f8fbff;
}

.booking-mode-card-selected[b-02mf7v8rfx] {
    border-color: var(--primary-color, #059669);
    background: #ffffff;
    box-shadow: 0 0 0 1px var(--primary-color, #059669);
}

[b-02mf7v8rfx] .booking-mode-radiogroup .k-radio {
    border-color: #cbd5e1;
}

[b-02mf7v8rfx] .booking-mode-radiogroup .k-radio:checked,
[b-02mf7v8rfx] .booking-mode-radiogroup .k-radio.k-checked {
    border-color: var(--primary-color, #059669) !important;
    color: var(--primary-color, #059669) !important;
    accent-color: var(--primary-color, #059669);
}

[b-02mf7v8rfx] .booking-mode-radiogroup .k-radio:checked::before,
[b-02mf7v8rfx] .booking-mode-radiogroup .k-radio.k-checked::before {
    background-color: var(--primary-color, #059669) !important;
}

.booking-switch-row[b-02mf7v8rfx] {
    align-items: center;
}

.booking-email-input-wrapper[b-02mf7v8rfx] {
    position: relative;
}

.booking-email-input[b-02mf7v8rfx] {
    padding-right: 2rem;
}

[b-02mf7v8rfx] .booking-email-input .k-input-inner {
    padding-right: 2rem;
}

.booking-email-valid-icon[b-02mf7v8rfx] {
    position: absolute;
    top: 50%;
    right: 0.75rem;
    transform: translateY(-50%);
    color: var(--primary-color, #059669);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}

.booking-config-actions[b-02mf7v8rfx] {
    display: flex;
    justify-content: flex-end;
    padding-top: 0.68rem;
    margin-top: 0.62rem;
}

.booking-main-divider[b-02mf7v8rfx] {
    margin-top: 0.55rem !important;
    margin-bottom: 0.55rem !important;
}

.booking-banner-block[b-02mf7v8rfx] {
    padding-top: 0.15rem;
}

.booking-banner-actions[b-02mf7v8rfx] {
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
}

.booking-banner-full[b-02mf7v8rfx] {
    width: 100%;
    height: auto;
    min-height: 120px;
    aspect-ratio: 16 / 5;
    border-radius: 12px;
    border-width: 1px;
}

.booking-banner-button[b-02mf7v8rfx] {
    width: fit-content;
}

.booking-links-list[b-02mf7v8rfx] {
    border-top: 1px solid #e5e7eb;
}

.booking-link-row[b-02mf7v8rfx] {
    padding: 0.65rem 0;
    border-bottom: 1px solid #e5e7eb;
}

/* ==========================================================================
   Información de la Empresa - Diseño Moderno & Responsive Grid
   ========================================================================== */

.company-info-card[b-02mf7v8rfx] {
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    box-shadow: 0 4px 12px -2px rgba(0, 0, 0, 0.04), 0 2px 6px -1px rgba(0, 0, 0, 0.02);
    background: #ffffff;
    overflow: hidden;
}

.company-card-header[b-02mf7v8rfx] {
    background: #f8fafc;
    padding: 16px 24px;
    border-bottom: 1px solid #e2e8f0;
}

.company-card-header .modern-card-title h3[b-02mf7v8rfx] {
    margin: 0;
    font-size: 1.12rem;
    font-weight: 700;
    color: #1e293b;
    letter-spacing: -0.01em;
}

.company-edit-btn-desktop[b-02mf7v8rfx] {
    border-radius: 9999px !important;
    padding: 5px 18px !important;
    font-size: 0.88rem !important;
    font-weight: 600 !important;
    border: 1.5px solid #d8b4fe !important;
    color: #6d28d9 !important;
    background: #ffffff !important;
    transition: all 0.2s ease-in-out !important;
}

.company-edit-btn-desktop:hover[b-02mf7v8rfx] {
    background: #faf5ff !important;
    border-color: #a855f7 !important;
    color: #5b21b6 !important;
    box-shadow: 0 2px 6px rgba(168, 85, 247, 0.15) !important;
}

.company-edit-btn-mobile[b-02mf7v8rfx] {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1.5px solid #d8b4fe;
    background: #ffffff;
    color: #6d28d9;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.company-edit-btn-mobile:hover[b-02mf7v8rfx],
.company-edit-btn-mobile:active[b-02mf7v8rfx] {
    background: #faf5ff;
    border-color: #a855f7;
    color: #5b21b6;
    transform: scale(1.06);
    box-shadow: 0 2px 8px rgba(168, 85, 247, 0.2);
}

.company-edit-btn-mobile svg[b-02mf7v8rfx] {
    width: 16px;
    height: 16px;
}

.company-card-body[b-02mf7v8rfx] {
    padding: 24px 28px;
}

/* Grid Container */
.company-info-grid[b-02mf7v8rfx] {
    display: grid;
    position: relative;
    width: 100%;
}

/* Info Item Structure */
.company-info-item[b-02mf7v8rfx] {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.company-info-header[b-02mf7v8rfx] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}

.company-info-icon[b-02mf7v8rfx] {
    width: 18px;
    height: 18px;
    color: #3b2d54;
    flex-shrink: 0;
}

.company-info-title[b-02mf7v8rfx] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #1e293b;
    line-height: 1.3;
}

.company-info-value[b-02mf7v8rfx] {
    font-size: 0.9rem;
    font-weight: 500;
    color: #64748b;
    /*padding-left: 26px;*/
    line-height: 1.4;
    word-break: break-word;
}

/* Color corporativo swatch */
.company-color-display[b-02mf7v8rfx] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.company-color-swatch-wrapper[b-02mf7v8rfx] {
    position: relative;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
    flex-shrink: 0;
}

.company-color-circle[b-02mf7v8rfx] {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    display: block;
    border: 1px solid rgba(0, 0, 0, 0.08);
}

.company-color-edit-hover[b-02mf7v8rfx] {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: rgba(15, 23, 42, 0.5);
    color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.2s ease;
}

.company-color-edit-hover svg[b-02mf7v8rfx] {
    width: 11px;
    height: 11px;
}

.company-color-swatch-wrapper:hover .company-color-edit-hover[b-02mf7v8rfx] {
    opacity: 1;
}

.company-color-hex[b-02mf7v8rfx] {
    font-size: 0.9rem;
    font-weight: 600;
    color: #475569;
}

/* Area Mappings */
.item-legal[b-02mf7v8rfx] { grid-area: legal; }
.item-commercial[b-02mf7v8rfx] { grid-area: commercial; }
.item-nit[b-02mf7v8rfx] { grid-area: nit; }
.item-area[b-02mf7v8rfx] { grid-area: area; }
.item-subarea[b-02mf7v8rfx] { grid-area: subarea; }
.item-regimen[b-02mf7v8rfx] { grid-area: regimen; }
.item-email[b-02mf7v8rfx] { grid-area: email; }
.item-phone[b-02mf7v8rfx] { grid-area: phone; }
.item-color[b-02mf7v8rfx] { grid-area: color; }
.item-status[b-02mf7v8rfx] { grid-area: status; }

/* Desktop View (>= 768px) */
@media (min-width: 768px) {
    .company-info-grid[b-02mf7v8rfx] {
        grid-template-columns: 1fr 1fr;
        grid-template-areas:
            "legal commercial"
            "nit area"
            "subarea regimen"
            "email phone"
            "color status";
        column-gap: 56px;
        row-gap: 22px;
    }

    /* Central vertical divider on desktop */
    .company-info-grid[b-02mf7v8rfx]::after {
        content: "";
        position: absolute;
        top: 2px;
        bottom: 2px;
        left: calc(50% - 0.5px);
        width: 1px;
        background-color: #f1f5f9;
    }

    .company-info-grid .item-legal[b-02mf7v8rfx],
    .company-info-grid .item-nit[b-02mf7v8rfx],
    .company-info-grid .item-subarea[b-02mf7v8rfx],
    .company-info-grid .item-email[b-02mf7v8rfx],
    .company-info-grid .item-color[b-02mf7v8rfx] {
        padding-right: 12px;
    }

    .company-info-grid .item-commercial[b-02mf7v8rfx],
    .company-info-grid .item-area[b-02mf7v8rfx],
    .company-info-grid .item-regimen[b-02mf7v8rfx],
    .company-info-grid .item-phone[b-02mf7v8rfx],
    .company-info-grid .item-status[b-02mf7v8rfx] {
        padding-left: 12px;
    }
}

/* Mobile View (< 768px) */
@media (max-width: 767.98px) {
    .company-card-header[b-02mf7v8rfx] {
        padding: 9px 14px !important;
        flex-wrap: nowrap !important;
    }

    .company-card-header .modern-card-title[b-02mf7v8rfx] {
        flex: 0 1 auto !important;
        gap: 6px !important;
    }

    .company-card-header .modern-card-title h3[b-02mf7v8rfx] {
        font-size: 0.98rem !important;
    }

    .company-edit-btn-mobile[b-02mf7v8rfx] {
        width: 32px !important;
        height: 32px !important;
    }

    .company-edit-btn-mobile svg[b-02mf7v8rfx] {
        width: 14px !important;
        height: 14px !important;
    }

    .company-card-body[b-02mf7v8rfx] {
        padding: 4px 6px !important;
    }

    .company-info-grid[b-02mf7v8rfx] {
        grid-template-columns: 1fr 1fr;
        grid-template-areas:
            "legal commercial"
            "nit area"
            "subarea regimen"
            "email email"
            "phone color";
    }

    .item-status[b-02mf7v8rfx] {
        display: none !important;
    }

    .company-info-item[b-02mf7v8rfx] {
        padding: 7px 9px;
    }

    .company-info-header[b-02mf7v8rfx] {
        gap: 5px;
        margin-bottom: 1px;
    }

    .company-info-icon[b-02mf7v8rfx] {
        width: 15px;
        height: 15px;
    }

    .company-info-title[b-02mf7v8rfx] {
        font-size: 0.82rem;
        font-weight: 700;
        line-height: 1.2;
    }

    .company-info-value[b-02mf7v8rfx] {
        font-size: 0.78rem;
        /*padding-left: 20px;*/
        line-height: 1.25;
    }

    .company-color-display[b-02mf7v8rfx] {
        gap: 8px;
    }

    .company-color-swatch-wrapper[b-02mf7v8rfx] {
        width: 18px;
        height: 18px;
    }

    .company-color-hex[b-02mf7v8rfx] {
        font-size: 0.78rem;
    }

    /* Mobile Border Separators */
    .item-legal[b-02mf7v8rfx] {
        border-right: 1px solid #f1f5f9;
        border-bottom: 1px solid #f1f5f9;
    }

    .item-commercial[b-02mf7v8rfx] {
        border-bottom: 1px solid #f1f5f9;
    }

    .item-nit[b-02mf7v8rfx] {
        border-right: 1px solid #f1f5f9;
        border-bottom: 1px solid #f1f5f9;
    }

    .item-area[b-02mf7v8rfx] {
        border-bottom: 1px solid #f1f5f9;
    }

    .item-subarea[b-02mf7v8rfx] {
        border-right: 1px solid #f1f5f9;
        border-bottom: 1px solid #f1f5f9;
    }

    .item-regimen[b-02mf7v8rfx] {
        border-bottom: 1px solid #f1f5f9;
    }

    .item-email[b-02mf7v8rfx] {
        border-bottom: 1px solid #f1f5f9;
    }

    .item-phone[b-02mf7v8rfx] {
        border-right: 1px solid #f1f5f9;
    }

    .item-color[b-02mf7v8rfx] {
        border: none;
    }
}

/* /Pages/TrackOrder/TrackOrder.razor.rz.scp.css */
/* ==========================================================================
   ── ESTILOS BASE (MOBILE-FIRST - Viewports 320px a 767px) ──
   ========================================================================== */

/* ── Página completa ── */
.track-order-page[b-aywqmym6mm] {
    --primary-color: #093d93 !important;
    --primary-dark: #09224f !important;
    --primary-gradient: linear-gradient(135deg, #093d93 0%, #1a5bc4 100%) !important;
    --primary-text-color: #ffffff !important;
    --primary-rgba-color: rgba(9, 61, 147, 0.12) !important;
    --RgbaColor01: rgba(9, 61, 147, 0.12) !important;
    --RgbaColor02: rgba(9, 61, 147, 0.22) !important;
    --RgbaColor03: rgba(9, 61, 147, 0.08) !important;
    --RgbaColor04: rgba(9, 61, 147, 0.35) !important;
    --RgbaColor05: rgba(9, 61, 147, 0.50) !important;
    width: 100%;
    max-width: 100vw;
    min-height: 100vh;
    background-color: #dfe3e8 !important;
    padding: 12px 8px 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    box-sizing: border-box;
    z-index: 0;
    overflow-x: hidden;
}

.track-order-page[b-aywqmym6mm]  .btn-gradient-primary-arregly,
[b-aywqmym6mm] .track-order-page .btn-gradient-primary-arregly,
[b-aywqmym6mm] .btn-gradient-primary-arregly {
    background: linear-gradient(135deg, #093d93 0%, #1a5bc4 100%) !important;
    color: #ffffff !important;
    border: none !important;
}

.track-order-page[b-aywqmym6mm]  .btn-gradient-primary-arregly:hover,
[b-aywqmym6mm] .track-order-page .btn-gradient-primary-arregly:hover,
[b-aywqmym6mm] .btn-gradient-primary-arregly:hover {
    opacity: 0.9 !important;
}

.search-card[b-aywqmym6mm],
.info-cards[b-aywqmym6mm],
.order-header-card[b-aywqmym6mm],
.order-tabs-container[b-aywqmym6mm] {
    width: 100%;
    box-sizing: border-box;
    margin-left: auto;
    margin-right: auto;
}

/* ── Acciones de cabecera ── */
.page-actions[b-aywqmym6mm] {
    width: 100%;
    max-width: 1120px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    box-sizing: border-box;
}

.page-actions .back-link[b-aywqmym6mm] {
    width: auto;
    max-width: none;
    margin: 0;
}

.page-actions .btn-outline-primary-arregly.animated-btn[b-aywqmym6mm] {
    width: 130px;
    font-size: 0.85rem;
    padding: 6px 12px;
}

.page-actions-right[b-aywqmym6mm] {
    display: flex;
    align-items: center;
    gap: 8px;
}

/* Botón de recarga estilo Grid */
.toolbar-utility-btn[b-aywqmym6mm] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border-radius: 999px;
    border: 1.5px solid #e5e7eb;
    background: #ffffff;
    color: #4b5563;
    cursor: pointer;
    flex-shrink: 0;
    transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, transform 0.12s ease, box-shadow 0.18s ease;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}

.toolbar-utility-btn:hover[b-aywqmym6mm] {
    transform: translateY(-1px);
    background: #f3f4f6;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.1);
}

.toolbar-utility-btn--refresh[b-aywqmym6mm] {
    color: #4b5563;
    border-color: #e5e7eb;
}

.toolbar-utility-btn--refresh:hover[b-aywqmym6mm] {
    color: #1d4ed8;
    border-color: #bfdbfe;
    background: #eff6ff;
}

/* Animación para indicar recarga de datos */
@keyframes spin-refresh-b-aywqmym6mm {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(-360deg); }
}

.toolbar-utility-btn--refresh.is-loading .k-svg-icon[b-aywqmym6mm],
.toolbar-utility-btn--refresh.is-loading[b-aywqmym6mm]  .k-svg-icon {
    animation: spin-refresh-b-aywqmym6mm 1s linear infinite !important;
}

.toolbar-utility-btn .k-svg-icon[b-aywqmym6mm] {
    width: 16px !important;
    height: 16px !important;
}

/* ── Volver al inicio ── */
.back-link[b-aywqmym6mm] {
    border: none;
    background: transparent;
    color: #6b7280;
    display: inline-flex;
    gap: 8px;
    align-items: center;
    cursor: pointer;
    font-size: 0.9rem;
    transition: color 0.2s ease;
    padding: 0;
}

.back-link:hover[b-aywqmym6mm] {
    color: #111827;
}

/* ── Card principal de búsqueda ── */
.search-card[b-aywqmym6mm] {
    width: 100%;
    max-width: 640px;
    background: #ffffff;
    border: none;
    border-radius: 20px;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
    padding: 24px 16px 20px;
    text-align: center;
    margin-bottom: 20px;
    box-sizing: border-box;
}

.search-icon-wrapper[b-aywqmym6mm] {
    width: 80px;
    height: 80px;
    margin: 0 auto 24px;
    border-radius: 50%;
    background: var(--primary-rgba-color) !important;
    color: var(--primary-color) !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

[b-aywqmym6mm].search-icon-wrapper .k-svg-icon {
    width: 20px !important;
    height: 20px !important;
}

.search-card h1[b-aywqmym6mm] {
    font-size: 1.3rem;
    font-weight: 700;
    color: #111827;
    margin: 0 0 12px;
}

.search-card > p[b-aywqmym6mm] {
    color: #6b7280;
    font-size: 0.95rem;
    line-height: 1.55;
    margin: 0 auto;
    max-width: 480px;
}

.search-form[b-aywqmym6mm] {
    margin: 28px auto 0;
    text-align: left;
    width: 100%;
}

.search-form label[b-aywqmym6mm] {
    display: block;
    font-weight: 600;
    color: #374151;
    margin-bottom: 8px;
    font-size: 0.9rem;
}

.search-form small[b-aywqmym6mm] {
    display: block;
    color: #9ca3af;
    font-size: 0.82rem;
    margin: 8px 0 20px;
}

.search-error[b-aywqmym6mm] {
    color: #b91c1c;
    font-size: 0.875rem;
    margin-bottom: 12px;
}

[b-aywqmym6mm] .track-order-page .textbox-arregly,
[b-aywqmym6mm] .track-order-page .textbox-arregly:hover,
[b-aywqmym6mm] .track-order-page .textbox-arregly.k-focus,
[b-aywqmym6mm] .track-order-page .textbox-arregly:focus-within,
[b-aywqmym6mm] .track-order-page .textbox-arregly.k-valid:not(.k-invalid) {
    background-color: #ffffff !important;
    border-color: #d0d5dd !important;
    box-shadow: none !important;
}

[b-aywqmym6mm] .track-order-page .textbox-arregly .k-input-inner {
    background-color: #ffffff !important;
}

[b-aywqmym6mm] .track-order-page input:-webkit-autofill,
[b-aywqmym6mm] .track-order-page input:-webkit-autofill:hover,
[b-aywqmym6mm] .track-order-page input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px #ffffff inset !important;
    box-shadow: 0 0 0 1000px #ffffff inset !important;
    -webkit-text-fill-color: #101828 !important;
}

/* ── Info cards ── */
.info-cards[b-aywqmym6mm] {
    width: 100%;
    max-width: 640px;
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.info-card[b-aywqmym6mm] {
    background: #ffffff;
    border: none;
    border-radius: 16px;
    padding: 16px 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

.info-icon[b-aywqmym6mm] {
    width: 40px;
    height: 40px;
    border-radius: 10px;
    background: var(--primary-rgba-color) !important;
    color: var(--primary-color) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 12px;
}

.info-icon .k-svg-icon[b-aywqmym6mm] { width: 20px !important; height: 20px !important; }

.info-card h3[b-aywqmym6mm] { font-size: 0.9rem; font-weight: 700; color: #111827; margin: 0 0 6px; }
.info-card p[b-aywqmym6mm] { font-size: 0.82rem; color: #6b7280; margin: 0; line-height: 1.4; }

/* ── Header de la orden ── */
.order-header-card[b-aywqmym6mm] {
    width: 100%;
    max-width: 1120px;
    background: #ffffff;
    border: none;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    padding: 16px 12px;
    display: grid;
    gap: 16px;
    box-sizing: border-box;
    margin-bottom: 0;
}

.order-header-top[b-aywqmym6mm] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
}

@media (max-width: 480px) {
    .order-header-card[b-aywqmym6mm] {
        padding: 12px 10px;
    }
    .order-title-and-badge h2[b-aywqmym6mm] {
        font-size: 1.1rem;
    }
    .status-badge[b-aywqmym6mm] {
        font-size: 0.72rem;
        padding: 2px 6px;
    }
    .total-amount[b-aywqmym6mm] {
        font-size: 1.5rem;
    }
}

.order-id-row[b-aywqmym6mm] {
    display: flex;
    align-items: center;
    gap: 16px;
}

.order-title-block[b-aywqmym6mm] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: flex-start;
}

.order-title-and-badge[b-aywqmym6mm] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.order-title-and-badge h2[b-aywqmym6mm] { margin: 0; font-size: 1.25rem; font-weight: 700; }

.service-name[b-aywqmym6mm] { margin: 0; color: #4b5563; font-size: 0.95rem; }

.order-header-right[b-aywqmym6mm] {
    text-align: left;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
}

.order-header-right strong[b-aywqmym6mm] { font-size: 1.4rem; color: #111827; font-weight: 700; }

.order-header-icon[b-aywqmym6mm] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: var(--primary-rgba-color) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.order-header-icon .k-svg-icon[b-aywqmym6mm] { width: 24px !important; height: 24px !important; color: var(--primary-color) !important; }

/* ── Status badge variants ── */
.status-badge[b-aywqmym6mm] {
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 600;
    padding: 4px 10px;
}

.status-badge--created[b-aywqmym6mm] { background: #dbeafe; color: #1d4ed8; }
.status-badge--progress[b-aywqmym6mm] { background: #fef3c7; color: #92400e; }
.status-badge--completed[b-aywqmym6mm] { background: #d1fae5; color: #065f46; }
.status-badge--invoiced[b-aywqmym6mm] { background: #ede9fe; color: #5b21b6; }
.status-badge--cancelled[b-aywqmym6mm] { background: #fee2e2; color: #991b1b; }

/* ── Progress ── */
.progress-label-row[b-aywqmym6mm] {
    display: flex;
    justify-content: space-between;
    margin-bottom: 6px;
    color: #374151;
    font-size: 0.8rem;
}

.global-progress-bar[b-aywqmym6mm] { width: 100%; }

[b-aywqmym6mm] .track-order-progressbar.k-progressbar {
    height: 10px;
    border-radius: 999px;
    background: #e5e7eb;
    border: none;
    overflow: hidden;
}

[b-aywqmym6mm] .track-order-progressbar .k-selected {
    background: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}

[b-aywqmym6mm] .track-order-progressbar .k-progress-status,
[b-aywqmym6mm] .track-order-progressbar .k-progressbar-text,
[b-aywqmym6mm] .track-order-progressbar .k-label {
    display: none !important;
}

.total-container[b-aywqmym6mm] { display: flex; align-items: baseline; gap: 8px; }
.total-label[b-aywqmym6mm] { font-weight: 500; color: #6b7280; font-size: 1rem; }
.total-amount[b-aywqmym6mm] { font-size: 1.9rem; color: #111827; font-weight: 700; }

/* ── Tabs container ── */
.order-tabs-container[b-aywqmym6mm] {
    width: 100%;
    max-width: 1120px;
    margin-top: 16px;
}

/* Unified tabs bar (Mockup Style) */
[b-aywqmym6mm] .custom-tab-strip--floating .k-tabstrip-items {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    padding: 6px !important;
    margin: 0 0 16px 0 !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    gap: 6px !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
    box-sizing: border-box !important;
    scrollbar-width: none; /* Firefox */
}

[b-aywqmym6mm] .custom-tab-strip--floating .k-tabstrip-items::-webkit-scrollbar {
    display: none; /* Chrome/Safari */
}

[b-aywqmym6mm] .custom-tab-strip--floating .k-tabstrip-item,
[b-aywqmym6mm] .custom-tab-strip--floating .k-item {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 8px !important;
    color: #4b5563 !important;
    transition: none !important; /* Desactivar la transición heredada de app.css */
    flex-shrink: 0 !important;
    flex: 1 !important; /* Distribute tabs evenly to fill the container width */
    text-align: center !important;
}

[b-aywqmym6mm] .custom-tab-strip--floating .k-tabstrip-item:hover,
[b-aywqmym6mm] .custom-tab-strip--floating .k-item:hover {
    background: #f3f4f6 !important;
    color: #111827 !important;
    transition: none !important;
}

/* Active tab style with solid brand color */
[b-aywqmym6mm] .custom-tab-strip--floating .k-tabstrip-item.k-active,
[b-aywqmym6mm] .custom-tab-strip--floating .k-item.k-active {
    background: var(--primary-color, #16a34a) !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
    transition: none !important;
}

[b-aywqmym6mm] .custom-tab-strip--floating .k-tabstrip-item.k-active:hover,
[b-aywqmym6mm] .custom-tab-strip--floating .k-item.k-active:hover {
    background: var(--primary-color, #16a34a) !important;
    color: #ffffff !important;
    opacity: 1 !important; /* Quitar desvanecimiento de opacidad en hover */
    transition: none !important;
}

[b-aywqmym6mm] .custom-tab-strip--floating .k-tabstrip-item .k-link,
[b-aywqmym6mm] .custom-tab-strip--floating .k-item .k-link {
    padding: 10px 20px !important;
    color: inherit !important;
    font-weight: 500 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

@media (max-width: 480px) {
    [b-aywqmym6mm] .custom-tab-strip--floating .k-tabstrip-item .k-link,
    [b-aywqmym6mm] .custom-tab-strip--floating .k-item .k-link {
        padding: 8px 10px !important;
        font-size: 0.8rem !important;
    }
}

[b-aywqmym6mm] .custom-tab-strip--floating .k-tabstrip-items::-webkit-scrollbar {
    display: none; /* Chrome/Safari */
}

[b-aywqmym6mm] .custom-tab-strip--floating .k-tabstrip-item {
    flex-shrink: 0 !important;
}

/* ── Detail cards (shared) ── */
.detail-card[b-aywqmym6mm] {
    background: #ffffff;
    border: none;
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
    padding: 18px 16px;
    box-sizing: border-box;
}

@media (max-width: 480px) {
    .detail-card[b-aywqmym6mm] {
        padding: 12px 10px;
    }
}

.detail-card h3[b-aywqmym6mm] {
    margin: 0 0 12px;
    font-size: 0.9rem;
    font-weight: 700;
    color: #111827;
    display: flex;
    align-items: center;
    gap: 8px;
}

.detail-card h3 .k-svg-icon[b-aywqmym6mm],
[b-aywqmym6mm] .detail-card h3 .k-svg-icon {
    width: 18px !important;
    height: 18px !important;
    color: var(--primary-color) !important;
    flex-shrink: 0;
}

.detail-card h3[b-aywqmym6mm]::before { display: none !important; }

.compact p[b-aywqmym6mm] { margin: 0 0 10px; font-size: 0.875rem; color: #374151; }

.meta-row[b-aywqmym6mm] {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    font-size: 0.875rem;
}

.meta-row span[b-aywqmym6mm] { color: #6b7280; }
.meta-row strong[b-aywqmym6mm] { color: #111827; }

.service-label[b-aywqmym6mm] {
    font-size: 0.75rem !important;
    color: #9ca3af !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    margin-bottom: 2px !important;
    font-weight: 600 !important;
}

.notes-box[b-aywqmym6mm] {
    background: #f9fafb;
    border-radius: 10px;
    padding: 14px;
    color: #374151;
    font-size: 0.875rem;
}

/* ── Tab: Resumen ── */
.tab-resumen[b-aywqmym6mm] {
    display: grid;
    gap: 16px;
}

.resumen-cards-grid[b-aywqmym6mm] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

.resumen-cards-grid .detail-card p[b-aywqmym6mm] {
    margin: 0 0 8px;
    font-size: 0.875rem;
    color: #374151;
}

/* ── Track Order Services List ── */
.track-order-services-list[b-aywqmym6mm] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 12px;
}

.track-order-service-item[b-aywqmym6mm] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 10px;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
}

.track-order-service-bullet[b-aywqmym6mm] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--primary-color, #601a18);
    flex-shrink: 0;
}

.track-order-service-info[b-aywqmym6mm] {
    display: flex;
    align-items: center;
    flex: 1;
    min-width: 0;
}

.track-order-service-name[b-aywqmym6mm] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #1e293b;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.track-order-service-qty[b-aywqmym6mm] {
    font-size: 0.78rem;
    font-weight: 600;
    color: #64748b;
    background: #e2e8f0;
    padding: 2px 6px;
    border-radius: 6px;
    flex-shrink: 0;
}

/* ── Financial Summary Pills ── */
.financial-summary-grid[b-aywqmym6mm] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
}

.financial-pill[b-aywqmym6mm] {
    border-radius: 12px;
    padding: 10px 8px;
    text-align: center;
}

@media (max-width: 360px) {
    .financial-pill[b-aywqmym6mm] {
        padding: 8px 4px;
    }
}

.financial-pill__label[b-aywqmym6mm] {
    display: block;
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    margin-bottom: 6px;
}

.financial-pill__value[b-aywqmym6mm] {
    display: block;
    font-size: 0.95rem;
    font-weight: 700;
}

@media (max-width: 360px) {
    .financial-pill__value[b-aywqmym6mm] {
        font-size: 0.8rem;
    }
}

.pill-total[b-aywqmym6mm] { background: #f0f4f8; }
.pill-total .financial-pill__label[b-aywqmym6mm] { color: #6b7280; }
.pill-total .financial-pill__value[b-aywqmym6mm] { color: #111827; }

.pill-paid[b-aywqmym6mm] { background: #ecfdf5; }
.pill-paid .financial-pill__label[b-aywqmym6mm] { color: #065f46; }
.pill-paid .financial-pill__value[b-aywqmym6mm] { color: #059669; }

.pill-pending[b-aywqmym6mm] { background: #fef3c7; }
.pill-pending .financial-pill__label[b-aywqmym6mm] { color: #92400e; }
.pill-pending .financial-pill__value[b-aywqmym6mm] { color: #d97706; }

.pill-percent[b-aywqmym6mm] { background: #f5f3ff; }
.pill-percent .financial-pill__label[b-aywqmym6mm] { color: #5b21b6; }
.pill-percent .financial-pill__value[b-aywqmym6mm] { color: #7c3aed; }

/* ── Tab: Seguimiento ── */
.tab-seguimiento[b-aywqmym6mm] {
    display: grid;
    gap: 16px;
}

/* Timeline */
.timeline-item[b-aywqmym6mm] {
    display: grid;
    grid-template-columns: 36px 1fr;
    gap: 10px;
    position: relative;
    padding-bottom: 22px;
}

.timeline-item[b-aywqmym6mm]::after {
    content: "";
    position: absolute;
    left: 17px;
    top: 36px;
    bottom: -2px;
    width: 1px;
    background: #dbe3ee;
}

.timeline-item:last-child[b-aywqmym6mm]::after { display: none; }

.timeline-dot[b-aywqmym6mm] {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid #dbe3ee;
    background: #dfe8f6;
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.timeline-dot .k-svg-icon[b-aywqmym6mm],
[b-aywqmym6mm] .timeline-dot .k-svg-icon {
    width: 12px !important;
    height: 12px !important;
    color: var(--primary-color) !important;
}

.timeline-item.current .timeline-dot[b-aywqmym6mm],
.timeline-item.completed .timeline-dot[b-aywqmym6mm] {
    border-color: #dbe3ee !important;
    box-shadow: none !important;
}

.timeline-item.current .timeline-dot[b-aywqmym6mm]::after {
    content: "";
    position: absolute;
    inset: -7px;
    border: 2px solid var(--primary-rgba-color);
    border-radius: 50%;
    animation: currentStepPulse-b-aywqmym6mm 1.6s ease-out infinite;
}

@keyframes currentStepPulse-b-aywqmym6mm {
    0% { transform: scale(0.7); opacity: 0.95; }
    70% { transform: scale(1.35); opacity: 0; }
    100% { transform: scale(1.35); opacity: 0; }
}

.timeline-item.pending .timeline-dot[b-aywqmym6mm] { opacity: 0.9; }

.timeline-header[b-aywqmym6mm] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.timeline-left-meta[b-aywqmym6mm] {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    margin-bottom: 6px;
    flex-wrap: wrap;
}

.timeline-right-meta[b-aywqmym6mm] {
    display: flex;
    justify-content: flex-start;
    text-align: left;
}

.timeline-right-meta span[b-aywqmym6mm] {
    font-size: 0.75rem;
    color: #9ca3af;
    white-space: normal;
}

.badge-theme[b-aywqmym6mm] {
    font-size: 0.7rem;
    padding: 3px 8px;
    border-radius: 6px;
    font-weight: 600;
}

.badge-theme-created[b-aywqmym6mm] { background: #eff6ff; color: #1e40af; }
.badge-theme-status[b-aywqmym6mm] { background: #fef2f2; color: #991b1b; }
.badge-theme-task[b-aywqmym6mm] { background: #f5f3ff; color: #5b21b6; }
.badge-theme-info[b-aywqmym6mm] { background: #f0fdf4; color: #166534; }
.badge-theme-evidence[b-aywqmym6mm] { background: #fff7ed; color: #9a3412; }
.badge-theme-finance[b-aywqmym6mm] { background: #ecfdf5; color: #065f46; }

.timeline-content p[b-aywqmym6mm] {
    margin: 4px 0 0 0;
    font-size: 0.85rem;
    color: #4b5563;
    line-height: 1.4;
}

.timeline-important[b-aywqmym6mm] {
    background: #f0f4f8;
    border-left: 3px solid var(--primary-color);
    padding: 10px 14px;
    border-radius: 0 8px 8px 0;
    margin-bottom: 18px;
}

.timeline-important p[b-aywqmym6mm] {
    margin: 0;
    font-size: 0.82rem;
    color: #334155;
    font-weight: 500;
}

.timeline-important-status[b-aywqmym6mm] { border-left-color: #ef4444; background: #fee2e2; }
.timeline-important-status p[b-aywqmym6mm] { color: #991b1b; }

/* ── Tab: Cliente ── */
.tab-cliente[b-aywqmym6mm] {
    display: grid;
    gap: 16px;
}

.client-data-grid[b-aywqmym6mm] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
}

.client-info-card[b-aywqmym6mm] {
    background: #f9fafb;
    border-radius: 12px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.client-info-card .k-svg-icon[b-aywqmym6mm],
[b-aywqmym6mm] .client-info-card .k-svg-icon {
    width: 18px !important;
    height: 18px !important;
    color: #9ca3af !important;
}

.client-info-card__label[b-aywqmym6mm] {
    font-size: 0.72rem;
    font-weight: 600;
    color: #9ca3af;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.client-info-card__value[b-aywqmym6mm] {
    font-size: 0.95rem;
    font-weight: 600;
    color: #111827;
}

/* ── Comment Blocks (Mockup Style) ── */
.comment-block[b-aywqmym6mm] {
    background: #f3f4f6; /* Gray background */
    border-radius: 12px;
    padding: 14px 16px;
    margin-bottom: 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    box-sizing: border-box;
}

.comment-block:last-child[b-aywqmym6mm] {
    margin-bottom: 0;
}

/* Special styling for final comments / requests */
.comment-requests[b-aywqmym6mm] {
    background: #fffbeb; /* Light yellow background */
}

.comment-block__title[b-aywqmym6mm] {
    font-size: 0.75rem;
    font-weight: 600;
    color: #8b5cf6; /* default purple badge color */
    text-transform: capitalize;
}

.comment-problem .comment-block__title[b-aywqmym6mm] {
    color: #6b7280; /* gray */
}

.comment-observations .comment-block__title[b-aywqmym6mm] {
    color: #6b7280; /* gray */
}

.comment-requests .comment-block__title[b-aywqmym6mm] {
    color: #b45309; /* amber */
}

.comment-block__text[b-aywqmym6mm] {
    font-size: 0.9rem;
    color: #1f2937 !important;
    margin: 0;
    line-height: 1.4;
}

.client-info-card-footer[b-aywqmym6mm] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 16px;
    font-size: 0.8rem;
    color: #6b7280;
    flex-wrap: wrap;
}

.client-info-card-footer .k-svg-icon[b-aywqmym6mm] {
    width: 14px !important;
    height: 14px !important;
    color: #6b7280 !important;
}

.footer-meta-item[b-aywqmym6mm] {
    display: flex;
    align-items: center;
    gap: 6px;
}

.footer-separator[b-aywqmym6mm] {
    color: #9ca3af;
}

/* Custom icon colors to match Mockup */
.card-client-info h3 .k-svg-icon[b-aywqmym6mm],
[b-aywqmym6mm] .card-client-info h3 .k-svg-icon {
    color: #15803d !important; /* Green icon */
}

.card-coming-soon[b-aywqmym6mm] {
    background: #f9fafb;
    border: 1px dashed #d1d5db;
    text-align: center;
    padding: 20px;
}

.card-coming-soon strong[b-aywqmym6mm] { color: #374151; font-size: 0.9rem; }
.card-coming-soon p[b-aywqmym6mm] { color: #9ca3af; font-size: 0.82rem; margin: 6px 0 0; }

/* ── Tab: Finanzas y Archivos ── */
.tab-finanzas[b-aywqmym6mm] {
    display: grid;
    gap: 16px;
}

.finanzas-top-grid[b-aywqmym6mm] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

/* ── Financial Detail ── */
.financial-status-badge[b-aywqmym6mm] {
    display: inline-block;
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 0.72rem;
    font-weight: 700;
    margin-bottom: 14px;
}

.financial-status-badge--paid[b-aywqmym6mm] { background: #d1fae5; color: #065f46; }
.financial-status-badge--pending[b-aywqmym6mm] { background: #fef3c7; color: #92400e; }

.financial-detail-rows[b-aywqmym6mm] { margin-bottom: 16px; }

.financial-row[b-aywqmym6mm] {
    display: flex;
    justify-content: space-between;
    padding: 6px 0;
    border-bottom: 1px solid #f3f4f6;
    font-size: 0.875rem;
}

.financial-row:last-child[b-aywqmym6mm] { border-bottom: none; }
.financial-row span[b-aywqmym6mm] { color: #6b7280; }
.financial-row strong[b-aywqmym6mm] { color: #111827; }
.financial-row .paid-value[b-aywqmym6mm] { color: #059669; }
.financial-row .pending-value[b-aywqmym6mm] { color: #d97706; }

.financial-progress-section[b-aywqmym6mm] { margin-top: 4px; }

.financial-progress-bar[b-aywqmym6mm] {
    width: 100%;
    height: 8px;
    background: #e5e7eb;
    border-radius: 999px;
    overflow: hidden;
    margin-top: 6px;
}

.financial-progress-fill[b-aywqmym6mm] {
    height: 100%;
    background: linear-gradient(90deg, var(--primary-color, #16a34a), #22c55e);
    border-radius: 999px;
    transition: width 0.5s ease;
}

/* ── Payments (Mockup Style) ── */
.payments-list[b-aywqmym6mm] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 14px;
}

.payment-card[b-aywqmym6mm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
    box-sizing: border-box;
}

.payment-card__left[b-aywqmym6mm] {
    display: flex;
    align-items: center;
    gap: 14px;
}

.payment-card__icon-wrapper[b-aywqmym6mm] {
    width: 38px;
    height: 38px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.payment-card--anticipo .payment-card__icon-wrapper[b-aywqmym6mm] {
    background: #eff6ff; /* light blue */
    color: #2563eb;
}

.payment-card--abono .payment-card__icon-wrapper[b-aywqmym6mm] {
    background: #f0fdf4; /* light green */
    color: #16a34a;
}

.payment-card__icon-wrapper .k-svg-icon[b-aywqmym6mm] {
    width: 18px !important;
    height: 18px !important;
    color: inherit !important;
}

.payment-card__details[b-aywqmym6mm] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.payment-card__type[b-aywqmym6mm] {
    font-size: 0.88rem;
    font-weight: 600;
}

.payment-card--anticipo .payment-card__type[b-aywqmym6mm] {
    color: #2563eb;
}

.payment-card--abono .payment-card__type[b-aywqmym6mm] {
    color: #16a34a;
}

.payment-card__method[b-aywqmym6mm] {
    font-size: 0.78rem;
    color: #6b7280;
}

.payment-card__date[b-aywqmym6mm] {
    font-size: 0.72rem;
    color: #9ca3af;
}

.payment-card__amount[b-aywqmym6mm] {
    font-size: 1.05rem;
    font-weight: 700;
    color: #111827;
}

/* Custom icon colors to match Mockup for financial and payments headers */
.card-financial-detail h3 .k-svg-icon[b-aywqmym6mm],
[b-aywqmym6mm] .card-financial-detail h3 .k-svg-icon,
.card-payments h3 .k-svg-icon[b-aywqmym6mm],
[b-aywqmym6mm] .card-payments h3 .k-svg-icon {
    color: #15803d !important; /* Green icon */
}

/* ── Photos evidence ── */
.photo-group[b-aywqmym6mm] {
    margin-bottom: 20px;
}

.photo-group h4[b-aywqmym6mm] {
    font-size: 0.85rem;
    font-weight: 700;
    color: #374151;
    margin: 0 0 10px 0;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.photo-grid[b-aywqmym6mm] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
}

.photo-card[b-aywqmym6mm] {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    display: flex;
    flex-direction: row;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    height: 160px;
    box-sizing: border-box;
}

.photo-card:hover[b-aywqmym6mm] {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
}

.photo-card__img-wrapper[b-aywqmym6mm] {
    width: 150px;
    height: 100%;
    min-height: 140px;
    overflow: hidden;
    cursor: pointer;
    background: #f3f4f6;
    border-right: 1px solid #e5e7eb;
    flex-shrink: 0;
}

.photo-card__img[b-aywqmym6mm] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease;
}

.photo-card__img:hover[b-aywqmym6mm] {
    transform: scale(1.05);
}

.photo-card__info[b-aywqmym6mm] {
    padding: 12px 14px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex-grow: 1;
    min-width: 0;
}

.photo-card__meta[b-aywqmym6mm] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.photo-card__belonging-name-title[b-aywqmym6mm] {
    font-size: 0.85rem;
    color: #4b5563;
}

.photo-card__belonging-name-title strong[b-aywqmym6mm] {
    color: #111827;
}

.photo-card__type[b-aywqmym6mm] {
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    background: #eff6ff;
    color: #1e40af;
    padding: 3px 8px;
    border-radius: 6px;
}

.photo-card__date[b-aywqmym6mm] {
    font-size: 0.75rem;
    color: #9ca3af;
}

.photo-card__service[b-aywqmym6mm] {
    font-size: 0.85rem;
    color: #111827;
    font-weight: 600;
}

.photo-card__service span[b-aywqmym6mm] {
    font-weight: normal;
    color: #4b5563;
}

.photo-card__notes[b-aywqmym6mm] {
    font-size: 0.8rem;
    color: #4b5563;
    background: #f9fafb;
    border-left: 3px solid var(--primary-color, #16a34a);
    padding: 4px 8px;
    border-radius: 0 6px 6px 0;
    margin-top: 2px;
    max-height: 48px;
    overflow-y: auto;
    word-break: break-word;
}

/* ── Documents ── */
.documents-grid[b-aywqmym6mm] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.document-card[b-aywqmym6mm] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-radius: 10px;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    cursor: pointer;
    opacity: 1;
    transition: all 0.2s ease-in-out;
}

.document-card:hover[b-aywqmym6mm] {
    border-color: #3b82f6;
    background: #f8faff;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.08);
}

.document-card--disabled[b-aywqmym6mm] {
    opacity: 0.5;
    pointer-events: none;
    cursor: not-allowed;
}

.document-card--loading[b-aywqmym6mm] {
    border-color: #3b82f6;
    background: #f0f7ff;
    opacity: 1;
    cursor: wait;
}

.document-card__icon[b-aywqmym6mm] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    flex-shrink: 0;
}

.document-card .k-svg-icon[b-aywqmym6mm],
[b-aywqmym6mm] .document-card .k-svg-icon {
    width: 24px !important;
    height: 24px !important;
    color: #ef4444 !important;
    flex-shrink: 0;
}

.document-card__info[b-aywqmym6mm] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.document-card__info strong[b-aywqmym6mm] {
    font-size: 0.85rem;
    color: #111827;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.document-card__category[b-aywqmym6mm] {
    font-size: 0.72rem;
    color: #6b7280;
}

.badge-downloading-pulse[b-aywqmym6mm] {
    font-size: 0.7rem;
    font-weight: 600;
    color: #2563eb;
    background: #dbeafe;
    padding: 2px 8px;
    border-radius: 9999px;
    animation: downloadPulse-b-aywqmym6mm 1.5s infinite;
}

@keyframes downloadPulse-b-aywqmym6mm {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.6; transform: scale(0.97); }
}

/* ── Evidence preview (in timeline) ── */
.evidence-preview[b-aywqmym6mm] {
    display: inline-flex;
    margin-top: 10px;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #e5e7eb;
    background: #f9fafb;
    cursor: pointer;
}

.evidence-thumbnail[b-aywqmym6mm] {
    width: 56px;
    height: 56px;
    object-fit: cover;
    display: block;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.evidence-preview:hover .evidence-thumbnail[b-aywqmym6mm] {
    transform: scale(1.03);
}

/* ── Lightbox ── */
.lightbox-overlay[b-aywqmym6mm] {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.82);
    z-index: 9000;
    display: flex;
    align-items: center;
    justify-content: center;
    animation: fadeIn-b-aywqmym6mm 0.18s ease;
}

.lightbox-container[b-aywqmym6mm] {
    position: relative;
    max-width: 90vw;
    max-height: 90vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.lightbox-image[b-aywqmym6mm] {
    max-width: 90vw;
    max-height: 90vh;
    object-fit: contain;
    border-radius: 8px;
    box-shadow: 0 24px 48px rgba(0, 0, 0, 0.5);
    image-rendering: high-quality;
}

.lightbox-close[b-aywqmym6mm] {
    position: absolute;
    top: -16px;
    right: -16px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #fff;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0,0,0,0.25);
    z-index: 1;
    transition: background 0.15s ease;
}

.lightbox-close:hover[b-aywqmym6mm] { background: #f3f4f6; }

@keyframes fadeIn-b-aywqmym6mm {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* ── Icon colors ── */
[b-aywqmym6mm] .info-icon .k-svg-icon,
[b-aywqmym6mm] .search-icon-wrapper .k-svg-icon,
[b-aywqmym6mm] .order-header-icon .k-svg-icon {
    color: var(--primary-color) !important;
    width: 20px;
}

html[b-aywqmym6mm], body[b-aywqmym6mm] {
    background-color: #dfe3e8 !important;
}


/* ==========================================================================
   ── ESCALADO PROGRESIVO (TABLET / DESKTOP - min-width 768px) ──
   ========================================================================== */
@media (min-width: 768px) {
    .track-order-page[b-aywqmym6mm] {
        padding: 32px 16px 60px;
    }

    .search-card[b-aywqmym6mm] {
        /*padding: 48px 40px 40px;*/
    }

    .search-card h1[b-aywqmym6mm] {
        font-size: 1.75rem;
    }

    .info-cards[b-aywqmym6mm] {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 14px;
    }

    .order-header-card[b-aywqmym6mm] {
        padding: 24px;
        gap: 16px;
    }

    .order-header-top[b-aywqmym6mm] {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        gap: 16px;
    }

    .order-id-row h2[b-aywqmym6mm] {
        font-size: 1.4rem;
    }

    .order-header-right[b-aywqmym6mm] {
        text-align: right;
        width: auto;
        display: block;
    }

    .order-header-right strong[b-aywqmym6mm] {
        font-size: 1.9rem;
    }

    .order-header-icon[b-aywqmym6mm] {
        width: 60px;
        height: 60px;
        border-radius: 12px;
    }

    .order-header-icon .k-svg-icon[b-aywqmym6mm] {
        width: 32px !important;
        height: 32px !important;
    }

    .progress-label-row[b-aywqmym6mm] {
        font-size: 0.875rem;
    }

    .detail-card[b-aywqmym6mm] {
        padding: 20px;
    }

    .detail-card h3[b-aywqmym6mm] {
        font-size: 0.95rem;
        margin-bottom: 18px;
    }

    .timeline-header[b-aywqmym6mm] {
        flex-direction: row;
        justify-content: space-between;
        gap: 10px;
        align-items: flex-start;
    }

    .timeline-right-meta[b-aywqmym6mm] {
        justify-content: flex-end;
        text-align: right;
    }

    .meta-row[b-aywqmym6mm] {
        flex-direction: row;
        justify-content: space-between;
        gap: 10px;
    }

    .resumen-cards-grid[b-aywqmym6mm] {
        grid-template-columns: repeat(3, 1fr);
        gap: 16px;
    }

    .financial-summary-grid[b-aywqmym6mm] {
        grid-template-columns: repeat(4, 1fr);
        gap: 12px;
    }

    .financial-pill[b-aywqmym6mm] {
        padding: 14px 12px;
    }

    .financial-pill__value[b-aywqmym6mm] {
        font-size: 1.1rem;
    }

    .client-data-grid[b-aywqmym6mm] {
        grid-template-columns: repeat(3, 1fr);
        gap: 14px;
    }

    .finanzas-top-grid[b-aywqmym6mm] {
        grid-template-columns: 1.2fr 1fr;
        gap: 16px;
    }

    .photo-grid[b-aywqmym6mm] {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .documents-grid[b-aywqmym6mm] {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }

    /* Pestañas a ancho completo sin scroll horizontal */
    [b-aywqmym6mm] .custom-tab-strip--floating .k-tabstrip-items {
        flex-wrap: wrap !important;
        overflow-x: visible !important;
        scrollbar-width: auto;
    }
}

/* ── Belonging Details Inline Styles ── */
.photo-card__belonging-details-container[b-aywqmym6mm] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 2px;
}

.photo-card__belonging-grid[b-aywqmym6mm] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
    border-top: 1px dashed #e5e7eb;
    padding-top: 6px;
}

.photo-card__belonging-item[b-aywqmym6mm] {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    gap: 4px;
}

.photo-card__belonging-label[b-aywqmym6mm] {
    font-size: 0.75rem;
    font-weight: 700;
    color: #111827;
}

.photo-card__belonging-val[b-aywqmym6mm] {
    font-size: 0.78rem;
    font-weight: 400;
    color: #4b5563;
}

.photo-card__belonging-notes-box[b-aywqmym6mm] {
    font-size: 0.78rem;
    color: #374151;
    background-color: #f9fafb;
    border-left: 3px solid var(--primary-color, #16a34a);
    padding: 6px 10px;
    border-radius: 0 6px 6px 0;
    word-break: break-word;
    line-height: 1.35;
    max-height: 64px;
    overflow-y: auto;
}

.photo-card__belonging-notes-box strong[b-aywqmym6mm] {
    color: #111827;
    font-weight: 700;
}

@media (max-width: 480px) {
    .photo-card__belonging-grid[b-aywqmym6mm] {
        grid-template-columns: 1fr;
        gap: 2px;
    }
}

/* Estilos para Historial de Notas en Rastrear Orden */
.detailed-notes-list[b-aywqmym6mm] {
    margin-top: 1rem;
}

.detailed-note-card[b-aywqmym6mm] {
    background-color: #ffffff;
    border-radius: 12px;
    border: 1px solid #f3f4f6;
    border-left: 5px solid transparent;
    padding: 16px 20px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.03), 0 2px 4px -1px rgba(0, 0, 0, 0.01);
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
}

.detailed-note-card:hover[b-aywqmym6mm] {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.05), 0 4px 6px -2px rgba(0, 0, 0, 0.02);
    transform: translateY(-2px);
}

/* Variaciones de borde izquierdo */
.detailed-note-card.note-card-blue[b-aywqmym6mm] { border-left-color: #3b82f6; }
.detailed-note-card.note-card-purple[b-aywqmym6mm] { border-left-color: #8b5cf6; }
.detailed-note-card.note-card-green[b-aywqmym6mm] { border-left-color: #10b981; }
.detailed-note-card.note-card-teal[b-aywqmym6mm] { border-left-color: #14b8a6; }
.detailed-note-card.note-card-red[b-aywqmym6mm] { border-left-color: #f43f5e; }
.detailed-note-card.note-card-default[b-aywqmym6mm] { border-left-color: #9ca3af; }

/* Título de la nota según variación para coincidir con gama de colores */
.detailed-note-card.note-card-blue strong[b-aywqmym6mm] { color: #1d4ed8; }
.detailed-note-card.note-card-purple strong[b-aywqmym6mm] { color: #6d28d9; }
.detailed-note-card.note-card-green strong[b-aywqmym6mm] { color: #047857; }
.detailed-note-card.note-card-teal strong[b-aywqmym6mm] { color: #0f766e; }
.detailed-note-card.note-card-red strong[b-aywqmym6mm] { color: #e11d48; }
.detailed-note-card.note-card-default strong[b-aywqmym6mm] { color: #4b5563; }

/* Estilos Premium para la tabla de ítems de la orden y resumen de totales */
.card-order-items[b-aywqmym6mm] {
    background: #ffffff;
    border-radius: 12px;
    padding: 24px;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.03), 0 2px 4px -1px rgba(0, 0, 0, 0.01);
}

.order-detail-table-container[b-aywqmym6mm] {
    overflow-x: auto;
    background-color: #fff;
    margin-top: 16px;
}

.order-detail-table[b-aywqmym6mm] {
    border-collapse: collapse;
    margin: 0;
    padding: 0;
    font-size: 0.9rem;
}

.order-detail-table th[b-aywqmym6mm] {
    background-color: #f8fafc;
    color: #475569;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.05em;
    padding: 12px 18px;
    border-bottom: 2px solid #e2e8f0;
}

.order-detail-table td[b-aywqmym6mm] {
    padding: 16px 18px;
    border-bottom: 1px solid #f1f5f9;
    color: #334155;
}

.order-detail-table tbody tr:hover[b-aywqmym6mm] {
    background-color: #f8fafc;
}

.order-detail-table .item-taxes-info[b-aywqmym6mm] {
    color: #64748b;
    font-size: 0.75rem;
}

.order-detail-table .taxes-breakdown-cell[b-aywqmym6mm] {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-end;
    text-align: right;
    min-width: 150px;
}

.tax-item-row[b-aywqmym6mm] {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    line-height: 1.4;
    white-space: nowrap;
    width: 100%;
}

.tax-item-label[b-aywqmym6mm] {
    color: #7f8c8d;
    font-weight: 400;
}

.tax-item-val[b-aywqmym6mm] {
    color: #2c3e50;
    font-weight: 500;
}

.tax-cell-divider[b-aywqmym6mm] {
    border-top: 1px solid #b2bec3;
    width: 100%;
    margin-top: 4px;
    margin-bottom: 4px;
}

.tax-total-bold[b-aywqmym6mm] {
    font-weight: 750;
    color: #2c3e50;
    font-size: 0.95rem;
}

.order-detail-summary[b-aywqmym6mm] {
    background-color: #f8fafc !important;
    border-radius: 8px;
}

.summary-box[b-aywqmym6mm] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.summary-row[b-aywqmym6mm] {
    display: flex;
    justify-content: space-between;
    font-size: 0.9rem;
}

/* ============================================================
   RESPONSIVE MOBILE CARDS
   ============================================================ */
.order-mobile-cards[b-aywqmym6mm] {
    background-color: #f8fafc;
    border-radius: 8px;
    margin-top: 16px;
}

.order-item-card[b-aywqmym6mm] {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.order-item-card-grey-box[b-aywqmym6mm] {
    background-color: #f1f5f9;
    border-radius: 8px;
    padding: 12px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}

.grey-box-col[b-aywqmym6mm] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.grey-box-label[b-aywqmym6mm] {
    font-size: 0.65rem;
    color: #64748b;
    font-weight: 700;
    letter-spacing: 0.05em;
    margin-bottom: 4px;
    text-align: center;
}

.grey-box-val[b-aywqmym6mm] {
    font-size: 0.9rem;
    font-weight: 700;
    text-align: center;
}

.order-item-card-divider[b-aywqmym6mm] {
    border-top: 1px dashed #e2e8f0;
    margin-top: 12px;
    margin-bottom: 12px;
}

.border-top-light[b-aywqmym6mm] {
    border-top-color: #e2e8f0 !important;
}

@media (max-width: 768px) {
    .order-detail-summary[b-aywqmym6mm] {
        padding: 16px !important;
    }

    .summary-box[b-aywqmym6mm] {
        width: 100% !important;
    }
}


/* /Pages/Warranties/SignWarrantyExternally.razor.rz.scp.css */
.accept-quote-page-wrapper[b-8yv8vu1gry] {
    --primary-color: var(--tenant-theme-color, #3b82f6);
    --primary-dark: color-mix(in srgb, var(--tenant-theme-color, #3b82f6) 80%, black);
    --primary-gradient: linear-gradient(135deg, var(--tenant-theme-color, #3b82f6) 0%, color-mix(in srgb, var(--tenant-theme-color, #3b82f6) 80%, black) 100%);
    --primary-rgba-color: color-mix(in srgb, var(--tenant-theme-color, #3b82f6) 15%, transparent);

    position: relative;
    min-height: 100vh;
    width: 100%;
    background: #f8fafc;
    overflow-x: hidden;
    z-index: 1;
}

/* Background blob decorations for a modern, fluid visual style */
.background-decorations[b-8yv8vu1gry] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}

.blob[b-8yv8vu1gry] {
    position: fixed;
    border-radius: 50%;
    filter: blur(120px);
    opacity: 0.12;
    z-index: 0;
}

.blob-1[b-8yv8vu1gry] {
    top: -10%;
    right: -10%;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, var(--primary-color) 0%, var(--primary-dark) 100%);
}

.blob-2[b-8yv8vu1gry] {
    bottom: -10%;
    left: -10%;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, var(--primary-dark) 0%, var(--primary-color) 100%);
}

.content-container[b-8yv8vu1gry] {
    position: relative;
    z-index: 2;
}

/* Glassmorphism card styles */
.glass-card[b-8yv8vu1gry] {
    background: rgba(255, 255, 255, 0.82);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.45);
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04), 0 1px 3px rgba(0, 0, 0, 0.02);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Header customization */
.quote-header[b-8yv8vu1gry] {
    border-left: 6px solid var(--primary-color);
}

.tenant-logo-placeholder[b-8yv8vu1gry] {
    width: 48px;
    height: 48px;
    border-radius: 10px;
    background: var(--primary-gradient);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: 700;
    box-shadow: 0 4px 10px rgba(59, 130, 246, 0.25);
}

.tenant-name[b-8yv8vu1gry] {
    font-size: 1.35rem;
    font-weight: 700;
    color: #1e293b;
    letter-spacing: -0.025em;
}

.branch-name[b-8yv8vu1gry] {
    font-size: 0.875rem;
    font-weight: 500;
}

.quote-code[b-8yv8vu1gry] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.01em;
}

.expiration-date[b-8yv8vu1gry] {
    font-size: 0.85rem;
}

.expiration-date strong[b-8yv8vu1gry] {
    color: #334155;
}

/* Section elements styling */
.card-section-title[b-8yv8vu1gry] {
    font-size: 1.15rem;
    font-weight: 700;
    color: #1e293b;
    display: flex;
    align-items: center;
    gap: 8px;
}

.card-section-title[b-8yv8vu1gry]  svg {
    color: var(--primary-color);
    width: 20px;
    height: 20px;
}

/* Custom table styling for items */
.table-arregly[b-8yv8vu1gry] {
    margin-bottom: 0;
}

.table-arregly thead th[b-8yv8vu1gry] {
    background-color: #f1f5f9;
    color: #475569;
    font-weight: 600;
    font-size: 0.825rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 12px 16px;
    border-bottom: 2px solid #e2e8f0;
}

.table-arregly tbody td[b-8yv8vu1gry] {
    padding: 16px;
    border-bottom: 1px solid #e2e8f0;
    color: #334155;
    font-size: 0.9rem;
}

.table-arregly tbody tr:last-child td[b-8yv8vu1gry] {
    border-bottom: none;
}

.item-description-block[b-8yv8vu1gry] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.item-name[b-8yv8vu1gry] {
    color: #1e293b;
    font-size: 0.95rem;
}

.item-type-badge[b-8yv8vu1gry] {
    align-self: flex-start;
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
}

.badge-service[b-8yv8vu1gry] {
    background-color: rgba(5, 150, 105, 0.15);
    color: #047857;
}

.badge-product[b-8yv8vu1gry] {
    background-color: #f3e8ff;
    color: #7e22ce;
}

/* Client Details card style */
.client-details-list[b-8yv8vu1gry] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.client-detail-item[b-8yv8vu1gry] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.client-detail-item .label[b-8yv8vu1gry] {
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    color: #64748b;
    letter-spacing: 0.025em;
}

.client-detail-item .value[b-8yv8vu1gry] {
    font-size: 0.9rem;
    color: #334155;
    word-break: break-all;
}

/* Summary and totals styling */
.summary-card[b-8yv8vu1gry] {
    border-top: 5px solid var(--primary-color);
}

/* Loading & Error States */
.loading-state[b-8yv8vu1gry], .error-state[b-8yv8vu1gry], .success-state[b-8yv8vu1gry] {
    max-width: 600px;
    margin: 60px auto;
    border-top: 5px solid var(--primary-color);
}

.error-state[b-8yv8vu1gry] {
    border-top-color: #ef4444;
}

.success-state[b-8yv8vu1gry] {
    border-top-color: #10b981;
}

.loading-title[b-8yv8vu1gry], .error-title[b-8yv8vu1gry], .success-title[b-8yv8vu1gry] {
    font-weight: 700;
    color: #0f172a;
    letter-spacing: -0.02em;
}

.spinner-container[b-8yv8vu1gry] {
    display: inline-block;
}

.spinner[b-8yv8vu1gry] {
    width: 48px;
    height: 48px;
    border: 4px solid rgba(59, 130, 246, 0.15);
    border-top-color: var(--primary-color);
    border-radius: 50%;
    animation: spin-b-8yv8vu1gry 1s infinite linear;
}

@keyframes spin-b-8yv8vu1gry {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.error-icon-wrapper[b-8yv8vu1gry] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background-color: #fee2e2;
}

.error-svg-icon[b-8yv8vu1gry]  svg {
    color: #ef4444;
    width: 32px;
    height: 32px;
}

.error-text[b-8yv8vu1gry] {
    font-size: 1rem;
    color: #64748b;
    max-width: 450px;
    margin-left: auto;
    margin-right: auto;
}

/* Success page elements (migrados a SignatureSuccessCard compartido) */

/* Canvas Drawing Block style */
.signature-canvas-container[b-8yv8vu1gry] {
    position: relative;
    width: 100%;
    border-radius: 12px;
    overflow: hidden;
    border: 2px dashed #cbd5e1;
    background-color: #fafafa;
    transition: border-color 0.2s ease;
}

.signature-canvas-container:hover[b-8yv8vu1gry] {
    border-color: var(--primary-color);
}

/* Terms Acceptance layout styling */
.terms-acceptance-block[b-8yv8vu1gry] {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
}

.terms-text[b-8yv8vu1gry] {
    font-size: 0.85rem;
    color: #475569;
    line-height: 1.5;
}

.checkbox-custom[b-8yv8vu1gry] {
    width: 16px;
    height: 16px;
    border-radius: 4px;
    border: 1px solid #cbd5e1;
    accent-color: var(--primary-color);
    flex-shrink: 0;
}

/* Loader modal when saving */
.submitting-loader[b-8yv8vu1gry] {
    width: 100%;
    max-width: 450px;
    border-top: 5px solid var(--primary-color);
}

.submitting-loader .spinner[b-8yv8vu1gry] {
    margin: 0 auto;
}

.submitting-loader h4[b-8yv8vu1gry] {
    font-weight: 700;
    color: #0f172a;
}

.submitting-loader p[b-8yv8vu1gry] {
    font-size: 0.875rem;
}

/* Grid layout rules for dynamic responsive order */
.accept-quote-grid[b-8yv8vu1gry] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

@media (min-width: 992px) {
    .accept-quote-grid[b-8yv8vu1gry] {
        display: grid;
        grid-template-columns: 7fr 5fr;
        gap: 1.5rem;
        align-items: start;
    }
    
    .grid-details[b-8yv8vu1gry] {
        grid-column: 1;
    }
    
    .grid-totals[b-8yv8vu1gry] {
        grid-column: 2;
        position: sticky;
        top: 24px;
    }
}

@media (max-width: 768px) {
    /* Enforce exact rendering order on mobile */
    .accept-quote-grid[b-8yv8vu1gry] {
        display: flex;
        flex-direction: column;
        gap: 1rem !important;
    }

    .grid-details[b-8yv8vu1gry] {
        order: 1 !important;
    }

    .grid-totals[b-8yv8vu1gry] {
        order: 2 !important;
    }

    /* Tighter padding on mobile for cards */
    .glass-card[b-8yv8vu1gry] {
        padding: 16px !important;
    }
}

/* Custom central styles for buttons with Blazor isolation override */
[b-8yv8vu1gry] .btn-gradient-primary-arregly {
    background: var(--primary-gradient) !important;
    color: white !important;
    border: none !important;
}

[b-8yv8vu1gry] .btn-gradient-primary-arregly:hover {
    opacity: 0.95 !important;
}

[b-8yv8vu1gry] .btn-outline-primary-arregly {
    background-color: transparent !important;
    color: var(--primary-color) !important;
    border: 1px solid var(--primary-color) !important;
}

[b-8yv8vu1gry] .btn-outline-primary-arregly:hover {
    background-color: var(--primary-color) !important;
    color: white !important;
    border-color: var(--primary-color) !important;
}

[b-8yv8vu1gry] .btn-arregly.k-disabled,
[b-8yv8vu1gry] .btn-arregly:disabled {
    opacity: 0.6 !important;
    cursor: not-allowed !important;
}
/* /Pages/Warranties/Warranties.razor.rz.scp.css */
.warranty-grid-wrap[b-r9qau4odx3] {
    margin-top: 4px;
    width: 100%;
}

[b-r9qau4odx3] .custom-base-grid tbody tr > td:first-child {
    padding: 0 !important;
    cursor: pointer !important;
    transition: background-color 0.2s ease, color 0.2s ease !important;
}

[b-r9qau4odx3] .custom-base-grid tbody tr > td:first-child:hover {
    background-color: rgba(99, 102, 241, 0.12) !important;
}

[b-r9qau4odx3] .custom-base-grid tbody tr > td:first-child:hover .badge-theme-theme {
    background-color: rgba(99, 102, 241, 0.25) !important;
    color: #4f46e5 !important;
    text-decoration: underline solid !important;
}

.warranty-grid-wrap[b-r9qau4odx3]  .base-grid-container {
    margin-left: 0;
    margin-right: 0;
    width: 100%;
}

[b-r9qau4odx3] .warranty-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1;
    border: 1px solid transparent;
}

[b-r9qau4odx3] .badge-icon {
    font-size: 0.9rem !important;
}

/* Status: Solicitada */
[b-r9qau4odx3] .status-solicitada {
    background-color: #dbeafe !important;
    color: #1d4ed8 !important;
    border-color: #93c5fd !important;
}

/* Status: Esperando Firma */
[b-r9qau4odx3] .status-esperando-firma {
    background-color: #fef3c7 !important;
    color: #92400e !important;
    border-color: #fcd34d !important;
}

/* Status: Cerrada */
[b-r9qau4odx3] .status-cerrada {
    background-color: #dcfce7 !important;
    color: #166534 !important;
    border-color: #86efac !important;
}

/* Status: Facturada */
[b-r9qau4odx3] .status-facturada {
    background-color: #ede9fe !important;
    color: #6d28d9 !important;
    border-color: #c4b5fd !important;
}

/* Default / other statuses */
[b-r9qau4odx3] .status-default {
    background-color: #f3f4f6 !important;
    color: #374151 !important;
    border-color: #d1d5db !important;
}

/* Type: Gratuita */
[b-r9qau4odx3] .badge-gratuita {
    background-color: #e6fcf5 !important;
    color: #0ca678 !important;
    border-color: #c3fae8 !important;
}

/* Type: Con cobro */
[b-r9qau4odx3] .badge-con-cobro {
    background-color: #fff9db !important;
    color: #f08c00 !important;
    border-color: #ffe066 !important;
}

/* Signature */
[b-r9qau4odx3] .signature-check-icon {
    color: #10b981 !important;
    font-size: 1.2rem !important;
}

[b-r9qau4odx3] .signature-pending {
    color: #9ca3af;
    font-weight: 500;
    font-size: 0.85rem;
}

/* Cost cell regular style */
[b-r9qau4odx3] .cost-cell-bold {
    font-weight: 400;
    color: #1f2937;
    font-size: 0.95rem;
}

/* Details modal style */
.warranty-details-container[b-r9qau4odx3] {
    padding: 1rem;
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.details-grid[b-r9qau4odx3] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}

.details-group[b-r9qau4odx3] {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.details-label[b-r9qau4odx3] {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #6b7280;
    font-weight: 600;
}

.details-value[b-r9qau4odx3] {
    font-size: 0.9rem;
    color: #1f2937;
    font-weight: 500;
}

.details-value-bold[b-r9qau4odx3] {
    font-weight: 700;
}

.details-section-title[b-r9qau4odx3] {
    font-size: 1rem;
    font-weight: 600;
    color: #374151;
    border-bottom: 2px solid #f3f4f6;
    padding-bottom: 0.5rem;
    margin-bottom: 0.5rem;
}

.items-table[b-r9qau4odx3] {
    width: 100%;
    border-collapse: collapse;
}

.items-table th[b-r9qau4odx3] {
    background-color: #f9fafb;
    color: #374151;
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.5rem;
    text-align: left;
    border-bottom: 1px solid #e5e7eb;
}

.items-table td[b-r9qau4odx3] {
    padding: 0.5rem;
    font-size: 0.85rem;
    color: #4b5563;
    border-bottom: 1px solid #f3f4f6;
}

.items-table th.text-right[b-r9qau4odx3],
.items-table td.text-right[b-r9qau4odx3] {
    text-align: right;
}

/* Progress Stepper for Warranty */
.progress-steps-container[b-r9qau4odx3] {
    height: 60px;
}

.step-icon-wrap[b-r9qau4odx3] {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    font-size: 1.1rem;
    transition: all 0.3s ease;
}

.step-active[b-r9qau4odx3] {
    background-color: #ecfdf5 !important;
    color: #10b981 !important;
    border: 2px solid #10b981 !important;
    box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.1);
}

.step-inactive[b-r9qau4odx3] {
    background-color: #f9fafb !important;
    color: #9ca3af !important;
    border: 2px solid #e5e7eb !important;
}

/* Additional Status Badge Colors */
[b-r9qau4odx3] .status-aprobada {
    background-color: #dcfce7 !important;
    color: #166534 !important;
    border-color: #86efac !important;
}

[b-r9qau4odx3] .status-en-proceso {
    background-color: #dbeafe !important;
    color: #1d4ed8 !important;
    border-color: #93c5fd !important;
}

[b-r9qau4odx3] .status-entregada {
    background-color: #dbeafe !important;
    color: #1d4ed8 !important;
    border-color: #93c5fd !important;
}

[b-r9qau4odx3] .status-rechazada {
    background-color: #fee2e2 !important;
    color: #991b1b !important;
    border-color: #fca5a5 !important;
}

/* Timeline/Historial Log */
.timeline-container[b-r9qau4odx3] {
    margin-left: 10px;
}

.timeline-item[b-r9qau4odx3] {
    position: relative;
    padding-left: 20px;
}

.timeline-dot[b-r9qau4odx3] {
    z-index: 5;
    background-color: #ffffff !important;
}

.shadow-xs[b-r9qau4odx3] {
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05), 0 1px 2px 0 rgba(0, 0, 0, 0.03);
}

.cursor-pointer[b-r9qau4odx3] {
    cursor: pointer;
}

/* Copied styles from EditOrder.razor.css to keep design identical */
.order-detail-header-row[b-r9qau4odx3] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    flex-wrap: wrap;
    gap: 16px;
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px 14px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05), 0 1px 2px 0 rgba(0, 0, 0, 0.03);
    margin-bottom: 20px;
}

@media (max-width: 768px) {
    .order-detail-header-row[b-r9qau4odx3] {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    .order-header-main-info[b-r9qau4odx3] {
        align-items: flex-start !important;
    }

    .order-detail-header-actions[b-r9qau4odx3] {
        display: flex;
        flex-direction: column;
        gap: 8px !important;
        border-top: 1px solid #e2e8f0;
        padding-top: 12px;
        margin-top: 4px;
        width: 100%;
        justify-content: flex-start !important;
    }

    .order-detail-header-actions[b-r9qau4odx3]  .k-button {
        width: 100% !important;
    }

    .order-header-title[b-r9qau4odx3] {
        font-size: 1.4rem !important;
    }
}

.order-header-main-info[b-r9qau4odx3] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.order-header-title[b-r9qau4odx3] {
    font-size: 1.65rem;
    font-weight: 800;
    color: #0f172a !important;
    letter-spacing: 1px;
}

.order-header-subtitle[b-r9qau4odx3] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 0.9rem;
    color: #475569;
    line-height: 1.2;
}

.subtitle-item[b-r9qau4odx3] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.subtitle-separator[b-r9qau4odx3] {
    color: #94a3b8;
}

.order-header-subtitle[b-r9qau4odx3]  .k-svg-icon {
    align-self: center;
    position: relative;
    top: -1px;
}

@media (max-width: 576px) {
    .order-header-subtitle[b-r9qau4odx3] {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .subtitle-separator[b-r9qau4odx3] {
        display: none !important;
    }
}

.order-detail-header-row[b-r9qau4odx3]  .order-back-link-btn,
.order-detail-header-row[b-r9qau4odx3]  .order-back-link-btn.k-button {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-color: transparent !important;
    padding: 4px !important;
    color: var(--primary-color, #667eea) !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: none !important;
    transition: opacity 0.2s ease;
}

.order-detail-header-row[b-r9qau4odx3]  .order-back-link-btn:hover,
.order-detail-header-row[b-r9qau4odx3]  .order-back-link-btn.k-button:hover {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-color: transparent !important;
    opacity: 0.7 !important;
    box-shadow: none !important;
}

.order-detail-header-row[b-r9qau4odx3]  .order-back-link-btn:focus,
.order-detail-header-row[b-r9qau4odx3]  .order-back-link-btn:active,
.order-detail-header-row[b-r9qau4odx3]  .order-back-link-btn.k-button:focus,
.order-detail-header-row[b-r9qau4odx3]  .order-back-link-btn.k-button:active {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

.order-detail-header-row[b-r9qau4odx3]  .order-back-link-btn .k-svg-icon,
.order-detail-header-row[b-r9qau4odx3]  .order-back-link-btn.k-button .k-svg-icon {
    color: var(--primary-color, #667eea) !important;
}

.quote-code-highlight[b-r9qau4odx3] {
    color: var(--primary-color, #667eea) !important;
    font-weight: 700;
    text-decoration: none;
}

.quote-code-highlight:hover[b-r9qau4odx3] {
    text-decoration: underline;
    opacity: 0.85;
}

/* Order status badges */
[b-r9qau4odx3] .order-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1;
    border: 1px solid transparent;
}

[b-r9qau4odx3] .order-status-badge--created {
    color: #1d4ed8 !important;
    background-color: #dbeafe !important;
    border-color: #93c5fd !important;
}

[b-r9qau4odx3] .order-status-badge--progress {
    color: #92400e !important;
    background-color: #fef3c7 !important;
    border-color: #fcd34d !important;
}

[b-r9qau4odx3] .order-status-badge--completed {
    color: #166534 !important;
    background-color: #dcfce7 !important;
    border-color: #86efac !important;
}

[b-r9qau4odx3] .order-status-badge--invoiced {
    color: #6d28d9 !important;
    background-color: #ede9fe !important;
    border-color: #c4b5fd !important;
}

[b-r9qau4odx3] .order-status-badge--cancelled {
    color: #991b1b !important;
    background-color: #fee2e2 !important;
    border-color: #fca5a5 !important;
}

[b-r9qau4odx3] .order-status-badge--default {
    color: #374151 !important;
    background-color: #f3f4f6 !important;
    border-color: #d1d5db !important;
}

@media (max-width: 768px) {
    [b-r9qau4odx3] .grid-toolbar,
    [b-r9qau4odx3] .toolbar-left {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: 4px !important;
        width: 100% !important;
        padding: 0 !important;
    }

    [b-r9qau4odx3] .toolbar-left .toolbar-extra {
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: fit-content !important;
        min-width: 0 !important;
        margin: 0 !important;
    }

    [b-r9qau4odx3] .toolbar-left .toolbar-extra .inventory-toolbar-branch-filter {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 4px !important;
        width: auto !important;
    }

    [b-r9qau4odx3] .toolbar-left .toolbar-extra .dropdownlist-arregly,
    [b-r9qau4odx3] .toolbar-left .toolbar-extra .k-dropdownlist,
    [b-r9qau4odx3] .toolbar-left .toolbar-extra .k-picker {
        width: 72px !important;
        max-width: 72px !important;
        min-width: 72px !important;
        display: block !important;
    }

    [b-r9qau4odx3] .toolbar-left .toolbar-extra .k-input-inner {
        padding: 2px 4px 2px 6px !important;
        font-size: 0.78rem !important;
    }

    [b-r9qau4odx3] .toolbar-left .toolbar-extra .k-input-button {
        padding: 0 3px !important;
    }

    [b-r9qau4odx3] .toolbar-left .toolbar-search-group {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        width: auto !important;
        display: flex !important;
        align-items: center !important;
        gap: 4px !important;
    }

    [b-r9qau4odx3] .toolbar-left .toolbar-utility-btn {
        flex: 0 0 28px !important;
        width: 28px !important;
        height: 28px !important;
        min-width: 28px !important;
        padding: 0 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
}
/* /Pages/Warranties/WarrantyDetail.razor.rz.scp.css */
/* Header styling */
.order-detail-header-row[b-jp5e73seo8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    flex-wrap: wrap;
    gap: 16px;
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 16px 14px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05), 0 1px 2px 0 rgba(0, 0, 0, 0.03);
    margin-bottom: 20px;
}
@media (max-width: 768px) {
    .order-detail-header-row[b-jp5e73seo8] {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        padding-left: 8px !important;
        padding-right: 8px !important;
    }

    .order-header-main-info[b-jp5e73seo8] {
        align-items: flex-start !important;
    }

    [b-jp5e73seo8] .order-detail-header-actions {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: wrap !important;
        gap: 8px !important;
        border-top: 1px solid #e2e8f0;
        padding-top: 12px;
        margin-top: 6px;
        width: 100% !important;
    }

    /* Botón principal CTA: Fila superior completa (100%) */
    [b-jp5e73seo8] .order-detail-header-actions .btn-gradient-primary-arregly {
        order: 1 !important;
        width: 100% !important;
        flex: 1 1 100% !important;
    }

    /* Botones secundarios outline: Fila inferior lado a lado (50% / 50%) */
    [b-jp5e73seo8] .order-detail-header-actions .btn-outline-primary-arregly {
        order: 2 !important;
        flex: 1 1 calc(50% - 4px) !important;
        min-width: 0 !important;
    }

    /* Botón de PDF compacto y ubicado en un costado (derecha) */
    [b-jp5e73seo8] .order-detail-header-actions .btn-warranty-pdf-action {
        order: 2 !important;
        flex: 0 0 auto !important;
        width: auto !important;
        max-width: max-content !important;
        margin-left: auto !important;
        padding: 6px 14px !important;
        font-size: 0.8rem !important;
    }

    /* Estilos y clases homologados con Órdenes (Imagen 3) */
    [b-jp5e73seo8] .order-detail-header-actions .k-button,
    [b-jp5e73seo8] .order-detail-header-actions .btn-arregly {
        min-height: 32px !important;
        height: auto !important;
        padding: 8px 10px !important;
        border-radius: 12px !important;
        font-weight: 500 !important;
        font-size: 0.82rem !important;
        justify-content: center !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 6px !important;
        white-space: nowrap !important;
    }

    [b-jp5e73seo8] .order-detail-header-actions .k-button svg,
    [b-jp5e73seo8] .order-detail-header-actions .k-button .k-svg-icon {
        width: 15px !important;
        height: 15px !important;
        flex-shrink: 0 !important;
    }

    [b-jp5e73seo8] .order-detail-header-actions .k-button .k-button-text {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .order-header-title[b-jp5e73seo8] {
        font-size: 1.4rem !important;
    }
}

.order-header-main-info[b-jp5e73seo8] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.order-header-title[b-jp5e73seo8] {
    font-size: 1.65rem;
    font-weight: 800;
    color: #0f172a !important;
    letter-spacing: 1px;
    margin: 0;
}

.order-header-subtitle[b-jp5e73seo8] {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 0.9rem;
    color: #475569;
    line-height: 1.2;
    margin-top: 4px;
}

.subtitle-item[b-jp5e73seo8] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}

.subtitle-separator[b-jp5e73seo8] {
    color: #94a3b8;
}

.order-header-subtitle[b-jp5e73seo8]  .k-svg-icon {
    align-self: center;
    position: relative;
    top: -1px;
}

@media (max-width: 576px) {
    .order-header-subtitle[b-jp5e73seo8] {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .subtitle-separator[b-jp5e73seo8] {
        display: none !important;
    }
}

.order-detail-header-row[b-jp5e73seo8]  .order-back-link-btn,
.order-detail-header-row[b-jp5e73seo8]  .order-back-link-btn.k-button {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-color: transparent !important;
    padding: 4px !important;
    color: var(--primary-color, #667eea) !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-shadow: none !important;
    transition: opacity 0.2s ease;
}

.order-detail-header-row[b-jp5e73seo8]  .order-back-link-btn:hover,
.order-detail-header-row[b-jp5e73seo8]  .order-back-link-btn.k-button:hover {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-color: transparent !important;
    opacity: 0.7 !important;
    box-shadow: none !important;
}

.order-detail-header-row[b-jp5e73seo8]  .order-back-link-btn:focus,
.order-detail-header-row[b-jp5e73seo8]  .order-back-link-btn:active,
.order-detail-header-row[b-jp5e73seo8]  .order-back-link-btn.k-button:focus,
.order-detail-header-row[b-jp5e73seo8]  .order-back-link-btn.k-button:active {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

.order-detail-header-row[b-jp5e73seo8]  .order-back-link-btn .k-svg-icon,
.order-detail-header-row[b-jp5e73seo8]  .order-back-link-btn.k-button .k-svg-icon {
    color: var(--primary-color, #667eea) !important;
}

.quote-code-highlight[b-jp5e73seo8] {
    color: var(--primary-color, #667eea) !important;
    font-weight: 700;
    text-decoration: none;
}

.quote-code-highlight:hover[b-jp5e73seo8] {
    text-decoration: underline;
    opacity: 0.85;
}

.order-module-card[b-jp5e73seo8] {
    border: none;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    background-color: #fff;
}

.order-edit-page-shell[b-jp5e73seo8]  .employee-tabstrip,
.order-edit-page-shell[b-jp5e73seo8]  .employee-tabstrip .k-tabstrip-content,
.order-edit-page-shell[b-jp5e73seo8]  .employee-tabstrip .k-content,
.order-edit-page-shell[b-jp5e73seo8]  .tab-content {
    overflow: visible !important;
    overflow-y: visible !important;
    height: auto !important;
}

.order-edit-page-shell[b-jp5e73seo8]  .custom-tab-strip-container {
    padding-bottom: 0 !important;
}

/* Status Badges */
[b-jp5e73seo8] .order-status-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 600;
    line-height: 1;
    border: 1px solid transparent;
}

[b-jp5e73seo8] .order-status-badge--created {
    color: #1d4ed8 !important;
    background-color: #dbeafe !important;
    border-color: #93c5fd !important;
}

[b-jp5e73seo8] .order-status-badge--progress {
    color: #92400e !important;
    background-color: #fef3c7 !important;
    border-color: #fcd34d !important;
}

[b-jp5e73seo8] .order-status-badge--completed {
    color: #166534 !important;
    background-color: #dcfce7 !important;
    border-color: #86efac !important;
}

[b-jp5e73seo8] .order-status-badge--invoiced {
    color: #6d28d9 !important;
    background-color: #ede9fe !important;
    border-color: #c4b5fd !important;
}

[b-jp5e73seo8] .order-status-badge--cancelled {
    color: #991b1b !important;
    background-color: #fee2e2 !important;
    border-color: #fca5a5 !important;
}

[b-jp5e73seo8] .order-status-badge--default {
    color: #374151 !important;
    background-color: #f3f4f6 !important;
    border-color: #d1d5db !important;
}

.alert-cancellation-reason[b-jp5e73seo8] {
    background-color: #fff1f2;
    border: 1.5px solid #fda4af;
    border-radius: 12px;
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    margin-top: 20px;
    margin-bottom: 20px;
    box-shadow: 0 4px 12px rgba(225, 29, 72, 0.05);
}

.cancellation-icon-container[b-jp5e73seo8] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 10px;
    background-color: #ffe4e6;
    color: #e11d48;
    flex-shrink: 0;
}

.cancellation-icon-container[b-jp5e73seo8]  .k-svg-icon {
    width: 24px;
    height: 24px;
}

.cancellation-title[b-jp5e73seo8] {
    font-size: 0.95rem;
    font-weight: 700;
    color: #9f1239;
}

.cancellation-text[b-jp5e73seo8] {
    font-size: 0.9rem;
    color: #4c0519;
    line-height: 1.4;
}