/*
 * DDT Utilities CSS v1.0.0
 * Comprehensive utility classes for rapid development
 */

/* ========================================
   SPACING UTILITIES
   Scale: 0, 1(0.25rem), 2(0.5rem), 3(0.75rem), 4(1rem), 5(1.25rem), 
          6(1.5rem), 8(2rem), 10(2.5rem), 12(3rem), 16(4rem), 20(5rem)
   ======================================== */

/* Margin All Sides */
.ddt-m-0 { margin: 0 !important; }
.ddt-m-1 { margin: 0.25rem !important; }
.ddt-m-2 { margin: 0.5rem !important; }
.ddt-m-3 { margin: 0.75rem !important; }
.ddt-m-4 { margin: 1rem !important; }
.ddt-m-5 { margin: 1.25rem !important; }
.ddt-m-6 { margin: 1.5rem !important; }
.ddt-m-8 { margin: 2rem !important; }
.ddt-m-10 { margin: 2.5rem !important; }
.ddt-m-12 { margin: 3rem !important; }
.ddt-m-16 { margin: 4rem !important; }
.ddt-m-20 { margin: 5rem !important; }
.ddt-m-auto { margin: auto !important; }

/* Margin Top */
.ddt-mt-0 { margin-top: 0 !important; }
.ddt-mt-1 { margin-top: 0.25rem !important; }
.ddt-mt-2 { margin-top: 0.5rem !important; }
.ddt-mt-3 { margin-top: 0.75rem !important; }
.ddt-mt-4 { margin-top: 1rem !important; }
.ddt-mt-5 { margin-top: 1.25rem !important; }
.ddt-mt-6 { margin-top: 1.5rem !important; }
.ddt-mt-8 { margin-top: 2rem !important; }
.ddt-mt-10 { margin-top: 2.5rem !important; }
.ddt-mt-12 { margin-top: 3rem !important; }
.ddt-mt-16 { margin-top: 4rem !important; }
.ddt-mt-20 { margin-top: 5rem !important; }
.ddt-mt-auto { margin-top: auto !important; }

/* Margin Bottom */
.ddt-mb-0 { margin-bottom: 0 !important; }
.ddt-mb-1 { margin-bottom: 0.25rem !important; }
.ddt-mb-2 { margin-bottom: 0.5rem !important; }
.ddt-mb-3 { margin-bottom: 0.75rem !important; }
.ddt-mb-4 { margin-bottom: 1rem !important; }
.ddt-mb-5 { margin-bottom: 1.25rem !important; }
.ddt-mb-6 { margin-bottom: 1.5rem !important; }
.ddt-mb-8 { margin-bottom: 2rem !important; }
.ddt-mb-10 { margin-bottom: 2.5rem !important; }
.ddt-mb-12 { margin-bottom: 3rem !important; }
.ddt-mb-16 { margin-bottom: 4rem !important; }
.ddt-mb-20 { margin-bottom: 5rem !important; }
.ddt-mb-auto { margin-bottom: auto !important; }

/* Margin Left */
.ddt-ml-0 { margin-left: 0 !important; }
.ddt-ml-1 { margin-left: 0.25rem !important; }
.ddt-ml-2 { margin-left: 0.5rem !important; }
.ddt-ml-3 { margin-left: 0.75rem !important; }
.ddt-ml-4 { margin-left: 1rem !important; }
.ddt-ml-5 { margin-left: 1.25rem !important; }
.ddt-ml-6 { margin-left: 1.5rem !important; }
.ddt-ml-8 { margin-left: 2rem !important; }
.ddt-ml-10 { margin-left: 2.5rem !important; }
.ddt-ml-12 { margin-left: 3rem !important; }
.ddt-ml-16 { margin-left: 4rem !important; }
.ddt-ml-20 { margin-left: 5rem !important; }
.ddt-ml-auto { margin-left: auto !important; }

/* Margin Right */
.ddt-mr-0 { margin-right: 0 !important; }
.ddt-mr-1 { margin-right: 0.25rem !important; }
.ddt-mr-2 { margin-right: 0.5rem !important; }
.ddt-mr-3 { margin-right: 0.75rem !important; }
.ddt-mr-4 { margin-right: 1rem !important; }
.ddt-mr-5 { margin-right: 1.25rem !important; }
.ddt-mr-6 { margin-right: 1.5rem !important; }
.ddt-mr-8 { margin-right: 2rem !important; }
.ddt-mr-10 { margin-right: 2.5rem !important; }
.ddt-mr-12 { margin-right: 3rem !important; }
.ddt-mr-16 { margin-right: 4rem !important; }
.ddt-mr-20 { margin-right: 5rem !important; }
.ddt-mr-auto { margin-right: auto !important; }

