/* admin.css
   Consolidated styles for Realtrac EDI admin pages.

   Covers:
   - Components/Pages/Admin/Tenants.razor
   - Components/Pages/Admin/Buyers.razor
   - Components/Pages/Admin/Orders.razor
   - Components/Pages/Admin/Agents.razor
   - Components/Pages/Admin/TenantUsers.razor

   Note:
   This file is intentionally scoped to the admin page wrapper classes so it can be
   loaded globally from App.razor without accidentally restyling account/public pages.
*/

.tenant-page,
.buyers-page,
.orders-page,
.agents-page,
.tenant-users-page {
    margin: 0 auto;
    padding: 28px;
    font-family: Arial, Helvetica, sans-serif;
    color: #1f2937;
}

.tenant-page,
.buyers-page,
.tenant-users-page {
    max-width: 1200px;
}

.agents-page {
    max-width: 1150px;
}

.orders-page {
    max-width: 1250px;
}

/* Page headers */

.tenant-page .page-header,
.buyers-page .page-header,
.orders-page .page-header,
.agents-page .page-header,
.tenant-users-page .page-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 20px;
}

.tenant-page .page-header {
    display: block;
}

.tenant-page .page-header h1,
.buyers-page .page-header h1,
.orders-page .page-header h1,
.agents-page .page-header h1,
.tenant-users-page .page-header h1 {
    margin: 0 0 6px 0;
    font-size: 30px;
}

.tenant-page .page-header p,
.buyers-page .page-header p,
.orders-page .page-header p,
.agents-page .page-header p,
.tenant-users-page .page-header p {
    margin: 0;
    color: #6b7280;
}

.buyers-page .header-actions,
.orders-page .header-actions,
.agents-page .header-actions,
.tenant-users-page .header-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

/* Summary panels */

.buyers-page .tenant-summary,
.orders-page .tenant-summary,
.agents-page .tenant-summary,
.tenant-users-page .tenant-summary,
.agents-page .agent-health-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(180px, 1fr));
    gap: 14px;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    padding: 16px 18px;
    margin-bottom: 18px;
}

.buyers-page .tenant-summary div,
.orders-page .tenant-summary div,
.orders-page .details-grid div,
.agents-page .tenant-summary div,
.agents-page .agent-health-summary div,
.tenant-users-page .tenant-summary div {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.buyers-page .label,
.orders-page .label,
.agents-page .label,
.tenant-users-page .label {
    font-size: 12px;
    color: #667085;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
}

/* Cards */

.tenant-page .card,
.buyers-page .card,
.orders-page .card,
.agents-page .card,
.tenant-users-page .card {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    padding: 20px;
    margin-top: 18px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.05);
}

.tenant-page .card h2,
.buyers-page .card h2,
.orders-page .card h2,
.agents-page .card h2,
.tenant-users-page .card h2 {
    margin-top: 0;
    font-size: 20px;
}

.orders-page .card p {
    color: #6b7280;
}

.orders-page .details-card {
    border-color: #b7e5e2;
}

.orders-page .sub-card {
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    background: #f9fafb;
    padding: 14px;
    margin-top: 14px;
}

.orders-page .sub-card h3 {
    margin: 0 0 10px 0;
    font-size: 16px;
}

.orders-page .error-sub-card {
    border-color: #fecdca;
    background: #fffafa;
}

.orders-page .error-sub-card h3,
.orders-page .error-sub-card p {
    color: #b42318;
}

.orders-page .ship-to {
    line-height: 1.6;
}

/* Section headers / action rows */

.orders-page .section-header,
.agents-page .section-header,
.tenant-users-page .section-header {
    display: flex;
    justify-content: space-between;
    gap: 12px;
}

.orders-page .section-header {
    align-items: flex-start;
}

.agents-page .section-header,
.tenant-users-page .section-header {
    align-items: center;
}

.orders-page .detail-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

/* Forms */

.tenant-page .form-grid,
.buyers-page .form-grid,
.agents-page .form-grid,
.tenant-users-page .form-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(220px, 1fr));
    gap: 14px;
}

