/* Base layout styles for XAF Blazor application */
html, body {
    height: 100%;
}

app {
    display: block;
    height: 100%;
}

/* N2C Logo styling */
.header-logo {
    flex-shrink: 0;
    background-color: currentColor;
    /*-webkit-mask: url('../images/Logo.svg');*/
    /*mask: url('../images/Logo.svg');*/
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    width: 28px;
    height: 24px;
}

/* Blazor error UI */
#blazor-error-ui {
    background: inherit;
    bottom: 0;
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 100001;
}

/* N2C Theme Enhancements for XAF Components */

.btn-primary:hover,
.dxbl-btn-primary:hover {
    background-color: #085050;
    border-color: #085050;
}

.btn-primary:focus,
.dxbl-btn-primary:focus {
    box-shadow: 0 0 0 0.25rem rgba(10, 89, 89, 0.25);
}

/* Link colors consistent with N2C brand */
a {
    color: #0A5959;
}

    a:hover {
        color: #085050;
    }

/* Focus outline for accessibility */
*:focus-visible {
    outline: 2px solid #0A5959;
    outline-offset: 2px;
}

/* Grid and list view enhancements */

/* Per-row action button (e.g. print icon) inside DxGrid cell — 44 × 44 px minimum tap target.
   Reference: https://developer.mozilla.org/en-US/docs/Web/CSS/min-height */
.grid-row-action-btn {
    min-width: 44px;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.dxbl-grid-header {
    background-color: #ececec;
    font-weight: 500;
}

.dxbl-grid-data-row:hover {
    background-color: rgba(10, 89, 89, 0.05);
}

.dxbl-grid-data-row.dxbl-grid-selected {
    background-color: rgba(10, 89, 89, 0.1);
}

/* Navigation menu styling */
.dxbl-navigation-menu-item.active {
    color: #0A5959;
    font-weight: 500;
}

/* Form validation styling */
.is-valid,
.was-validated .form-control:valid {
    border-color: #0A5959;
}

    .is-valid:focus,
    .was-validated .form-control:valid:focus {
        border-color: #0A5959;
        box-shadow: 0 0 0 0.25rem rgba(10, 89, 89, 0.25);
    }

/* Loading indicators */
.dxbl-splash-screen {
    background-color: #fff;
}

/* Modal dialog enhancements */
.modal-header {
    background-color: #ececec;
    border-bottom: 2px solid #0A5959;
}

/* Card component styling */
.card-header {
    background-color: #ececec;
    font-weight: 500;
}

/* Ensure good contrast for text */
.text-primary {
    color: #0A5959 !important;
}

.bg-primary {
    background-color: #060300 !important;
}

.bg-success {
    background-color: #0A5959 !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .header-logo {
        width: 24px;
        height: 20px;
    }
}

/* Dark mode support (if enabled via data-bs-theme attribute) */
[data-bs-theme="dark"] .dxbl-grid-header {
    background-color: #343a40;
}

[data-bs-theme="dark"] .modal-header,
[data-bs-theme="dark"] .card-header {
    background-color: #343a40;
    border-color: #495057;
}

[data-bs-theme="dark"] a {
    color: #0A5959;
}

    [data-bs-theme="dark"] a:hover {
        color: #0d7070;
    }

/* Accordion tabs and help panel styles */
.pineapple-accordion-tabs {
    width: 100%;
}

.pineapple-accordion-tabs .dxbl-tabs {
    width: 100%;
}

.pineapple-accordion-tab-body,
.pineapple-accordion-help-tab-body {
    padding: 0.5rem 0;
}

.pineapple-accordion-help-topic {
    border: 1px solid rgba(10, 89, 89, 0.2);
    border-radius: 8px;
    padding: 0.75rem;
    margin-bottom: 0.75rem;
    background: rgba(10, 89, 89, 0.02);
}

.pineapple-accordion-help-title {
    margin-bottom: 0.5rem;
    color: #0A5959;
}

.pineapple-markdown-help {
    line-height: 1.5;
}

.pineapple-markdown-help h1,
.pineapple-markdown-help h2,
.pineapple-markdown-help h3,
.pineapple-markdown-help h4,
.pineapple-markdown-help h5 {
    margin-top: 0.75rem;
    margin-bottom: 0.5rem;
}

.pineapple-markdown-help pre {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    padding: 0.75rem;
    overflow: auto;
}

.pineapple-markdown-help code {
    font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, monospace;
}

.pineapple-mermaid-diagram {
    overflow-x: auto;
    padding: 0.25rem;
}

.pineapple-accordion-help-empty {
    color: #6c757d;
    font-style: italic;
}