/*
   Site-wide visual polish.
   Keeps existing UI and behavior, but softens typography, spacing, cards,
   modals, and map controls across pages.
*/

:root {
    --site-polish-border: rgba(226, 232, 240, .82);
    --site-polish-border-soft: rgba(226, 232, 240, .64);
    --site-polish-shadow: 0 8px 24px rgba(15, 23, 42, .045);
    --site-polish-shadow-soft: 0 5px 16px rgba(15, 23, 42, .035);
    --site-polish-text: #111827;
    --site-polish-muted: #64748b;
}

body {
    font-feature-settings: "cv02", "cv03", "cv04", "cv11";
    text-rendering: geometricPrecision;
}

body :where(h1, h2, h3, h4, h5, h6, p, a, button, label, span, strong, b, small) {
    letter-spacing: 0 !important;
}

body :where(.font-black, .font-extrabold) {
    font-weight: 680 !important;
}

body :where(.font-bold) {
    font-weight: 580 !important;
}

body :where(.uppercase) {
    text-transform: none !important;
}

body :where(.tracking-widest, .tracking-wide, .tracking-wider, [class*="tracking-["]) {
    letter-spacing: 0 !important;
}

body :where(.text-gray-400, .text-gray-500, .text-slate-400, .text-slate-500) {
    font-weight: 450 !important;
}

body:not(.page-map) :where(
    [class*="rounded-[40px]"],
    [class*="rounded-[36px]"],
    [class*="rounded-[32px]"],
    [class*="rounded-[28px]"],
    [class*="rounded-[24px]"],
    .shadow-2xl,
    .shadow-xl
) {
    border-color: var(--site-polish-border) !important;
    box-shadow: var(--site-polish-shadow) !important;
}

body:not(.page-map) :where(section, article, aside, form, [class*="-card"], [class*="Card"]) :where(h1, h2, h3) {
    font-weight: 680 !important;
}

body:not(.page-map) :where(section, article, aside, form, [class*="-card"], [class*="Card"]) :where(p, small) {
    font-weight: 450;
}

