/* /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] {
    font-size: .74rem;
    color: #6b7280;
    font-weight: 600;
}

.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-service-main[b-qy0e8eulll] {
    font-size: .84rem;
    color: #1f2937;
    font-weight: 700;
    margin-bottom: .55rem;
}

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

.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;
    }
}
/* /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;
}
/* /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(360px, 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-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;
}
/* /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;
}
/* /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(37, 99, 235, 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(37, 99, 235, 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(37, 99, 235, 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(37, 99, 235, 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: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    box-shadow: 0 14px 28px rgba(37, 99, 235, 0.3);
    color: #ffffff;
    font-size: 1.35rem;
    font-weight: 700;
}

.app-error-button-primary:hover[b-2mym8y30mu] {
    box-shadow: 0 18px 32px rgba(37, 99, 235, 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 #764ba2;
    /*box-shadow: 0 14px 28px rgba(255, 127, 36, 0.3);*/
    color: #764ba2;
    font-size: 1.35rem;
    font-weight: 700;
}

    .app-error-button-primary-outline :hover[b-2mym8y30mu] {
        box-shadow: 0 18px 32px rgba(255, 127, 36, 0.35);
    }


.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: 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: 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/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/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;
}
/* /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: #16a34a;
}

.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;
}

.client-actions-wrapper[b-s1876ugtx3] {
    padding-top: 12px;
}

.client-action-btn[b-s1876ugtx3] {
    min-height: 36px !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 10px !important;
    background: #ffffff !important;
    color: #111827 !important;
    padding: 0 12px !important;
    font-weight: 500 !important;
    transition: background-color 0.18s ease, border-color 0.18s ease;
}

.client-action-btn:hover[b-s1876ugtx3] {
    background: #f9fafb !important;
    border-color: #9ca3af !important;
}

/* 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] {
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .quote-detail-footer-center[b-s1876ugtx3] {
        order: 3;
        width: 100%;
        justify-content: center;
    }

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

/* /Components/Forms/Quotes/Modals/QuoteItemModal.razor.rz.scp.css */
.quote-item-selector-layout[b-jtdebytnpw] {
    align-items: stretch;
}

.qty-stepper[b-jtdebytnpw] {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.qty-stepper span[b-jtdebytnpw] {
    min-width: 30px;
    text-align: center;
    font-weight: 600;
}

.quote-item-selector-card[b-jtdebytnpw],
.quote-item-actions-card[b-jtdebytnpw] {
    border: 1px solid #dce1e7;
}

.quote-item-selector-list[b-jtdebytnpw] {
    max-height: calc((52px * 5) + (0.5rem * 4));
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    padding-right: 0.25rem;
}

.quote-catalog-item[b-jtdebytnpw] {
    border: 1px solid #e4e8ee;
    border-radius: 0.6rem;
    min-height: 52px;
    padding: 0.4rem 0.75rem;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 0.75rem;
    align-items: center;
}

.quote-catalog-item-service[b-jtdebytnpw] {
    grid-template-columns: minmax(0, 1fr) auto;
}

.quote-catalog-service-main[b-jtdebytnpw] {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
}

.quote-catalog-service-title[b-jtdebytnpw] {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.quote-catalog-service-meta[b-jtdebytnpw] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    align-items: center;
}

.quote-catalog-badge[b-jtdebytnpw] {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 0.08rem 0.5rem;
    font-size: 0.72rem;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
}

.quote-catalog-badge-associated[b-jtdebytnpw] {
    background-color: #e8f3ff;
    color: #1f5fa8;
    border: 1px solid #bdd9ff;
}

.quote-catalog-badge-unassociated[b-jtdebytnpw] {
    background-color: #f1f3f5;
    color: #4b5563;
    border: 1px solid #d7dce2;
}

.quote-catalog-badge-stock-ok[b-jtdebytnpw] {
    background-color: #eaf8ef;
    color: #207245;
    border: 1px solid #bfe7cf;
}

.quote-catalog-badge-stock-missing[b-jtdebytnpw] {
    background-color: #fdecec;
    color: #b42318;
    border: 1px solid #f7caca;
}

.quote-catalog-name[b-jtdebytnpw] {
    font-weight: 600;
    color: #2f3440;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.quote-catalog-price[b-jtdebytnpw] {
    font-weight: 600;
    white-space: nowrap;
}

.quote-catalog-item-enabled[b-jtdebytnpw] {
    cursor: pointer;
    background-color: #ffffff;
}

.quote-catalog-item-enabled:hover[b-jtdebytnpw] {
    border-color: #c9d2e0;
    background-color: #f7f9fc;
}

.quote-product-item-disabled[b-jtdebytnpw] {
    cursor: not-allowed;
    background-color: #f4f5f7;
    opacity: 0.65;
}

.quote-catalog-item-selected[b-jtdebytnpw] {
    cursor: pointer;
    border-color: #38a169;
    background-color: #f0fff4;
}

.quote-catalog-group-title[b-jtdebytnpw] {
    font-size: 0.78rem;
    font-weight: 700;
    color: #475467;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin: 0.25rem 0 0.35rem;
}

[b-jtdebytnpw] .quote-item-selected-display .k-input-inner,
[b-jtdebytnpw] .quote-item-selected-display.k-input .k-input-inner,
[b-jtdebytnpw] .quote-item-selected-display.k-textbox .k-input-inner {
    font-weight: 700;
    color: #2f3440 !important;
    -webkit-text-fill-color: #2f3440;
    opacity: 1;
}

@media (max-width: 991.98px) {
    .quote-item-selector-list[b-jtdebytnpw] {
        max-height: calc((52px * 5) + (0.5rem * 4));
    }
}

/* Estandarización de bordes, radio de curvatura y fondo en inputs */
[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;
}
/* /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;
}
/* /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;
}
/* /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/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: #764ba2;
    --secondary-color: #8e5cc7;
    --progress-bg: #ede7f6;
    --text-primary: #1a1a2e;
    --text-secondary: #6b7280;
    --card-bg: rgba(255, 255, 255, 0.98);
    --shadow: 0 20px 40px rgba(118, 75, 162, 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(118, 75, 162, 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/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, #667eea) !important;
    background: #f7f8ff !important;
    box-shadow: 0 0 0 2px rgba(102, 126, 234, 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, #667eea) !important;
    background: #eef2ff !important;
    color: var(--primary-color, #667eea) !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/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: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #ffffff;
    padding: 12px;
}

.summary-table-container[b-1pozdpvsbe] {
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #ffffff;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.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.65rem 0.85rem !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.65rem 0.85rem !important;
}

.summary-table tbody tr:hover[b-1pozdpvsbe] {
    background-color: #f8fafc;
}

.quantity-input-group[b-1pozdpvsbe] {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    max-width: 280px;
}

.summary-table[b-1pozdpvsbe]  .quantity-numeric-input {
    width: 110px !important;
    min-width: 95px !important;
    flex-shrink: 0 !important;
}

.summary-table[b-1pozdpvsbe]  .quantity-numeric-input .k-input-inner {
    padding: 0.35rem 0.5rem !important;
    min-height: 32px !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
}

.summary-table[b-1pozdpvsbe]  .quantity-unit-dropdown {
    width: 155px !important;
    min-width: 130px !important;
    flex-grow: 1 !important;
}

.summary-table[b-1pozdpvsbe]  .quantity-unit-dropdown .k-input-inner {
    padding: 0.35rem 0.5rem !important;
    min-height: 32px !important;
    font-size: 0.875rem !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: 30px;
    width: 130px;
    border-radius: 10px;
    border: 1px solid #111827;
    background: #ffffff;
    color: #111827;
    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, background 0.2s ease, opacity 0.2s ease;
    box-shadow: 0 2px 8px rgba(17, 24, 39, 0.1);
}

.service-add-button:hover:not(:disabled)[b-1pozdpvsbe] {
    transform: translateY(-1px);
    background: #f3f4f6;
    box-shadow: 0 6px 14px rgba(17, 24, 39, 0.16);
}

.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;
}

[b-1pozdpvsbe] .service-add-button.k-button,
[b-1pozdpvsbe] .service-add-button.k-button:hover,
[b-1pozdpvsbe] .service-add-button.k-button:focus,
[b-1pozdpvsbe] .service-add-button.k-button:active,
[b-1pozdpvsbe] .service-add-button.k-button.k-focus,
[b-1pozdpvsbe] .service-add-button.k-button.k-hover,
[b-1pozdpvsbe] .service-add-button.k-button.k-active,
[b-1pozdpvsbe] .service-add-button .k-button,
[b-1pozdpvsbe] .service-add-button .k-button:hover,
[b-1pozdpvsbe] .service-add-button .k-button:focus,
[b-1pozdpvsbe] .service-add-button .k-button.k-hover,
[b-1pozdpvsbe] .service-add-button .k-button.k-focus {
    border: 1px solid #9ca3af !important;
    border-color: #9ca3af !important;
    box-shadow: none !important;
    background: #ffffff !important;
}

/* 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;
}
/* /Components/Forms/TenantBranch/Forms/BranchForm.razor.rz.scp.css */
/* /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: 99999999999 !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) 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%;
}

.base-grid-initial-loading-overlay[b-rbkob7y4uz] {
    position: absolute;
    inset: 0;
    z-index: 20;
    background: transparent;
    padding: 0;
}

.base-grid-loading-state[b-rbkob7y4uz] {
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !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;
}

@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;
    }
}

@media (max-width: 768px) {
    .grid-toolbar[b-rbkob7y4uz] {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: 0.5rem !important;
        padding: 8px 12px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .toolbar-left[b-rbkob7y4uz] {
        width: 100% !important;
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: 0.5rem !important;
        flex: 1 1 auto !important;
    }

    /* Distribuir los elementos del toolbar para que ocupen anchos proporcionales en una sola fila */
    .toolbar-extra[b-rbkob7y4uz] {
        flex: 1 1 35% !important; /* El selector de sedes toma 35% */
        min-width: 90px !important;
        max-width: 130px !important;
    }

    .toolbar-extra[b-rbkob7y4uz]  .dropdownlist-arregly,
    .toolbar-extra[b-rbkob7y4uz]  .k-dropdownlist {
        width: 100% !important;
    }

    .toolbar-left[b-rbkob7y4uz] >  .search-input-container {
        flex: 1 1 50% !important; /* El buscador toma 50% */
        min-width: 110px !important;
    }

    .toolbar-left[b-rbkob7y4uz] >  .textbox-arregly {
        width: 100% !important;
    }

    /* Los botones de recarga y configuración ocupan el 15% restante */
    .toolbar-left[b-rbkob7y4uz] >  .toolbar-btn {
        flex: 0 0 auto !important;
        padding: 6px 8px !important;
        min-width: 32px !important;
        height: 30px !important;
        border-radius: 8px !important;
    }

    .toolbar-left[b-rbkob7y4uz] >  .toolbar-btn .k-button-icon {
        margin: 0 !important;
    }

    .toolbar-right[b-rbkob7y4uz] {
        display: none !important; /* Ocultar totales para salvar espacio en mobile */
    }
}

.grid-toolbar[b-rbkob7y4uz] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 0;
    background: transparent;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 10px;
}

[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) */
[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);
}