/* Margin X-axis (left & right) */
.ddt-mx-0 { margin-left: 0 !important; margin-right: 0 !important; }
.ddt-mx-1 { margin-left: 0.25rem !important; margin-right: 0.25rem !important; }
.ddt-mx-2 { margin-left: 0.5rem !important; margin-right: 0.5rem !important; }
.ddt-mx-3 { margin-left: 0.75rem !important; margin-right: 0.75rem !important; }
.ddt-mx-4 { margin-left: 1rem !important; margin-right: 1rem !important; }
.ddt-mx-5 { margin-left: 1.25rem !important; margin-right: 1.25rem !important; }
.ddt-mx-6 { margin-left: 1.5rem !important; margin-right: 1.5rem !important; }
.ddt-mx-8 { margin-left: 2rem !important; margin-right: 2rem !important; }
.ddt-mx-auto { margin-left: auto !important; margin-right: auto !important; }

/* Margin Y-axis (top & bottom) */
.ddt-my-0 { margin-top: 0 !important; margin-bottom: 0 !important; }
.ddt-my-1 { margin-top: 0.25rem !important; margin-bottom: 0.25rem !important; }
.ddt-my-2 { margin-top: 0.5rem !important; margin-bottom: 0.5rem !important; }
.ddt-my-3 { margin-top: 0.75rem !important; margin-bottom: 0.75rem !important; }
.ddt-my-4 { margin-top: 1rem !important; margin-bottom: 1rem !important; }
.ddt-my-5 { margin-top: 1.25rem !important; margin-bottom: 1.25rem !important; }
.ddt-my-6 { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important; }
.ddt-my-8 { margin-top: 2rem !important; margin-bottom: 2rem !important; }
.ddt-my-auto { margin-top: auto !important; margin-bottom: auto !important; }

/* Padding All Sides */
.ddt-p-0 { padding: 0 !important; }
.ddt-p-1 { padding: 0.25rem !important; }
.ddt-p-2 { padding: 0.5rem !important; }
.ddt-p-3 { padding: 0.75rem !important; }
.ddt-p-4 { padding: 1rem !important; }
.ddt-p-5 { padding: 1.25rem !important; }
.ddt-p-6 { padding: 1.5rem !important; }
.ddt-p-8 { padding: 2rem !important; }
.ddt-p-10 { padding: 2.5rem !important; }
.ddt-p-12 { padding: 3rem !important; }
.ddt-p-16 { padding: 4rem !important; }
.ddt-p-20 { padding: 5rem !important; }

/* Padding Top */
.ddt-pt-0 { padding-top: 0 !important; }
.ddt-pt-1 { padding-top: 0.25rem !important; }
.ddt-pt-2 { padding-top: 0.5rem !important; }
.ddt-pt-3 { padding-top: 0.75rem !important; }
.ddt-pt-4 { padding-top: 1rem !important; }
.ddt-pt-5 { padding-top: 1.25rem !important; }
.ddt-pt-6 { padding-top: 1.5rem !important; }
.ddt-pt-8 { padding-top: 2rem !important; }
.ddt-pt-10 { padding-top: 2.5rem !important; }
.ddt-pt-12 { padding-top: 3rem !important; }
.ddt-pt-16 { padding-top: 4rem !important; }
.ddt-pt-20 { padding-top: 5rem !important; }

/* Padding Bottom */
.ddt-pb-0 { padding-bottom: 0 !important; }
.ddt-pb-1 { padding-bottom: 0.25rem !important; }
.ddt-pb-2 { padding-bottom: 0.5rem !important; }
.ddt-pb-3 { padding-bottom: 0.75rem !important; }
.ddt-pb-4 { padding-bottom: 1rem !important; }
.ddt-pb-5 { padding-bottom: 1.25rem !important; }
.ddt-pb-6 { padding-bottom: 1.5rem !important; }
.ddt-pb-8 { padding-bottom: 2rem !important; }
.ddt-pb-10 { padding-bottom: 2.5rem !important; }
.ddt-pb-12 { padding-bottom: 3rem !important; }
.ddt-pb-16 { padding-bottom: 4rem !important; }
.ddt-pb-20 { padding-bottom: 5rem !important; }

/* Padding Left */
.ddt-pl-0 { padding-left: 0 !important; }
.ddt-pl-1 { padding-left: 0.25rem !important; }
.ddt-pl-2 { padding-left: 0.5rem !important; }
.ddt-pl-3 { padding-left: 0.75rem !important; }
.ddt-pl-4 { padding-left: 1rem !important; }
.ddt-pl-5 { padding-left: 1.25rem !important; }
.ddt-pl-6 { padding-left: 1.5rem !important; }
.ddt-pl-8 { padding-left: 2rem !important; }
.ddt-pl-10 { padding-left: 2.5rem !important; }
.ddt-pl-12 { padding-left: 3rem !important; }
.ddt-pl-16 { padding-left: 4rem !important; }
.ddt-pl-20 { padding-left: 5rem !important; }

