/**
 * SwiftLogist V2 — Global stylesheet
 *
 * Import order matters: tokens first, then reset, then global rules.
 * Component-level stylesheets are imported from here as well so a single
 * <link> tag in base.html.twig is sufficient.
 */

/* Tom Select base styles (symfony/ux-autocomplete widget). Imported here so the
   enhanced city filters are always styled, independent of the JS autoimport
   timing; the design-system overrides live in components/freight-search.css. */
@import "../vendor/tom-select/dist/css/tom-select.default-FgUXnTW.css";

/* driver.js base styles (dashboard first-login guide, SL-235). Imported here rather
   than from the Stimulus controller for the same reason as Tom Select above: the
   popover must never render unstyled while waiting on the JS autoimport. */
@import "../vendor/driver.js/dist/driver.min-UHsSNTa.css";

/* Self-hosted Inter (SL-184): must come before the tokens that reference the family. */
@import "fonts-R-92aDf.css";
@import "tokens-uSQ0CgB.css";
@import "components/toolkit-m29O87r.css";
@import "components/back-link-AZPDVcm.css";
@import "components/count-badge-cU5Fwqr.css";
@import "components/country-flag-1TpJ3e7.css";
@import "components/forms-gxp8Bo7.css";
@import "components/layout-C4D8KxB.css";
@import "components/register-hgPf1rj.css";
@import "components/onboarding-5XmrqMJ.css";
@import "components/dashboard-lkVupDF.css";
@import "components/dashboard-tour-WdXPyck.css";
@import "components/quota-tJN1-hk.css";
@import "components/carrier-8Wpx2BU.css";
@import "components/shipper-JpwA3zr.css";
@import "components/listing-manage-kIEuAdd.css";
@import "components/pagination-O4FoRCn.css";
@import "components/freight-search-h3RLMiG.css";
@import "components/freight-detail-9r786Qo.css";
@import "components/carrier-availability-search-TB8-GLF.css";
@import "components/carrier-availability-detail-Ce5zxOH.css";
@import "components/freight-wizard-R7cWETW.css";
@import "components/multiselect-Jql6qwg.css";
@import "components/city-autocomplete-7L6Yxz2.css";
@import "components/address-autocomplete-NbNQp2M.css";
@import "components/toasts-Rbrre4S.css";
@import "components/chat-kEsdpa4.css";
@import "components/conversation-inbox-SMUmUpT.css";
@import "components/mission-recap-JfJUygp.css";
@import "components/mission-hub-l6iq4f6.css";
@import "components/mission-list-6vCM9u5.css";
@import "components/notification-bell-dH9Pj68.css";
@import "components/banner-RA-Nmz5.css";
@import "components/impersonation-FCEQPky.css";
@import "components/kyc-banner-Lgw7I_O.css";
@import "components/company-profile-b6yC13w.css";
@import "components/legal-page-BWT6qNe.css";
@import "components/support-bubble-rxtMK35.css";

/* -------------------------------------------------------------------------
 * Minimal reset
 * ---------------------------------------------------------------------- */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    padding: 0;
}

/* -------------------------------------------------------------------------
 * Base typography
 * ---------------------------------------------------------------------- */

body {
    font-family: var(--font-family-base);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-regular);
    color: var(--color-navy);
    line-height: var(--line-height-base);
    background-color: var(--color-white);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1 {
    font-family: var(--font-family-display);
    font-size: var(--font-size-4xl);
    font-weight: var(--font-weight-medium);
    line-height: var(--line-height-tight);
    letter-spacing: -0.01em;
    color: var(--color-navy);
    margin: 0;
}

h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-family-base);
    font-weight: var(--font-weight-medium);
    color: var(--color-navy);
    margin: 0;
}

p {
    margin: 0;
}

a {
    color: var(--color-brand-orange);
    text-decoration: none;
}

a:hover {
    color: var(--color-brand-orange-hover);
}

/* -------------------------------------------------------------------------
 * Container
 * ---------------------------------------------------------------------- */

.container {
    max-width: var(--container-max-width);
    margin-inline: auto;
    padding-inline: var(--container-padding);
}

@media (max-width: 1200px) {
    .container {
        max-width: 768px;
    }
}

@media (max-width: 768px) {
    .container {
        max-width: 100%;
        padding-inline: 15px;
    }
}

/* -------------------------------------------------------------------------
 * Utilities
 * ---------------------------------------------------------------------- */

/* Contact address rendered as an image (SL-178): keeping it out of the markup is
   what protects the mailbox from scrapers. Sized in em so it follows the font size
   of the sentence it sits in, and pushed below the baseline so it lines up with the
   surrounding text instead of floating above it. */
.contact-email {
    height: 1.2em;
    width: auto;
    max-width: 100%;
    vertical-align: -0.38em;
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
