/** * Utility Classes * * Common utility classes for spacing, sizing, and layout * @package Apus_Theme * @since 1.0.0 */ /* Display utilities */ .d-none { display: none !important; } .d-inline { display: inline !important; } .d-inline-block { display: inline-block !important; } .d-block { display: block !important; } .d-flex { display: flex !important; } .d-grid { display: grid !important; } .d-table { display: table !important; } .d-table-row { display: table-row !important; } .d-table-cell { display: table-cell !important; } .d-contents { display: contents !important; } /* Visibility utilities */ .visibility-hidden { visibility: hidden !important; } .visibility-visible { visibility: visible !important; } /* Overflow utilities */ .overflow-auto { overflow: auto !important; } .overflow-hidden { overflow: hidden !important; } .overflow-visible { overflow: visible !important; } .overflow-scroll { overflow: scroll !important; } .overflow-x-auto { overflow-x: auto !important; } .overflow-y-auto { overflow-y: auto !important; } /* Position utilities */ .position-static { position: static !important; } .position-relative { position: relative !important; } .position-absolute { position: absolute !important; } .position-fixed { position: fixed !important; } .position-sticky { position: sticky !important; } /* Floating utilities */ .float-start { float: left !important; } .float-end { float: right !important; } .float-none { float: none !important; } /* Flex utilities */ .flex-row { flex-direction: row !important; } .flex-column { flex-direction: column !important; } .flex-wrap { flex-wrap: wrap !important; } .flex-nowrap { flex-wrap: nowrap !important; } .flex-grow-1 { flex-grow: 1 !important; } .flex-shrink-1 { flex-shrink: 1 !important; } .justify-content-start { justify-content: flex-start !important; } .justify-content-end { justify-content: flex-end !important; } .justify-content-center { justify-content: center !important; } .justify-content-between { justify-content: space-between !important; } .justify-content-around { justify-content: space-around !important; } .align-items-start { align-items: flex-start !important; } .align-items-end { align-items: flex-end !important; } .align-items-center { align-items: center !important; } .align-items-baseline { align-items: baseline !important; } .align-items-stretch { align-items: stretch !important; } .align-content-start { align-content: flex-start !important; } .align-content-end { align-content: flex-end !important; } .align-content-center { align-content: center !important; } .align-content-between { align-content: space-between !important; } /* Gap utilities */ .gap-0 { gap: 0 !important; } .gap-1 { gap: 0.25rem !important; } .gap-2 { gap: 0.5rem !important; } .gap-3 { gap: 1rem !important; } .gap-4 { gap: 1.5rem !important; } .gap-5 { gap: 3rem !important; } /* Text alignment */ .text-start { text-align: left !important; } .text-end { text-align: right !important; } .text-center { text-align: center !important; } .text-justify { text-align: justify !important; } /* Text transform */ .text-lowercase { text-transform: lowercase !important; } .text-uppercase { text-transform: uppercase !important; } .text-capitalize { text-transform: capitalize !important; } /* Text wrapping */ .text-wrap { word-wrap: break-word !important; } .text-nowrap { white-space: nowrap !important; } .text-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } /* Font weight */ .fw-light { font-weight: 300 !important; } .fw-normal { font-weight: 400 !important; } .fw-bold { font-weight: 700 !important; } .fw-bolder { font-weight: 900 !important; } /* Font style */ .fst-italic { font-style: italic !important; } .fst-normal { font-style: normal !important; } /* Line height */ .lh-1 { line-height: 1 !important; } .lh-sm { line-height: 1.25 !important; } .lh-base { line-height: 1.5 !important; } .lh-lg { line-height: 2 !important; } /* Border utilities */ .border { border: 1px solid #dee2e6 !important; } .border-0 { border: 0 !important; } .border-top { border-top: 1px solid #dee2e6 !important; } .border-end { border-right: 1px solid #dee2e6 !important; } .border-bottom { border-bottom: 1px solid #dee2e6 !important; } .border-start { border-left: 1px solid #dee2e6 !important; } .border-rounded { border-radius: 0.25rem !important; } .border-rounded-1 { border-radius: 0.25rem !important; } .border-rounded-2 { border-radius: 0.5rem !important; } .border-rounded-3 { border-radius: 1rem !important; } .border-rounded-circle { border-radius: 50% !important; } /* Width and Height */ .w-auto { width: auto !important; } .w-25 { width: 25% !important; } .w-50 { width: 50% !important; } .w-75 { width: 75% !important; } .w-100 { width: 100% !important; } .h-auto { height: auto !important; } .h-25 { height: 25% !important; } .h-50 { height: 50% !important; } .h-75 { height: 75% !important; } .h-100 { height: 100% !important; } .min-vh-100 { min-height: 100vh !important; } /* Opacity */ .opacity-0 { opacity: 0 !important; } .opacity-25 { opacity: 0.25 !important; } .opacity-50 { opacity: 0.5 !important; } .opacity-75 { opacity: 0.75 !important; } .opacity-100 { opacity: 1 !important; } /* Shadow */ .shadow-none { box-shadow: none !important; } .shadow { box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important; } .shadow-sm { box-shadow: 0 0.0625rem 0.125rem rgba(0, 0, 0, 0.075) !important; } .shadow-lg { box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important; } /* Clearfix */ .clearfix::after { content: ""; display: table; clear: both; } /* Cursor utilities */ .cursor-pointer { cursor: pointer !important; } .cursor-default { cursor: default !important; } .cursor-not-allowed { cursor: not-allowed !important; } .cursor-auto { cursor: auto !important; } /* User select */ .user-select-auto { user-select: auto !important; } .user-select-none { user-select: none !important; } .user-select-all { user-select: all !important; } /* Pointer events */ .pointer-events-none { pointer-events: none !important; } .pointer-events-auto { pointer-events: auto !important; } /* Object fit */ .object-fit-contain { object-fit: contain !important; } .object-fit-cover { object-fit: cover !important; } .object-fit-fill { object-fit: fill !important; } .object-fit-scale { object-fit: scale-down !important; } /* Z-index */ .z-1 { z-index: 1 !important; } .z-2 { z-index: 2 !important; } .z-3 { z-index: 3 !important; } .z-auto { z-index: auto !important; } /* Transition */ .transition-all { transition: all 0.3s ease !important; } .transition-none { transition: none !important; }