body {
    .asset-view-header {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        gap: 1rem;
        margin-bottom: 1.5rem;
        padding: 1.4rem;
        background: #ffffff;
        border: 1px solid #e3e6e9;
        border-radius: 0.75rem;
        box-shadow: 0 0.15rem 0.65rem rgba(0, 0, 0, 0.07);
    }

    .asset-heading {
        display: flex;
        align-items: flex-start;
        gap: 1rem;
    }

    .asset-category-icon {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 58px;
        height: 58px;
        flex: 0 0 58px;
        border-radius: 0.75rem;
        background: #eef4ff;
        color: #0d6efd;
        font-size: 1.65rem;
    }

    .asset-title {
        margin: 0;
        font-size: 1.8rem;
        font-weight: 650;
    }

    .asset-subtitle {
        margin-top: 0.25rem;
        color: #6c757d;
    }

    .asset-header-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 0.5rem;
    }

    .asset-status-badge {
        display: inline-block;
        margin-top: 0.65rem;
        padding: 0.4rem 0.75rem;
        border-radius: 999px;
        font-size: 0.82rem;
        font-weight: 600;
    }

    .asset-summary-card,
    .asset-detail-card,
    .asset-overview-card {
        height: 100%;
        border: 1px solid #dee2e6;
        box-shadow: 0 0.15rem 0.65rem rgba(0, 0, 0, 0.07);
    }

    .asset-summary-card {
        border: 0;
    }

        .asset-summary-card .card-body {
            padding: 1.15rem;
        }

    .asset-summary-label {
        margin-bottom: 0.35rem;
        color: #6c757d;
        font-size: 0.76rem;
        font-weight: 650;
        letter-spacing: 0.035rem;
        text-transform: uppercase;
    }

    .asset-summary-value {
        font-size: 1rem;
        font-weight: 600;
        overflow-wrap: anywhere;
    }

    .asset-detail-card .card-header,
    .asset-overview-card .card-header {
        padding: 0.8rem 1rem;
        background: #ffffff;
        border-bottom: 1px solid #e9ecef;
        font-weight: 650;
    }

    .asset-detail-card .card-body,
    .asset-overview-card .card-body {
        padding: 0.75rem 1rem;
    }

    .asset-detail-row {
        padding: 0.45rem 0;
        border-bottom: 1px solid #edf0f2;
    }

        .asset-detail-row:last-child {
            border-bottom: 0;
        }

    .asset-detail-label {
        display: block;
        margin-bottom: 0.15rem;
        color: #6c757d;
        font-size: 0.72rem;
        font-weight: 600;
        letter-spacing: 0.03em;
        text-transform: uppercase;
    }

    .asset-detail-value {
        display: block;
        overflow-wrap: anywhere;
    }

    .asset-tabs {
        margin-bottom: 1.25rem;
    }

        .asset-tabs .nav-link {
            color: #495057;
            font-weight: 500;
        }

            .asset-tabs .nav-link.active {
                color: #0d6efd;
                font-weight: 650;
            }

    .asset-table th {
        white-space: nowrap;
    }

    .asset-table td {
        vertical-align: middle;
    }

    .warranty-current {
        color: #15803d;
        font-weight: 650;
    }

    .warranty-warning {
        color: #b45309;
        font-weight: 650;
    }

    .warranty-expired {
        color: #b91c1c;
        font-weight: 650;
    }

    .yes-value {
        color: #15803d;
        font-weight: 600;
    }

    .no-value {
        color: #6c757d;
    }

    .asset-notice {
        border-left: 4px solid #0d6efd;
    }

    .notes-section {
        overflow: hidden;
        background: #ffffff;
        border: 1px solid #dee2e6;
        border-radius: 0.5rem;
    }

    .notes-section-header {
        padding: 0.75rem 1rem;
        background: #ffffff;
        border-bottom: 1px solid #e9ecef;
        font-weight: 650;
    }

    .notes-section-body {
        min-height: 5rem;
        padding: 1rem;
        overflow-wrap: anywhere;
    }

    @media screen and (max-width: 767.98px) {
        .asset-view-header {
            flex-direction: column;
        }

        .asset-heading,
        .asset-header-actions {
            width: 100%;
        }

            .asset-header-actions .btn {
                width: 100%;
            }

        .asset-make-model {
            white-space: normal;
        }
    }

    .asset-category-icon {
        width: 48px;
        height: 48px;
        flex-basis: 48px;
    }

    .asset-title {
        font-size: 1.45rem;
    }
}

    .asset-form-header {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        gap: 1rem;
        margin-bottom: 1.5rem;
    }

    .asset-form-title {
        margin: 0;
        font-size: 1.75rem;
        font-weight: 650;
    }

    .asset-form-subtitle {
        margin-top: 0.35rem;
        margin-bottom: 0;
        color: #6c757d;
    }

    .asset-form-card {
        border: 0;
        box-shadow: 0 0.15rem 0.65rem rgba(0, 0, 0, 0.08);
    }

        .asset-form-card .card-header {
            padding: 1rem 1.25rem;
            background: #ffffff;
            border-bottom: 1px solid #dee2e6;
            font-weight: 600;
        }

    .asset-required::after {
        content: " *";
        color: #dc3545;
    }

    .validation-message {
        display: block;
        margin-top: 0.3rem;
        color: #dc3545;
        font-size: 0.85rem;
    }

    .asset-form-help {
        margin-top: 0.3rem;
        color: #6c757d;
        font-size: 0.82rem;
    }

    .asset-actions {
        position: sticky;
        bottom: 0;
        z-index: 20;
        padding: 1rem 0;
        background: rgba(245, 246, 248, 0.96);
        border-top: 1px solid #dee2e6;
        backdrop-filter: blur(5px);
    }

    @media screen and (max-width: 767.98px) {
        .asset-form-header {
            flex-direction: column;
        }

            .asset-form-header .btn {
                width: 100%;
            }

        .asset-actions .btn {
            width: 100%;
        }
    }

    .asset-section-description {
        margin-top: 0.25rem;
        margin-bottom: 0;
        color: #6c757d;
        font-size: 0.85rem;
    }

    .asset-optional-section {
        margin-top: 1rem;
        padding: 1rem;
        background: #f8f9fa;
        border: 1px solid #dee2e6;
        border-radius: 0.5rem;
    }

    .asset-assignment-summary {
        padding: 0.75rem 1rem;
        color: #495057;
        background: #eef4ff;
        border-left: 4px solid #0d6efd;
        border-radius: 0.375rem;
    }

    .asset-page-header {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        gap: 1rem;
        margin-bottom: 1.5rem;
    }

    .asset-page-title {
        margin: 0;
        font-size: 1.75rem;
        font-weight: 650;
    }

    .asset-page-subtitle {
        margin-top: 0.35rem;
        margin-bottom: 0;
        color: #6c757d;
    }

    .asset-summary-card {
        height: 100%;
        border: 0;
        border-left: 4px solid #dee2e6;
        box-shadow: 0 0.15rem 0.65rem rgba(0, 0, 0, 0.08);
    }

        .asset-summary-card .card-body {
            padding: 0.7rem 1rem;
        }

    .asset-summary-label {
        margin-bottom: 0.15rem;
        color: #6c757d;
        font-size: 0.74rem;
        font-weight: 600;
        letter-spacing: 0.04rem;
        text-transform: uppercase;
    }

    .asset-summary-value {
        margin: 0;
        font-size: 1.55rem;
        font-weight: 700;
        line-height: 1;
    }

    .asset-summary-icon {
        font-size: 1.45rem;
        color: #6c757d;
    }

    .asset-filter-card,
    .asset-list-card {
        border: 0;
        box-shadow: 0 0.15rem 0.65rem rgba(0, 0, 0, 0.08);
    }

    .asset-grid th {
        white-space: nowrap;
    }

    .asset-grid td {
        vertical-align: middle;
    }

    .asset-make-model {
        white-space: nowrap;
    }

    .asset-name {
        font-weight: 600;
    }

    .asset-secondary {
        color: #6c757d;
        font-size: 0.85rem;
    }

    .asset-empty {
        padding: 3rem 1rem;
        text-align: center;
        color: #6c757d;
    }

    .status-badge {
        display: inline-block;
        padding: 0.35rem 0.55rem;
        border-radius: 999px;
        font-size: 0.78rem;
        font-weight: 600;
    }

    .warranty-warning {
        color: #b45309;
        font-weight: 600;
    }

    .warranty-expired {
        color: #b91c1c;
        font-weight: 600;
    }

    @media screen and (max-width: 767.98px) {
        .asset-page-header {
            flex-direction: column;
        }

            .asset-page-header .btn {
                width: 100%;
            }
    }

    .assignment-header {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        gap: 1rem;
        margin-bottom: 1.5rem;
        padding: 1.25rem;
        background: #ffffff;
        border: 1px solid #e3e6e9;
        border-radius: 0.75rem;
        box-shadow: 0 0.15rem 0.65rem rgba(0, 0, 0, 0.07);
    }

    .assignment-title {
        margin: 0;
        font-size: 1.7rem;
        font-weight: 650;
    }

    .assignment-subtitle {
        margin-top: 0.35rem;
        color: #6c757d;
    }

    .assignment-card {
        border: 0;
        box-shadow: 0 0.15rem 0.65rem rgba(0, 0, 0, 0.07);
    }

        .assignment-card .card-header {
            padding: 1rem 1.25rem;
            background: #ffffff;
            border-bottom: 1px solid #e9ecef;
            font-weight: 650;
        }

    .assignment-required::after {
        content: " *";
        color: #dc3545;
    }

    .validation-message {
        display: block;
        margin-top: 0.3rem;
        color: #dc3545;
        font-size: 0.85rem;
    }

    .assignment-detail {
        padding: 0.7rem 0;
        border-bottom: 1px solid #eef0f2;
    }

        .assignment-detail:last-child {
            border-bottom: 0;
        }

    .assignment-label {
        margin-bottom: 0.15rem;
        color: #6c757d;
        font-size: 0.76rem;
        font-weight: 650;
        text-transform: uppercase;
    }

    .assignment-actions {
        position: sticky;
        bottom: 0;
        z-index: 20;
        margin-top: 1.5rem;
        padding: 1rem 0;
        background: rgba(245, 246, 248, 0.96);
        border-top: 1px solid #dee2e6;
        backdrop-filter: blur(5px);
    }

    @media screen and (max-width: 767.98px) {
        .assignment-header {
            flex-direction: column;
        }

            .assignment-header .btn,
            .assignment-actions .btn {
                width: 100%;
            }
    }
}