[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 */
[b-rbkob7y4uz] .toolbar-utility-btn--refresh {
    color: #4b5563;
    border-color: #e5e7eb;
}

[b-rbkob7y4uz] .toolbar-utility-btn--refresh:hover {
    color: #1d4ed8;
    border-color: #bfdbfe;
    background: #eff6ff;
}

/* Botón columnas — neutro con tinte indigo al hover */
[b-rbkob7y4uz] .toolbar-utility-btn--settings {
    color: #4b5563;
    border-color: #e5e7eb;
}

[b-rbkob7y4uz] .toolbar-utility-btn--settings:hover {
    color: #4338ca;
    border-color: #c7d2fe;
    background: #eef2ff;
}

/* Botón PDF — tinte rojo */
[b-rbkob7y4uz] .toolbar-utility-btn--pdf {
    color: #dc2626;
    border-color: #fca5a5;
    background: #fff5f5;
}

[b-rbkob7y4uz] .toolbar-utility-btn--pdf:hover {
    color: #b91c1c;
    border-color: #f87171;
    background: #fee2e2;
    box-shadow: 0 3px 8px rgba(220, 38, 38, 0.15);
}

/* Botón Excel — tinte verde coincidiendo con detalles de orden */
[b-rbkob7y4uz] .toolbar-utility-btn--excel {
    color: #166534;
    border-color: #bbf7d0;
    background: #f0fdf4;
}

[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: 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;
}

.custom-base-grid.k-loading[b-rbkob7y4uz]::after {
    background-color: rgba(255, 255, 255, 0.9);
    border-radius: 12px;
}

.custom-base-grid .k-loading-mask[b-rbkob7y4uz] {
    background-color: rgba(255, 255, 255, 0.85);
    border-radius: 12px;
    backdrop-filter: blur(4px);
}

/* =================== 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 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;
}

/* /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: 1rem;
    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;
}

.mobile-card-header[b-wejqja8fxb] {
    margin-bottom: 0.25rem;
}

.mobile-card-details[b-wejqja8fxb] {
    border-top: 1px solid #cbd5e1;
    margin-top: 0.25rem;
    padding-top: 0.5rem;
}
/* /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;
}

.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] {
    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;
}

.btn-new-order:hover[b-2eezno1133] {
    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);
}

.btn-new-order:active[b-2eezno1133] {
    transform: translateY(0);
}

[b-2eezno1133] .btn-icon {
    width: 20px;
    height: 20px;
}

/* 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] {
        padding: 14px 24px;
        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;
    }
}
/* /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] .password-input-container {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !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: .65rem !important;
    transform: translateY(-50%) !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;
    padding: .15rem !important;
    box-shadow: none !important;
    min-width: auto !important;
    height: auto !important;
    z-index: 1 !important;
}

[b-38q8plan1n] .password-toggle-icon {
    width: 1rem !important;
    height: 1rem !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;
}

[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;
}

[b-38q8plan1n] .requirement-item {
    color: #dc2626 !important;
    font-size: .86rem !important;
    line-height: 1.25 !important;
    font-weight: 600 !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/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;
}

/* Conexión DIAN */
.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;
}

/* Custom Checkbox Color */
[b-b70gflyffj] .form-check-input:checked {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}
/* /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/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.png');
    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: 1.875rem;
    font-weight: 800;
    line-height: 1.2;
    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: 1.05rem;
    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 - TELERIK OVERRIDES
   ================================================ */
.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;
}

.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.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;
}

.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.k-button[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.k-button[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.k-button: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.k-button[b-e07l7l8qnd],
    .btn-secondary-cta.k-button[b-e07l7l8qnd] {
        transition: none !important;
    }

    .btn-primary-cta.k-button: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;
}

.feature-card-description[b-0bwe9p9xye] {
    margin: 0;
    margin-top: 0.5rem;
    line-height: 1.45;
}

/* Features Section Advanced Styles */
.features-section .section-title[b-0bwe9p9xye] {
    background: linear-gradient(135deg, #1a1a1a 0%, #4a5568 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
}

/* 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: 5.5rem 1.5rem;
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
    position: relative;
    overflow: hidden;
}

/* 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;
}

/* ================================================
   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: 2.25rem;
    font-weight: 800;
    line-height: 1.25;
    color: #0f172a;
    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: 1.1rem;
    color: #64748b;
    line-height: 1.65;
    margin: 0;
}

/* ================================================
   CATEGORY FILTER TABS
   ================================================ */
.features-filter-tabs[b-8pzizo0pp8] {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.6rem;
    margin-bottom: 3rem;
}

.filter-tab[b-8pzizo0pp8] {
    padding: 0.55rem 1.25rem;
    border-radius: 9999px;
    background: #ffffff;
    border: 1px solid rgba(9, 61, 147, 0.12);
    color: #475569;
    font-size: 0.9rem;
    font-weight: 600;
    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);
}

.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;
}

/* ================================================
   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: #64748b;
}

.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: #6c757d;
}

.badge-arrow[b-p8b55vgna3] {
    font-size: 0.75rem;
    color: #6c757d;
}

.hero-title[b-p8b55vgna3] {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.2;
    color: #1a1a1a;
    margin-bottom: 1.5rem;
}

.hero-subtitle[b-p8b55vgna3] {
    max-width: 42rem;
    margin: 0 auto 2rem;
    font-size: 1rem;
    color: #6c757d;
    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 de Telerik */
.btn-primary-landing.k-button[b-p8b55vgna3] {
    background-color: #667eea;
    border-color: #667eea;
    color: white;
    padding: 0.75rem 1.5rem;
    font-size: 1.125rem;
    border-radius: 0.5rem;
    font-weight: 500;
}

    .btn-primary-landing.k-button:hover[b-p8b55vgna3] {
        background-color: #5a6fd8;
        border-color: #5a6fd8;
    }

.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;
}

    .btn-primary-outline-landing.k-button:hover[b-p8b55vgna3] {
        background-color: #667eea;
        color: white;
    }

.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: 7rem 1rem 4rem; /* Ajustado para que empiece debajo del navbar */
}

/* Video de fondo y overlay */
.video-wrapper[b-zdrbu4h33l] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.hero-bg-video[b-zdrbu4h33l] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-overlay[b-zdrbu4h33l] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* Degradado utilizando el color corporativo #093d93 */
    background: linear-gradient(135deg, rgba(15, 23, 42, 0.85) 0%, rgba(9, 61, 147, 0.65) 100%);
}

/* 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;
}

.badge-dot[b-zdrbu4h33l] {
    height: 0.5rem;
    width: 0.5rem;
    border-radius: 9999px;
    background-color: #ed7024;
}

.badge-text[b-zdrbu4h33l] {
    color: #f1f5f9;
}

.badge-arrow[b-zdrbu4h33l] {
    font-size: 0.75rem;
    color: #cbd5e1;
}

/* Títulos y Subtítulos */
.hero-title[b-zdrbu4h33l] {
    font-size: 2.25rem;
    font-weight: 800;
    line-height: 1.2;
    color: #ffffff;
    margin-bottom: 1.5rem;
    text-shadow: 0 4px 12px rgba(0, 0, 0, 0.45);
}

.hero-subtitle[b-zdrbu4h33l] {
    max-width: 42rem;
    margin: 0 auto 2.5rem;
    font-size: 1.125rem;
    color: #e2e8f0;
    line-height: 1.6;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

/* CTAs */
.hero-cta[b-zdrbu4h33l] {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    flex-wrap: nowrap;
    gap: 1.25rem;
    margin-bottom: 3.5rem;
}

/* Botones sobre video */
.hero-cta .btn-primary-landing.k-button[b-zdrbu4h33l] {
    background: linear-gradient(135deg, #093d93 0%, #093c91 100%);
    border: none;
    color: white;
    padding: 0.875rem 2rem;
    font-size: 1.125rem;
    border-radius: 0.5rem;
    font-weight: 600;
    box-shadow: 0 4px 20px rgba(9, 61, 147, 0.4);
    transition: all 0.3s ease;
}

.hero-cta .btn-primary-landing.k-button:hover[b-zdrbu4h33l] {
    transform: translateY(-2px);
    background: linear-gradient(135deg, #ed7024 0%, #fd8c1d 100%);
    box-shadow: 0 6px 24px rgba(237, 112, 36, 0.5);
}

.hero-cta .btn-primary-outline-landing.k-button[b-zdrbu4h33l] {
    background-color: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.45);
    color: #ffffff;
    padding: 0.875rem 2rem;
    font-size: 1.125rem;
    border-radius: 0.5rem;
    font-weight: 600;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    transition: all 0.3s ease;
}

.hero-cta .btn-primary-outline-landing.k-button:hover[b-zdrbu4h33l] {
    background-color: #ffffff;
    color: #093d93;
    border-color: #ffffff;
    transform: translateY(-2px);
}

.btn-lg.k-button[b-zdrbu4h33l] {
    padding: 0.875rem 1.75rem;
}

/* Estadísticas con efecto Glassmorphism */
.hero-stats[b-zdrbu4h33l] {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    padding-top: 2.5rem;
}

.stat-card-landing.k-card[b-zdrbu4h33l] {
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    border-radius: 1rem !important;
    box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.2) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
}

.stat-item[b-zdrbu4h33l] {
    text-align: center;
    opacity: 0;
    transform: translateY(20px);
    animation: fadeInUp-b-zdrbu4h33l 0.6s ease forwards;
}

.stat-value[b-zdrbu4h33l] {
    font-size: 1.75rem;
    font-weight: 800;
    color: #fd8c1d;
}

.stat-label[b-zdrbu4h33l] {
    margin-top: 0.375rem;
    font-size: 0.875rem;
    color: #cbd5e1;
}

/* Animaciones para contadores */
.stat-value .animated-counter[b-zdrbu4h33l] {
    display: inline-block;
    font-variant-numeric: tabular-nums;
    color: #fd8c1d;
}

.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);
    }
}

@media (min-width: 768px) {
    .hero-video-section[b-zdrbu4h33l] {
        padding: 8rem 2rem 5rem;
    }

    .hero-title[b-zdrbu4h33l] {
        font-size: 3rem;
    }

    .hero-subtitle[b-zdrbu4h33l] {
        font-size: 1.25rem;
    }

    .hero-stats[b-zdrbu4h33l] {
        grid-template-columns: repeat(4, 1fr);
    }

    .stat-value[b-zdrbu4h33l] {
        font-size: 2.5rem;
    }
}

@media (min-width: 992px) {
    .hero-title[b-zdrbu4h33l] {
        font-size: 3.75rem;
    }
}
/* /Components/Landing/Navbar.razor.rz.scp.css */
/* ================================================
   NAVBAR COMPONENT STYLES
   ================================================ */

.navbar-header[b-u7201g5f13] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1030;
    width: 100%;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    background-color: transparent;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(10px);
}

.navbar-header.scrolled[b-u7201g5f13] {
    background-color: rgba(255, 255, 255, 0.95);
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    backdrop-filter: blur(20px);
}

.navbar-wrapper[b-u7201g5f13] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
    min-height: 4rem;
    max-width: 1280px;
    margin: 0 auto;
    padding: 0.75rem 1rem;
}

/* ================================================
   BRAND/LOGO STYLES
   ================================================ */
.navbar-brand[b-u7201g5f13] {
    display: flex;
    align-items: center;
    text-decoration: none;
}

.navbar-logo[b-u7201g5f13] {
    height: 2.5rem;
    width: auto;
    max-width: 180px;
    object-fit: contain;
    transition: transform 0.3s ease;
}

