/* Global Styles - Moiren-3.0 (MudBlazor defaults, no overrides) */

/* MudBlazor default scale (100%) via root font-size */
:root {
    font-size: 16px; /* 100% */
}

/* Responsive width utilities */
.w-100 { width: 100% !important; }
.w-sm-auto { width: auto !important; }

@media (max-width: 599.98px) {
    .w-sm-auto { width: 100% !important; }
}

/* Mobile: remove MudGrid side gutters so MudItems use the full available width */
@media (max-width: 599.98px) {
    .mud-grid {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .mud-grid > .mud-grid-item {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}

/* Stats cards: add inner gap on mobile only, outer edges follow parent grid */
@media (max-width: 599.98px) {
    .stats-grid-item:nth-child(odd),
    .quick-actions-item:nth-child(odd),
    .nav-hub-item:nth-child(odd) {
        padding-left: 0 !important;
        padding-right: 2px !important;
    }

    .stats-grid-item:nth-child(even),
    .quick-actions-item:nth-child(even),
    .nav-hub-item:nth-child(even) {
        padding-left: 2px !important;
        padding-right: 0 !important;
    }

    .stats-grid-item:nth-child(1),
    .stats-grid-item:nth-child(2) {
        padding-bottom: 2px !important;
    }

    .quick-actions-item:nth-child(1),
    .quick-actions-item:nth-child(2) {
        padding-bottom: 2px !important;
    }

    .nav-hub-item {
        padding-bottom: 2px !important;
    }
}

/* Logs: interval select is capped on desktop, full-width on mobile */
.log-interval-select {
    max-width: 120px !important;
}

@media (max-width: 599.98px) {
    .log-interval-select {
        max-width: none !important;
    }
}

.log-action-btn {
    min-width: 150px !important;
}

/* Logs data grid: percentage-based column widths */
.logs-data-grid .mud-table-root {
    table-layout: fixed !important;
}

/* Mobile log grid: keep label column wide enough to prevent wrapping */
@media (max-width: 959.98px) {
    .logs-data-grid .mud-table-row .mud-table-cell:first-child {
        width: 100px !important;
        white-space: nowrap !important;
    }
}

/* Logs grid: natural height on mobile so the page scrolls instead of a small inner viewport */
@media (max-width: 959.98px) {
    .logs-data-grid .mud-table-container,
    .logs-data-grid .mud-table,
    .logs-data-grid .mud-data-grid {
        overflow-y: visible !important;
        max-height: none !important;
        height: auto !important;
    }
}

/* Mobile data grid: consistent cell padding and data-label width for all views */
@media (max-width: 959.98px) {
    .mud-data-grid td.mud-table-cell {
        padding: 12px 16px !important;
    }

    .mud-data-grid td.mud-table-cell::before {
        min-width: 100px !important;
        padding-right: 16px !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
}

/* Full-width grids and tables — remove default MudBlazor max-width constraints */
.mud-grid,
.mud-table,
.mud-data-grid,
.mud-table-root,
.mud-table-container {
    max-width: 100% !important;
    width: 100% !important;
}

.mud-data-grid .mud-table,
.mud-data-grid table,
.mud-table table,
.mud-table-root table {
    width: 100% !important;
    table-layout: fixed !important;
}

/* Apply wrapping only to data cells, keep headers on one line */
.mud-data-grid .mud-table-cell,
.mud-table-cell {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

.mud-data-grid td.mud-table-cell,
.mud-table td.mud-table-cell {
    word-wrap: break-word !important;
    overflow-wrap: anywhere !important;
    white-space: normal !important;
}

/* Generic and mobile-only centering for headers and standalone text */
.text-center .page-header-title-row {
    justify-content: center !important;
}

.text-center .page-header-text,
.text-center .mud-typography,
.text-center.mud-typography {
    text-align: center !important;
}

@media (max-width: 599.98px) {
    .page-header .page-header-title-row,
    .text-center-mobile .page-header-title-row {
        justify-content: center !important;
    }

    .page-header .page-header-text,
    .page-header .mud-typography,
    .text-center-mobile .page-header-text,
    .text-center-mobile .mud-typography,
    .text-center-mobile.mud-typography {
        text-align: center !important;
    }
}
@media (max-width: 599.98px) {
    .symbol-monitoring-grid th:nth-child(2),
    .symbol-monitoring-grid td:nth-child(2) {
        display: none !important;
    }

    .symbol-monitoring-grid th:nth-child(1),
    .symbol-monitoring-grid td:nth-child(1) {
        width: 55% !important;
    }

    .symbol-monitoring-grid th:nth-child(3),
    .symbol-monitoring-grid td:nth-child(3) {
        width: 30% !important;
    }

    .symbol-monitoring-grid th:nth-child(4),
    .symbol-monitoring-grid td:nth-child(4) {
        width: 15% !important;
    }
}

/* Wallet asset grid: fixed height + scroll on desktop, natural on mobile */
@media (min-width: 960px) {
    .wallet-asset-grid .mud-table-container {
        height: calc(50vh - 3rem);
        max-height: calc(50vh - 3rem);
        overflow-y: auto !important;
    }
}

@media (max-width: 959.98px) {
    .wallet-asset-grid .mud-table-container,
    .wallet-asset-grid .mud-table,
    .wallet-asset-grid .mud-data-grid {
        overflow-y: visible !important;
        max-height: none !important;
        height: auto !important;
    }
}

/* Order view grid: fixed height + scroll on desktop, natural on mobile */
@media (min-width: 960px) {
    .order-view-grid .mud-table-container,
    .positions-overview-grid .mud-table-container {
        height: 60vh;
        max-height: 60vh;
        overflow-y: auto !important;
    }
}

@media (max-width: 959.98px) {
    .order-view-grid .mud-table-container,
    .order-view-grid .mud-table,
    .order-view-grid .mud-data-grid,
    .positions-overview-grid .mud-table-container,
    .positions-overview-grid .mud-table,
    .positions-overview-grid .mud-data-grid,
    .asset-screener-grid .mud-table-container,
    .asset-screener-grid .mud-table,
    .asset-screener-grid .mud-data-grid {
        overflow-y: visible !important;
        max-height: none !important;
        height: auto !important;
    }

    .order-view-grid .mud-table-pagination,
    .order-view-grid .mud-data-grid-pager,
    .asset-screener-grid .mud-table-pagination,
    .asset-screener-grid .mud-data-grid-pager {
        display: none !important;
    }
}

/* AutoTrader grid: centered text, natural height on mobile; comfortable column widths on desktop */
@media (min-width: 960px) {
    .auto-trader-grid .mud-table-cell {
        min-width: 100px;
    }

    .auto-trader-grid th.mud-table-cell {
        min-width: 110px;
    }
}

@media (max-width: 959.98px) {
    .auto-trader-grid .mud-table-container,
    .auto-trader-grid .mud-table,
    .auto-trader-grid .mud-data-grid {
        overflow-y: visible !important;
        max-height: none !important;
        height: auto !important;
    }

    .auto-trader-grid .mud-table-cell {
        text-align: center !important;
    }
}

/* Stock symbol search: full width on mobile, capped on desktop */
.stock-symbol-search {
    max-width: 320px !important;
}

@media (max-width: 599.98px) {
    .stock-symbol-search {
        max-width: none !important;
    }
}

/* Account management layout: center headings/nav, full-width buttons and inputs on mobile */
@media (max-width: 599.98px) {
    .manage-layout .mud-typography {
        text-align: center !important;
    }

    .account-nav {
        width: 100%;
    }

    .account-nav .mud-nav-link,
    .account-nav .mud-nav-link > a {
        width: 100% !important;
        justify-content: center !important;
    }

    .account-nav .mud-nav-link .mud-nav-link-text,
    .account-nav .mud-nav-link span,
    .account-nav .mud-nav-link .mud-typography {
        text-align: center !important;
    }

    .manage-layout .mud-grid-item {
        flex: 0 0 100% !important;
        max-width: 100% !important;
    }

    .manage-layout .mud-button,
    .manage-layout .mud-static-button,
    .manage-layout button {
        width: 100% !important;
    }

    .manage-layout .mud-input,
    .manage-layout .mud-input-control,
    .manage-layout .mud-input input {
        width: 100% !important;
    }

    .manage-layout .mud-input-label,
    .manage-layout .mud-input-helper-text,
    .manage-layout .mud-input-helper,
    .manage-layout .mud-input input {
        text-align: center !important;
    }
}

/* UserManagement: hide empty Actions label and expand value on mobile */
@media (max-width: 599.98px) {
    .user-management-grid .mud-table-cell[data-label=""]:not(:has(> div .mud-select)) {
        display: none !important;
    }

    .user-management-grid .mud-table-cell:has(> div .mud-select) {
        width: 100% !important;
        display: block !important;
        padding: 14px 16px !important;
    }

    /* Remove the empty data-label pseudo-element to avoid a left column on the Actions row */
    .user-management-grid .mud-table-cell:has(> div .mud-select)::before {
        display: none !important;
    }

    /* Expand the MudSelect input slot so the selected value can be text-centered */
    .user-management-grid .mud-select .mud-input .mud-input-slot {
        flex: 1 1 0 !important;
        text-align: center !important;
    }
}

/* OrderView: stretch tabs to full width on desktop */
@media (min-width: 960px) {
    .order-view-tabs .mud-tab {
        flex: 1 1 0 !important;
        max-width: none !important;
        min-width: 0 !important;
    }
}

/* OrderView layout: search/filters above order entries on mobile */
.order-view-filters {
    order: 1;
}

.order-view-data {
    order: 2;
}

.order-view-chart {
    order: 3;
}

@media (min-width: 960px) {
    .order-view-filters {
        order: 3;
    }

    .order-view-data {
        order: 2;
    }

    .order-view-chart {
        order: 4;
    }
}

/* OrderDetailContent: center all text and chips */
.order-detail-content .mud-typography {
    text-align: center !important;
}

.order-detail-content .mud-chip {
    justify-content: center !important;
}

.order-detail-content .mud-grid-item {
    text-align: center;
}

.log-category-chip {
    max-width: 100%;
    overflow: hidden;
}