/* Extracted from resources/views/layouts/partials/blade-ui-overrides.blade.php; keep this file static and browser-cacheable. */
:root {
        --ui-panel: rgba(255, 255, 255, .97);
        --ui-panel-soft: #f8fafc;
        --ui-border: rgba(15, 23, 42, .10);
        --ui-border-strong: rgba(15, 23, 42, .16);
        --ui-text: #0f172a;
        --ui-muted: #64748b;
        --ui-primary: #2563eb;
        --ui-teal: #0f766e;
        --ui-amber: #b45309;
        --ui-rose: #be123c;
        --ui-radius: 8px;
        --ui-shadow: 0 12px 30px rgba(15, 23, 42, .07);
    }

    .tms-body,
    .tms-admin-body,
    .tms-portal-body {
        color: var(--ui-text);
        background:
            linear-gradient(180deg, #f8fafc 0%, #eef4f8 100%) !important;
    }

    .tms-content-inner > :where(.card, .panel, .box, .tms-card, .tms-panel, .fd-card, .manifest-card),
    .tms-content-inner :where(.card, .panel, .box, .tms-card, .tms-panel, .fd-card, .manifest-card):not(.ct-sidebar *),
    .tms-portal-main > :where(.card, .panel, .box, .tms-card),
    .ct-auth-card {
        border: 1px solid var(--ui-border) !important;
        border-radius: var(--ui-radius) !important;
        background: var(--ui-panel) !important;
        box-shadow: var(--ui-shadow) !important;
    }

    .tms-content-inner :where(.card-header, .panel-heading, .box-header, .tms-card-header),
    .tms-portal-main :where(.card-header, .panel-heading, .box-header) {
        border-bottom: 1px solid var(--ui-border) !important;
        background: linear-gradient(180deg, #fff, #f8fafc) !important;
        color: var(--ui-text) !important;
    }

    .tms-content-inner :where(h1, h2, h3, h4, h5, h6),
    .tms-portal-main :where(h1, h2, h3, h4, h5, h6),
    .ct-auth-card :where(h1, h2, h3, h4, h5, h6) {
        color: #07111f;
        letter-spacing: 0;
    }

    .tms-content-inner :where(p, small, .help-text, .form-text, .text-muted),
    .tms-portal-main :where(p, small, .help-text, .form-text, .text-muted) {
        color: var(--ui-muted);
    }

    .tms-content-inner :where(.table-responsive, .tms-table-wrap, .table-wrap),
    .tms-portal-main :where(.table-responsive, .tms-table-wrap, .table-wrap) {
        border: 1px solid var(--ui-border);
        border-radius: var(--ui-radius);
        background: #fff;
        box-shadow: var(--ui-shadow);
        overflow: auto;
    }

    .tms-content-inner table,
    .tms-portal-main table {
        width: 100%;
        border-collapse: separate !important;
        border-spacing: 0 !important;
        color: var(--ui-text);
    }

    .tms-content-inner table thead th,
    .tms-portal-main table thead th {
        position: sticky;
        top: 0;
        z-index: 1;
        padding: 12px 13px !important;
        border-bottom: 1px solid var(--ui-border-strong) !important;
        background: #f8fafc !important;
        color: #475569 !important;
        font-size: 11px !important;
        font-weight: 900 !important;
        letter-spacing: .08em !important;
        text-transform: uppercase !important;
        white-space: nowrap;
    }

    .tms-content-inner table tbody td,
    .tms-portal-main table tbody td {
        padding: 12px 13px !important;
        border-top: 1px solid rgba(226, 232, 240, .86) !important;
        vertical-align: middle !important;
    }

    .tms-content-inner table tbody tr:hover > *,
    .tms-portal-main table tbody tr:hover > * {
        background: #f0fdfa !important;
    }

    .tms-content-inner :where(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea, .form-control, .form-select),
    .tms-portal-main :where(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea, .form-control, .form-select),
    .ct-auth-content :where(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea) {
        min-height: 40px;
        border: 1px solid var(--ui-border) !important;
        border-radius: var(--ui-radius) !important;
        background: #fff !important;
        color: var(--ui-text) !important;
        box-shadow: none !important;
    }

    .tms-content-inner :where(input, select, textarea, .form-control, .form-select):focus,
    .tms-portal-main :where(input, select, textarea, .form-control, .form-select):focus,
    .ct-auth-content :where(input, select, textarea):focus {
        border-color: rgba(37, 99, 235, .42) !important;
        box-shadow: 0 0 0 4px rgba(37, 99, 235, .09) !important;
        outline: 0 !important;
    }

    .tms-content-inner :where(label, .form-label),
    .tms-portal-main :where(label, .form-label),
    .ct-auth-content :where(label, .form-label) {
        color: #334155 !important;
        font-size: 12px;
        font-weight: 850;
    }

    .tms-content-inner :where(.btn, .button, button, [type="submit"], [role="button"]),
    .tms-portal-main :where(.btn, .button, button, [type="submit"], [role="button"]),
    .ct-auth-content :where(button, [type="submit"]) {
        border-radius: var(--ui-radius) !important;
        font-weight: 850 !important;
        letter-spacing: 0 !important;
    }

    .tms-content-inner :where(.btn-primary, .primary, button[type="submit"]),
    .tms-portal-main :where(.btn-primary, .primary, button[type="submit"]),
    .ct-auth-content button[type="submit"] {
        border-color: transparent !important;
        background: linear-gradient(135deg, var(--ui-teal), var(--ui-primary)) !important;
        color: #fff !important;
        box-shadow: 0 12px 24px rgba(15, 118, 110, .18) !important;
    }

    .tms-content-inner :where(.badge, .label, .pill, .status, .tag),
    .tms-portal-main :where(.badge, .label, .pill, .status, .tag) {
        border-radius: 999px !important;
        font-size: 11px !important;
        font-weight: 900 !important;
        letter-spacing: 0 !important;
    }

    .tms-content-inner :where(.alert, .notice, .message),
    .tms-portal-main :where(.alert, .notice, .message),
    .ct-auth-content :where(.alert, .notice, .message, .status) {
        border-radius: var(--ui-radius) !important;
        border: 1px solid var(--ui-border) !important;
        box-shadow: 0 10px 24px rgba(15, 23, 42, .05) !important;
    }

    .tms-content-inner :where(.nav-tabs, .tabs, .tab-list),
    .tms-portal-main :where(.nav-tabs, .tabs, .tab-list) {
        gap: 6px;
        border-bottom: 1px solid var(--ui-border) !important;
    }

    .tms-content-inner :where(.nav-tabs a, .nav-tabs button, .tabs a, .tabs button, .tab-list a, .tab-list button),
    .tms-portal-main :where(.nav-tabs a, .nav-tabs button, .tabs a, .tabs button, .tab-list a, .tab-list button) {
        border-radius: var(--ui-radius) var(--ui-radius) 0 0 !important;
    }

    .tms-portal-header-inner {
        border-radius: var(--ui-radius) !important;
        box-shadow: var(--ui-shadow) !important;
    }

    .tms-portal-nav a.active {
        background: linear-gradient(135deg, var(--ui-teal), var(--ui-primary)) !important;
    }

    .ct-auth-brand-panel {
        background:
            linear-gradient(145deg, rgba(20, 184, 166, .18), transparent 42%),
            linear-gradient(180deg, #0b1220, #07111f) !important;
    }

    .ct-auth-logo {
        background: linear-gradient(135deg, var(--ui-teal), var(--ui-primary)) !important;
        border-radius: var(--ui-radius) !important;
    }

    .ct-auth-metric,
    .ct-auth-proof {
        border-radius: var(--ui-radius) !important;
    }

    .tms-content-inner :where(
        .rounded-xl,
        .rounded-2xl,
        .rounded-3xl,
        .af-hero,
        .af-card,
        .af-panel,
        .af-filter,
        .af-btn,
        .aft-hero,
        .aft-card,
        .aft-panel,
        .aft-tabs,
        .aft-tab,
        .fd-hero,
        .fd-card,
        .fd-panel,
        .fd-btn,
        .fd-tabs a,
        .shipment-hero,
        .hero-stat,
        .panel-ui,
        .filter-panel,
        .sub-panel,
        .hint-box,
        .stat-card,
        .info-item,
        .metric,
        .small-card,
        .charge-box,
        .mini-form,
        .milestone,
        .ux-hero,
        .ux-card,
        .ux-panel,
        .ux-btn,
        .ux-input,
        .ux-select,
        .ux-textarea,
        .ft-card,
        .ft-btn,
        .ft-input,
        .ft-code,
        .ticket-card,
        .ticket-btn,
        .support-card,
        .support-btn,
        .tf-card,
        .tf-btn,
        .ts-card,
        .tt-card
    ) {
        border-radius: var(--ui-radius) !important;
    }

    .tms-content-inner :where(
        .bg-indigo-600,
        .bg-indigo-700,
        .text-indigo-600,
        .text-indigo-700
    ) {
        --tw-text-opacity: 1;
    }

    .tms-content-inner :where(.bg-indigo-600, .bg-indigo-700),
    .tms-content-inner :where(.af-btn:not(.alt):not(.dark), .aft-btn:not(.alt), .fd-btn-primary, .ux-btn:not(.ux-btn-light):not(.ux-btn-red):not(.ux-btn-green), .ft-btn:not(.gray):not(.red):not(.green):not(.amber)) {
        background: linear-gradient(135deg, var(--ui-teal), var(--ui-primary)) !important;
        color: #fff !important;
        border-color: transparent !important;
    }

    .tms-content-inner :where(.text-indigo-600, .text-indigo-700, .text-blue-600, .text-blue-700) {
        color: var(--ui-primary) !important;
    }

    .tms-content-inner :where(.border-indigo-100, .border-indigo-200, .border-blue-100, .border-blue-200) {
        border-color: rgba(37, 99, 235, .18) !important;
    }

    .tms-content-inner :where(
        .ae-wrap,
        .ai-wrap,
        .api-shell,
        .branch-page,
        .company-shell,
        .comm-shell,
        .dc-wrap,
        .doc-shell,
        .ef-shell,
        .ft-doc-wrap,
        .gf-shell,
        .pdfx-shell,
        .prodash-shell,
        .ri-page,
        .settings-shell,
        .shipment-admin-page
    ) {
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 0 !important;
    }

    .tms-content-inner :where(
        .ae-hero,
        .ai-hero,
        .api-hero,
        .branch-premium-hero,
        .branch-form-hero,
        .comm-hero,
        .dc-hero,
        .doc-hero,
        .ef-hero,
        .fd-hero,
        .ft-doc-hero,
        .ft-hero,
        .gf-hero,
        .pdfx-hero,
        .prodash-command,
        .prodash-overview,
        .ri-hero,
        .settings-hero,
        .shipment-hero
    ) {
        border: 1px solid rgba(15, 23, 42, .10) !important;
        border-radius: var(--ui-radius) !important;
        background:
            linear-gradient(135deg, #0b1220 0%, #0f766e 48%, #2563eb 100%) !important;
        box-shadow: 0 14px 34px rgba(15, 23, 42, .12) !important;
        padding: clamp(18px, 2vw, 24px) !important;
    }

    .tms-content-inner :where(
        .ae-hero,
        .ai-hero,
        .branch-premium-hero,
        .branch-form-hero,
        .comm-hero,
        .dc-hero,
        .ft-hero,
        .ri-hero,
        .shipment-hero
    )::after,
    .tms-content-inner :where(
        .ae-hero,
        .api-hero,
        .branch-premium-hero,
        .branch-form-hero,
        .ri-hero,
        .shipment-hero
    )::before {
        display: none !important;
    }

    .tms-content-inner :where(
        .ae-hero h1,
        .ai-hero h1,
        .api-hero h1,
        .branch-premium-hero h1,
        .branch-form-hero h1,
        .comm-hero h1,
        .dc-hero h1,
        .doc-hero h1,
        .ef-hero h1,
        .fd-hero h1,
        .ft-doc-hero h1,
        .ft-hero h1,
        .gf-hero h1,
        .pdfx-hero h1,
        .prodash-command h2,
        .ri-hero h1,
        .settings-hero h1,
        .shipment-hero h1,
        .shipment-title,
        .title
    ) {
        font-size: clamp(24px, 2.1vw, 34px) !important;
        line-height: 1.12 !important;
        letter-spacing: 0 !important;
    }

    .tms-content-inner :where(
        .ae-card,
        .ae-section,
        .ai-card,
        .api-card,
        .api-panel,
        .branch-card,
        .comm-card,
        .comm-panel,
        .dc-card,
        .doc-card,
        .doc-panel,
        .ef-card,
        .ef-stat,
        .ft-doc-card,
        .ft-doc-reader,
        .gf-card,
        .pdfx-card,
        .pdfx-stat,
        .prodash-panel,
        .prodash-band,
        .prodash-master,
        .prodash-score,
        .prodash-queue,
        .ri-card,
        .ri-metric-card,
        .ri-inline-module,
        .settings-card,
        .settings-panel,
        .stat-card,
        .panel-ui,
        .filter-panel
    ) {
        border: 1px solid var(--ui-border) !important;
        border-radius: var(--ui-radius) !important;
        background: #fff !important;
        box-shadow: var(--ui-shadow) !important;
    }

    .tms-content-inner :where(
        .ae-tab,
        .ae-btn,
        .ai-btn,
        .api-btn,
        .branch-btn,
        .comm-btn,
        .dc-btn,
        .doc-btn,
        .ef-btn,
        .ft-doc-btn,
        .ft-btn,
        .gf-btn,
        .pdfx-btn,
        .prodash-btn,
        .prodash-mode-links a,
        .ri-btn,
        .settings-btn,
        .btn-ui
    ) {
        border-radius: var(--ui-radius) !important;
        box-shadow: none !important;
        transform: none !important;
    }

    .tms-content-inner :where(
        .ae-btn:not(.gray):not(.green):not(.amber),
        .ai-btn:not(.alt):not(.soft):not(.danger),
        .api-btn-primary,
        .comm-btn-primary,
        .dc-btn-primary,
        .doc-btn-primary,
        .ft-doc-btn.primary,
        .ft-btn.primary,
        .gf-btn,
        .pdfx-btn-primary,
        .ri-btn-primary,
        .settings-btn-primary,
        .btn-ui.primary,
        .prodash-btn.primary
    ) {
        border-color: transparent !important;
        background: linear-gradient(135deg, var(--ui-teal), var(--ui-primary)) !important;
        color: #fff !important;
    }

    .tms-content-inner :where(
        .ae-input,
        .ae-select,
        .ae-textarea,
        .ai-input,
        .ai-select,
        .ai-textarea,
        .api-input,
        .api-select,
        .api-textarea,
        .comm-input,
        .comm-select,
        .comm-textarea,
        .dc-input,
        .dc-select,
        .dc-textarea,
        .doc-input,
        .doc-select,
        .doc-textarea,
        .gf-input,
        .gf-select,
        .gf-textarea,
        .pdfx-input,
        .pdfx-select,
        .pdfx-textarea,
        .ri-input,
        .ri-select,
        .ri-textarea,
        .settings-input,
        .settings-select,
        .settings-textarea
    ) {
        border-radius: var(--ui-radius) !important;
    }

    .tms-content-inner :where(
        .ftdash-hero,
        .ftdash-stat-card,
        .ftdash-panel,
        .ftdash-quick-action,
        .ftdash-table-wrap,
        .ftdash-workflow-row,
        .ftdash-hero-card,
        .neo-hero,
        .neo-card,
        .neo-panel,
        .neo-btn,
        .neo-form input,
        .neo-form select,
        .neo-form textarea,
        .ft-card,
        .ft-table,
        .ft-code,
        .driver-card,
        .driver-panel,
        .portal-card,
        .portal-panel
    ) {
        border-radius: var(--ui-radius) !important;
    }

    .tms-content-inner :where(
        .ftdash-stat-card,
        .ftdash-panel,
        .ftdash-quick-action,
        .ftdash-table-wrap,
        .ftdash-workflow-row,
        .neo-card,
        .neo-panel,
        .ft-card,
        .driver-card,
        .driver-panel,
        .portal-card,
        .portal-panel
    ) {
        border: 1px solid var(--ui-border) !important;
        background: #fff !important;
        box-shadow: var(--ui-shadow) !important;
    }

    .tms-content-inner :where(
        .ftdash-page-head h1,
        .ftdash-hero h2,
        .ftdash-stat-card h3,
        .ftdash-panel-head h3,
        .neo-hero h1,
        .neo-panel h3,
        .neo-card h3,
        .ft-card h1,
        .ft-card h2,
        .ft-card h3
    ) {
        letter-spacing: 0 !important;
    }

    .tms-content-inner :where(.ftdash-hero-glow) {
        display: none !important;
    }

    .tms-content-inner .ftdash-stat-card::after {
        display: none !important;
    }

    .tms-content-inner :where(
        .ftdash-btn,
        .ftdash-action,
        .ftdash-panel-link,
        .ftdash-quick-action,
        .neo-btn,
        .ft-btn
    ) {
        border-radius: var(--ui-radius) !important;
        transform: none !important;
    }

    .tms-content-inner :where(.ftdash-btn:hover, .ftdash-action:hover, .ftdash-quick-action:hover, .neo-btn:hover, .ft-btn:hover) {
        transform: none !important;
    }

    .tms-content-inner :where(
        .prodash-mini-bars b,
        .prodash-finance-bars b,
        .prodash-meter b,
        .ftdash-progress-track div,
        .ftdash-hero-meter div
    ) {
        transform-origin: left center;
        animation: tms-chart-draw-x .7s ease both;
    }

    .tms-content-inner :where(.prodash-trend-bars i) {
        transform-origin: bottom center;
        animation: tms-chart-draw-y .7s ease both;
    }

    .tms-content-inner :where(.prodash-donut) {
        animation: tms-donut-settle .72s ease both;
    }

    .tms-content-inner :where(.prodash-panel, .ftdash-panel, .ftdash-stat-card, .prodash-stat) {
        animation: tms-panel-rise .34s ease both;
    }

    @keyframes tms-chart-draw-x {
        from { transform: scaleX(0); opacity: .45; }
        to { transform: scaleX(1); opacity: 1; }
    }

    @keyframes tms-chart-draw-y {
        from { transform: scaleY(0); opacity: .45; }
        to { transform: scaleY(1); opacity: 1; }
    }

    @keyframes tms-donut-settle {
        from { transform: rotate(-12deg) scale(.94); opacity: .65; }
        to { transform: rotate(0) scale(1); opacity: 1; }
    }

    @keyframes tms-panel-rise {
        from { transform: translateY(5px); opacity: .82; }
        to { transform: translateY(0); opacity: 1; }
    }

    @media (prefers-reduced-motion: reduce) {
        .tms-content-inner :where(
            .prodash-trend-bars i,
            .prodash-mini-bars b,
            .prodash-finance-bars b,
            .prodash-meter b,
            .ftdash-progress-track div,
            .ftdash-hero-meter div,
            .prodash-donut,
            .prodash-panel,
            .ftdash-panel,
            .ftdash-stat-card,
            .prodash-stat
        ) {
            animation: none !important;
            transform: none !important;
        }
    }

    /* Clean full-project UI pass */
    .tms-content-inner {
        color: var(--ui-text);
        min-width: 0;
        width: 100%;
    }

    .tms-content-inner > :where(.py-4, .py-5, .py-6, .py-8, .py-10, .af-page, .as-page, .shipment-page),
    .tms-content-inner :where(
        .ae-wrap,
        .af-page,
        .ai-wrap,
        .api-shell,
        .as-page,
        .branch-page,
        .company-shell,
        .comm-shell,
        .cn-page,
        .dc-wrap,
        .doc-shell,
        .ef-shell,
        .ftdash-page,
        .ft-doc-wrap,
        .gf-shell,
        .party-page,
        .payf-page,
        .payx-page,
        .pdfx-page,
        .prodash-page,
        .ql-page,
        .ri-page,
        .settings-page,
        .shipment-admin-page,
        .shipment-page
    ) {
        width: 100% !important;
        max-width: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .tms-content-inner > :where(.py-4, .py-5, .py-6, .py-8, .py-10) > :where(.mx-auto, [class*="max-w-"]),
    .tms-content-inner :where(
        .ae-shell,
        .af-shell,
        .api-shell,
        .as-shell,
        .cn-shell,
        .ft-shell,
        .ftdash-shell,
        .payf-shell,
        .payx-shell,
        .pdfx-shell,
        .prodash-shell,
        .ql-shell,
        .ri-wrap,
        .saas-shell,
        .settings-shell,
        .shipment-container,
        .vb-wrap
    ) {
        width: 100% !important;
        max-width: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .tms-content-inner :where(.grid, [class*="-grid"], .row, .form-row, .hero-row, .card-body, .panel-body, .table-responsive, [class*="-table-wrap"]) {
        min-width: 0;
    }

    .tms-content-inner :where(.table-responsive, [class*="-table-wrap"]) {
        width: 100%;
        overflow-x: auto;
    }

    .tms-page-header {
        background:
            linear-gradient(180deg, rgba(255, 255, 255, .98), rgba(248, 250, 252, .95)),
            #fff !important;
    }

    .tms-content-inner :where(.card, .panel, .box, .tms-card, .tms-panel, .fd-card, .manifest-card):not(.ct-sidebar *),
    .tms-portal-main :where(.card, .panel, .box, .tms-card) {
        transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
    }

    .tms-content-inner :where(.card, .panel, .box, .tms-card, .tms-panel, .fd-card, .manifest-card):not(.ct-sidebar *):hover,
    .tms-portal-main :where(.card, .panel, .box, .tms-card):hover {
        border-color: rgba(20, 184, 166, .20) !important;
        box-shadow: 0 14px 34px rgba(15, 23, 42, .08) !important;
    }

    .tms-content-inner :where(.btn, .button, button, [type="submit"], [role="button"], .dropdown-toggle),
    .tms-portal-main :where(.btn, .button, button, [type="submit"], [role="button"]) {
        min-height: 38px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        border-radius: var(--ui-radius) !important;
        text-decoration: none !important;
        transition: background .16s ease, color .16s ease, border-color .16s ease, box-shadow .16s ease;
    }

    .tms-content-inner :where(.btn:hover, .button:hover, button:hover, [role="button"]:hover),
    .tms-portal-main :where(.btn:hover, .button:hover, button:hover, [role="button"]:hover) {
        box-shadow: 0 10px 22px rgba(15, 23, 42, .08) !important;
    }

    .tms-content-inner :where(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea, .form-control, .form-select),
    .tms-portal-main :where(input:not([type="checkbox"]):not([type="radio"]):not([type="file"]), select, textarea, .form-control, .form-select) {
        min-height: 42px;
        padding-inline: 12px;
    }

    .tms-content-inner :where(textarea, .form-control[rows]),
    .tms-portal-main :where(textarea, .form-control[rows]) {
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .tms-content-inner :where(table tbody tr:nth-child(even) > *),
    .tms-portal-main :where(table tbody tr:nth-child(even) > *) {
        background: rgba(248, 250, 252, .48);
    }

    .tms-content-inner :where(table tbody tr:hover > *),
    .tms-portal-main :where(table tbody tr:hover > *) {
        background: #ecfeff !important;
    }

    .tms-content-inner :where(.pagination, nav[role="navigation"]) {
        gap: 6px;
    }

    .tms-content-inner :where(.modal-content, .dropdown-menu, .popover) {
        border: 1px solid var(--ui-border) !important;
        border-radius: var(--ui-radius) !important;
        box-shadow: 0 18px 48px rgba(15, 23, 42, .14) !important;
    }

    .tms-content-inner :where(.empty, .empty-state, .no-data, .no-records) {
        border: 1px dashed rgba(148, 163, 184, .45);
        border-radius: var(--ui-radius);
        background: #f8fafc;
    }

    .tms-content-inner :where([class$="-hero"], [class*="-hero "], .prodash-command, .prodash-overview, .ftdash-hero, .portaldash-hero),
    .tms-portal-main :where([class$="-hero"], [class*="-hero "], .portaldash-hero) {
        position: relative !important;
        overflow: hidden !important;
        color: #ffffff !important;
    }

    .tms-content-inner :where([class$="-hero"], [class*="-hero "], .prodash-command, .prodash-overview, .ftdash-hero, .portaldash-hero) > *,
    .tms-portal-main :where([class$="-hero"], [class*="-hero "], .portaldash-hero) > * {
        position: relative;
        z-index: 2;
    }

    .tms-content-inner :where([class$="-hero"], [class*="-hero "], .prodash-command, .prodash-overview, .ftdash-hero, .portaldash-hero) :where(h1, h2, h3, h4, h5, h6, .title, .shipment-title, .ftdash-title, .prodash-title, .af-title, .as-title),
    .tms-portal-main :where([class$="-hero"], [class*="-hero "], .portaldash-hero) :where(h1, h2, h3, h4, h5, h6, .title) {
        color: #ffffff !important;
        text-shadow: 0 1px 2px rgba(2, 6, 23, .24);
    }

    .tms-content-inner :where([class$="-hero"], [class*="-hero "], .prodash-command, .prodash-overview, .ftdash-hero, .portaldash-hero) :where(p, small, .text-muted, .form-text, .help-text, .subtitle, .shipment-subtitle, .af-sub, .as-sub, .ai-sub, .api-sub, .dc-sub, .ft-muted),
    .tms-portal-main :where([class$="-hero"], [class*="-hero "], .portaldash-hero) :where(p, small, .text-muted, .form-text, .help-text, .subtitle) {
        color: rgba(232, 248, 255, .9) !important;
    }

    .tms-content-inner :where([class$="-hero"], [class*="-hero "], .prodash-command, .prodash-overview, .ftdash-hero, .portaldash-hero)::before,
    .tms-portal-main :where([class$="-hero"], [class*="-hero "], .portaldash-hero)::before {
        content: "" !important;
        display: block !important;
        position: absolute !important;
        right: clamp(14px, 3vw, 34px) !important;
        top: 18px !important;
        z-index: 0 !important;
        width: clamp(128px, 18vw, 210px) !important;
        height: clamp(68px, 8vw, 96px) !important;
        border: 1px solid rgba(255, 255, 255, .2) !important;
        border-radius: 8px !important;
        background:
            linear-gradient(90deg, transparent 0 18px, rgba(255, 255, 255, .16) 18px 20px, transparent 20px 42px),
            linear-gradient(0deg, transparent 0 18px, rgba(255, 255, 255, .11) 18px 20px, transparent 20px 42px),
            linear-gradient(135deg, rgba(255, 255, 255, .2), rgba(125, 211, 252, .08)) !important;
        background-size: 42px 42px, 42px 42px, 100% 100% !important;
        box-shadow: inset 0 1px 0 rgba(255, 255, 255, .18), 0 18px 38px rgba(2, 6, 23, .18) !important;
        opacity: .5 !important;
        pointer-events: none !important;
        transform: rotate(-2deg) !important;
        animation: tms-hero-cargo-float 5.6s ease-in-out infinite !important;
    }

    .tms-content-inner :where([class$="-hero"], [class*="-hero "], .prodash-command, .prodash-overview, .ftdash-hero, .portaldash-hero)::after,
    .tms-portal-main :where([class$="-hero"], [class*="-hero "], .portaldash-hero)::after {
        content: "" !important;
        display: block !important;
        position: absolute !important;
        right: clamp(28px, 5vw, 76px) !important;
        bottom: 18px !important;
        z-index: 1 !important;
        width: clamp(110px, 16vw, 190px) !important;
        height: 34px !important;
        border-radius: 8px !important;
        background:
            radial-gradient(circle at 8px 17px, #ffffff 0 3px, transparent 4px),
            radial-gradient(circle at calc(100% - 8px) 17px, #67e8f9 0 3px, transparent 4px),
            repeating-linear-gradient(90deg, rgba(255, 255, 255, .78) 0 12px, transparent 12px 22px) center / 100% 2px no-repeat !important;
        opacity: .68 !important;
        pointer-events: none !important;
        animation: tms-hero-route-dash 2.8s linear infinite !important;
    }

    @keyframes tms-hero-cargo-float {
        0%, 100% { transform: translateY(0) rotate(-2deg); }
        50% { transform: translateY(-7px) rotate(1deg); }
    }

    @keyframes tms-hero-route-dash {
        from { background-position: 0 0, 0 0, 0 50%; }
        to { background-position: 0 0, 0 0, 34px 50%; }
    }

    @media (prefers-reduced-motion: reduce) {
        .tms-content-inner :where([class$="-hero"], [class*="-hero "], .prodash-command, .prodash-overview, .ftdash-hero, .portaldash-hero)::before,
        .tms-content-inner :where([class$="-hero"], [class*="-hero "], .prodash-command, .prodash-overview, .ftdash-hero, .portaldash-hero)::after,
        .tms-portal-main :where([class$="-hero"], [class*="-hero "], .portaldash-hero)::before,
        .tms-portal-main :where([class$="-hero"], [class*="-hero "], .portaldash-hero)::after {
            animation: none !important;
        }
    }

    @media (max-width: 760px) {
        .tms-content-inner :where([class$="-hero"], [class*="-hero "], .prodash-command, .prodash-overview, .ftdash-hero, .portaldash-hero)::before,
        .tms-content-inner :where([class$="-hero"], [class*="-hero "], .prodash-command, .prodash-overview, .ftdash-hero, .portaldash-hero)::after,
        .tms-portal-main :where([class$="-hero"], [class*="-hero "], .portaldash-hero)::before,
        .tms-portal-main :where([class$="-hero"], [class*="-hero "], .portaldash-hero)::after {
            opacity: .18 !important;
        }

        .tms-content-inner :where(.card, .panel, .box, .tms-card, .tms-panel),
        .tms-portal-main :where(.card, .panel, .box, .tms-card) {
            padding: 14px !important;
        }

        .tms-content-inner table thead th,
        .tms-content-inner table tbody td,
        .tms-portal-main table thead th,
        .tms-portal-main table tbody td {
            padding: 10px !important;
        }
    }