/* Padding Right */
.ddt-pr-0 { padding-right: 0 !important; }
.ddt-pr-1 { padding-right: 0.25rem !important; }
.ddt-pr-2 { padding-right: 0.5rem !important; }
.ddt-pr-3 { padding-right: 0.75rem !important; }
.ddt-pr-4 { padding-right: 1rem !important; }
.ddt-pr-5 { padding-right: 1.25rem !important; }
.ddt-pr-6 { padding-right: 1.5rem !important; }
.ddt-pr-8 { padding-right: 2rem !important; }
.ddt-pr-10 { padding-right: 2.5rem !important; }
.ddt-pr-12 { padding-right: 3rem !important; }
.ddt-pr-16 { padding-right: 4rem !important; }
.ddt-pr-20 { padding-right: 5rem !important; }

/* Padding X-axis (left & right) */
.ddt-px-0 { padding-left: 0 !important; padding-right: 0 !important; }
.ddt-px-1 { padding-left: 0.25rem !important; padding-right: 0.25rem !important; }
.ddt-px-2 { padding-left: 0.5rem !important; padding-right: 0.5rem !important; }
.ddt-px-3 { padding-left: 0.75rem !important; padding-right: 0.75rem !important; }
.ddt-px-4 { padding-left: 1rem !important; padding-right: 1rem !important; }
.ddt-px-5 { padding-left: 1.25rem !important; padding-right: 1.25rem !important; }
.ddt-px-6 { padding-left: 1.5rem !important; padding-right: 1.5rem !important; }
.ddt-px-8 { padding-left: 2rem !important; padding-right: 2rem !important; }

/* Padding Y-axis (top & bottom) */
.ddt-py-0 { padding-top: 0 !important; padding-bottom: 0 !important; }
.ddt-py-1 { padding-top: 0.25rem !important; padding-bottom: 0.25rem !important; }
.ddt-py-2 { padding-top: 0.5rem !important; padding-bottom: 0.5rem !important; }
.ddt-py-3 { padding-top: 0.75rem !important; padding-bottom: 0.75rem !important; }
.ddt-py-4 { padding-top: 1rem !important; padding-bottom: 1rem !important; }
.ddt-py-5 { padding-top: 1.25rem !important; padding-bottom: 1.25rem !important; }
.ddt-py-6 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; }
.ddt-py-8 { padding-top: 2rem !important; padding-bottom: 2rem !important; }

/* ========================================
   TYPOGRAPHY UTILITIES
   ======================================== */

/* Font Size */
.ddt-text-xs { font-size: 0.75rem !important; line-height: 1rem; }
.ddt-text-sm { font-size: 0.875rem !important; line-height: 1.25rem; }
.ddt-text-base { font-size: 1rem !important; line-height: 1.5rem; }
.ddt-text-lg { font-size: 1.125rem !important; line-height: 1.75rem; }
.ddt-text-xl { font-size: 1.25rem !important; line-height: 1.75rem; }
.ddt-text-2xl { font-size: 1.5rem !important; line-height: 2rem; }
.ddt-text-3xl { font-size: 1.875rem !important; line-height: 2.25rem; }
.ddt-text-4xl { font-size: 2.25rem !important; line-height: 2.5rem; }
.ddt-text-5xl { font-size: 3rem !important; line-height: 1; }

/* Font Weight */
.ddt-font-thin { font-weight: 100 !important; }
.ddt-font-light { font-weight: 300 !important; }
.ddt-font-normal { font-weight: 400 !important; }
.ddt-font-medium { font-weight: 500 !important; }
.ddt-font-semibold { font-weight: 600 !important; }
.ddt-font-bold { font-weight: 700 !important; }
.ddt-font-extrabold { font-weight: 800 !important; }
.ddt-font-black { font-weight: 900 !important; }

/* Text Align */
.ddt-text-left,.text-left { text-align: left !important; }
.ddt-text-center,.text-center { text-align: center !important; }
.ddt-text-right,.text-right { text-align: right !important; }
.ddt-text-justif,.text-justify { text-align: justify !important; }

/* Text Transform */
.ddt-text-uppercase { text-transform: uppercase !important; }
.ddt-text-lowercase { text-transform: lowercase !important; }
.ddt-text-capitalize { text-transform: capitalize !important; }
.ddt-text-normal-case { text-transform: none !important; }

/* Text Decoration */
.ddt-text-underline { text-decoration: underline !important; }
.ddt-text-line-through { text-decoration: line-through !important; }
.ddt-text-no-underline { text-decoration: none !important; }

/* Line Height */
.ddt-leading-none { line-height: 1 !important; }
.ddt-leading-tight { line-height: 1.25 !important; }
.ddt-leading-snug { line-height: 1.375 !important; }
.ddt-leading-normal { line-height: 1.5 !important; }
.ddt-leading-relaxed { line-height: 1.625 !important; }
.ddt-leading-loose { line-height: 2 !important; }