.navbar-logo:hover[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 & ACTIVE SCROLLSPY INDICATOR
   ================================================ */
.desktop-nav[b-u7201g5f13] {
    display: none;
    align-items: center;
    gap: 0.5rem;
}

.navbar-header .nav-link[b-u7201g5f13] {
    font-size: 1rem !important;
    font-weight: 500 !important;
    color: rgba(255, 255, 255, 0.85) !important;
    text-decoration: none !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    white-space: nowrap !important;
    position: relative !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    padding: 0.5rem 0.75rem !important;
    display: inline-block !important;
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    border-bottom: 3px solid transparent !important;
    box-shadow: none !important;
}

.navbar-header.scrolled .nav-link[b-u7201g5f13] {
    color: #475569 !important;
}

.navbar-header:not(.scrolled) .nav-link:hover[b-u7201g5f13] {
    color: #ffffff !important;
    background: transparent !important;
    box-shadow: none !important;
    border-bottom: 3px solid #ffffff !important;
}

.navbar-header.scrolled .nav-link:hover[b-u7201g5f13] {
    color: #093d93 !important;
    border-bottom: 3px solid #ed7024 !important;
}

/* ESTADO ACTIVO (SCROLLSPY Y CLIC) */
.navbar-header .nav-link.active[b-u7201g5f13] {
    font-weight: 700 !important;
}

.navbar-header:not(.scrolled) .nav-link.active[b-u7201g5f13] {
    color: #ffffff !important;
    border-bottom: 3px solid #ffffff !important;
}

.navbar-header.scrolled .nav-link.active[b-u7201g5f13] {
    color: #093d93 !important;
    border-bottom: 3px solid #ed7024 !important;
}

/* ================================================
   BOTONES DE ACCIÓN (PILL SHAPE)
   ================================================ */
.desktop-actions[b-u7201g5f13] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    width: auto;
    margin-left: auto;
}

[b-u7201g5f13] .btn-navbar-outline,
[b-u7201g5f13] .btn-navbar-solid,
[b-u7201g5f13] .btn-navbar-outline.k-button,
[b-u7201g5f13] .btn-navbar-solid.k-button {
    border-radius: 9999px !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;
}

/* Transparent Navbar state */
.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-navbar-outline,
.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-navbar-outline.k-button {
    border: 1.5px solid #ffffff !important;
    background-color: transparent !important;
    color: #ffffff !important;
}

.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-navbar-outline *,
.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-navbar-outline.k-button * {
    color: #ffffff !important;
}

.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-navbar-outline:hover,
.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-navbar-outline.k-button:hover {
    background-color: rgba(255, 255, 255, 0.18) !important;
    border-color: #ffffff !important;
    color: #ffffff !important;
}

.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-navbar-solid,
.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-navbar-solid.k-button {
    background-color: #ffffff !important;
    border: 1.5px solid #ffffff !important;
    color: #000000 !important;
}

.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-navbar-solid *,
.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-navbar-solid.k-button * {
    color: #000000 !important;
}

.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-navbar-solid:hover,
.navbar-header:not(.scrolled)[b-u7201g5f13]  .btn-navbar-solid.k-button:hover {
    background-color: #f3f4f6 !important;
    border-color: #f3f4f6 !important;
    color: #000000 !important;
}

/* Scrolled Navbar state */
.navbar-header.scrolled[b-u7201g5f13]  .btn-navbar-outline,
.navbar-header.scrolled[b-u7201g5f13]  .btn-navbar-outline.k-button {
    border: 1.5px solid #093d93 !important;
    background-color: transparent !important;
    color: #093d93 !important;
}

.navbar-header.scrolled[b-u7201g5f13]  .btn-navbar-outline *,
.navbar-header.scrolled[b-u7201g5f13]  .btn-navbar-outline.k-button * {
    color: #093d93 !important;
}

.navbar-header.scrolled[b-u7201g5f13]  .btn-navbar-outline:hover,
.navbar-header.scrolled[b-u7201g5f13]  .btn-navbar-outline.k-button:hover {
    background-color: rgba(9, 61, 147, 0.08) !important;
    border-color: #093d93 !important;
    color: #093d93 !important;
}

.navbar-header.scrolled[b-u7201g5f13]  .btn-navbar-solid,
.navbar-header.scrolled[b-u7201g5f13]  .btn-navbar-solid.k-button {
    background-color: #093d93 !important;
    border: 1.5px solid #093d93 !important;
    color: #ffffff !important;
}

.navbar-header.scrolled[b-u7201g5f13]  .btn-navbar-solid *,
.navbar-header.scrolled[b-u7201g5f13]  .btn-navbar-solid.k-button * {
    color: #ffffff !important;
}

.navbar-header.scrolled[b-u7201g5f13]  .btn-navbar-solid:hover,
.navbar-header.scrolled[b-u7201g5f13]  .btn-navbar-solid.k-button:hover {
    background-color: #ed7024 !important;
    border-color: #ed7024 !important;
    color: #ffffff !important;
}

@media (max-width: 767.98px) {
    .desktop-actions[b-u7201g5f13] {
        gap: 0.375rem;
        justify-content: flex-end;
    }

    [b-u7201g5f13] .k-button {
        padding: 0.35rem 0.85rem !important;
        font-size: 0.8rem !important;
    }
}

/* ================================================
   RESPONSIVE BREAKPOINTS
   ================================================ */
@media (min-width: 576px) {
    .navbar-wrapper[b-u7201g5f13] {
        padding: 0.75rem 1.5rem;
    }
}

@media (min-width: 768px) {
    .navbar-wrapper[b-u7201g5f13] {
        flex-wrap: nowrap;
        height: 4rem;
        min-height: 4rem;
        padding: 0 1.5rem;
    }

    .desktop-nav[b-u7201g5f13] {
        display: flex;
        margin-left: 4rem;
    }

    .desktop-actions[b-u7201g5f13] {
        gap: 0.75rem;
        margin-left: auto;
    }
}

@media (min-width: 992px) {
    .navbar-wrapper[b-u7201g5f13] {
        padding: 0 2rem;
    }

    .navbar-header .nav-link[b-u7201g5f13] {
        font-size: 1.05rem !important;
    }

    .desktop-nav[b-u7201g5f13] {
        gap: 2.5rem;
    }
}

@media (min-width: 1200px) {
    .desktop-nav[b-u7201g5f13] {
        gap: 3rem;
    }
}
/* /Components/Landing/PricingSection.razor.rz.scp.css */
/* /Components/Landing/ProductShowcase.razor.rz.scp.css */
/* ================================================
   ULTRA-MODERN PRODUCT SHOWCASE (3D ROTATION + CAROUSEL + GLOW BUBBLE)
   ================================================ */
.product-section[b-1zs8m8c6c4] {
    padding: 6rem 1.5rem;
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    position: relative;
    overflow: hidden;
}

.product-container[b-1zs8m8c6c4] {
    max-width: 1280px;
    margin: 0 auto;
}

.product-grid[b-1zs8m8c6c4] {
    display: grid;
    grid-template-columns: 1fr;
    gap: 3.5rem;
    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: 2.25rem;
    font-weight: 800;
    line-height: 1.25;
    color: #0f172a;
    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: 1.05rem;
    color: #64748b;
    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);
}

.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: #334155;
    line-height: 1.45;
}

.feature-text strong[b-1zs8m8c6c4] {
    color: #0f172a;
}

/* ================================================
   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 */
.kanban-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;
}

.kanban-title[b-1zs8m8c6c4] {
    font-size: 1rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0;
}

.kanban-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); }
}

/* SLIDE 0: KANBAN COLUMNS */
.kanban-columns[b-1zs8m8c6c4] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
}

.kanban-column[b-1zs8m8c6c4] {
    background: #f1f5f9;
    border-radius: 0.75rem;
    padding: 0.75rem;
}

.column-header[b-1zs8m8c6c4] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    margin-bottom: 0.75rem;
}

.status-dot[b-1zs8m8c6c4] {
    height: 0.5rem;
    width: 0.5rem;
    border-radius: 9999px;
}