.tenant-page .form-field,
.buyers-page .form-field,
.agents-page .form-field,
.tenant-users-page .form-field {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.tenant-page .form-field label,
.buyers-page .form-field label,
.agents-page .form-field label,
.tenant-users-page .form-field label {
    font-size: 13px;
    font-weight: 700;
    color: #374151;
}

.tenant-page .input,
.buyers-page .input,
.agents-page .input,
.tenant-users-page .input {
    border: 1px solid #d1d5db;
    border-radius: 8px;
    padding: 9px 10px;
    font-size: 14px;
}

.tenant-page .actions,
.buyers-page .actions,
.agents-page .actions,
.tenant-users-page .actions {
    margin-top: 16px;
}

/* Buttons */

.tenant-page .btn,
.buyers-page .btn,
.orders-page .btn,
.agents-page .btn,
.tenant-users-page .btn {
    border: 1px solid #cbd5e1;
    background: #f8fafc;
    color: #111827;
    border-radius: 8px;
    padding: 8px 12px;
    cursor: pointer;
    font-weight: 700;
    text-decoration: none;
    display: inline-block;
}

.tenant-page .btn:hover,
.buyers-page .btn:hover,
.orders-page .btn:hover,
.agents-page .btn:hover,
.tenant-users-page .btn:hover {
    background: #eef2f7;
}

.tenant-page .btn.primary,
.buyers-page .btn.primary,
.agents-page .btn.primary,
.tenant-users-page .btn.primary {
    background: #1E8782;
    border-color: #1E8782;
    color: white;
}

.tenant-page .btn.primary:hover,
.buyers-page .btn.primary:hover,
.agents-page .btn.primary:hover,
.tenant-users-page .btn.primary:hover {
    background: #176c68;
}

.tenant-page .btn.small,
.buyers-page .btn.small,
.orders-page .btn.small,
.agents-page .btn.small,
.tenant-users-page .btn.small {
    padding: 5px 9px;
    font-size: 12px;
}

.buyers-page .btn.primary-lite,
.orders-page .btn.primary-lite {
    background: #e6f7f6;
    border-color: #1E8782;
    color: #176c68;
}

.buyers-page .btn.primary-lite:hover,
.orders-page .btn.primary-lite:hover {
    background: #d7f0ef;
}

.orders-page .btn.danger,
.tenant-users-page .btn.danger {
    background: #fff1f0;
    border-color: #fecdca;
    color: #b42318;
}

.buyers-page .btn.disabled,
.tenant-users-page .btn.disabled {
    opacity: .55;
    cursor: not-allowed;
}

/* Alerts */

.tenant-page .alert,
.buyers-page .alert,
.orders-page .alert,
.agents-page .alert,
.tenant-users-page .alert {
    border-radius: 10px;
    padding: 12px 14px;
    margin-top: 14px;
    font-weight: 700;
}

.tenant-page .alert.success,
.buyers-page .alert.success,
.orders-page .alert.success,
.agents-page .alert.success,
.tenant-users-page .alert.success {
    background: #ecfdf3;
    color: #027a48;
    border: 1px solid #abefc6;
}

.tenant-page .alert.error,
.buyers-page .alert.error,
.orders-page .alert.error,
.agents-page .alert.error,
.tenant-users-page .alert.error {
    background: #fef3f2;
    color: #b42318;
    border: 1px solid #fecdca;
}

/* One-time generated values */

.tenant-page .license-box,
.buyers-page .invite-link-box,
.agents-page .credential-box,
.tenant-users-page .invite-box {
    margin-top: 16px;
    border: 1px solid #fedf89;
    background: #fffaeb;
    border-radius: 12px;
    padding: 14px;
}

.tenant-page .license-title,
.buyers-page .invite-title,
.agents-page .credential-title,
.tenant-users-page .invite-title {
    font-weight: 800;
    color: #93370d;
}

.tenant-page .license-box p,
.buyers-page .invite-link-box p,
.agents-page .credential-box p,
.tenant-users-page .invite-box p {
    margin: 6px 0 10px 0;
    color: #7a2e0e;
}

.tenant-page .license-key,
.buyers-page .invite-url,
.tenant-users-page .invite-url {
    font-family: Consolas, monospace;
    background: #ffffff;
    border: 1px dashed #d6a000;
    padding: 10px;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 800;
    word-break: break-all;
}

.agents-page .credential-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
}

