﻿/*========================================
  MARGIN HELPERS — Bootstrap 5 Standard
========================================*/

.m-0  { margin: 0 !important; }
.mt-0 { margin-top: 0 !important; }
.mr-0 { margin-right: 0 !important; }
.mb-0 { margin-bottom: 0 !important; }
.ml-0 { margin-left: 0 !important; }
.mx-0 { margin-left: 0 !important; margin-right: 0 !important; }
.my-0 { margin-top: 0 !important; margin-bottom: 0 !important; }

.m-1  { margin: 0.25rem !important; }
.mt-1 { margin-top: 0.25rem !important; }
.mr-1 { margin-right: 0.25rem !important; }
.mb-1 { margin-bottom: 0.25rem !important; }
.ml-1 { margin-left: 0.25rem !important; }
.mx-1 { margin-left: 0.25rem !important; margin-right: 0.25rem !important; }
.my-1 { margin-top: 0.25rem !important; margin-bottom: 0.25rem !important; }

.m-2  { margin: 0.5rem !important; }
.mt-2 { margin-top: 0.5rem !important; }
.mr-2 { margin-right: 0.5rem !important; }
.mb-2 { margin-bottom: 0.5rem !important; }
.ml-2 { margin-left: 0.5rem !important; }
.mx-2 { margin-left: 0.5rem !important; margin-right: 0.5rem !important; }
.my-2 { margin-top: 0.5rem !important; margin-bottom: 0.5rem !important; }

.m-3  { margin: 1rem !important; }
.mt-3 { margin-top: 1rem !important; }
.mr-3 { margin-right: 1rem !important; }
.mb-3 { margin-bottom: 1rem !important; }
.ml-3 { margin-left: 1rem !important; }
.mx-3 { margin-left: 1rem !important; margin-right: 1rem !important; }
.my-3 { margin-top: 1rem !important; margin-bottom: 1rem !important; }

.m-4  { margin: 1.5rem !important; }
.mt-4 { margin-top: 1.5rem !important; }
.mr-4 { margin-right: 1.5rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.ml-4 { margin-left: 1.5rem !important; }
.mx-4 { margin-left: 1.5rem !important; margin-right: 1.5rem !important; }
.my-4 { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important; }

.m-5  { margin: 3rem !important; }
.mt-5 { margin-top: 3rem !important; }
.mr-5 { margin-right: 3rem !important; }
.mb-5 { margin-bottom: 3rem !important; }
.ml-5 { margin-left: 3rem !important; }
.mx-5 { margin-left: 3rem !important; margin-right: 3rem !important; }
.my-5 { margin-top: 3rem !important; margin-bottom: 3rem !important; }

.m-auto  { margin: auto !important; }
.mt-auto { margin-top: auto !important; }
.mr-auto { margin-right: auto !important; }
.mb-auto { margin-bottom: auto !important; }
.ml-auto { margin-left: auto !important; }
.mx-auto { margin-left: auto !important; margin-right: auto !important; }
.my-auto { margin-top: auto !important; margin-bottom: auto !important; }

/*========================================
  PADDING HELPERS — Bootstrap 5 Standard
========================================*/

.p-0  { padding: 0 !important; }
.pt-0 { padding-top: 0 !important; }
.pr-0 { padding-right: 0 !important; }
.pb-0 { padding-bottom: 0 !important; }
.pl-0 { padding-left: 0 !important; }
.px-0 { padding-left: 0 !important; padding-right: 0 !important; }
.py-0 { padding-top: 0 !important; padding-bottom: 0 !important; }

.p-1  { padding: 0.25rem !important; }
.pt-1 { padding-top: 0.25rem !important; }
.pr-1 { padding-right: 0.25rem !important; }
.pb-1 { padding-bottom: 0.25rem !important; }
.pl-1 { padding-left: 0.25rem !important; }
.px-1 { padding-left: 0.25rem !important; padding-right: 0.25rem !important; }
.py-1 { padding-top: 0.25rem !important; padding-bottom: 0.25rem !important; }

.p-2  { padding: 0.5rem !important; }
.pt-2 { padding-top: 0.5rem !important; }
.pr-2 { padding-right: 0.5rem !important; }
.pb-2 { padding-bottom: 0.5rem !important; }
.pl-2 { padding-left: 0.5rem !important; }
.px-2 { padding-left: 0.5rem !important; padding-right: 0.5rem !important; }
.py-2 { padding-top: 0.5rem !important; padding-bottom: 0.5rem !important; }

.p-3  { padding: 1rem !important; }
.pt-3 { padding-top: 1rem !important; }
.pr-3 { padding-right: 1rem !important; }
.pb-3 { padding-bottom: 1rem !important; }
.pl-3 { padding-left: 1rem !important; }
.px-3 { padding-left: 1rem !important; padding-right: 1rem !important; }
.py-3 { padding-top: 1rem !important; padding-bottom: 1rem !important; }

.p-4  { padding: 1.5rem !important; }
.pt-4 { padding-top: 1.5rem !important; }
.pr-4 { padding-right: 1.5rem !important; }
.pb-4 { padding-bottom: 1.5rem !important; }
.pl-4 { padding-left: 1.5rem !important; }
.px-4 { padding-left: 1.5rem !important; padding-right: 1.5rem !important; }
.py-4 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; }