.status-yellow[b-1zs8m8c6c4] { background-color: #f59e0b; }
.status-blue[b-1zs8m8c6c4] { background-color: #093d93; }
.status-green[b-1zs8m8c6c4] { background-color: #10b981; }

.column-title[b-1zs8m8c6c4] {
    font-size: 0.75rem;
    font-weight: 700;
    color: #334155;
    flex: 1;
}

.column-count[b-1zs8m8c6c4] {
    padding: 0.1rem 0.4rem;
    border-radius: 0.25rem;
    background: #e2e8f0;
    font-size: 0.7rem;
    font-weight: 600;
    color: #475569;
}

.kanban-cards[b-1zs8m8c6c4] {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.kanban-card[b-1zs8m8c6c4] {
    padding: 0.6rem;
    border-radius: 0.5rem;
    background-color: #ffffff;
    font-size: 0.75rem;
    font-weight: 500;
    color: #0f172a;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
}

.kanban-card.highlight-border[b-1zs8m8c6c4] {
    border-left: 3px solid #093d93;
}

.card-tag[b-1zs8m8c6c4] {
    display: inline-block;
    padding: 0.1rem 0.35rem;
    border-radius: 0.2rem;
    font-size: 0.65rem;
    font-weight: 700;
    margin-bottom: 0.25rem;
}

.tag-high[b-1zs8m8c6c4] { background: #fee2e2; color: #dc2626; }
.tag-mid[b-1zs8m8c6c4] { background: #fef3c7; color: #d97706; }
.tag-blue[b-1zs8m8c6c4] { background: #dbeafe; color: #093d93; }
.tag-green[b-1zs8m8c6c4] { background: #dcfce7; color: #166534; }

/* SLIDE 1: INVOICE MOCKUP */
.dian-badge[b-1zs8m8c6c4] {
    background: rgba(16, 185, 129, 0.1);
    color: #10b981;
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0.25rem 0.65rem;
    border-radius: 9999px;
    display: flex;
    align-items: center;
}

.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: #64748b;
}

.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: #64748b;
    font-weight: 600;
}

.signature-hash[b-1zs8m8c6c4] {
    color: #10b981;
    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: #64748b;
}

.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: #d97706; }
.item-stock.success[b-1zs8m8c6c4] { background: #dcfce7; color: #15803d; }

/* SLIDE 3: ANALYTICS MOCKUP */
.live-badge[b-1zs8m8c6c4] {
    background: rgba(237, 112, 36, 0.1);
    color: #ed7024;
    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: #64748b;
    margin: 0.2rem 0;
}

.metric-trend.positive[b-1zs8m8c6c4] {
    font-size: 0.68rem;
    font-weight: 700;
    color: #10b981;
}

/* Carousel Indicators Bar */
.showcase-carousel-nav[b-1zs8m8c6c4] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin-top: 1.25rem;
}

.showcase-dot[b-1zs8m8c6c4] {
    width: 0.6rem;
    height: 0.6rem;
    border-radius: 9999px;
    background: #cbd5e1;
    border: none;
    transition: all 0.3s ease;
    cursor: pointer;
}

.showcase-dot.active[b-1zs8m8c6c4] {
    width: 1.75rem;
    background: linear-gradient(135deg, #093d93 0%, #ed7024 100%);
}

/* ================================================
   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);
    }

    .kanban-columns[b-1zs8m8c6c4],
    .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/ModalBase.razor.rz.scp.css */
.modal-overlay[b-zjptprzpg4] {
    position: fixed;
    top: 0;
    left: 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: 999;
    transition: all 0.3s ease;
    padding: 16px; /* Aporta espacio para que no choque arriba/abajo */
    box-sizing: border-box;
    /*padding: 20px;*/
}

.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: 100% !important;*/
    max-height: calc(100dvh - 32px); /* Mantener dentro de la pantalla */
    max-width: 100%;
    width: 100%;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transform: translateY(100px);
    opacity: 0;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.custom-modal.modal-enter[b-zjptprzpg4] {
    transform: translateY(0);
    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: translateY(0);
        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-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;
}

[b-zjptprzpg4] .modal-close-btn {
    border: none !important;
    background: transparent !important;
    border-radius: 8px !important;
    transition: all 0.3s ease;
    padding: 8px !important;
    min-width: auto !important;
    width: 40px;
    height: 40px;
}

[b-zjptprzpg4] .modal-title-icon,
[b-zjptprzpg4] .modal-close-btn .k-svg-icon {
    color: #6b7280 !important;
}

[b-zjptprzpg4] .modal-close-btn:hover {
    background: var(--hover-theme-arregly) !important;
    transform: scale(1.05);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

[b-zjptprzpg4] .modal-close-btn:active {
    transform: scale(0.98);
}

.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 */
    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(100dvh - 20px) !important; /* Respeta la barra de iOS */
        border-radius: 16px;
    }

    .modal-header-custom[b-zjptprzpg4] {
        /*padding: 10px;*/
        padding: 12px 16px;
    }

    /*.modal-title-text {
        font-size: 1.125rem;
    }*/

    .modal-body-custom[b-zjptprzpg4] {
        /*padding: 10px 10px;*/
        /* max-height: calc(100% - 100px);*/
        padding: 12px 16px;
    }

    .modal-footer-custom[b-zjptprzpg4] {
        /*padding: 10px 15px;
        flex-direction: row !important;
        flex-wrap: wrap;*/
        padding: 12px 16px;
        flex-direction: row !important;
        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;
}*/




















/*.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: none !important;
    background: transparent !important;
    border-radius: 8px !important;
    transition: all 0.3s ease;
    padding: 8px !important;
    min-width: auto !important;
    width: 40px;
    height: 40px;
}

::deep .modal-title-icon,
::deep .modal-close-btn .k-svg-icon {
    color: #6b7280 !important;
}

::deep .modal-close-btn:hover {
    background: var(--hover-theme-arregly) !important;
    transform: scale(1.05);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

::deep .modal-close-btn:active {
    transform: scale(0.98);
}

.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/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;
}
/* /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/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 */
/* ==========================================================================
   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.1));
    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: 1px solid #e2e8f0;
}

.scanned-info-card[b-pcm8o1xv7h] {
    background-color: #ffffff;
    border: 1px solid #e2e8f0;
    transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.scanned-info-card:hover[b-pcm8o1xv7h] {
    border-color: #cbd5e1;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.scanned-card-header[b-pcm8o1xv7h] {
    font-size: 0.75rem;
    letter-spacing: 0.05em;
}

.scanned-card-title[b-pcm8o1xv7h] {
    font-size: 0.95rem;
    color: #1e293b;
}

.scanned-field-item[b-pcm8o1xv7h] {
    font-size: 0.825rem;
    color: #475569;
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.scanned-field-item i[b-pcm8o1xv7h] {
    font-size: 0.85rem;
    flex-shrink: 0;
}

.scanned-footer-barcode[b-pcm8o1xv7h] {
    background-color: #f8fafc;
    border: 1px solid #e2e8f0;
}

.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;
    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-belonging-card__body[b-o825cw9i7m],
.order-aside-card__body[b-o825cw9i7m] {
    padding: 16px 18px;
}

.order-aside-card__header[b-o825cw9i7m] {
    background-color: #fff;
    border-bottom: 1px solid #eef2f7;
    padding: 16px 18px;
}

.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;
}

@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;
    }

    .order-belonging-card__content[b-o825cw9i7m] {
        width: 100%;
    }

    .order-belonging-card__actions[b-o825cw9i7m] {
        justify-content: flex-end;
        width: 100%;
    }
}
/* /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;
}

.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;
}

.order-section-card__header[b-i4hfdfo4c6],
.order-aside-card__header[b-i4hfdfo4c6] {
    background-color: #fff;
    border-bottom: 1px solid #eef2f7;
    padding: 16px 18px;
}

.order-section-card__body[b-i4hfdfo4c6] {
    padding: 16px 18px;
}

.order-aside-card__body[b-i4hfdfo4c6] {
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: 12px;
    flex-grow: 1;
}

.single-button-container[b-i4hfdfo4c6],
.signature-buttons-container[b-i4hfdfo4c6] {
    margin-top: auto !important;
}

.order-aside-data-row[b-i4hfdfo4c6] {
    font-size: 1.0rem;
}

.order-aside-data-label[b-i4hfdfo4c6] {
    color: #6b7280;
    margin-right: 12px;
}

.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;
}

.order-service-item[b-i4hfdfo4c6] {
    border-color: #edf0f4 !important;
    border-radius: 14px !important;
    overflow: hidden;
}

.order-service-history[b-i4hfdfo4c6] {
    border-color: #edf0f4 !important;
}

.order-products-summary[b-i4hfdfo4c6] {
    border-color: #edf0f4 !important;
    background-color: #fff !important;
}

.order-products-table-shell[b-i4hfdfo4c6] {
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    background-color: #fff;
}

.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 */
}



.service-icon-circle[b-i4hfdfo4c6] {
    flex-shrink: 0 !important;
}

@media (max-width: 480px) {
    .service-icon-circle[b-i4hfdfo4c6] {
        width: 32px !important;
        height: 32px !important;
    }
    
    [b-i4hfdfo4c6] .order-service-item .btn-arregly-add {
        padding: 4px 10px !important;
        font-size: 0.8rem !important;
        gap: 8px !important;
    }
}

/* Card state for pending information (no client, no delivery date, 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;
}

.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;
}

.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;
}

.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;
}

.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;
}

.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 */
.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);
}

.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);
}

.pending-delivery-input-btn .pending-text[b-i4hfdfo4c6] {
    flex-grow: 1;
    text-align: left;
}

.pending-delivery-input-btn .edit-icon-wrapper[b-i4hfdfo4c6] {
    display: flex;
    align-items: center;
    color: #dc3545;
}

.pending-delivery-input-btn:hover .edit-icon-wrapper[b-i4hfdfo4c6] {
    color: #bd2130;
}



/* ============================================================
   SECCIÓN DETALLE DE LA ORDEN
   ============================================================ */
.order-detail-table-container[b-i4hfdfo4c6] {
    overflow-x: auto;
    background-color: #fff;
}

.order-detail-table[b-i4hfdfo4c6] {
    border-collapse: collapse;
    margin: 0;
    padding: 0;
    font-size: 0.9rem;
}

.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;
}

.order-detail-table td[b-i4hfdfo4c6] {
    padding: 16px 18px;
    border-bottom: 1px solid #f1f5f9;
    color: #334155;
}

.order-detail-table tbody tr:hover[b-i4hfdfo4c6] {
    background-color: #f8fafc;
}

.order-detail-table .item-taxes-info[b-i4hfdfo4c6] {
    color: #64748b;
    font-size: 0.75rem;
}

.order-detail-table .taxes-breakdown-cell[b-i4hfdfo4c6] {
    display: inline-flex;
    flex-direction: column;
    align-items: flex-end;
    text-align: right;
    min-width: 150px;
}

.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%;
}

.tax-item-label[b-i4hfdfo4c6] {
    color: #7f8c8d;
    font-weight: 400;
}

.tax-item-val[b-i4hfdfo4c6] {
    color: #2c3e50;
    font-weight: 500;
}

.tax-cell-divider[b-i4hfdfo4c6] {
    border-top: 1px solid #b2bec3;
    width: 100%;
    margin-top: 4px;
    margin-bottom: 4px;
}

.tax-total-bold[b-i4hfdfo4c6] {
    font-weight: 750;
    color: #2c3e50;
    font-size: 0.95rem;
}


.order-detail-summary[b-i4hfdfo4c6] {
    background-color: #f8fafc !important;
}

.summary-row[b-i4hfdfo4c6] {
    font-size: 0.9rem;
}

/* ============================================================
   DESGLOSE DE COSTOS DEL SERVICIO
   ============================================================ */
.order-service-cost-breakdown[b-i4hfdfo4c6] {
    border: 1px solid #e2e8f0 !important;
    background-color: #f8fafc !important;
    border-radius: 10px !important;
}

.order-service-cost-breakdown h6[b-i4hfdfo4c6] {
    color: #475569 !important;
    letter-spacing: 0.05em;
}

.cost-breakdown-box[b-i4hfdfo4c6] {
    max-width: 100%;
}

.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 (DISEÑO PROPUESTO)
   ============================================================ */
.order-mobile-cards[b-i4hfdfo4c6] {
    background-color: #f8fafc;
}

.order-item-card[b-i4hfdfo4c6] {
    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-i4hfdfo4c6] {
    background-color: #f1f5f9;
    border-radius: 8px;
    padding: 12px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
}

.grey-box-col[b-i4hfdfo4c6] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.grey-box-label[b-i4hfdfo4c6] {
    font-size: 0.65rem;
    color: #64748b;
    font-weight: 700;
    letter-spacing: 0.05em;
    margin-bottom: 4px;
    text-align: center;
}

.grey-box-val[b-i4hfdfo4c6] {
    font-size: 0.9rem;
    font-weight: 700;
    text-align: center;
}

.order-item-card-divider[b-i4hfdfo4c6] {
    border-top: 1px dashed #e2e8f0;
    margin-top: 12px;
    margin-bottom: 12px;
}

.border-top-light[b-i4hfdfo4c6] {
    border-top-color: #e2e8f0 !important;
}

/* Glassmorphism Signature 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;
}

.signature-conformity-card:hover[b-i4hfdfo4c6] {
    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.08) !important;
    transform: translateY(-2px);
}

.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;
}

.signature-conformity-card.order-aside-card--no-signature:hover[b-i4hfdfo4c6] {
    transform: none !important;
}

.signature-conformity-card.order-aside-card--no-signature .order-aside-card__header[b-i4hfdfo4c6] {
    background-color: #fef2f2 !important;
    border-bottom: 1px solid #fecaca;
}

.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;
}

.signature-display-box:hover[b-i4hfdfo4c6] {
    box-shadow: 0 4px 16px rgba(0, 200, 83, 0.1) !important;
}

.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],
.order-aside-card__body[b-tjcvalwxg7] {
    /*padding: 16px 18px;*/
}

.order-history-card__body[b-tjcvalwxg7] {
    padding: 22px 24px;
}

.order-aside-card__header[b-tjcvalwxg7] {
    background-color: #fff;
    border-bottom: 1px solid #eef2f7;
    padding: 16px 18px;
}

.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: 16px 20px;
    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;
    }
}
/* /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: 18px 22px;
    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;
}

/* 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 18px;
}

.order-section-card__body[b-96ifgwepjy],
.order-aside-card__body[b-96ifgwepjy] {
    padding: 16px 18px;
}

.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__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);
    }
}
/* /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;
}

/* /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/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/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/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/TableSkeletonLoading.razor.rz.scp.css */
.skeleton[b-wosc0wggaq] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: skeleton-loading-b-wosc0wggaq 1.5s infinite;
    border-radius: 4px;
    display: inline-block;
}

.skeleton-text[b-wosc0wggaq] {
    border-radius: 4px;
}

.skeleton-avatar[b-wosc0wggaq] {
    border-radius: 50%;
}

.skeleton-button[b-wosc0wggaq] {
    border-radius: 6px;
}