.agents-page .credential-grid div {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.agents-page .credential-grid span {
    font-size: 12px;
    font-weight: 800;
    color: #7a2e0e;
    text-transform: uppercase;
    letter-spacing: .04em;
}

.agents-page code {
    font-family: Consolas, monospace;
    background: #ffffff;
    border: 1px dashed #d6a000;
    padding: 10px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 800;
    word-break: break-all;
}

.tenant-users-page code {
    font-family: Consolas, monospace;
    font-size: 12px;
}

/* Tables */

.tenant-page .table-wrap,
.buyers-page .table-wrap,
.orders-page .table-wrap,
.agents-page .table-wrap,
.tenant-users-page .table-wrap {
    overflow-x: auto;
}

.tenant-page .tenants-table,
.tenant-page .tenant-table {
    width: 100%;
    min-width: 1050px;
    border-collapse: collapse;
}

.buyers-page .buyer-table,
.orders-page .orders-table,
.agents-page .agent-table,
.tenant-users-page .users-table {
    width: 100%;
    border-collapse: collapse;
}

.tenant-page .tenants-table th,
.tenant-page .tenants-table td,
.tenant-page .tenant-table th,
.tenant-page .tenant-table td,
.buyers-page .buyer-table th,
.buyers-page .buyer-table td,
.orders-page .orders-table th,
.orders-page .orders-table td,
.agents-page .agent-table th,
.agents-page .agent-table td,
.tenant-users-page .users-table th,
.tenant-users-page .users-table td {
    border-bottom: 1px solid #e5e7eb;
    text-align: left;
    padding: 10px 8px;
    vertical-align: middle;
}

.tenant-page .tenants-table th,
.tenant-page .tenant-table th,
.buyers-page .buyer-table th,
.orders-page .orders-table th,
.agents-page .agent-table th,
.tenant-users-page .users-table th {
    font-size: 13px;
    color: #475467;
    background: #f9fafb;
}

.tenant-page .right,
.buyers-page .right,
.orders-page .right,
.agents-page .right,
.tenant-users-page .right {
    text-align: right !important;
}

.orders-page .selected-row {
    background: #f0fdfa;
}

/* Tenant table action buttons */

.tenant-page .action-cell {
    text-align: center;
    vertical-align: middle;
}

.tenant-page .table-action-btn {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1px;
    min-width: 64px;
    line-height: 1.15;
    text-align: center;
    white-space: normal;
}

.tenant-page .action-header {
    text-align: center !important;
}

/* Status pills */

.tenant-page .status,
.buyers-page .status,
.orders-page .status,
.agents-page .status,
.tenant-users-page .status {
    display: inline-block;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}

.tenant-page .status.active,
.buyers-page .status.active,
.orders-page .status.active,
.orders-page .status.imported,
.agents-page .status.active,
.agents-page .status.online,
.tenant-users-page .status.active {
    background: #ecfdf3;
    color: #027a48;
}

.tenant-page .status.inactive,
.buyers-page .status.inactive,
.orders-page .status.inactive,
.orders-page .status.downloaded,
.agents-page .status.inactive,
.agents-page .status.never,
.tenant-users-page .status.inactive,
.tenant-users-page .status.used {
    background: #f2f4f7;
    color: #475467;
}

.orders-page .status.submitted,
.tenant-users-page .status.pending {
    background: #eff8ff;
    color: #175cd3;
}

.orders-page .status.inreview,
.agents-page .status.stale,
.tenant-users-page .status.expired {
    background: #fffaeb;
    color: #b54708;
}

.orders-page .status.rejected,
.orders-page .status.failed,
.agents-page .status.disabled,
.tenant-users-page .status.disabled {
    background: #fef3f2;
    color: #b42318;
}

/* Responsive */

@media (max-width: 900px) {
    .buyers-page .page-header,
    .orders-page .page-header,
    .orders-page .section-header,
    .agents-page .page-header,
    .agents-page .section-header,
    .tenant-users-page .page-header,
    .tenant-users-page .section-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .buyers-page .header-actions,
    .orders-page .header-actions,
    .orders-page .detail-actions,
    .agents-page .header-actions,
    .tenant-users-page .header-actions {
        justify-content: flex-start;
    }

    .tenant-page .form-grid,
    .buyers-page .form-grid,
    .buyers-page .tenant-summary,
    .orders-page .tenant-summary,
    .orders-page .details-grid,
    .agents-page .tenant-summary,
    .agents-page .agent-health-summary,
    .agents-page .form-grid,
    .tenant-users-page .tenant-summary,
    .tenant-users-page .form-grid {
        grid-template-columns: 1fr;
    }
}