Set box-sizing: border-box globally

frontend/components/CommandPalette/_styles.scss

@@ -68,7 +68,6 @@
   &__input {
     flex: 1;
     min-width: 0;
-    box-sizing: border-box;
     height: 44px;
     padding: $pad-small;
     font-size: $x-small;

frontend/components/FeedListItem/_styles.scss

@@ -4,7 +4,6 @@
   grid-template-rows: max-content;
 
   &__avatar-wrapper {
-    box-sizing: border-box;
     display: grid;
     grid-template-columns: 16px 16px;
     grid-template-rows: 8px 32px 1fr;

frontend/components/FlashMessage/_styles.scss

@@ -21,7 +21,6 @@
   padding: $pad-small $pad-medium;
   z-index: 999;
   border: 1px solid;
-  box-sizing: border-box;
   border-radius: 8px;
   max-width: calc(100% - 64px); // Same horizontal margin as .main-content
   pointer-events: auto;

frontend/components/Modal/_styles.scss

@@ -65,7 +65,6 @@
 
   &__modal_container {
     @include position(absolute, 22px null null null);
-    box-sizing: border-box;
     background-color: $core-fleet-white;
     padding: $pad-xxlarge;
     border-radius: 8px;

frontend/components/SidePanelContent/_styles.scss

@@ -1,6 +1,5 @@
 .side-panel-content {
   background-color: $core-fleet-white;
-  box-sizing: border-box;
   border-left: 1px solid $ui-gray;
 
   body.dark-mode & {

frontend/components/SidePanelPage/_styles.scss

@@ -34,7 +34,6 @@ $main-max-width-including-padding: 1280px + 32px + 32px; // Cannot use variables
   /* Main Content logic per breakpoint */
   .main-content {
     position: relative;
-    box-sizing: border-box;
     padding: $main-padding;
 
     /* Default: for < ($main-max-width-including-padding + $side-panel-width) */

frontend/components/Tag/_styles.scss

@@ -17,7 +17,6 @@
     background: none;
     cursor: pointer;
     outline: inherit;
-    box-sizing: inherit;
 
     &:focus {
       // this is defined in the Button component styles

frontend/components/TargetLabelSelector/_styles.scss

@@ -36,7 +36,6 @@
   &__label {
     width: 100%;
     padding: $pad-small $pad-medium;
-    box-sizing: border-box;
     display: flex;
     align-items: center;
 

frontend/components/TargetsInput/_styles.scss

@@ -44,7 +44,6 @@
       display: flex;
       justify-content: center;
       box-shadow: 0px 4px 10px rgba(52, 59, 96, 0.15);
-      box-sizing: border-box;
     }
   }
   // hack because it's creating unwanted space

frontend/components/buttons/Button/_styles.scss

@@ -174,7 +174,6 @@ $base-class: "button";
     );
     color: $core-fleet-green;
     border: 1px solid $core-fleet-green;
-    box-sizing: border-box;
     font-size: $xx-small;
     padding: $pad-xsmall 10px;
     height: 24px;
@@ -200,7 +199,6 @@ $base-class: "button";
     color: $ui-fleet-black-75;
     border: 1px solid $ui-fleet-black-25;
     border-radius: 4px;
-    box-sizing: border-box;
     font-size: $xx-small;
     font-weight: $bold;
     padding: 0 $pad-small;
@@ -432,7 +430,6 @@ $base-class: "button";
     );
     background-color: transparent;
     color: $ui-fleet-black-75;
-    box-sizing: border-box;
 
     .children-wrapper {
       gap: $pad-small; // For icons next to text like Pagination buttons
@@ -447,7 +444,6 @@ $base-class: "button";
       $inverse: true
     );
     color: $core-vibrant-red;
-    box-sizing: border-box;
   }
 
   &--disabled {

frontend/components/forms/fields/AutoSizeInputField/_styles.scss

@@ -1,5 +1,4 @@
 .component__auto-size-input-field {
-  box-sizing: border-box;
   color: $core-fleet-black;
 
   &::placeholder {

frontend/components/forms/fields/Dropdown/_styles.scss

@@ -39,7 +39,6 @@
         .Select-control {
           color: $core-vibrant-red;
           border: 1px solid $core-vibrant-red;
-          box-sizing: border-box;
           border-radius: $border-radius;
         }
 
@@ -280,7 +279,6 @@
     color: $ui-fleet-black-50;
     font-size: $x-small;
     line-height: 34px;
-    box-sizing: border-box;
   }
 
   .Select-clear-zone {
@@ -294,7 +292,6 @@
   .Select-input {
     color: $core-fleet-black;
     font-size: $x-small;
-    box-sizing: border-box;
     height: 34px;
 
     &:focus {

frontend/components/forms/fields/InputField/_styles.scss

@@ -7,7 +7,6 @@
   padding: $pad-small $pad-medium;
   color: $core-fleet-black;
   font-family: "Inter", sans-serif;
-  box-sizing: border-box;
   height: 36px;
   transition: border-color 100ms;
   width: 100%;
@@ -35,7 +34,6 @@
   &--error {
     color: $core-vibrant-red;
     border: 1px solid $core-vibrant-red;
-    box-sizing: border-box;
     border-radius: $border-radius;
 
     &:focus {

frontend/components/forms/fields/InputFieldWithIcon/_styles.scss

@@ -18,7 +18,6 @@
 
     &--error {
       border: 1px solid $core-vibrant-red;
-      box-sizing: border-box;
       border-radius: $border-radius;
     }
   }
@@ -40,7 +39,6 @@
     text-indent: 1px;
     position: relative;
     width: 100%;
-    box-sizing: border-box;
     color: $core-fleet-black;
     font-weight: $regular;
     transition: border-color 100ms;
@@ -69,7 +67,6 @@
     &--error {
       color: $core-vibrant-red;
       border: 1px solid $core-vibrant-red;
-      box-sizing: border-box;
       border-radius: $border-radius;
     }
   }

frontend/layouts/CoreLayout/_styles.scss

@@ -40,7 +40,6 @@
 .site-nav-container {
   background: $core-fleet-white;
   border-bottom: 1px solid $ui-fleet-black-10;
-  box-sizing: border-box;
   top: 0;
   left: 0;
   z-index: 100;

frontend/pages/ConfirmInvitePage/_styles.scss

@@ -1,6 +1,5 @@
 .confirm-invite-page {
   &__form-section-wrapper {
-    box-sizing: border-box;
     margin-bottom: 110px;
   }
 

frontend/pages/DashboardPage/_styles.scss

@@ -34,7 +34,6 @@
   }
 
   .card {
-    box-sizing: border-box;
     overflow-x: hidden;
   }
 

frontend/pages/DashboardPage/cards/ActivityFeed/components/ActivityAutomationDetailsModal/_styles.scss

@@ -1,5 +1,4 @@
 .activity-automation-details-modal {
-  box-sizing: border-box;
   width: 811px;
 
   &__modal-content {

frontend/pages/DashboardPage/cards/ActivityFeed/components/ActivityTypeDropdown/_styles.scss

@@ -23,7 +23,6 @@
     color: $core-fleet-blue;
     font-family: "Inter", sans-serif;
     font-size: $x-small;
-    box-sizing: border-box;
     height: 36px;
 
     &::placeholder {
@@ -51,7 +50,6 @@
     &--error {
       color: $core-vibrant-red;
       border: 1px solid $core-vibrant-red;
-      box-sizing: border-box;
       border-radius: $border-radius;
 
       &:focus {

frontend/pages/DashboardPage/cards/ActivityFeed/components/RunScriptDetailsModal/_styles.scss

@@ -1,5 +1,4 @@
 .run-script-details-modal {
-  box-sizing: border-box;
   width: 811px;
 
   &__modal-content {

frontend/pages/DashboardPage/components/ActivityFeedAutomationsModal/_styles.scss

@@ -6,7 +6,6 @@
   }
 
   pre {
-    box-sizing: border-box;
     margin: 0;
   }
 }

frontend/pages/ManageControlsPage/OSSettings/cards/DiskEncryption/_styles.scss

@@ -18,7 +18,6 @@
       // Keeps table data within the table container at smaller screen sizes
       overflow-x: auto;
       // Prevent border from causing .side-nav__card-container horizontal scroll
-      box-sizing: border-box;
     }
   }
 }

frontend/pages/ManageControlsPage/OSUpdates/components/EndUserOSRequirementPreview/_styles.scss

@@ -1,5 +1,4 @@
 .os-requirement-preview {
-  box-sizing: border-box;
   background-color: $ui-off-white;
   border-radius: $border-radius;
   border: 1px solid $ui-fleet-black-10;

frontend/pages/SoftwarePage/SoftwareLibrary/SelfServiceCategoriesPage/_styles.scss

@@ -26,7 +26,6 @@
     .upload-list__list-item {
       padding: 0 $pad-large;
       height: 56px;
-      box-sizing: border-box;
     }
   }
 

frontend/pages/SoftwarePage/components/forms/PackageForm/_styles.scss

@@ -61,10 +61,6 @@
     }
   }
 
-  &__file-uploader {
-    box-sizing: border-box;
-  }
-
   &__form-fields {
     &--gitops-disabled {
       @include disabled;

frontend/pages/SoftwarePage/components/forms/SoftwareOptionsSelector/_styles.scss

@@ -21,7 +21,6 @@
   &__label {
     width: 100%;
     padding: $pad-small $pad-medium;
-    box-sizing: border-box;
     display: flex;
     align-items: center;
 

frontend/pages/admin/IntegrationsPage/cards/Integrations/components/IntegrationForm/_styles.scss

@@ -85,7 +85,6 @@
     width: 98%;
     float: left;
     padding: 0 $pad-medium 0 0;
-    box-sizing: border-box;
 
     .input-icon-field {
       width: 100%;

frontend/pages/admin/ManageUsersPage/components/UserForm/_styles.scss

@@ -49,7 +49,6 @@
   }
 
   &__password {
-    box-sizing: border-box;
 
     .input-icon-field {
       width: 100%;

frontend/pages/hosts/ManageHostsPage/components/CustomLabelGroupHeading/_styles.scss

@@ -34,7 +34,6 @@
     color: $core-fleet-blue;
     font-family: "Inter", sans-serif;
     font-size: $x-small;
-    box-sizing: border-box;
     height: 36px;
 
     margin-bottom: $pad-medium;
@@ -64,7 +63,6 @@
     &--error {
       color: $core-vibrant-red;
       border: 1px solid $core-vibrant-red;
-      box-sizing: border-box;
       border-radius: $border-radius;
 
       &:focus {

frontend/pages/hosts/details/HostDetailsPage/modals/RunScriptModal/_styles.scss

@@ -1,5 +1,4 @@
 .run-script-modal {
-  box-sizing: border-box;
   width: 811px;
 
   &__modal-content {

frontend/pages/hosts/details/cards/Software/SelfService/components/CategoryFilter/_styles.scss

@@ -70,7 +70,6 @@
     color: $core-fleet-blue;
     font-family: "Inter", sans-serif;
     font-size: $x-small;
-    box-sizing: border-box;
     height: 36px;
 
     &::placeholder {

frontend/pages/policies/ManagePoliciesPage/components/AutomationsModal/components/CalendarEventsModal/_styles.scss

@@ -19,7 +19,6 @@
   }
 
   pre {
-    box-sizing: border-box;
     margin: 0;
   }
 }

frontend/pages/policies/ManagePoliciesPage/components/AutomationsModal/components/OtherWorkflowsModal/ExampleTicket/_styles.scss

@@ -2,7 +2,6 @@
   display: flex;
   flex-direction: column;
   align-items: center;
-  box-sizing: border-box;
 
   &__screenshot {
     max-width: 400px;

frontend/pages/policies/components/PatchAutomationCta/_styles.scss

@@ -2,7 +2,6 @@
   display: flex;
   align-items: center;
   justify-content: space-between;
-  box-sizing: border-box;
   width: 100%;
   padding: $pad-medium;
   background-color: $ui-fleet-black-5;

frontend/pages/policies/edit/components/PolicyErrorsTable/_styles.scss

@@ -103,6 +103,5 @@
 
 .no-team-policy {
   border: 1px solid #e2e4ea;
-  box-sizing: border-box;
   border-radius: 8px;
 }

frontend/pages/policies/edit/components/PolicyResultsTable/_styles.scss

@@ -121,6 +121,5 @@
 
 .no-team-policy {
   border: 1px solid #e2e4ea;
-  box-sizing: border-box;
   border-radius: 8px;
 }

frontend/pages/queries/ManageQueriesPage/components/ManageQueryAutomationsModal/_styles.scss

@@ -9,7 +9,6 @@
   &__query-item {
     width: 100%;
     padding: 8px 12px;
-    box-sizing: border-box;
     display: flex;
     align-items: center;
     justify-content: space-between;

frontend/styles/global/_global.scss

@@ -1,12 +1,19 @@
 html {
   position: relative;
   height: 100%;
+  box-sizing: border-box;
   // Because iOS hates us we must fight to the death!
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
   // End Apple War
   color-scheme: light;
 }
 
+*,
+*::before,
+*::after {
+  box-sizing: inherit;
+}
+
 html:has(body.dark-mode) {
   // Tells the browser to render native UI (scrollbars, form controls, etc.)
   // in their dark variants when dark mode is active.
@@ -146,10 +153,6 @@ form,
   p {
     margin: 0;
   }
-
-  .info-banner {
-    box-sizing: border-box;
-  }
 }
 
 .form-field {