@keyframes skeleton-loading-b-wosc0wggaq {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

.table-skeleton-container[b-wosc0wggaq] {
    background: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    border: 1px solid #e5e7eb;
}

.skeleton-header[b-wosc0wggaq] {
    background: #f8fafc;
    padding: 16px 20px;
    border-bottom: 1px solid #e2e8f0;
}

.skeleton-rows[b-wosc0wggaq] {
    padding: 0;
}

.skeleton-row[b-wosc0wggaq] {
    padding: 16px 20px;
    border-bottom: 1px solid #f1f5f9;
    transition: background-color 0.2s ease;
}

.skeleton-row:hover[b-wosc0wggaq] {
    background: #f9fafb;
}

.skeleton-row:last-child[b-wosc0wggaq] {
    border-bottom: none;
}

.skeleton-footer[b-wosc0wggaq] {
    padding: 16px 20px;
    border-top: 1px solid #e2e8f0;
    background: #f9fafb;
}

@media (max-width: 768px) {
    .skeleton-header[b-wosc0wggaq],
    .skeleton-row[b-wosc0wggaq],
    .skeleton-footer[b-wosc0wggaq] {
        padding: 12px 16px;
    }

    .skeleton-row .d-flex[b-wosc0wggaq] {
        flex-direction: column;
        gap: 8px;
        align-items: flex-start !important;
    }

    .skeleton-row .col-1[b-wosc0wggaq],
    .skeleton-row .col-3[b-wosc0wggaq],
    .skeleton-row .col-4[b-wosc0wggaq] {
        width: 100%;
    }
}
/* /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/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/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: 450px;
    overflow-y: auto;
    padding: 1.25rem;
}

/* Switch personalización */
[b-7ys2re8uq7] .switch-arregly.k-switch {
    width: 72px !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, #667eea) !important;
    border-color: var(--primary-color, #667eea) !important;
    box-shadow: none !important;
}

/* Checkbox personalizado */
.checkbox-theme-arregly[b-7ys2re8uq7] {
    accent-color: var(--primary-color, #667eea);
    width: 18px;
    height: 18px;
    cursor: pointer;
    margin-top: 3px;
}

/* Checklist Módulos y Beneficios */
.tab-instruction-text[b-7ys2re8uq7] {
    font-size: 0.9rem;
    color: #6c757d;
    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 #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-7ys2re8uq7] {
    border-color: var(--primary-color, #667eea);
    background: #f8fafc;
}

.checklist-item-box.checked[b-7ys2re8uq7] {
    border-color: var(--primary-color, #667eea);
    background: #f0f3ff;
}

.checklist-label-wrapper[b-7ys2re8uq7] {
    display: flex;
    gap: 12px;
    cursor: pointer;
    flex-grow: 1;
    margin-bottom: 0;
}

.checklist-icon-wrap[b-7ys2re8uq7] {
    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-7ys2re8uq7] {
    background: var(--primary-color, #667eea);
    color: #ffffff;
}

.checklist-info[b-7ys2re8uq7] {
    display: flex;
    flex-direction: column;
}

.checklist-name[b-7ys2re8uq7] {
    font-weight: 600;
    font-size: 0.92rem;
    color: #212529;
}

.checklist-desc[b-7ys2re8uq7] {
    font-size: 0.78rem;
    color: #6c757d;
    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: #495057;
    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: 420px !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 Arregly para Tabla Desktop */
[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: #f0f3ff !important;
}

[b-7ys2re8uq7] .table-arregly tbody tr.editing-row td:first-child {
    border-left: 4px solid var(--primary-color, #667eea);
}

[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: #f0f3ff;
    color: var(--primary-color, #667eea);
}

[b-7ys2re8uq7] .btn-action-edit:hover {
    background-color: var(--primary-color, #667eea);
    color: #ffffff;
    transform: scale(1.1);
    box-shadow: 0 4px 10px rgba(102, 126, 234, 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: #f4f7ff !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/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: #e0e7ff;
    color: #4338ca;
}

.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: #e0e7ff;
    color: #4338ca;
}

.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, #667eea) !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;
}
/* /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, #667eea) !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/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: 99999 !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: 16px 20px;
    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: 32px;
    height: 32px;
    font-size: 0.95rem;
    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;
}

/* 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; }
/* /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;
}
/* /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: 24px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05);
    overflow: hidden;
    min-width: 0;
}

.history-card-header[b-jw8rfyaul2] {
    margin-bottom: 24px;
    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/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;
    }
}

.header-stock-alert[b-pfucypd37e] {
    width: auto;
    max-width: max-content;
    border-radius: 25px;
    border: 1px solid transparent;
    padding: 8px 12px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 0;
}

.header-stock-alert.warning[b-pfucypd37e] {
    background: rgba(255, 243, 205, 0.95);
    border-color: rgba(255, 230, 156, 0.95);
}

.header-stock-alert.critical[b-pfucypd37e] {
    background: rgba(248, 215, 218, 0.95);
    border-color: rgba(241, 174, 181, 0.95);
}

[b-pfucypd37e] .header-stock-alert-icon {
    width: 14px;
    height: 14px;
}

.header-stock-alert.warning[b-pfucypd37e]  .header-stock-alert-icon {
    color: #ea580c;
}

.header-stock-alert.critical[b-pfucypd37e]  .header-stock-alert-icon {
    color: #dc2626;
}

.header-stock-alert-text[b-pfucypd37e] {
    min-width: 0;
}

.header-stock-alert-title[b-pfucypd37e] {
    font-size: 0.875rem;
    font-weight: 700;
    color: #111827;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.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;
    }

    .header-stock-alert[b-pfucypd37e] {
        display: none;
    }

    .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;
}
/* /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: grid;
    grid-template-columns: 240px 1fr;
    gap: 1.5rem;
    margin-top: 1.5rem;
}

@media (max-width: 992px) {
    .analytics-layout[b-lu5tjggszy] {
        grid-template-columns: 1fr;
    }
}

/* Sidebar selector list */
.analytics-sidebar[b-lu5tjggszy] {
    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;
}

@media (max-width: 992px) {
    .analytics-sidebar[b-lu5tjggszy] {
        flex-direction: row;
        overflow-x: auto;
        padding: 0.5rem;
        white-space: nowrap;
    }
}

.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);
}

.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] {
    min-width: 0;
    width: 100%;
    overflow: hidden;
}

/* 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/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 */

.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-photo[b-w0zlg4ri7b] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0;
    border: 0;
    box-shadow: none;
}

.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: #7c8cff;
    transform: scale(1.08);
    box-shadow: none;
}

.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],
.register-action[b-w0zlg4ri7b] {
    color: #4a9eff;
    text-decoration: none;
    font-size: 1rem;
}

.help-link:hover[b-w0zlg4ri7b],
.register-action:hover[b-w0zlg4ri7b] {
    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: #999;
    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 */
/* Recuperar Contraseña */

.reset-password-container[b-gv4kuekerr] {
    min-height: 100vh;
    background: var(--primary-gradient) !important;
    display: flex;
    flex-direction: column;
}

.reset-password-container[b-gv4kuekerr]::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 140px;
    background: linear-gradient(135deg, #059669 0%, #047857 100%);
    z-index: -1;
}

.reset-card[b-gv4kuekerr] {
    background: white;
    border-radius: 20px;
    padding: 40px;
    max-width: 450px;
    width: 100%;
    margin: 156px auto 28px auto;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    position: relative;
}

.form-description[b-gv4kuekerr] {
    text-align: center;
    margin-bottom: 16px;
    padding: 0 6px;
}

.form-description p[b-gv4kuekerr] {
    margin: 0;
    color: #6b7280;
    line-height: 1.5;
    font-size: 15px;
}

.reset-form[b-gv4kuekerr] {
    text-align: left;
}

.form-field[b-gv4kuekerr] {
    margin-bottom: 25px;
}

.field-label[b-gv4kuekerr] {
    display: block;
    font-weight: 500;
    color: #374151;
    margin-bottom: 8px;
    font-size: 14px;
}

.textbox-arregly[b-gv4kuekerr] {
    width: 100%;
    padding: 14px 16px;
    border: 2px solid #d1d5db;
    border-radius: 8px;
    font-size: 16px;
    transition: all 0.2s ease;
    background: white;
}

.textbox-arregly:focus[b-gv4kuekerr] {
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
    outline: none;
}

.back-link[b-gv4kuekerr] {
    text-align: center;
    margin-top: 20px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.back-link-action[b-gv4kuekerr] {
    color: #6b7280;
    text-decoration: none;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    transition: color 0.2s ease;
}

.back-link-action:hover[b-gv4kuekerr] {
    color: #374151;
}

.back-link .k-svg-icon[b-gv4kuekerr] {
    font-size: 14px;
}

.reset-form .btn-gradient-primary-arregly[b-gv4kuekerr] {
    color: #ffffff !important;
    font-weight: 700 !important;
}

.reset-footer[b-gv4kuekerr] {
    text-align: center;
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px solid #e5e7eb;
}

.reset-footer p[b-gv4kuekerr] {
    font-size: 12px;
    color: #9ca3af;
    margin: 0;
    line-height: 1.4;
}

.reset-footer a[b-gv4kuekerr] {
    color: #3b82f6;
    text-decoration: none;
}

.reset-footer a:hover[b-gv4kuekerr] {
    text-decoration: underline;
}

.validation-message[b-gv4kuekerr] {
    color: #dc2626;
    font-size: 12px;
    margin-top: 4px;
    display: block;
}

@media (max-width: 768px) {
    .reset-card[b-gv4kuekerr] {
        margin: 144px 20px 28px 20px;
        padding: 30px 20px 40px 20px;
    }
}
/* /Pages/Auth/PasswordRecovery/NewPassword.razor.rz.scp.css */
.new-password-container[b-p884fdqqz1] {
    min-height: 100vh;
    background: var(--primary-gradient) !important;
    display: flex;
    flex-direction: column;
}

.new-password-container[b-p884fdqqz1]::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 140px;
    background: linear-gradient(135deg, #059669 0%, #047857 100%);
    z-index: -1;
}

.password-card[b-p884fdqqz1] {
    background: white;
    border-radius: 20px;
    padding: 40px;
    max-width: 500px;
    width: 100%;
    margin: 160px auto 40px auto;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    position: relative;
}

.password-description[b-p884fdqqz1] {
    background: #f8f9fa;
    border-radius: 8px;
    padding: 15px;
    margin-bottom: 25px;
    border-left: 3px solid #3b82f6;
    text-align: left;
}

.password-description p[b-p884fdqqz1] {
    margin: 0;
    color: #6b7280;
    line-height: 1.5;
    font-size: 14px;
}

.password-form[b-p884fdqqz1] {
    text-align: left;
}

.form-field[b-p884fdqqz1] {
    margin-bottom: 20px;
}

.password-form .btn-gradient-primary-arregly[b-p884fdqqz1] {
    color: #ffffff !important;
    font-weight: 700 !important;
}

.password-footer[b-p884fdqqz1] {
    text-align: center;
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid #e5e7eb;
}

.password-footer p[b-p884fdqqz1] {
    font-size: 12px;
    color: #9ca3af;
    margin: 0;
    line-height: 1.4;
}

.password-footer a[b-p884fdqqz1] {
    color: #3b82f6;
    text-decoration: none;
}

.password-footer a:hover[b-p884fdqqz1] {
    text-decoration: underline;
}

@media (max-width: 768px) {
    .password-card[b-p884fdqqz1] {
        margin: 144px 20px 28px 20px;
        padding: 30px 20px 40px 20px;
    }
}
/* /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(59, 130, 246, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 22px;
    border: 1px solid rgba(59, 130, 246, 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(59, 130, 246, 0.45);
    border-radius: 50%;
    animation: pulse-ring 1.5s infinite;
}

.recovery-hero-icon-circle .k-svg-icon[b-aqem0jb8go] {
    font-size: 32px;
    color: #3b82f6;
}

@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 */
/* Verificar Código */

.verify-code-container[b-h9ti2cubeo] {
    min-height: 100vh;
    background: var(--primary-gradient) !important;
    display: flex;
    flex-direction: column;
}

.verify-code-container[b-h9ti2cubeo]::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 140px;
    background: linear-gradient(135deg, #059669 0%, #047857 100%);
    z-index: -1;
}

.verify-card[b-h9ti2cubeo] {
    background: white;
    border-radius: 20px;
    padding: 40px;
    max-width: 450px;
    width: 100%;
    margin: 160px auto 40px auto;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    position: relative;
}

.email-info[b-h9ti2cubeo] {
    text-align: center;
    margin-bottom: 16px;
}

.email-info p[b-h9ti2cubeo] {
    margin: 4px 0;
    color: #6b7280;
    font-size: 15px;
}

.email-display[b-h9ti2cubeo] {
    font-weight: 600;
    color: #374151;
    font-size: 16px;
}

.code-form[b-h9ti2cubeo] {
    margin-bottom: 30px;
}

.code-form > .btn-arregly[b-h9ti2cubeo] {
    margin-bottom: 0 !important;
}

.code-inputs[b-h9ti2cubeo] {
    display: flex;
    gap: 12px;
    justify-content: center;
    margin-bottom: 30px;
}

.code-input[b-h9ti2cubeo] {
    width: 50px;
    height: 50px;
    border: 2px solid #d1d5db;
    border-radius: 8px;
    text-align: center;
    font-size: 20px;
    font-weight: bold;
    color: #374151;
    transition: all 0.2s ease;
    background: white;
}

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

.code-input:disabled[b-h9ti2cubeo] {
    background-color: #f9fafb;
    cursor: not-allowed;
    opacity: 0.6;
}

.resend-section[b-h9ti2cubeo] {
    text-align: center;
    margin-top: 12px;
    margin-bottom: 20px;
}

.resend-section .recovery-resend-btn[b-h9ti2cubeo] {
    margin-bottom: 0 !important;
}

.resend-section .recovery-resend-btn[b-h9ti2cubeo],
.resend-section .recovery-resend-btn:hover[b-h9ti2cubeo],
.resend-section .recovery-resend-btn:focus[b-h9ti2cubeo] {
    color: #1f3c88 !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
}

.resend-section .recovery-resend-btn:disabled[b-h9ti2cubeo] {
    opacity: 1 !important;
    background: #e9edff !important;
    border-color: #c6d0ff !important;
    color: #4a5b8a !important;
}

[b-h9ti2cubeo] .resend-section .recovery-resend-btn.k-disabled,
[b-h9ti2cubeo] .resend-section .recovery-resend-btn[disabled] {
    opacity: 1 !important;
    background: #e9edff !important;
    border-color: #c6d0ff !important;
    color: #2f3f72 !important;
}

[b-h9ti2cubeo] .resend-section .recovery-resend-btn.k-disabled .k-button-text,
[b-h9ti2cubeo] .resend-section .recovery-resend-btn[disabled] .k-button-text,
[b-h9ti2cubeo] .resend-section .recovery-resend-btn.k-disabled .k-button-icon,
[b-h9ti2cubeo] .resend-section .recovery-resend-btn[disabled] .k-button-icon,
[b-h9ti2cubeo] .resend-section .recovery-resend-btn.k-disabled span,
[b-h9ti2cubeo] .resend-section .recovery-resend-btn[disabled] span {
    color: #2f3f72 !important;
    opacity: 1 !important;
    font-weight: 700 !important;
}

.change-email[b-h9ti2cubeo] {
    text-align: center;
    margin-top: 20px;
}

.change-email-link[b-h9ti2cubeo] {
    color: #6b7280;
    text-decoration: none;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    transition: color 0.2s ease;
}

.change-email-link:hover[b-h9ti2cubeo] {
    color: #374151;
}

.change-email .k-svg-icon[b-h9ti2cubeo] {
    font-size: 14px;
}

.code-form .btn-gradient-primary-arregly[b-h9ti2cubeo] {
    color: #ffffff !important;
    font-weight: 700 !important;
}

.verify-footer[b-h9ti2cubeo] {
    text-align: center;
    margin-top: 40px;
    padding-top: 20px;
    border-top: 1px solid #e5e7eb;
}

.verify-footer p[b-h9ti2cubeo] {
    font-size: 12px;
    color: #9ca3af;
    margin: 0;
    line-height: 1.4;
}

.verify-footer a[b-h9ti2cubeo] {
    color: #3b82f6;
    text-decoration: none;
}

.verify-footer a:hover[b-h9ti2cubeo] {
    text-decoration: underline;
}

@media (max-width: 768px) {
    .verify-card[b-h9ti2cubeo] {
        margin: 144px 20px 28px 20px;
        padding: 30px 20px 40px 20px;
    }

    .code-inputs[b-h9ti2cubeo] {
        gap: 8px;
    }

    .code-input[b-h9ti2cubeo] {
        width: 45px;
        height: 45px;
        font-size: 18px;
    }
}
/* /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: #2563eb;
}

.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) !important;
    color: var(--primary-text-color) !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(--primary-color);
        border-radius: 50%;
        animation: pulse-ring-b-h9e18frqlk 1.5s infinite;
    }

.telerik-step.completed .telerik-step-icon[b-h9e18frqlk] {
    background-color: var(--primary-color);
    color: var(--primary-text-color);
}

.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);
    font-weight: 600;
}

.telerik-step.completed .telerik-step-title[b-h9e18frqlk] {
    color: var(--primary-color);
    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: #2563eb;
    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: 200px auto 0 auto;
    width: 900px !important;
}

@media (max-width: 768px) {
    /* Ajuste responsive para móviles */
    .card-register[b-h9e18frqlk] {
        margin: 135px auto 0 auto;
        padding: 20px;
        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 */
.success-container[b-qni4ulfmh7] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #f5f7ff 0%, #eef2ff 100%);
    padding: 1.5rem;
}

.loading-card[b-qni4ulfmh7] {
    width: 100%;
    max-width: 420px;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 12px 40px rgba(44, 90, 160, 0.12);
    padding: 2rem;
    text-align: center;
}

.loading-title[b-qni4ulfmh7] {
    margin: 1.25rem 0 .5rem;
    color: #1f2937;
    font-size: 1.5rem;
}

.loading-description[b-qni4ulfmh7] {
    margin: 0;
    color: #4b5563;
}

.success-card[b-qni4ulfmh7] {
    width: 100%;
    max-width: 520px;
    background: #fff;
    border-radius: 16px;
    box-shadow: 0 12px 40px rgba(44, 90, 160, 0.12);
    padding: 2rem;
    text-align: center;
}

.success-header[b-qni4ulfmh7] {
    margin-bottom: 1rem;
}

.brand-logo[b-qni4ulfmh7] {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    color: #2c5aa0;
    font-weight: 600;
}

.brand-text[b-qni4ulfmh7] {
    font-size: 1.1rem;
}

.success-icon[b-qni4ulfmh7] {
    margin: 1rem 0;
}

.icon-circle[b-qni4ulfmh7] {
    width: 72px;
    height: 72px;
    margin: 0 auto;
    border-radius: 999px;
    background: #eaf1ff;
    color: #2c5aa0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.success-content[b-qni4ulfmh7] {
    margin: 1rem 0 1.5rem;
}

.success-title[b-qni4ulfmh7] {
    margin: 0;
    color: #1f2937;
    font-size: 1.5rem;
}

.success-description[b-qni4ulfmh7] {
    margin-top: .75rem;
    color: #4b5563;
}

.success-actions[b-qni4ulfmh7] {
    margin-top: 1rem;
}

.success-footer[b-qni4ulfmh7] {
    margin-top: 1.5rem;
    color: #6b7280;
    font-size: .85rem;
}
/* /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/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/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/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/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: 340px) {
    /* 1. Reducir combobox a 50px */
    [b-swf66nl452] .toolbar-left .toolbar-extra,
    [b-swf66nl452] .toolbar-left .toolbar-extra .dropdownlist-arregly,
    [b-swf66nl452] .toolbar-left .toolbar-extra .k-dropdownlist {
        width: 50px !important;
        min-width: 50px !important;
        max-width: 50px !important;
        flex: 0 0 50px !important;
    }

    /* 2. Reducir el buscador a 90px */
    [b-swf66nl452] .toolbar-left .search-input-container {
        width: 90px !important;
        min-width: 90px !important;
        max-width: 90px !important;
        flex: 0 0 90px !important;
    }

    /* 3. Quitar las flechas y ocultar desbordamientos */
    [b-swf66nl452] .k-grid-toolbar,
    [b-swf66nl452] .k-toolbar,
    [b-swf66nl452] .grid-toolbar {
        overflow: hidden !important;
    }

    [b-swf66nl452] .k-toolbar-scroll-button,
    [b-swf66nl452] .k-scroll-button,
    [b-swf66nl452] .k-button-scroll {
        display: none !important;
    }
}

@media (max-width: 768px) {
    [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;
    }
}
/* /Pages/Home.razor.rz.scp.css */
.landing-page[b-ijftnp0kz9] {
    min-height: 100vh;
    background-color: white;
}

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 */

/* Contenedor de movimientos */
.movements-container[b-sw02hht6lw] {
    padding: 0;
}

.movements-header[b-sw02hht6lw] {
    margin-bottom: 20px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e5e7eb;
}

.movements-header h4[b-sw02hht6lw] {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: #374151;
}

.no-movements[b-sw02hht6lw] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    text-align: center;
    color: #6b7280;
}

.no-movements svg[b-sw02hht6lw] {
    width: 64px;
    height: 64px;
    margin-bottom: 16px;
    color: #d1d5db;
}

.no-movements h3[b-sw02hht6lw] {
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 8px 0;
    color: #374151;
}

.no-movements p[b-sw02hht6lw] {
    font-size: 14px;
    margin: 0;
    max-width: 400px;
}


.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] .toolbar-left .toolbar-extra,
    [b-sw02hht6lw] .toolbar-left .search-input-container,
    [b-sw02hht6lw] .toolbar-left > .k-button,
    [b-sw02hht6lw] .toolbar-right {
        order: initial;
    }

    [b-sw02hht6lw] .toolbar-left .toolbar-extra .inventory-toolbar-branch-filter .k-picker {
        min-width: 100%;
    }


    .movements-header[b-sw02hht6lw] {
        text-align: center;
    }
}

/* Ajustes exclusivos para dispositivos de 320px para mantener una fila proporcional sin flechas */
@media (max-width: 340px) {
    /* 1. Ocultar las flechas de scroll de Telerik */
    [b-sw02hht6lw] .k-toolbar-scroll-button,
    [b-sw02hht6lw] .k-scroll-button,
    [b-sw02hht6lw] .k-button-scroll {
        display: none !important;
    }

    [b-sw02hht6lw] .k-grid-toolbar,
    [b-sw02hht6lw] .k-toolbar,
    [b-sw02hht6lw] .grid-toolbar {
        overflow: hidden !important;
        padding: 8px 6px !important; /* Optimizar paddings laterales */
    }

    /* 2. Forzar fila única y reducir la separación (gap) */
    [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;
    }

    /* 3. Reducir combobox de sede a 60px */
    [b-sw02hht6lw] .toolbar-left .toolbar-extra {
        width: 60px !important;
        min-width: 60px !important;
        max-width: 60px !important;
        flex: 0 0 60px !important;
        margin: 0 !important;
    }

    [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: 100% !important;
        min-width: 0 !important;
    }

    /* 4. Reducir el buscador a 95px */
    [b-sw02hht6lw] .toolbar-left .search-input-container {
        width: 95px !important;
        min-width: 95px !important;
        max-width: 95px !important;
        flex: 0 0 95px !important;
    }

    /* 5. Optimizar los botones de utilidad a 30px */
    [b-sw02hht6lw] .toolbar-left .toolbar-utility-btn {
        width: 30px !important;
        height: 30px !important;
        min-width: 30px !important;
        flex: 0 0 30px !important;
    }
}
/* /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: 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-i367de5fti]  .k-button {
        width: 100% !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[b-i367de5fti] {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 12px;
}

/* 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;
}
/* /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/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);
}

/* 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);
}

/* 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;
}

/* Sobreescribir el color naranja del checkbox por negro */
[b-bm10i30sku] .k-checkbox:checked,
[b-bm10i30sku] .k-checkbox.k-checked,
[b-bm10i30sku] .k-checkbox:indeterminate,
[b-bm10i30sku] .k-checkbox.k-indeterminate {
    background-color: #000000 !important;
    border-color: #000000 !important;
    color: #ffffff !important;
}

[b-bm10i30sku] .k-checkbox:focus,
[b-bm10i30sku] .k-checkbox.k-focus {
    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.2) !important;
    border-color: #000000 !important;
}