.p-5  { padding: 3rem !important; }
.pt-5 { padding-top: 3rem !important; }
.pr-5 { padding-right: 3rem !important; }
.pb-5 { padding-bottom: 3rem !important; }
.pl-5 { padding-left: 3rem !important; }
.px-5 { padding-left: 3rem !important; padding-right: 3rem !important; }
.py-5 { padding-top: 3rem !important; padding-bottom: 3rem !important; }

/*========================================
  COLOR HELPERS — Custom Prefix "ch-" 
  (Color Helper, won't clash with Bootstrap)
========================================*/

.ch-red     { color: #dc3545 !important; }  /* Bootstrap 5's red */
.ch-green   { color: #198754 !important; }  /* Bootstrap 5's green */
.ch-blue    { color: #0d6efd !important; }  /* Bootstrap 5's blue */
.ch-orange  { color: #fd7e14 !important; }  /* Bootstrap 5's orange */
.ch-purple  { color: #6f42c1 !important; }  /* Bootstrap 5's purple */
.ch-magenta { color: #d63384 !important; }  /* Bootstrap 5's pink/magenta */
.ch-yellow  { color: #ffc107 !important; }  /* Bootstrap 5's yellow */
.ch-teal    { color: #20c997 !important; }  /* Bonus: teal */
.ch-cyan    { color: #0dcaf0 !important; }  /* Bonus: cyan */
.ch-white   { color: #fff !important; }
.ch-black   { color: #000 !important; }
.ch-gray    { color: #6c757d !important; }  /* Bootstrap 5's gray */

/*========================================
  TEXT HELPERS — Custom Prefix "th-" 
  (Text Helper, won't clash with Bootstrap)
========================================*/

.th-bold      { font-weight: bold !important; }
.th-bolder    { font-weight: bolder !important; }
.th-normal    { font-weight: normal !important; }
.th-light     { font-weight: 300 !important; }
.th-lighter   { font-weight: lighter !important; }

.th-italic    { font-style: italic !important; }
.th-normal-style { font-style: normal !important; }

.th-underline { text-decoration: underline !important; }
.th-line-through { text-decoration: line-through !important; }
.th-no-decoration { text-decoration: none !important; }

.th-uppercase { text-transform: uppercase !important; }
.th-lowercase { text-transform: lowercase !important; }
.th-capitalize { text-transform: capitalize !important; }

.th-left      { text-align: left !important; }
.th-center    { text-align: center !important; }
.th-right     { text-align: right !important; }
.th-justify   { text-align: justify !important; }

.th-wrap      { white-space: normal !important; }
.th-nowrap    { white-space: nowrap !important; }

.th-truncate {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.th-small     { font-size: 0.875em !important; }
.th-lead      { font-size: 1.25em !important; }

/*========================================
  BACKGROUND HELPERS — Custom Prefix "bh-" 
  (Background Helper)
========================================*/

.bh-red     { background-color: #dc3545 !important; }
.bh-green   { background-color: #198754 !important; }
.bh-blue    { background-color: #0d6efd !important; }
.bh-orange  { background-color: #fd7e14 !important; }
.bh-purple  { background-color: #6f42c1 !important; }
.bh-magenta { background-color: #d63384 !important; }
.bh-yellow  { background-color: #ffc107 !important; }
.bh-teal    { background-color: #20c997 !important; }
.bh-cyan    { background-color: #0dcaf0 !important; }
.bh-white   { background-color: #fff !important; }
.bh-black   { background-color: #000 !important; }
.bh-gray    { background-color: #6c757d !important; }
.bh-light   { background-color: #f8f9fa !important; }
.bh-dark    { background-color: #212529 !important; }

/*========================================
  BORDER HELPERS — Custom Prefix "brh-" 
  (Border Helper, won't clash with Bootstrap)
========================================*/

/*-------- Border Width --------*/
.brh-0 { border: 0 !important; }
.brh-1 { border: 1px solid !important; }
.brh-2 { border: 2px solid !important; }
.brh-3 { border: 3px solid !important; }
.brh-4 { border: 4px solid !important; }
.brh-5 { border: 5px solid !important; }

/*-------- Border Top --------*/
.brht-0 { border-top: 0 !important; }
.brht-1 { border-top: 1px solid !important; }
.brht-2 { border-top: 2px solid !important; }
.brht-3 { border-top: 3px solid !important; }
.brht-4 { border-top: 4px solid !important; }
.brht-5 { border-top: 5px solid !important; }

/*-------- Border Right --------*/
.brhr-0 { border-right: 0 !important; }
.brhr-1 { border-right: 1px solid !important; }
.brhr-2 { border-right: 2px solid !important; }
.brhr-3 { border-right: 3px solid !important; }
.brhr-4 { border-right: 4px solid !important; }
.brhr-5 { border-right: 5px solid !important; }

/*-------- Border Bottom --------*/
.brhb-0 { border-bottom: 0 !important; }
.brhb-1 { border-bottom: 1px solid !important; }
.brhb-2 { border-bottom: 2px solid !important; }
.brhb-3 { border-bottom: 3px solid !important; }
.brhb-4 { border-bottom: 4px solid !important; }
.brhb-5 { border-bottom: 5px solid !important; }

/*-------- Border Left --------*/
.brhl-0 { border-left: 0 !important; }
.brhl-1 { border-left: 1px solid !important; }
.brhl-2 { border-left: 2px solid !important; }
.brhl-3 { border-left: 3px solid !important; }
.brhl-4 { border-left: 4px solid !important; }
.brhl-5 { border-left: 5px solid !important; }

/*-------- Border Axial --------*/
.brh-x-0 { border-left: 0 !important; border-right: 0 !important; }
.brh-x-1 { border-left: 1px solid !important; border-right: 1px solid !important; }
.brh-x-2 { border-left: 2px solid !important; border-right: 2px solid !important; }
.brh-x-3 { border-left: 3px solid !important; border-right: 3px solid !important; }
.brh-x-4 { border-left: 4px solid !important; border-right: 4px solid !important; }
.brh-x-5 { border-left: 5px solid !important; border-right: 5px solid !important; }

.brh-y-0 { border-top: 0 !important; border-bottom: 0 !important; }
.brh-y-1 { border-top: 1px solid !important; border-bottom: 1px solid !important; }
.brh-y-2 { border-top: 2px solid !important; border-bottom: 2px solid !important; }
.brh-y-3 { border-top: 3px solid !important; border-bottom: 3px solid !important; }
.brh-y-4 { border-top: 4px solid !important; border-bottom: 4px solid !important; }
.brh-y-5 { border-top: 5px solid !important; border-bottom: 5px solid !important; }

/*-------- Border Color --------*/
.brh-red     { border-color: #dc3545 !important; }
.brh-green   { border-color: #198754 !important; }
.brh-blue    { border-color: #0d6efd !important; }
.brh-orange  { border-color: #fd7e14 !important; }
.brh-purple  { border-color: #6f42c1 !important; }
.brh-magenta { border-color: #d63384 !important; }
.brh-yellow  { border-color: #ffc107 !important; }
.brh-teal    { border-color: #20c997 !important; }
.brh-cyan    { border-color: #0dcaf0 !important; }
.brh-white   { border-color: #fff !important; }
.brh-black   { border-color: #000 !important; }
.brh-gray    { border-color: #6c757d !important; }
.brh-light   { border-color: #f8f9fa !important; }
.brh-dark    { border-color: #212529 !important; }

/*-------- Border Style --------*/
.brh-solid   { border-style: solid !important; }
.brh-dashed  { border-style: dashed !important; }
.brh-dotted  { border-style: dotted !important; }
.brh-double  { border-style: double !important; }
.brh-none    { border-style: none !important; }

/*-------- Border Radius --------*/
.brh-rounded-0 { border-radius: 0 !important; }
.brh-rounded-1 { border-radius: 0.2rem !important; }
.brh-rounded-2 { border-radius: 0.25rem !important; }
.brh-rounded-3 { border-radius: 0.375rem !important; }
.brh-rounded-4 { border-radius: 0.5rem !important; }
.brh-rounded-5 { border-radius: 1rem !important; }
.brh-rounded-pill { border-radius: 50rem !important; }
.brh-rounded-circle { border-radius: 50% !important; }

/*-------- Individual Radius Corners --------*/
.brh-rounded-top    { border-radius: 0.25rem 0.25rem 0 0 !important; }
.brh-rounded-right  { border-radius: 0 0.25rem 0.25rem 0 !important; }
.brh-rounded-bottom { border-radius: 0 0 0.25rem 0.25rem !important; }
.brh-rounded-left   { border-radius: 0.25rem 0 0 0.25rem !important; }
