/* .f-center { display: flex; justify-content: center; align-items: center; gap: 5px;}
.f-row-between { display: flex; justify-content: space-between; align-items: center; gap: 5px;}
.f-row-between-end { display: flex; justify-content: end; align-items: center; gap: 5px;}
.f-row-between-top { display: flex; justify-content: space-between; align-items: start; gap: 5px;}
.f-row-between-bottom { display: flex; justify-content: space-between; align-items: end; gap: 5px;}
.f-row-start { display: flex; justify-content: flex-start; align-items: center; gap: 5px;}
.f-row-start-top { display: flex; justify-content: flex-start; align-items: start; gap: 5px;}
.f-row-end-top {display: flex; justify-content: end; align-items: start; gap: 5px;}
.f-row-end { display: flex; justify-content: flex-end; align-items: center;}
.f-column-end { display: flex; flex-direction: column; align-items: flex-end; justify-content: flex-end; }
.f-column-start { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; }
.f-column-between { display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; }
.f-column-center { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; }
.f-column-top { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; }
.f-evenly { display: flex; justify-content: space-evenly; align-items: center; }
.f-wrap { display: flex; flex-wrap: wrap; gap: 10px; }
.f-column-reverse { display: flex; flex-direction: column-reverse; }
.f-row-reverse { display: flex; flex-direction: row-reverse; }
.d-flex { display: flex; }
.items-start { align-items: flex-start; }
.items-center { align-items: center; }
.items-end { align-items: flex-end; }
.items-stretch { align-items: stretch; }
.self-start { align-self: flex-start; }
.self-center { align-self: center; }
.self-end { align-self: flex-end;}

.text-left { text-align: left !important; }
.text-center { text-align: center; }
.text-right { text-align: right; }
.w100p-auto {width: 100%; max-width: 100%; margin: auto;}
.w100p {width: 100%; max-width: 100%;}


.mx-auto { margin-left: auto; margin-right: auto; }


.fixed-top { position: fixed; top: 0; left: 0; width: 100%; z-index: 100; }

.p-abs-bottom { position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); }
.p-abs-top { position: absolute; top: 0; left: 50%; transform: translateX(-50%); }
.p-abs-t {position: absolute; top: 0; left: 0;}
.p-abs-b {position: absolute; top: 0; bottom: 0;}
.p-relative{position: relative;}

.sticky-top { position: sticky; top: 0; }
.padding-unset {padding: unset !important;}
.margin-right-0 { margin-right: 0; }
.margin-left-0 { margin-left: 0; }
.z-index {z-index: 100; position: relative;} */

.f-center { display: flex; justify-content: center; align-items: center; gap: 5px;}
.f-row-between { display: flex; justify-content: space-between; align-items: center; gap: 5px;}
.f-row-between-end { display: flex; justify-content: end; align-items: center; gap: 5px;}
.f-row-between-top { display: flex; justify-content: space-between; align-items: start; gap: 5px;}
.f-row-between-bottom { display: flex; justify-content: space-between; align-items: end; gap: 5px;}
.f-row-start { display: flex; justify-content: flex-start; align-items: center; gap: 5px;}
.f-row-start-top { display: flex; justify-content: flex-start; align-items: start; gap: 5px;}
.f-row-end { display: flex; justify-content: flex-end; align-items: center;}
.f-column-end { display: flex; flex-direction: column; align-items: flex-end; justify-content: flex-end; }
.f-column-start { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; }
.f-column-center { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; }
.f-evenly { display: flex; justify-content: space-evenly; align-items: center; }
.f-wrap { display: flex; flex-wrap: wrap; gap: 10px; }
.f-column-reverse { display: flex; flex-direction: column-reverse; }
.f-row-reverse { display: flex; flex-direction: row-reverse; }
.items-start { align-items: flex-start; }
.items-center { align-items: center; }
.items-end { align-items: flex-end; }
.items-stretch { align-items: stretch; }
.self-start { align-self: flex-start; }
.self-center { align-self: center; }
.self-end { align-self: flex-end;}
/* Text Alignment */
.text-left { text-align: left; } 
.text-center { text-align: center; } 
.text-right { text-align: right; }
.w100p-auto {width: 100%; max-width: 100%; margin: auto;}
.w100p {width: 100%; max-width: 100%;}
/* Spacing Utilities: */
.p-10 { padding: 10px; }
.p-20 { padding: 20px; }
.px-10 { padding-left: 10px; padding-right: 10px; }
.py-10 { padding-top: 30px; padding-bottom: 30px; }
.m-10 { margin: 10px; }
.m-20 { margin: 20px; }
.mx-auto { margin-left: auto; margin-right: auto; }
/* Positioning Utilities: */
/* Fixed full-width container */
.fixed-top { position: fixed; top: 0; left: 0; width: 100%; z-index: 100; }
/* Absolute bottom-center */
.p-abs-bottom { position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); }
.p-abs-top { position: absolute; top: 0; left: 50%; transform: translateX(-50%); }
/* Sticky top */
.sticky-top { position: sticky; top: 0; }