[b-bm10i30sku] .k-checkbox:hover:checked,
[b-bm10i30sku] .k-checkbox.k-checked:hover {
    background-color: #1a1a1a !important;
    border-color: #1a1a1a !important;
}

/* 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;
    }
}
/* /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--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;
}

/* Ajustes exclusivos para dispositivos de 320px para mantener una fila proporcional sin flechas */
@media (max-width: 340px) {
    /* 1. Ocultar las flechas de scroll de Telerik */
    [b-0w6tbi7ygr] .k-toolbar-scroll-button,
    [b-0w6tbi7ygr] .k-scroll-button,
    [b-0w6tbi7ygr] .k-button-scroll {
        display: none !important;
    }

    [b-0w6tbi7ygr] .k-grid-toolbar,
    [b-0w6tbi7ygr] .k-toolbar,
    [b-0w6tbi7ygr] .grid-toolbar {
        overflow: hidden !important;
        padding: 8px 6px !important; /* Optimizar paddings laterales */
    }

    /* 2. Forzar fila única y reducir la separación (gap) */
    [b-0w6tbi7ygr] .grid-toolbar,
    [b-0w6tbi7ygr] .toolbar-left {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: 4px !important;
        width: 100% !important;
    }

    /* 3. Reducir combobox de sede a 90px */
    [b-0w6tbi7ygr] .toolbar-left .toolbar-extra {
        width: 90px !important;
        min-width: 90px !important;
        max-width: 90px !important;
        flex: 0 0 90px !important;
        margin: 0 !important;
    }

    [b-0w6tbi7ygr] .toolbar-left .toolbar-extra .dropdownlist-arregly,
    [b-0w6tbi7ygr] .toolbar-left .toolbar-extra .k-dropdownlist,
    [b-0w6tbi7ygr] .toolbar-left .toolbar-extra .k-picker {
        width: 100% !important;
        min-width: 0 !important;
    }

    /* 4. Reducir el buscador a 90px */
    [b-0w6tbi7ygr] .toolbar-left .search-input-container {
        width: 90px !important;
        min-width: 90px !important;
        max-width: 90px !important;
        flex: 0 0 90px !important;
    }
    /* 5. Optimizar los botones de utilidad a 30px */
    [b-0w6tbi7ygr] .toolbar-left .toolbar-utility-btn {
        width: 30px !important;
        height: 30px !important;
        min-width: 30px !important;
        flex: 0 0 30px !important;
    }
}