/* Letter Spacing */
.ddt-tracking-tighter { letter-spacing: -0.05em !important; }
.ddt-tracking-tight { letter-spacing: -0.025em !important; }
.ddt-tracking-normal { letter-spacing: 0 !important; }
.ddt-tracking-wide { letter-spacing: 0.025em !important; }
.ddt-tracking-wider { letter-spacing: 0.05em !important; }
.ddt-tracking-widest { letter-spacing: 0.1em !important; }

/* Text Truncate */
.ddt-text-truncate {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

/* Word Break */
.ddt-break-normal { word-break: normal !important; overflow-wrap: normal !important; }
.ddt-break-words { overflow-wrap: break-word !important; }
.ddt-break-all { word-break: break-all !important; }

/* White Space */
.ddt-whitespace-normal { white-space: normal !important; }
.ddt-whitespace-nowrap { white-space: nowrap !important; }
.ddt-whitespace-pre { white-space: pre !important; }
.ddt-whitespace-pre-line { white-space: pre-line !important; }
.ddt-whitespace-pre-wrap { white-space: pre-wrap !important; }

/* ========================================
   COLOR UTILITIES
   ======================================== */

/* Text Colors */
.ddt-text-primary { color: #007bff !important; }
.ddt-text-secondary { color: #6c757d !important; }
.ddt-text-success { color: #28a745 !important; }
.ddt-text-danger { color: #dc3545 !important; }
.ddt-text-warning { color: #ffc107 !important; }
.ddt-text-info { color: #17a2b8 !important; }
.ddt-text-light { color: #f8f9fa !important; }
.ddt-text-dark { color: #343a40 !important; }
.ddt-text-white { color: #ffffff !important; }
.ddt-text-black { color: #000000 !important; }
.ddt-text-muted { color: #6c757d !important; }

/* Background Colors */
.ddt-bg-primary { background-color: #007bff !important; }
.ddt-bg-secondary { background-color: #6c757d !important; }
.ddt-bg-success { background-color: #28a745 !important; }
.ddt-bg-danger { background-color: #dc3545 !important; }
.ddt-bg-warning { background-color: #ffc107 !important; }
.ddt-bg-info { background-color: #17a2b8 !important; }
.ddt-bg-light { background-color: #f8f9fa !important; }
.ddt-bg-dark { background-color: #343a40 !important; }
.ddt-bg-white { background-color: #ffffff !important; }
.ddt-bg-black { background-color: #000000 !important; }
.ddt-bg-transparent { background-color: transparent !important; }

/* Gradient Backgrounds */
.ddt-bg-gradient-primary {
  background: linear-gradient(135deg, #007bff 0%, #0056b3 100%) !important;
}
.ddt-bg-gradient-success {
  background: linear-gradient(135deg, #28a745 0%, #1e7e34 100%) !important;
}
.ddt-bg-gradient-danger {
  background: linear-gradient(135deg, #dc3545 0%, #bd2130 100%) !important;
}
.ddt-bg-gradient-warning {
  background: linear-gradient(135deg, #ffc107 0%, #e0a800 100%) !important;
}
.ddt-bg-gradient-info {
  background: linear-gradient(135deg, #17a2b8 0%, #117a8b 100%) !important;
}

/* ========================================
   BORDER UTILITIES
   ======================================== */

/* Border Width */
.ddt-border-0 { border: 0 !important; }
.ddt-border { border: 1px solid #dee2e6 !important; }
.ddt-border-2 { border: 2px solid #dee2e6 !important; }
.ddt-border-3 { border: 3px solid #dee2e6 !important; }
.ddt-border-4 { border: 4px solid #dee2e6 !important; }

.ddt-border-top { border-top: 1px solid #dee2e6 !important; }
.ddt-border-bottom { border-bottom: 1px solid #dee2e6 !important; }
.ddt-border-left { border-left: 1px solid #dee2e6 !important; }
.ddt-border-right { border-right: 1px solid #dee2e6 !important; }

.ddt-border-top-0 { border-top: 0 !important; }
.ddt-border-bottom-0 { border-bottom: 0 !important; }
.ddt-border-left-0 { border-left: 0 !important; }
.ddt-border-right-0 { border-right: 0 !important; }

/* Border Colors */
.ddt-border-primary { border-color: #007bff !important; }
.ddt-border-secondary { border-color: #6c757d !important; }
.ddt-border-success { border-color: #28a745 !important; }
.ddt-border-danger { border-color: #dc3545 !important; }
.ddt-border-warning { border-color: #ffc107 !important; }
.ddt-border-info { border-color: #17a2b8 !important; }
.ddt-border-light { border-color: #f8f9fa !important; }
.ddt-border-dark { border-color: #343a40 !important; }
.ddt-border-white { border-color: #ffffff !important; }

/* Border Radius */
.ddt-rounded-0 { border-radius: 0 !important; }
.ddt-rounded-sm { border-radius: 0.2rem !important; }
.ddt-rounded { border-radius: 0.375rem !important; }
.ddt-rounded-md { border-radius: 0.5rem !important; }
.ddt-rounded-lg { border-radius: 0.75rem !important; }
.ddt-rounded-xl { border-radius: 1rem !important; }
.ddt-rounded-2xl { border-radius: 1.5rem !important; }
.ddt-rounded-3xl { border-radius: 2rem !important; }
.ddt-rounded-full { border-radius: 9999px !important; }
.ddt-rounded-circle { border-radius: 50% !important; }

/* Border Radius Per Corner */
.ddt-rounded-top { border-top-left-radius: 0.375rem !important; border-top-right-radius: 0.375rem !important; }
.ddt-rounded-bottom { border-bottom-left-radius: 0.375rem !important; border-bottom-right-radius: 0.375rem !important; }
.ddt-rounded-left { border-top-left-radius: 0.375rem !important; border-bottom-left-radius: 0.375rem !important; }
.ddt-rounded-right { border-top-right-radius: 0.375rem !important; border-bottom-right-radius: 0.375rem !important; }

/* Border Style */
.ddt-border-solid { border-style: solid !important; }
.ddt-border-dashed { border-style: dashed !important; }
.ddt-border-dotted { border-style: dotted !important; }
.ddt-border-double { border-style: double !important; }
.ddt-border-none { border-style: none !important; }

/* ========================================
   SHADOW UTILITIES
   ======================================== */

.ddt-shadow-none { box-shadow: none !important; }
.ddt-shadow-xs { box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important; }
.ddt-shadow-sm { box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06) !important; }
.ddt-shadow { box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important; }
.ddt-shadow-md { box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important; }
.ddt-shadow-lg { box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04) !important; }
.ddt-shadow-xl { box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25) !important; }
.ddt-shadow-2xl { box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5) !important; }
.ddt-shadow-inner { box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06) !important; }

/* ========================================
   SIZING UTILITIES
   ======================================== */

/* Width */
.ddt-w-auto { width: auto !important; }
.ddt-w-0 { width: 0 !important; }
.ddt-w-25 { width: 25% !important; }
.ddt-w-33 { width: 33.333333% !important; }
.ddt-w-50 { width: 50% !important; }
.ddt-w-66 { width: 66.666667% !important; }
.ddt-w-75 { width: 75% !important; }
.ddt-w-100 { width: 100% !important; }
.ddt-w-screen { width: 100vw !important; }

/* Fixed Width */
.ddt-w-px { width: 1px !important; }
.ddt-w-20 { width: 5rem !important; }
.ddt-w-24 { width: 6rem !important; }
.ddt-w-32 { width: 8rem !important; }
.ddt-w-40 { width: 10rem !important; }
.ddt-w-48 { width: 12rem !important; }
.ddt-w-56 { width: 14rem !important; }
.ddt-w-64 { width: 16rem !important; }

/* Height */
.ddt-h-auto { height: auto !important; }
.ddt-h-0 { height: 0 !important; }
.ddt-h-25 { height: 25% !important; }
.ddt-h-50 { height: 50% !important; }
.ddt-h-75 { height: 75% !important; }
.ddt-h-100 { height: 100% !important; }
.ddt-h-screen { height: 100vh !important; }

/* Fixed Height */
.ddt-h-px { height: 1px !important; }
.ddt-h-20 { height: 5rem !important; }
.ddt-h-24 { height: 6rem !important; }
.ddt-h-32 { height: 8rem !important; }
.ddt-h-40 { height: 10rem !important; }
.ddt-h-48 { height: 12rem !important; }
.ddt-h-56 { height: 14rem !important; }
.ddt-h-64 { height: 16rem !important; }

/* Min/Max Width */
.ddt-min-w-0 { min-width: 0 !important; }
.ddt-min-w-full { min-width: 100% !important; }
.ddt-max-w-xs { max-width: 20rem !important; }
.ddt-max-w-sm { max-width: 24rem !important; }
.ddt-max-w-md { max-width: 28rem !important; }
.ddt-max-w-lg { max-width: 32rem !important; }
.ddt-max-w-xl { max-width: 36rem !important; }
.ddt-max-w-2xl { max-width: 42rem !important; }
.ddt-max-w-3xl { max-width: 48rem !important; }
.ddt-max-w-4xl { max-width: 56rem !important; }
.ddt-max-w-5xl { max-width: 64rem !important; }
.ddt-max-w-full { max-width: 100% !important; }
.ddt-max-w-screen { max-width: 100vw !important; }

/* Min/Max Height */
.ddt-min-h-0 { min-height: 0 !important; }
.ddt-min-h-full { min-height: 100% !important; }
.ddt-min-h-screen { min-height: 100vh !important; }
.ddt-max-h-full { max-height: 100% !important; }
.ddt-max-h-screen { max-height: 100vh !important; }

/* ========================================
   POSITION UTILITIES
   ======================================== */

.ddt-position-static { position: static !important; }
.ddt-position-relative { position: relative !important; }
.ddt-position-absolute { position: absolute !important; }
.ddt-position-fixed { position: fixed !important; }
.ddt-position-sticky { position: sticky !important; }

/* Position Values */
.ddt-top-0 { top: 0 !important; }
.ddt-top-50 { top: 50% !important; }
.ddt-top-100 { top: 100% !important; }
.ddt-bottom-0 { bottom: 0 !important; }
.ddt-bottom-50 { bottom: 50% !important; }
.ddt-bottom-100 { bottom: 100% !important; }
.ddt-left-0 { left: 0 !important; }
.ddt-left-50 { left: 50% !important; }
.ddt-left-100 { left: 100% !important; }
.ddt-right-0 { right: 0 !important; }
.ddt-right-50 { right: 50% !important; }
.ddt-right-100 { right: 100% !important; }

/* Inset */
.ddt-inset-0 { top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important; }
.ddt-inset-x-0 { left: 0 !important; right: 0 !important; }
.ddt-inset-y-0 { top: 0 !important; bottom: 0 !important; }

/* Z-Index */
.ddt-z-0 { z-index: 0 !important; }
.ddt-z-10 { z-index: 10 !important; }
.ddt-z-20 { z-index: 20 !important; }
.ddt-z-30 { z-index: 30 !important; }
.ddt-z-40 { z-index: 40 !important; }
.ddt-z-50 { z-index: 50 !important; }
.ddt-z-auto { z-index: auto !important; }
.ddt-z-negative { z-index: -1 !important; }
.ddt-z-top { z-index: 9999 !important; }

/* ========================================
   OVERFLOW UTILITIES
   ======================================== */

.ddt-overflow-auto { overflow: auto !important; }
.ddt-overflow-hidden { overflow: hidden !important; }
.ddt-overflow-visible { overflow: visible !important; }
.ddt-overflow-scroll { overflow: scroll !important; }

.ddt-overflow-x-auto { overflow-x: auto !important; }
.ddt-overflow-x-hidden { overflow-x: hidden !important; }
.ddt-overflow-x-visible { overflow-x: visible !important; }
.ddt-overflow-x-scroll { overflow-x: scroll !important; }

.ddt-overflow-y-auto { overflow-y: auto !important; }
.ddt-overflow-y-hidden { overflow-y: hidden !important; }
.ddt-overflow-y-visible { overflow-y: visible !important; }
.ddt-overflow-y-scroll { overflow-y: scroll !important; }

/* ========================================
   OPACITY UTILITIES
   ======================================== */

.ddt-opacity-0 { opacity: 0 !important; }
.ddt-opacity-10 { opacity: 0.1 !important; }
.ddt-opacity-20 { opacity: 0.2 !important; }
.ddt-opacity-25 { opacity: 0.25 !important; }
.ddt-opacity-30 { opacity: 0.3 !important; }
.ddt-opacity-40 { opacity: 0.4 !important; }
.ddt-opacity-50 { opacity: 0.5 !important; }
.ddt-opacity-60 { opacity: 0.6 !important; }
.ddt-opacity-70 { opacity: 0.7 !important; }
.ddt-opacity-75 { opacity: 0.75 !important; }
.ddt-opacity-80 { opacity: 0.8 !important; }
.ddt-opacity-90 { opacity: 0.9 !important; }
.ddt-opacity-100 { opacity: 1 !important; }

/* ========================================
   CURSOR UTILITIES
   ======================================== */

.ddt-cursor-auto { cursor: auto !important; }
.ddt-cursor-default { cursor: default !important; }
.ddt-cursor-pointer { cursor: pointer !important; }
.ddt-cursor-wait { cursor: wait !important; }
.ddt-cursor-text { cursor: text !important; }
.ddt-cursor-move { cursor: move !important; }
.ddt-cursor-not-allowed { cursor: not-allowed !important; }
.ddt-cursor-help { cursor: help !important; }
.ddt-cursor-zoom-in { cursor: zoom-in !important; }
.ddt-cursor-zoom-out { cursor: zoom-out !important; }
.ddt-cursor-grab { cursor: grab !important; }
.ddt-cursor-grabbing { cursor: grabbing !important; }

/* ========================================
   USER SELECT
   ======================================== */

.ddt-select-none { user-select: none !important; }
.ddt-select-text { user-select: text !important; }
.ddt-select-all { user-select: all !important; }
.ddt-select-auto { user-select: auto !important; }

/* ========================================
   POINTER EVENTS
   ======================================== */

.ddt-pointer-events-none { pointer-events: none !important; }
.ddt-pointer-events-auto { pointer-events: auto !important; }

/* ========================================
   VISIBILITY
   ======================================== */

.ddt-visible { visibility: visible !important; }
.ddt-invisible { visibility: hidden !important; }

/* ========================================
   VERTICAL ALIGN
   ======================================== */

.ddt-align-baseline { vertical-align: baseline !important; }
.ddt-align-top { vertical-align: top !important; }
.ddt-align-middle { vertical-align: middle !important; }
.ddt-align-bottom { vertical-align: bottom !important; }
.ddt-align-text-top { vertical-align: text-top !important; }
.ddt-align-text-bottom { vertical-align: text-bottom !important; }

/* ========================================
   TRANSFORM UTILITIES
   ======================================== */

.ddt-transform { transform: translateX(var(--ddt-translate-x, 0)) translateY(var(--ddt-translate-y, 0)) rotate(var(--ddt-rotate, 0)) skewX(var(--ddt-skew-x, 0)) skewY(var(--ddt-skew-y, 0)) scaleX(var(--ddt-scale-x, 1)) scaleY(var(--ddt-scale-y, 1)) !important; }
.ddt-transform-none { transform: none !important; }

/* Rotate */
.ddt-rotate-0 { --ddt-rotate: 0deg; transform: rotate(0deg) !important; }
.ddt-rotate-45 { --ddt-rotate: 45deg; transform: rotate(45deg) !important; }
.ddt-rotate-90 { --ddt-rotate: 90deg; transform: rotate(90deg) !important; }
.ddt-rotate-180 { --ddt-rotate: 180deg; transform: rotate(180deg) !important; }
.ddt-rotate-270 { --ddt-rotate: 270deg; transform: rotate(270deg) !important; }
.ddt-rotate-neg-45 { --ddt-rotate: -45deg; transform: rotate(-45deg) !important; }
.ddt-rotate-neg-90 { --ddt-rotate: -90deg; transform: rotate(-90deg) !important; }
.ddt-rotate-neg-180 { --ddt-rotate: -180deg; transform: rotate(-180deg) !important; }

/* Scale */
.ddt-scale-0 { transform: scale(0) !important; }
.ddt-scale-50 { transform: scale(0.5) !important; }
.ddt-scale-75 { transform: scale(0.75) !important; }
.ddt-scale-90 { transform: scale(0.9) !important; }
.ddt-scale-95 { transform: scale(0.95) !important; }
.ddt-scale-100 { transform: scale(1) !important; }
.ddt-scale-105 { transform: scale(1.05) !important; }
.ddt-scale-110 { transform: scale(1.1) !important; }
.ddt-scale-125 { transform: scale(1.25) !important; }
.ddt-scale-150 { transform: scale(1.5) !important; }

/* Translate */
.ddt-translate-x-0 { transform: translateX(0) !important; }
.ddt-translate-x-full { transform: translateX(100%) !important; }
.ddt-translate-x-half { transform: translateX(50%) !important; }
.ddt-translate-x-neg-full { transform: translateX(-100%) !important; }
.ddt-translate-x-neg-half { transform: translateX(-50%) !important; }

.ddt-translate-y-0 { transform: translateY(0) !important; }
.ddt-translate-y-full { transform: translateY(100%) !important; }
.ddt-translate-y-half { transform: translateY(50%) !important; }
.ddt-translate-y-neg-full { transform: translateY(-100%) !important; }
.ddt-translate-y-neg-half { transform: translateY(-50%) !important; }

/* ========================================
   TRANSITION UTILITIES
   ======================================== */

.ddt-transition-none { transition: none !important; }
.ddt-transition-all { transition: all 0.3s ease !important; }
.ddt-transition-colors { transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease !important; }
.ddt-transition-opacity { transition: opacity 0.3s ease !important; }
.ddt-transition-shadow { transition: box-shadow 0.3s ease !important; }
.ddt-transition-transform { transition: transform 0.3s ease !important; }

/* Transition Duration */
.ddt-duration-75 { transition-duration: 75ms !important; }
.ddt-duration-100 { transition-duration: 100ms !important; }
.ddt-duration-150 { transition-duration: 150ms !important; }
.ddt-duration-200 { transition-duration: 200ms !important; }
.ddt-duration-300 { transition-duration: 300ms !important; }
.ddt-duration-500 { transition-duration: 500ms !important; }
.ddt-duration-700 { transition-duration: 700ms !important; }
.ddt-duration-1000 { transition-duration: 1000ms !important; }

/* Transition Timing */
.ddt-ease-linear { transition-timing-function: linear !important; }
.ddt-ease-in { transition-timing-function: cubic-bezier(0.4, 0, 1, 1) !important; }
.ddt-ease-out { transition-timing-function: cubic-bezier(0, 0, 0.2, 1) !important; }
.ddt-ease-in-out { transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important; }

/* ========================================
   OBJECT FIT & POSITION
   ======================================== */

.ddt-object-contain { object-fit: contain !important; }
.ddt-object-cover { object-fit: cover !important; }
.ddt-object-fill { object-fit: fill !important; }
.ddt-object-none { object-fit: none !important; }
.ddt-object-scale-down { object-fit: scale-down !important; }

.ddt-object-center { object-position: center !important; }
.ddt-object-top { object-position: top !important; }
.ddt-object-bottom { object-position: bottom !important; }
.ddt-object-left { object-position: left !important; }
.ddt-object-right { object-position: right !important; }

/* ========================================
   FLOAT & CLEAR
   ======================================== */

.ddt-float-left { float: left !important; }
.ddt-float-right { float: right !important; }
.ddt-float-none { float: none !important; }

.ddt-clear-left { clear: left !important; }
.ddt-clear-right { clear: right !important; }
.ddt-clear-both { clear: both !important; }
.ddt-clear-none { clear: none !important; }

/* Clearfix */
.ddt-clearfix::after {
  content: "";
  display: table;
  clear: both;
}


/* ========================================
   IMAGE UTILITIES
   ======================================== */

.ddt-img-fluid {
  max-width: 100%;
  height: auto;
}

.ddt-img-thumbnail {
  padding: 0.25rem;
  background-color: #fff;
  border: 1px solid #dee2e6;
  border-radius: 0.375rem;
  max-width: 100%;
  height: auto;
}

/* ========================================
   ASPECT RATIO
   ======================================== */

.ddt-aspect-square { aspect-ratio: 1 / 1 !important; }
.ddt-aspect-video { aspect-ratio: 16 / 9 !important; }
.ddt-aspect-4-3 { aspect-ratio: 4 / 3 !important; }
.ddt-aspect-21-9 { aspect-ratio: 21 / 9 !important; }
.ddt-aspect-auto { aspect-ratio: auto !important; }

/* ========================================
   LIST STYLE
   ======================================== */

.ddt-list-none { list-style-type: none !important; }
.ddt-list-disc { list-style-type: disc !important; }
.ddt-list-decimal { list-style-type: decimal !important; }
.ddt-list-inside { list-style-position: inside !important; }
.ddt-list-outside { list-style-position: outside !important; }

/* ========================================
   HOVER UTILITIES
   ======================================== */

.ddt-hover-lift:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
  transition: all 0.3s ease;
}

.ddt-hover-grow:hover {
  transform: scale(1.05);
  transition: transform 0.3s ease;
}

.ddt-hover-shrink:hover {
  transform: scale(0.95);
  transition: transform 0.3s ease;
}

.ddt-hover-shadow:hover {
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
  transition: box-shadow 0.3s ease;
}

.ddt-hover-opacity:hover {
  opacity: 0.8;
  transition: opacity 0.3s ease;
}

/* ========================================
   RESPONSIVE UTILITIES (Mobile First)
   ======================================== */

/* SM - Small devices (≥576px) */
@media (min-width: 576px) {
  .ddt-text-sm-left { text-align: left !important; }
  .ddt-text-sm-center { text-align: center !important; }
  .ddt-text-sm-right { text-align: right !important; }
  
  .ddt-float-sm-left { float: left !important; }
  .ddt-float-sm-right { float: right !important; }
  .ddt-float-sm-none { float: none !important; }
}

/* MD - Medium devices (≥768px) */
@media (min-width: 768px) {
  .ddt-text-md-left { text-align: left !important; }
  .ddt-text-md-center { text-align: center !important; }
  .ddt-text-md-right { text-align: right !important; }
  
  .ddt-float-md-left { float: left !important; }
  .ddt-float-md-right { float: right !important; }
  .ddt-float-md-none { float: none !important; }
}

/* LG - Large devices (≥992px) */
@media (min-width: 992px) {
  .ddt-text-lg-left { text-align: left !important; }
  .ddt-text-lg-center { text-align: center !important; }
  .ddt-text-lg-right { text-align: right !important; }
  
  .ddt-float-lg-left { float: left !important; }
  .ddt-float-lg-right { float: right !important; }
  .ddt-float-lg-none { float: none !important; }
}

/* XL - Extra large devices (≥1200px) */
@media (min-width: 1200px) {
  .ddt-text-xl-left { text-align: left !important; }
  .ddt-text-xl-center { text-align: center !important; }
  .ddt-text-xl-right { text-align: right !important; }
  
  .ddt-float-xl-left { float: left !important; }
  .ddt-float-xl-right { float: right !important; }
  .ddt-float-xl-none { float: none !important; }
}

/* ========================================
   PRINT UTILITIES
   ======================================== */

@media print {
  .ddt-print-none { display: none !important; }
  .ddt-print-block { display: block !important; }
  .ddt-print-inline { display: inline !important; }
  .ddt-print-inline-block { display: inline-block !important; }
}