body:not(.page-map) :where(
    button,
    .btn,
    [role="button"],
    a[class*="bg-orange"],
    a[class*="bg-gray-9"],
    a[class*="bg-black"],
    button[class*="bg-orange"],
    button[class*="bg-gray-9"],
    button[class*="bg-black"]
) {
    font-weight: 600 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

body:not(.page-map) :where(input, textarea, select) {
    font-weight: 450 !important;
}

body:not(.page-map) :where(label, legend) {
    font-weight: 520 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

[data-feed-card] .feed-action-views {
    margin-left: auto !important;
    min-height: 32px;
    padding: 0 3px;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #94a3b8 !important;
    opacity: .82;
}

[data-feed-card] .feed-action-views svg {
    flex: 0 0 auto;
    color: currentColor;
}

[data-feed-card] .feed-action-views b {
    margin: 0 !important;
    color: currentColor !important;
    font-weight: 520 !important;
    line-height: 1 !important;
}

@media (min-width: 768px) {
    [data-feed-card] .feed-card-actions .feed-action-btn {
        height: 40px !important;
        min-height: 40px !important;
        max-height: 40px !important;
        box-sizing: border-box !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    [data-feed-card] .feed-card-actions a.feed-action-btn,
    [data-feed-card] .feed-card-actions button.feed-action-btn {
        min-width: 72px !important;
    }

    [data-feed-card] .feed-action-views {
        height: 40px !important;
        min-height: 40px !important;
        max-height: 40px !important;
        align-self: center !important;
        gap: 6px !important;
        font-size: 12px !important;
    }
}

body:not(.page-map) :where(
    body > .fixed.inset-0[id*="modal"] > div,
    body > .fixed.inset-0[id*="Modal"] > div,
    [id*="modal-content"],
    [id*="ModalContent"],
    [class*="modal"] [class*="rounded"]
) {
    border-color: var(--site-polish-border) !important;
    box-shadow: 0 18px 44px rgba(15, 23, 42, .12) !important;
}

body:not(.page-map) :where(
    [id*="modal"],
    [id*="Modal"],
    [class*="modal"],
    [class*="drawer"],
    [class*="Drawer"]
) :where(h2, h3) {
    font-weight: 680 !important;
    letter-spacing: 0 !important;
}

body:not(.page-map) :where(
    [id*="modal"],
    [id*="Modal"],
    [class*="modal"],
    [class*="drawer"],
    [class*="Drawer"]
) :where(p, label, small, span) {
    letter-spacing: 0 !important;
}

.site-topbar,
.site-create-button,
.site-create-menu-item,
.site-search-dropdown,
#userDropdown,
#notifDropdown,
#mobile-bottom-nav {
    letter-spacing: 0 !important;
}

.site-create-button,
#mobile-bottom-nav span,
.site-create-menu-item :where(strong, small),
.notif-dropdown :where(p, button) {
    text-transform: none !important;
    font-weight: 560 !important;
}

@media (max-width: 767px) {
    body:not(.page-map):not(.page-messages) .site-main-offset {
        background: #f8fafc;
    }

    body:not(.page-map):not(.page-messages) :where(
        section,
        article,
        aside,
        form,
        [class*="-card"],
        [class*="Card"]
    ) {
        scroll-margin-top: 18px;
    }

    body:not(.page-map) :where(.space-y-3 > :not([hidden]) ~ :not([hidden])) {
        margin-top: 14px !important;
    }

    body:not(.page-map) :where(.space-y-4 > :not([hidden]) ~ :not([hidden])) {
        margin-top: 18px !important;
    }

    body:not(.page-map) :where(.space-y-6 > :not([hidden]) ~ :not([hidden])) {
        margin-top: 26px !important;
    }

    body:not(.page-map) :where(.gap-3) {
        gap: 14px !important;
    }

    body:not(.page-map) :where(.gap-4) {
        gap: 18px !important;
    }

    body:not(.page-map) :where(
        body > .fixed.inset-0[id*="modal"] > div,
        body > .fixed.inset-0[id*="Modal"] > div,
        [id*="modal-content"],
        [id*="ModalContent"]
    ) {
        border-radius: 22px !important;
    }

    body:not(.page-map) :where(.shadow-2xl, .shadow-xl, .shadow-lg) {
        box-shadow: var(--site-polish-shadow) !important;
    }

    body:not(.page-map) :where(.p-5, .p-6, .md\:p-6, .md\:p-7) {
        --site-polish-local-pad: 16px;
    }
}

/* Map gets its own lighter treatment so full-screen positioning stays intact. */
body.page-map .map-page-wrapper :where(.font-black, .font-extrabold, .font-bold),
body.page-map .map-page-wrapper :where(
    .map-control-title,
    .map-control-subtitle,
    .map-active-chip,
    .map-control-badge,
    .collection-title-badge,
    button,
    label,
    small,
    strong
) {
    font-weight: 550 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

body.page-map .map-page-wrapper :where(
    #search-wrapper,
    #copilot-panel,
    #planner-sidebar,
    #route-info-card,
    #planner-assistant-panel,
    #radar-sidebar,
    #layer-switcher-menu,
    #poi-filter-menu,
    #left-collection-menu #collection-shell,
    .map-controls-panel,
    .map-floating-control,
    .maplibregl-popup-content
) {
    border-color: rgba(226, 232, 240, .72) !important;
    box-shadow: 0 8px 24px rgba(15, 23, 42, .08) !important;
}

body.page-map .map-page-wrapper :where(.map-control-row) {
    border-color: rgba(226, 232, 240, .82) !important;
    background: rgba(255, 255, 255, .92) !important;
}

body.page-map .map-page-wrapper :where(.map-control-title) {
    color: #111827 !important;
    font-size: 10px !important;
}

body.page-map .map-page-wrapper :where(.map-control-subtitle) {
    color: #64748b !important;
    font-size: 9px !important;
    font-weight: 430 !important;
}

body.page-map .map-page-wrapper :where(.map-active-chip) {
    min-height: 31px !important;
    border-color: rgba(249, 115, 22, .2) !important;
    box-shadow: 0 6px 16px rgba(15, 23, 42, .06) !important;
}