[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] {
        flex-wrap: wrap;
    }

    .orders-toolbar-filter-item[b-0w6tbi7ygr] {
        flex: 1 1 100%;
        max-width: 100%;
        min-width: 100%;
    }
}
/* /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: 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-r61kiw9iih]  .k-button {
        width: 100% !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;
    }
}

.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--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/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;
    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;
}
/* /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);
}


/* /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;
}

.pos-top-actions[b-oma8uzm48a] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    width: 380px;
}

.pos-top-actions[b-oma8uzm48a]  .k-button,
.pos-top-actions[b-oma8uzm48a]  .btn-arregly,
.pos-top-actions .pos-top-btn-clear[b-oma8uzm48a],
.pos-top-actions .pos-top-btn-pay[b-oma8uzm48a] {
    width: 100% !important;
    height: 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 8px 12px !important;
}

@media (max-width: 1200px) {
    .pos-top-actions[b-oma8uzm48a] {
        width: 350px;
    }
}

@media (max-width: 900px) {
    .pos-top-actions[b-oma8uzm48a] {
        width: 100%;
    }
}

.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 y Cliente */
.pos-top-controls[b-oma8uzm48a] {
    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-top-controls[b-oma8uzm48a] {
        grid-template-columns: 1fr;
    }
}

.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-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);
}

.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[b-oma8uzm48a] {
    font-weight: 700;
    min-width: 16px;
    text-align: center;
}

.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);
}
/* /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 {
    order: 1;
    display: inline-flex;
    align-items: center;
}

[b-ctsvqlufno] .toolbar-left .search-input-container {
    order: 2;
    flex: 1;
    min-width: 240px;
}

[b-ctsvqlufno] .toolbar-left .toolbar-utility-btn,
[b-ctsvqlufno] .toolbar-left > .k-button {
    order: 3;
}

[b-ctsvqlufno] .toolbar-right {
    order: 4;
}

[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-wrap: wrap !important;
        align-items: center !important;
        gap: 8px !important;
    }

    .dashboard-container[b-ctsvqlufno]  .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-ctsvqlufno]  .toolbar-left .search-input-container {
        order: 2 !important;
        flex: 1 1 calc(100% - 120px) !important;
        min-width: 0 !important;
    }

    .dashboard-container[b-ctsvqlufno]  .toolbar-left .toolbar-utility-btn,
    .dashboard-container[b-ctsvqlufno]  .toolbar-left > .k-button {
        order: 3 !important;
        flex: 0 0 32px !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;
    }
}


/* /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 */
/* Ajustes exclusivos para dispositivos de 320px para mantener una fila proporcional sin flechas */
@media (max-width: 340px) {
    /* 1. Ocultar las flechas de scroll de Telerik */
    [b-1l0jflwgwo] .k-toolbar-scroll-button,
    [b-1l0jflwgwo] .k-scroll-button,
    [b-1l0jflwgwo] .k-button-scroll {
        display: none !important;
    }

    [b-1l0jflwgwo] .k-grid-toolbar,
    [b-1l0jflwgwo] .k-toolbar,
    [b-1l0jflwgwo] .grid-toolbar {
        overflow: hidden !important;
        padding: 8px 6px !important; /* Optimizar paddings laterales */
    }

    /* 2. Forzar fila única y reducir la separación (gap) */
    [b-1l0jflwgwo] .grid-toolbar,
    [b-1l0jflwgwo] .toolbar-left {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        gap: 4px !important;
        width: 100% !important;
    }

    /* 3. Reducir combobox de sede a 60px */
    [b-1l0jflwgwo] .toolbar-left .toolbar-extra {
        width: 60px !important;
        min-width: 60px !important;
        max-width: 60px !important;
        flex: 0 0 60px !important;
        margin: 0 !important;
    }

    [b-1l0jflwgwo] .toolbar-left .toolbar-extra .dropdownlist-arregly,
    [b-1l0jflwgwo] .toolbar-left .toolbar-extra .k-dropdownlist,
    [b-1l0jflwgwo] .toolbar-left .toolbar-extra .k-picker {
        width: 100% !important;
        min-width: 0 !important;
    }

    /* 4. Reducir el buscador a 95px */
    [b-1l0jflwgwo] .toolbar-left .search-input-container {
        width: 95px !important;
        min-width: 95px !important;
        max-width: 95px !important;
        flex: 0 0 95px !important;
    }

    /* 5. Optimizar los botones de utilidad a 30px */
    [b-1l0jflwgwo] .toolbar-left .toolbar-utility-btn {
        width: 30px !important;
        height: 30px !important;
        min-width: 30px !important;
        flex: 0 0 30px !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-list-container[b-k9gypiy2ud]  .toolbar-extra {
    display: inline-flex;
    align-items: center;
    flex-wrap: nowrap;
    margin-left: 8px;
}

.services-list-container[b-k9gypiy2ud]  .toolbar-extra .services-toolbar-context-controls {
    width: 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;
}

.services-list-container[b-k9gypiy2ud]  .toolbar-extra .services-context-branch .k-picker {
    min-width: 180px;
}

.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;
    width: auto;
    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-list-container[b-k9gypiy2ud]  .toolbar-left {
    flex-wrap: nowrap;
}

.services-context-select-label[b-k9gypiy2ud] {
    margin: 0;
    font-size: 0.875rem;
    color: #4b5563;
    font-weight: 500;
}

.services-list-header[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 16px;
    margin-bottom: 0;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    background: #ffffff;
    font-size: 0.9rem;
    font-weight: 600;
    color: #111827;
    min-width: 980px;
}

.services-list-header.is-branch-mode[b-k9gypiy2ud] {
    grid-template-columns: 2.2fr 0.9fr 0.9fr 1fr 1fr 0.7fr;
}


.services-list-header[b-k9gypiy2ud] {
    order: 3;
    margin-bottom: 6px;
}

.services-list-container[b-k9gypiy2ud]  .accordion-grid-container {
    display: contents;
}

.services-list-container[b-k9gypiy2ud]  .accordion-toolbar {
    order: 1;
    margin-bottom: 16px;
    padding: 12px 20px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* --- Search Box & Toolbar (Standardized with BaseGrid) --- */
.services-list-container[b-k9gypiy2ud]  .search-input-container {
    flex: 1;
    min-width: 0;
}

.services-list-container[b-k9gypiy2ud]  .search-input-arregly-icon {
    color: #98a2b3 !important;
}

.services-list-container[b-k9gypiy2ud]  .search-input-field .k-input-inner {
    border-radius: 8px !important;
    background-color: #ffffff !important;
    transition: all 0.2s ease;
}

.services-list-container[b-k9gypiy2ud]  .search-input-field.k-focus .k-input-inner,
.services-list-container[b-k9gypiy2ud]  .search-input-field:focus-within .k-input-inner {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 1px var(--primary-color) !important;
}

/* --- Toolbar Elements Alignment --- */
.services-list-container[b-k9gypiy2ud]  .toolbar-left {
    display: flex;
    align-items: center;
    gap: 8px; /* Separación estándar como en BaseGrid */
    flex: 1;
}

.services-list-container[b-k9gypiy2ud]  .toolbar-left .toolbar-extra {
    order: 1;
}

.services-list-container[b-k9gypiy2ud]  .toolbar-left .search-input-container {
    order: 2;
    flex: 1;
    min-width: 240px;
}

.services-list-container[b-k9gypiy2ud]  .toolbar-left .toolbar-utility-btn {
    order: 3;
}

.services-list-container[b-k9gypiy2ud]  .toolbar-left .toolbar-info {
    order: 4;
}

/* Refresh Button - Standard size */
.services-list-container[b-k9gypiy2ud]  .toolbar-left .toolbar-utility-btn {
    border-radius: 12px !important;
    border: 1px solid #d0d5dd;
    background: #ffffff;
    color: #667085;
    transition: all 0.2s ease;
}

.services-list-container[b-k9gypiy2ud]  .toolbar-left > .k-button:hover {
    background: #f9fafb;
    color: #16a34a;
    border-color: #16a34a;
}

/* --- Responsive Design (Mobile Stacking) --- */
@media (max-width: 768px) {
    .services-list-container[b-k9gypiy2ud]  .accordion-toolbar {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
        padding: 12px !important;
    }

    .services-list-container[b-k9gypiy2ud]  .toolbar-left {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
    }

    .services-list-container[b-k9gypiy2ud]  .toolbar-left .toolbar-extra {
        order: 1;
        flex: 1 1 100%;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-left: 0;
        display: flex !important;
        flex-wrap: nowrap !important;
    }

    .services-list-container[b-k9gypiy2ud]  .toolbar-left .search-input-container {
        order: 2;
        flex: 1 1 calc(100% - 56px);
        min-width: 0;
    }

    .services-list-container[b-k9gypiy2ud]  .toolbar-left .toolbar-utility-btn {
        order: 3;
        flex: 0 0 40px;
    }

    .services-list-container[b-k9gypiy2ud]  .toolbar-left .toolbar-info {
        order: 4;
        flex: 1 1 auto;
        min-width: fit-content;
    }

    .services-list-container[b-k9gypiy2ud]  .toolbar-right {
        width: 100%;
        justify-content: flex-start;
    }

    .services-toolbar-context-controls[b-k9gypiy2ud] {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: 100% !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-list-container[b-k9gypiy2ud]  .toolbar-extra .services-context-branch {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        width: auto !important;
    }

    .services-list-container[b-k9gypiy2ud]  .toolbar-extra .services-context-branch .dropdownlist-arregly,
    .services-list-container[b-k9gypiy2ud]  .toolbar-extra .services-context-branch .k-dropdownlist,
    .services-list-container[b-k9gypiy2ud]  .toolbar-extra .services-context-branch .k-picker {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .services-context-mode[b-k9gypiy2ud]  .k-radio-list {
        flex-wrap: nowrap;
    }

    .services-context-mode[b-k9gypiy2ud] {
        overflow: hidden;
    }

    .services-context-mode[b-k9gypiy2ud]  .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;
    }

    .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-list-container[b-k9gypiy2ud]  .records-badge {
        width: 100%;
        justify-content: center;
    }
}


/* Badge Styling (Standardized Height) */
.services-list-container[b-k9gypiy2ud]  .records-badge {
    padding: 5px 12px; /* Reducido para alinearse con los 30px del toolbar */
    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; /* Forzamos altura igual al buscador */
    box-sizing: border-box;
}

.services-list-container[b-k9gypiy2ud]  .filtered-badge {
    background-color: #f0fdf4;
    color: #166534;
    border-color: #bbf7d0;
}

.services-list-container[b-k9gypiy2ud]  .accordion-grid-row {
    order: 4;
    margin-top: 0;
}

.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; /* Slightly more padding for air */
    border: 1px solid #f1f5f9; /* Softer border */
    border-radius: 14px; /* More rounded */
    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;
    position: relative;
}

.service-action-menu-button[b-k9gypiy2ud] {
    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;
}

.service-actions-cell[b-k9gypiy2ud]  .k-menu-button.service-action-menu-button {
    border-radius: 12px !important;
    width: 32px !important;
    min-width: 32px !important;
    height: 32px !important;
    padding: 0 !important;
}

.service-action-menu-button:hover[b-k9gypiy2ud] {
    background: var(--RgbaColor03) !important;
    color: var(--primary-color) !important;
    transform: none !important;
    box-shadow: none !important;
}

.service-action-menu-button:focus[b-k9gypiy2ud] {
    box-shadow: none !important;
}

.service-action-menu-button:focus-visible[b-k9gypiy2ud] {
    outline: none;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.35) !important;
}

.service-action-menu-button[b-k9gypiy2ud]  .k-svg-icon {
    width: 16px !important;
    height: 16px !important;
    color: var(--primary-color) !important;
    fill: currentColor !important;
    opacity: 1 !important;
}

.service-action-menu-button[b-k9gypiy2ud]  .k-button-text {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
}

.service-action-menu-button[b-k9gypiy2ud]  .k-button-icon {
    margin: 0 !important;
}

.service-action-menu-button[b-k9gypiy2ud]  .k-menu-button-arrow {
    display: none !important;
}

.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[b-k9gypiy2ud] {
    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: 14px;
}

.service-details-section[b-k9gypiy2ud] {
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 12px;
    background: #ffffff;
}

.service-details-section-header[b-k9gypiy2ud] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid #eef2f7;
    color: #374151;
    font-size: 1rem;
    font-weight: 600;
}

.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: 8px;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    padding: 8px 10px;
    background: #ffffff;
}

.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: 991.98px) {
    .services-search-header-separator[b-k9gypiy2ud] {
        display: none;
    }

    .services-list-container[b-k9gypiy2ud] {
        overflow-x: hidden;
    }

    .services-list-header[b-k9gypiy2ud],
    .service-list-row[b-k9gypiy2ud] {
        min-width: 0;
        grid-template-columns: 1.9fr 1fr auto;
        gap: 10px;
    }

    .service-header-duration[b-k9gypiy2ud],
    .service-header-branches[b-k9gypiy2ud],
    .service-header-signature[b-k9gypiy2ud],
    .service-header-status[b-k9gypiy2ud],
    .service-duration-cell[b-k9gypiy2ud],
    .service-branches-cell[b-k9gypiy2ud],
    .service-signature-cell[b-k9gypiy2ud],
    .service-status-cell[b-k9gypiy2ud] {
        display: none;
    }

    .service-main-cell[b-k9gypiy2ud] {
        gap: 8px;
    }

    .service-actions-cell[b-k9gypiy2ud] {
        justify-content: flex-end;
    }
}

@media (max-width: 340px) {
    .dashboard-container[b-k9gypiy2ud]  .toolbar-left .toolbar-info {
        display: none !important;
    }

    .services-toolbar-context-controls[b-k9gypiy2ud] {
        gap: 6px !important;
    }
}
/* /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, 480px));
    justify-content: flex-start;
    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;
}

/* Grilla de Adicionales */
.addons-cards-grid[b-zwi8dut793] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(340px, 480px));
    justify-content: flex-start;
    gap: 1.5rem;
    margin-top: 1rem;
}

.addon-card[b-zwi8dut793] {
    background: #ffffff;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    padding: 1.5rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
    transition: transform 0.2s, box-shadow 0.2s;
}

.addon-card:hover[b-zwi8dut793] {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);
}

.focused-addon-card[b-zwi8dut793] {
    border: 2px solid #667eea !important;
    animation: pulse-border-b-zwi8dut793 1.5s infinite;
}

@keyframes pulse-border-b-zwi8dut793 {
    0% { box-shadow: 0 0 0 0 rgba(102, 126, 234, 0.4); }
    70% { box-shadow: 0 0 0 8px rgba(102, 126, 234, 0); }
    100% { box-shadow: 0 0 0 0 rgba(102, 126, 234, 0); }
}

.addon-card-header[b-zwi8dut793] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.addon-icon-circle[b-zwi8dut793] {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: #f0f3ff;
    color: var(--primary-color, #667eea);
    display: flex;
    align-items: center;
    justify-content: center;
}

.addon-title[b-zwi8dut793] {
    font-size: 1.25rem;
    font-weight: 700;
    color: #1e293b;
    margin: 0;
}

.addon-desc[b-zwi8dut793] {
    font-size: 0.875rem;
    color: #64748b;
    margin-top: 0.25rem;
    min-height: 40px;
}

.addon-price-section[b-zwi8dut793] {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.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);
}

.popular-badge-wrapper[b-zwi8dut793] {
    position: absolute;
    top: -12px;
    right: 20px;
}

.popular-badge[b-zwi8dut793] {
    background: #10b981;
    color: #ffffff;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
}

.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: 1.25rem 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: 1rem;
    }
}
/* /Pages/SuperAdmin/Addons/Addons.razor.rz.scp.css */
.addons-container[b-yt0xxytf35] {
    padding: 1.5rem;
}

.addons-title[b-yt0xxytf35] {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1e293b;
    margin: 0;
}

.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;
}
/* /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: #e7f1ff;
    color: #0d6efd;
}

.stat-icon-active[b-relcba7xbq] {
    background-color: #e6f4ea;
    color: #198754;
}

.stat-icon-warning[b-relcba7xbq] {
    background-color: #fff8e6;
    color: #ffc107;
}

.stat-icon-danger[b-relcba7xbq] {
    background-color: #fce8e6;
    color: #dc3545;
}

/* 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;
}
/* /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: #e0e7ff;
    color: #4338ca;
}

.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;
}

/* 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, #6366f1);
}
/* /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;
}

/* 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, #667eea) !important;
    border-color: var(--primary-color, #667eea) !important;
    box-shadow: none !important;
}

/* Checkbox personalizado */
.checkbox-theme-arregly[b-s2c71h964f] {
    accent-color: var(--primary-color, #667eea);
    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, #667eea);
    background: #f8fafc;
}

.checklist-item-box.checked[b-s2c71h964f] {
    border-color: var(--primary-color, #667eea);
    background: #f0f3ff;
}

.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, #667eea);
    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, #667eea);
}

.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, #667eea);
}

.capability-checkbox-card.checked[b-s2c71h964f] {
    border-color: var(--primary-color, #667eea);
    background: #f0f3ff;
}

.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, #667eea);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.08);
}

.limit-icon-avatar[b-s2c71h964f] {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #f0f3ff;
    color: var(--primary-color, #667eea);
    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: #f0f3ff !important;
}

[b-s2c71h964f] .table-arregly tbody tr.editing-row td:first-child {
    border-left: 4px solid var(--primary-color, #667eea);
}

[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: #f0f3ff;
    color: var(--primary-color, #667eea);
}

[b-s2c71h964f] .btn-action-edit:hover {
    background-color: var(--primary-color, #667eea);
    color: #ffffff;
    transform: scale(1.1);
    box-shadow: 0 4px 10px rgba(102, 126, 234, 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: #e0e7ff;
    color: #4338ca;
}

.stat-icon-users[b-gjvw4zy5mr] {
    background-color: #dcfce7;
    color: #15803d;
}

.stat-icon-mrr[b-gjvw4zy5mr] {
    background-color: #f3e8ff;
    color: #7e22ce;
}

.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, #6366f1);
    border-top: 4px solid var(--primary-color, #6366f1);
}

.plan-card.card-enterprise[b-gjvw4zy5mr] {
    border-top: 4px solid #8b5cf6;
}

/* Popular Badge flotante centrado superior */
.popular-badge-wrapper[b-gjvw4zy5mr] {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
}

.popular-badge[b-gjvw4zy5mr] {
    background: var(--primary-color, #6366f1);
    color: #ffffff;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 4px 12px;
    border-radius: 999px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    box-shadow: 0 2px 8px rgba(99, 102, 241, 0.3);
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

.popular-star-icon[b-gjvw4zy5mr] {
    width: 14px;
    height: 14px;
}

/* 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, #6366f1);
}

.card-enterprise .plan-icon-circle[b-gjvw4zy5mr] {
    background-color: #8b5cf6;
}

.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, #667eea) !important;
    border-color: var(--primary-color, #667eea) !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, #667eea) !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;
}

.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, #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-gjvw4zy5mr] {
    background: #f0f3ff;
    border-color: var(--primary-color, #667eea);
    color: var(--primary-color, #667eea);
    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, #667eea);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 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, #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-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, #667eea);
    background: #f0f3ff;
    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: #e0e7ff;
    color: #4338ca;
}

.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, #6366f1);
}

/* 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, #6366f1);
    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/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: 576px) {
    .modern-card-header[b-02mf7v8rfx] {
        flex-wrap: wrap !important;
        gap: 12px !important;
        padding: 12px 16px !important;
    }

    .modern-card-title[b-02mf7v8rfx] {
        flex: 1 1 100% !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: 1 1 100% !important;
        min-width: 0 !important;
        padding: 6px 12px !important;
        font-size: 0.85rem !important;
        height: 32px !important;
        justify-content: center !important;
        margin-top: 4px !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;
}
/* /Pages/TrackOrder/TrackOrder.razor.rz.scp.css */
/* ==========================================================================
   ── ESTILOS BASE (MOBILE-FIRST - Viewports 320px a 767px) ──
   ========================================================================== */

/* ── Página completa ── */
.track-order-page[b-aywqmym6mm] {
    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;
}

.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;
    border-radius: 10px;
    background: #f9fafb;
    border: 1px solid #e5e7eb;
    cursor: default;
    opacity: 0.6;
}

.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.82rem;
    color: #111827;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.document-card__category[b-aywqmym6mm] {
    font-size: 0.68rem;
    color: #9ca3af;
}

/* ── 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;
}
/* /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;
    }

    .order-detail-header-actions[b-jp5e73seo8] {
        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-jp5e73seo8]  .k-button {
        width: 100% !important;
    }

    .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;
}