geeks-ui-framework/dist/geeks-ui.min.css

A modern, lightweight CSS framework with 15+ components for developers. Build beautiful interfaces with minimal effort.

/*!
 * Geeks UI v1.1.0
 * A modern, lightweight CSS framework for developers
 * https://geeks-ui-css-framework.github.io/Geeks_UI/
 * 
 * Copyright 2025 Joey Cadieux
 * Licensed under MIT
 */:root{--geeks-ui-primary:#1e90ff;--geeks-ui-secondary:#6c757d;--geeks-ui-success:#28a745;--geeks-ui-info:#17a2b8;--geeks-ui-warning:#dc3545;--geeks-ui-base:#708090;--geeks-ui-text-primary:#212529;--geeks-ui-text-secondary:#6c757d;--geeks-ui-text-light:#ffffff;--geeks-ui-padding:0.75rem 1.5rem;--geeks-ui-margin-bottom:1rem;--geeks-ui-font-size:1rem;--geeks-ui-font-weight-normal:400;--geeks-ui-font-weight-bold:600;--geeks-ui-border-radius:0.375rem;--geeks-ui-border-width:1px;--geeks-ui-border:none;--geeks-ui-display:inline-block;--geeks-ui-text-align:center;--geeks-ui-text-decoration:none;--geeks-ui-transition:all 0.3s ease}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 1rem}.container-fluid{width:100%;padding:0 1rem}@media (min-width:576px){.container{max-width:540px}}@media (min-width:768px){.container{max-width:720px}}@media (min-width:992px){.container{max-width:960px}}@media (min-width:1200px){.container{max-width:1140px}}.alert{padding:var(--geeks-ui-padding);margin-bottom:var(--geeks-ui-margin-bottom);border-radius:var(--geeks-ui-border-radius);color:var(--geeks-ui-text-light);font-size:var(--geeks-ui-font-size);transition:var(--geeks-ui-transition)}.alert-primary{background-color:var(--geeks-ui-primary);color:var(--geeks-ui-text-light)}.alert-secondary{background-color:var(--geeks-ui-secondary);color:var(--geeks-ui-text-light)}.alert-success{background-color:var(--geeks-ui-success);color:var(--geeks-ui-text-light)}.alert-info{background-color:var(--geeks-ui-info);color:var(--geeks-ui-text-light)}.alert-warning{background-color:var(--geeks-ui-warning);color:var(--geeks-ui-text-light)}.alert-base{background-color:var(--geeks-ui-base);color:var(--geeks-ui-text-light)}.btn{display:var(--geeks-ui-display);padding:var(--geeks-ui-padding);font-size:var(--geeks-ui-font-size);font-weight:var(--geeks-ui-font-weight-normal);text-align:var(--geeks-ui-text-align);text-decoration:var(--geeks-ui-text-decoration);border:var(--geeks-ui-border);border-radius:var(--geeks-ui-border-radius);cursor:pointer;transition:var(--geeks-ui-transition);user-select:none}.btn:hover{opacity:.9;transform:translateY(-1px);box-shadow:0 4px 8px rgba(0,0,0,.15)}.btn:active{transform:translateY(0)}.btn-primary{background-color:var(--geeks-ui-primary);color:var(--geeks-ui-text-light)}.btn-secondary{background-color:var(--geeks-ui-secondary);color:var(--geeks-ui-text-light)}.btn-success{background-color:var(--geeks-ui-success);color:var(--geeks-ui-text-light)}.btn-info{background-color:var(--geeks-ui-info);color:var(--geeks-ui-text-light)}.btn-warning{background-color:var(--geeks-ui-warning);color:var(--geeks-ui-text-light)}.btn-base{background-color:var(--geeks-ui-base);color:var(--geeks-ui-text-light)}.btn-sm{padding:.5rem 1rem;font-size:.875rem}.btn-lg{padding:1rem 2rem;font-size:1.25rem}.btn-outline-primary{background-color:transparent;border:2px solid var(--geeks-ui-primary);color:var(--geeks-ui-primary)}.btn-outline-primary:hover{background-color:var(--geeks-ui-primary);color:var(--geeks-ui-text-light)}.header{background-color:var(--geeks-ui-text-light);box-shadow:0 2px 4px rgba(0,0,0,.1);position:sticky;top:0;z-index:1000}.navbar{display:flex;justify-content:space-between;align-items:center;padding:1rem 0}.navbar-brand{font-size:1.5rem;font-weight:var(--geeks-ui-font-weight-bold);color:var(--geeks-ui-primary);text-decoration:none}.navbar-nav{display:flex;list-style:none;margin:0;padding:0;gap:2rem}.navbar-nav li{margin:0}.navbar-nav a{color:var(--geeks-ui-text-primary);text-decoration:none;font-weight:var(--geeks-ui-font-weight-normal);transition:var(--geeks-ui-transition)}.navbar-nav a:hover{color:var(--geeks-ui-primary)}@media (max-width:768px){.navbar{flex-direction:column;gap:1rem}.navbar-nav{gap:1rem}}.footer{background-color:var(--geeks-ui-secondary);color:var(--geeks-ui-text-light);padding:2rem 0;margin-top:auto}.footer p{margin:0;text-align:center;opacity:.9}.footer a{color:var(--geeks-ui-text-light);text-decoration:none;transition:var(--geeks-ui-transition)}.footer a:hover{opacity:.8;text-decoration:underline}.form-group{margin-bottom:1.5rem}.form-group:last-child{margin-bottom:0}.form-label{display:block;margin-bottom:.5rem;font-weight:600;color:var(--text-color);font-size:.875rem}.form-label.required::after{content:' *';color:var(--danger-color)}.form-control{display:block;width:100%;padding:.75rem 1rem;font-size:1rem;line-height:1.5;color:var(--text-color);background-color:var(--white);background-clip:padding-box;border:1px solid var(--border-color);border-radius:.375rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out}.form-control:focus{color:var(--text-color);background-color:var(--white);border-color:var(--primary-color);outline:0;box-shadow:0 0 0 .2rem rgba(102,126,234,.25)}.form-control::placeholder{color:var(--muted-color);opacity:1}.form-control:disabled{background-color:var(--light-gray);opacity:1;cursor:not-allowed}.form-control-sm{padding:.5rem .75rem;font-size:.875rem}.form-control-lg{padding:1rem 1.25rem;font-size:1.125rem}.form-select{display:block;width:100%;padding:.75rem 2.25rem .75rem 1rem;font-size:1rem;font-weight:400;line-height:1.5;color:var(--text-color);background-color:var(--white);background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m1 6 7 7 7-7'/%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right .75rem center;background-size:16px 12px;border:1px solid var(--border-color);border-radius:.375rem;transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;-webkit-appearance:none;-moz-appearance:none;appearance:none}.form-select:focus{border-color:var(--primary-color);outline:0;box-shadow:0 0 0 .2rem rgba(102,126,234,.25)}.form-check{display:block;min-height:1.5rem;padding-left:1.75rem;margin-bottom:.5rem}.form-check-input{width:1.25rem;height:1.25rem;margin-top:.125rem;margin-left:-1.75rem;vertical-align:top;background-color:var(--white);background-repeat:no-repeat;background-position:center;background-size:contain;border:1px solid var(--border-color);-webkit-appearance:none;-moz-appearance:none;appearance:none;transition:background-color .15s ease-in-out,border-color .15s ease-in-out}.form-check-input[type=checkbox]{border-radius:.25rem}.form-check-input[type=radio]{border-radius:50%}.form-check-input:active{filter:brightness(90%)}.form-check-input:focus{border-color:var(--primary-color);outline:0;box-shadow:0 0 0 .2rem rgba(102,126,234,.25)}.form-check-input:checked{background-color:var(--primary-color);border-color:var(--primary-color)}.form-check-input:checked[type=checkbox]{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e")}.form-check-input:checked[type=radio]{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e")}.form-check-label{cursor:pointer;font-size:.875rem}.input-group{position:relative;display:flex;flex-wrap:wrap;align-items:stretch;width:100%}.input-group>.form-control{position:relative;flex:1 1 auto;width:1%;min-width:0}.input-group-text{display:flex;align-items:center;padding:.75rem 1rem;font-size:1rem;font-weight:400;line-height:1.5;color:var(--text-color);text-align:center;white-space:nowrap;background-color:var(--light-gray);border:1px solid var(--border-color)}.input-group>.form-control:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.input-group>.form-control:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}.input-group>.input-group-text:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.input-group>.input-group-text:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}.form-text{margin-top:.25rem;font-size:.875rem;color:var(--muted-color)}.form-control.is-valid,.was-validated .form-control:valid{border-color:var(--success-color)}.form-control.is-valid:focus,.was-validated .form-control:valid:focus{border-color:var(--success-color);box-shadow:0 0 0 .2rem rgba(16,185,129,.25)}.form-control.is-invalid,.was-validated .form-control:invalid{border-color:var(--danger-color)}.form-control.is-invalid:focus,.was-validated .form-control:invalid:focus{border-color:var(--danger-color);box-shadow:0 0 0 .2rem rgba(239,68,68,.25)}.valid-feedback{display:none;width:100%;margin-top:.25rem;font-size:.875rem;color:var(--success-color)}.invalid-feedback{display:none;width:100%;margin-top:.25rem;font-size:.875rem;color:var(--danger-color)}.form-control.is-valid~.valid-feedback,.was-validated .form-control:valid~.valid-feedback{display:block}.form-control.is-invalid~.invalid-feedback,.was-validated .form-control:invalid~.invalid-feedback{display:block}.form-floating{position:relative}.form-floating>.form-control{height:calc(3.5rem + 2px);line-height:1.25;padding:1rem 1rem .25rem 1rem}.form-floating>label{position:absolute;top:0;left:0;height:100%;padding:1rem 1rem .25rem 1rem;pointer-events:none;border:1px solid transparent;transform-origin:0 0;transition:opacity .1s ease-in-out,transform .1s ease-in-out}.form-floating>.form-control:focus~label,.form-floating>.form-control:not(:placeholder-shown)~label{opacity:.65;transform:scale(.85) translateY(-.5rem) translateX(.15rem)}.card{position:relative;display:flex;flex-direction:column;min-width:0;word-wrap:break-word;background-color:var(--white);background-clip:border-box;border:1px solid var(--border-color);border-radius:.5rem;box-shadow:0 2px 4px rgba(0,0,0,.1);transition:box-shadow .15s ease-in-out,transform .15s ease-in-out}.card:hover{box-shadow:0 4px 8px rgba(0,0,0,.15);transform:translateY(-2px)}.card-body{flex:1 1 auto;padding:1.5rem}.card-body:first-child{border-top-left-radius:calc(.5rem - 1px);border-top-right-radius:calc(.5rem - 1px)}.card-body:last-child{border-bottom-right-radius:calc(.5rem - 1px);border-bottom-left-radius:calc(.5rem - 1px)}.card-title{margin-bottom:.75rem;font-size:1.25rem;font-weight:600;color:var(--text-color)}.card-subtitle{margin-top:-.375rem;margin-bottom:.75rem;font-size:.875rem;color:var(--muted-color)}.card-text{margin-bottom:1rem;color:var(--text-color);line-height:1.6}.card-text:last-child{margin-bottom:0}.card-header{padding:1rem 1.5rem;margin-bottom:0;background-color:var(--light-gray);border-bottom:1px solid var(--border-color);border-top-left-radius:calc(.5rem - 1px);border-top-right-radius:calc(.5rem - 1px);font-weight:600;color:var(--text-color)}.card-header:first-child{border-radius:calc(.5rem - 1px) calc(.5rem - 1px) 0 0}.card-footer{padding:1rem 1.5rem;background-color:var(--light-gray);border-top:1px solid var(--border-color);border-bottom-right-radius:calc(.5rem - 1px);border-bottom-left-radius:calc(.5rem - 1px)}.card-footer:last-child{border-radius:0 0 calc(.5rem - 1px) calc(.5rem - 1px)}.card-img{width:100%;border-radius:calc(.5rem - 1px)}.card-img-top{width:100%;border-top-left-radius:calc(.5rem - 1px);border-top-right-radius:calc(.5rem - 1px)}.card-img-bottom{width:100%;border-bottom-right-radius:calc(.5rem - 1px);border-bottom-left-radius:calc(.5rem - 1px)}.card-img-overlay{position:absolute;top:0;right:0;bottom:0;left:0;padding:1.5rem;border-radius:calc(.5rem - 1px);background:linear-gradient(180deg,transparent 0,rgba(0,0,0,.6) 100%);color:var(--white)}.card-img-overlay .card-subtitle,.card-img-overlay .card-text,.card-img-overlay .card-title{color:var(--white)}.card-link{color:var(--primary-color);text-decoration:none;transition:color .15s ease-in-out}.card-link:hover{color:var(--primary-hover);text-decoration:underline}.card-link+.card-link{margin-left:1rem}.card-group{display:flex;flex-direction:column}.card-group>.card{margin-bottom:1rem}.card-deck{display:flex;flex-direction:column}.card-deck .card{margin-bottom:1rem}.card-columns{column-count:1;column-gap:1.25rem;orphans:1;widows:1}.card-columns .card{display:inline-block;width:100%;margin-bottom:1rem}.card-primary{background-color:var(--primary-color);border-color:var(--primary-color);color:var(--white)}.card-primary .card-subtitle,.card-primary .card-text,.card-primary .card-title{color:var(--white)}.card-primary .card-footer,.card-primary .card-header{background-color:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2)}.card-secondary{background-color:var(--secondary-color);border-color:var(--secondary-color);color:var(--white)}.card-success{background-color:var(--success-color);border-color:var(--success-color);color:var(--white)}.card-warning{background-color:var(--warning-color);border-color:var(--warning-color);color:var(--text-color)}.card-danger{background-color:var(--danger-color);border-color:var(--danger-color);color:var(--white)}.card-info{background-color:var(--info-color);border-color:var(--info-color);color:var(--white)}.card-light{background-color:var(--light-gray);border-color:var(--border-color);color:var(--text-color)}.card-dark{background-color:var(--dark-color);border-color:var(--dark-color);color:var(--white)}.card-outline-primary{background-color:transparent;border-color:var(--primary-color)}.card-outline-secondary{background-color:transparent;border-color:var(--secondary-color)}.card-outline-success{background-color:transparent;border-color:var(--success-color)}.card-outline-warning{background-color:transparent;border-color:var(--warning-color)}.card-outline-danger{background-color:transparent;border-color:var(--danger-color)}.card-outline-info{background-color:transparent;border-color:var(--info-color)}@media (min-width:576px){.card-columns{column-count:2}.card-deck,.card-group{flex-direction:row}.card-deck .card,.card-group>.card{flex:1 0 0%;margin-bottom:0}.card-deck .card+.card,.card-group>.card+.card{margin-left:1rem}.card-group>.card{border-radius:0}.card-group>.card:first-child{border-top-right-radius:0;border-bottom-right-radius:0}.card-group>.card:last-child{border-top-left-radius:0;border-bottom-left-radius:0}.card-group>.card:only-child{border-radius:.5rem}.card-group>.card:not(:first-child):not(:last-child){border-radius:0}}@media (min-width:768px){.card-columns{column-count:3}}.modal{position:fixed;top:0;left:0;z-index:1050;display:none;width:100%;height:100%;overflow-x:hidden;overflow-y:auto;outline:0;background-color:rgba(0,0,0,.5);backdrop-filter:blur(2px)}.modal.show{display:flex;align-items:center;justify-content:center;animation:modalFadeIn .3s ease-out}.modal-dialog{position:relative;width:auto;margin:1rem;pointer-events:none;max-width:500px;animation:modalSlideIn .3s ease-out}.modal-dialog-centered{display:flex;align-items:center;min-height:calc(100% - 2rem)}.modal-content{position:relative;display:flex;flex-direction:column;width:100%;pointer-events:auto;background-color:var(--white);background-clip:padding-box;border:1px solid var(--border-color);border-radius:.5rem;box-shadow:0 .5rem 1rem rgba(0,0,0,.15);outline:0}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:1.5rem 1.5rem 1rem 1.5rem;border-bottom:1px solid var(--border-color);border-top-left-radius:calc(.5rem - 1px);border-top-right-radius:calc(.5rem - 1px)}.modal-title{margin:0;line-height:1.5;font-size:1.25rem;font-weight:600;color:var(--text-color)}.modal-body{position:relative;flex:1 1 auto;padding:1.5rem;color:var(--text-color);line-height:1.6}.modal-footer{display:flex;align-items:center;justify-content:flex-end;padding:1rem 1.5rem 1.5rem 1.5rem;border-top:1px solid var(--border-color);border-bottom-right-radius:calc(.5rem - 1px);border-bottom-left-radius:calc(.5rem - 1px);gap:.5rem}.modal-footer>*{margin:0}.modal-close{position:relative;width:2rem;height:2rem;padding:0;margin:0;background:0 0;border:none;font-size:1.5rem;line-height:1;color:var(--muted-color);cursor:pointer;transition:color .15s ease-in-out,opacity .15s ease-in-out;display:flex;align-items:center;justify-content:center;border-radius:.25rem}.modal-close:hover{color:var(--text-color);background-color:var(--light-gray)}.modal-close:focus{outline:0;box-shadow:0 0 0 .2rem rgba(102,126,234,.25)}.modal-close::before{content:'×';font-weight:300}.modal-sm{max-width:300px}.modal-lg{max-width:800px}.modal-xl{max-width:1140px}.modal-fullscreen{width:100vw;max-width:none;height:100%;margin:0}.modal-fullscreen .modal-content{height:100%;border:0;border-radius:0}.modal-fullscreen .modal-footer,.modal-fullscreen .modal-header{border-radius:0}@keyframes modalFadeIn{from{opacity:0}to{opacity:1}}@keyframes modalSlideIn{from{transform:translateY(-50px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-dialog-scrollable{height:calc(100% - 2rem)}.modal-dialog-scrollable .modal-content{max-height:100%;overflow:hidden}.modal-dialog-scrollable .modal-body{overflow-y:auto}@media (min-width:576px){.modal-dialog{max-width:500px;margin:1.75rem auto}.modal-dialog-centered{min-height:calc(100% - 3.5rem)}.modal-sm{max-width:300px}.modal-lg{max-width:800px}.modal-xl{max-width:1140px}}@media (min-width:992px){.modal-lg,.modal-xl{max-width:800px}}@media (min-width:1200px){.modal-xl{max-width:1140px}}.modal-primary .modal-header{background-color:var(--primary-color);border-color:var(--primary-color);color:var(--white)}.modal-primary .modal-title{color:var(--white)}.modal-primary .modal-close{color:rgba(255,255,255,.8)}.modal-primary .modal-close:hover{color:var(--white);background-color:rgba(255,255,255,.1)}.modal-success .modal-header{background-color:var(--success-color);border-color:var(--success-color);color:var(--white)}.modal-warning .modal-header{background-color:var(--warning-color);border-color:var(--warning-color);color:var(--text-color)}.modal-danger .modal-header{background-color:var(--danger-color);border-color:var(--danger-color);color:var(--white)}.modal-info .modal-header{background-color:var(--info-color);border-color:var(--info-color);color:var(--white)}.modal-backdrop{position:fixed;top:0;left:0;z-index:1040;width:100vw;height:100vh;background-color:rgba(0,0,0,.5)}.modal-backdrop.fade{opacity:0}.modal-backdrop.show{opacity:.5}body.modal-open{overflow:hidden}.badge{display:inline-block;padding:.35em .65em;font-size:.75em;font-weight:700;line-height:1;color:var(--white);text-align:center;white-space:nowrap;vertical-align:baseline;border-radius:.375rem;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}.badge:empty{display:none}.badge-primary{background-color:var(--primary-color);color:var(--white)}.badge-secondary{background-color:var(--secondary-color);color:var(--white)}.badge-success{background-color:var(--success-color);color:var(--white)}.badge-warning{background-color:var(--warning-color);color:var(--text-color)}.badge-danger{background-color:var(--danger-color);color:var(--white)}.badge-info{background-color:var(--info-color);color:var(--white)}.badge-light{background-color:var(--light-gray);color:var(--text-color)}.badge-dark{background-color:var(--dark-color);color:var(--white)}.badge-outline-primary{color:var(--primary-color);border:1px solid var(--primary-color);background-color:transparent}.badge-outline-secondary{color:var(--secondary-color);border:1px solid var(--secondary-color);background-color:transparent}.badge-outline-success{color:var(--success-color);border:1px solid var(--success-color);background-color:transparent}.badge-outline-warning{color:var(--warning-color);border:1px solid var(--warning-color);background-color:transparent}.badge-outline-danger{color:var(--danger-color);border:1px solid var(--danger-color);background-color:transparent}.badge-outline-info{color:var(--info-color);border:1px solid var(--info-color);background-color:transparent}.badge-outline-light{color:var(--text-color);border:1px solid var(--border-color);background-color:transparent}.badge-outline-dark{color:var(--dark-color);border:1px solid var(--dark-color);background-color:transparent}.badge-sm{padding:.25em .5em;font-size:.625em}.badge-lg{padding:.5em .75em;font-size:.875em}.badge-pill{border-radius:10rem}.badge-square{border-radius:0}.badge-circle{border-radius:50%;width:2em;height:2em;display:inline-flex;align-items:center;justify-content:center;padding:0}.position-relative{position:relative}.badge-positioned{position:absolute;top:0;right:0;transform:translate(50%,-50%)}.badge-positioned.badge-circle{top:-.5em;right:-.5em;transform:none}.badge-icon{display:inline-flex;align-items:center;gap:.25em}.badge-icon::before{width:1em;height:1em}a.badge{text-decoration:none}a.badge:focus,a.badge:hover{text-decoration:none;filter:brightness(110%)}a.badge-primary:focus,a.badge-primary:hover{background-color:var(--primary-hover)}a.badge-secondary:focus,a.badge-secondary:hover{background-color:var(--secondary-hover)}a.badge-success:focus,a.badge-success:hover{background-color:var(--success-hover)}a.badge-warning:focus,a.badge-warning:hover{background-color:var(--warning-hover)}a.badge-danger:focus,a.badge-danger:hover{background-color:var(--danger-hover)}a.badge-info:focus,a.badge-info:hover{background-color:var(--info-hover)}.badge-dismissible{display:inline-flex;align-items:center;gap:.5em;padding-right:.5em}.badge-close{background:0 0;border:none;color:inherit;font-size:1.2em;line-height:1;cursor:pointer;padding:0;margin-left:.25em;opacity:.7;transition:opacity .15s ease-in-out}.badge-close:hover{opacity:1}.badge-close::before{content:'×'}.badge-dot{width:.5em;height:.5em;border-radius:50%;padding:0;min-width:.5em}.badge-dot.badge-sm{width:.375em;height:.375em;min-width:.375em}.badge-dot.badge-lg{width:.75em;height:.75em;min-width:.75em}.badge-pulse{animation:badgePulse 2s infinite}@keyframes badgePulse{0%{box-shadow:0 0 0 0 currentColor;opacity:1}70%{box-shadow:0 0 0 10px transparent;opacity:.7}100%{box-shadow:0 0 0 0 transparent;opacity:1}}.badge-notification{position:absolute;top:-.5em;right:-.5em;min-width:1.5em;height:1.5em;display:flex;align-items:center;justify-content:center;font-size:.75em;font-weight:700;border:2px solid var(--white);box-shadow:0 1px 3px rgba(0,0,0,.2)}.badge-group{display:inline-flex;align-items:center;gap:.25rem}.badge-group .badge{margin:0}@media (max-width:576px){.badge-sm-hide{display:none}.badge{font-size:.625em;padding:.25em .5em}}.progress{width:100%;height:1rem;background-color:var(--light-color,#f8f9fa);border-radius:.25rem;overflow:hidden;box-shadow:inset 0 .1rem .1rem rgba(0,0,0,.1);margin:.5rem 0}.progress-bar{height:100%;background:linear-gradient(45deg,var(--primary-color,#667eea),var(--secondary-color,#764ba2));border-radius:inherit;transition:width .6s ease;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.75rem;font-weight:600;text-align:center;white-space:nowrap;overflow:hidden;position:relative}.progress-bar::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);animation:progress-shine 2s infinite}@keyframes progress-shine{0%{left:-100%}100%{left:100%}}.progress-bar-success{background:linear-gradient(45deg,var(--success-color,#28a745),#20c997)}.progress-bar-warning{background:linear-gradient(45deg,var(--warning-color,#ffc107),#fd7e14);color:var(--dark-color,#343a40)}.progress-bar-danger{background:linear-gradient(45deg,var(--danger-color,#dc3545),#e83e8c)}.progress-bar-info{background:linear-gradient(45deg,var(--info-color,#17a2b8),#6f42c1)}.progress-sm{height:.5rem}.progress-lg{height:1.5rem}.progress-lg .progress-bar{font-size:.875rem}.progress-bar-striped{background-image:linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);background-size:1rem 1rem}.progress-bar-animated{animation:progress-bar-stripes 1s linear infinite}@keyframes progress-bar-stripes{0%{background-position:1rem 0}100%{background-position:0 0}}.progress-circle{position:relative;width:120px;height:120px;border-radius:50%;background:conic-gradient(var(--primary-color,#667eea) 0deg,var(--light-color,#f8f9fa) 0deg);display:flex;align-items:center;justify-content:center;margin:1rem auto}.progress-circle::before{content:'';position:absolute;width:80px;height:80px;border-radius:50%;background:#fff}.progress-circle-text{position:relative;z-index:1;font-size:1.25rem;font-weight:700;color:var(--dark-color,#343a40)}.tabs{margin:1rem 0}.tab-list{display:flex;list-style:none;margin:0;padding:0;border-bottom:2px solid var(--light-color,#e9ecef);background:0 0}.tab-item{margin:0}.tab-link{display:block;padding:.75rem 1.5rem;text-decoration:none;color:var(--muted-color,#6c757d);border:none;background:0 0;cursor:pointer;transition:all .3s ease;border-bottom:3px solid transparent;font-weight:500;position:relative;overflow:hidden}.tab-link:hover{color:var(--primary-color,#667eea);background:rgba(102,126,234,.05)}.tab-link.active{color:var(--primary-color,#667eea);border-bottom-color:var(--primary-color,#667eea);background:rgba(102,126,234,.1)}.tab-content{padding:1.5rem 0}.tab-pane{display:none;animation:fadeIn .3s ease}.tab-pane.active{display:block}@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.tabs-pills .tab-list{border-bottom:none;gap:.5rem}.tabs-pills .tab-link{border-radius:2rem;border-bottom:none}.tabs-pills .tab-link.active{background:var(--primary-color,#667eea);color:#fff}.tabs-vertical{display:flex;gap:2rem}.tabs-vertical .tab-list{flex-direction:column;border-bottom:none;border-right:2px solid var(--light-color,#e9ecef);min-width:200px}.tabs-vertical .tab-link{text-align:left;border-bottom:none;border-right:3px solid transparent}.tabs-vertical .tab-link.active{border-right-color:var(--primary-color,#667eea);border-bottom:none}.tab-link i{margin-right:.5rem}@media (max-width:768px){.tab-list{flex-wrap:wrap}.tab-link{flex:1;text-align:center;padding:.5rem 1rem;font-size:.875rem}.tabs-vertical{flex-direction:column}.tabs-vertical .tab-list{flex-direction:row;border-right:none;border-bottom:2px solid var(--light-color,#e9ecef);min-width:auto}}.accordion{border:1px solid var(--border-color,#dee2e6);border-radius:.375rem;overflow:hidden;margin:1rem 0}.accordion-item{border-bottom:1px solid var(--border-color,#dee2e6)}.accordion-item:last-child{border-bottom:none}.accordion-header{margin:0}.accordion-button{width:100%;padding:1rem 1.25rem;background:var(--light-color,#f8f9fa);border:none;text-align:left;cursor:pointer;font-size:1rem;font-weight:500;color:var(--dark-color,#212529);transition:all .3s ease;position:relative;display:flex;align-items:center;justify-content:space-between}.accordion-button:hover{background:var(--secondary-light,#e9ecef);color:var(--primary-color,#667eea)}.accordion-button:focus{outline:0;box-shadow:0 0 0 .2rem rgba(102,126,234,.25)}.accordion-button::after{content:'+';font-size:1.25rem;font-weight:700;transition:transform .3s ease;line-height:1}.accordion-button[aria-expanded=true]::after{content:'−';transform:rotate(180deg)}.accordion-button.collapsed::after{content:'+';transform:rotate(0)}.accordion-body{padding:1.25rem;background:#fff;border-top:1px solid var(--border-color,#dee2e6);animation:slideDown .3s ease}.accordion-collapse{overflow:hidden;transition:height .3s ease}.accordion-collapse:not(.show){height:0}.accordion-collapse.show{height:auto}@keyframes slideDown{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.accordion-flush{border:none;border-radius:0}.accordion-flush .accordion-item{border-left:none;border-right:none;border-radius:0}.accordion-flush .accordion-button{border-radius:0;background:0 0}.accordion-icon .accordion-button::before{content:'📁';margin-right:.75rem;font-size:1.1rem}.accordion-icon .accordion-button[aria-expanded=true]::before{content:'📂'}.accordion-primary .accordion-button{background:rgba(102,126,234,.1);color:var(--primary-color,#667eea)}.accordion-primary .accordion-button:hover{background:rgba(102,126,234,.2)}.accordion-success .accordion-button{background:rgba(40,167,69,.1);color:var(--success-color,#28a745)}.accordion-warning .accordion-button{background:rgba(255,193,7,.1);color:var(--warning-color,#ffc107)}.dropdown{position:relative;display:inline-block}.dropdown-toggle{background:var(--primary-color,#667eea);color:#fff;border:none;padding:.5rem 1rem;border-radius:.375rem;cursor:pointer;font-size:1rem;transition:all .3s ease;display:flex;align-items:center;gap:.5rem}.dropdown-toggle:hover{background:var(--primary-dark,#5a6fd8);transform:translateY(-1px)}.dropdown-toggle::after{content:'▼';font-size:.75rem;transition:transform .3s ease}.dropdown-toggle[aria-expanded=true]::after{transform:rotate(180deg)}.dropdown-menu{position:absolute;top:100%;left:0;z-index:1000;display:none;min-width:10rem;padding:.5rem 0;margin:.125rem 0 0;background:#fff;border:1px solid var(--border-color,#dee2e6);border-radius:.375rem;box-shadow:0 .5rem 1rem rgba(0,0,0,.15);animation:dropdownSlide .3s ease}.dropdown-menu.show{display:block}@keyframes dropdownSlide{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.dropdown-item{display:block;width:100%;padding:.5rem 1rem;clear:both;font-weight:400;color:var(--dark-color,#212529);text-align:inherit;text-decoration:none;white-space:nowrap;background:0 0;border:none;cursor:pointer;transition:all .2s ease}.dropdown-item:focus,.dropdown-item:hover{background:var(--light-color,#f8f9fa);color:var(--primary-color,#667eea)}.dropdown-item.active{background:var(--primary-color,#667eea);color:#fff}.dropdown-item.disabled,.dropdown-item:disabled{color:var(--muted-color,#6c757d);pointer-events:none;background:0 0;cursor:not-allowed}.dropdown-divider{height:0;margin:.5rem 0;overflow:hidden;border-top:1px solid var(--border-color,#dee2e6)}.dropdown-header{display:block;padding:.5rem 1rem;margin-bottom:0;font-size:.875rem;color:var(--muted-color,#6c757d);white-space:nowrap;font-weight:600}.dropup .dropdown-menu{top:auto;bottom:100%;margin-top:0;margin-bottom:.125rem}.dropend .dropdown-menu{top:0;right:auto;left:100%;margin-top:0;margin-left:.125rem}.dropstart .dropdown-menu{top:0;right:100%;left:auto;margin-top:0;margin-right:.125rem}.dropdown-toggle-secondary{background:var(--secondary-color,#6c757d)}.dropdown-toggle-success{background:var(--success-color,#28a745)}.dropdown-toggle-warning{background:var(--warning-color,#ffc107);color:var(--dark-color,#212529)}.dropdown-toggle-danger{background:var(--danger-color,#dc3545)}.dropdown-toggle-outline{background:0 0;color:var(--primary-color,#667eea);border:1px solid var(--primary-color,#667eea)}.dropdown-toggle-outline:hover{background:var(--primary-color,#667eea);color:#fff}.dropdown-toggle-sm{padding:.25rem .75rem;font-size:.875rem}.dropdown-toggle-lg{padding:.75rem 1.5rem;font-size:1.25rem}.dropdown-menu-dark{background:var(--dark-color,#343a40);border-color:var(--dark-border,#495057)}.dropdown-menu-dark .dropdown-item{color:var(--light-color,#f8f9fa)}.dropdown-menu-dark .dropdown-item:hover{background:var(--secondary-color,#495057);color:#fff}.dropdown-menu-dark .dropdown-divider{border-top-color:var(--dark-border,#495057)}.tooltip{position:relative;display:inline-block;cursor:pointer}.tooltip-text{visibility:hidden;opacity:0;background:var(--dark-color,#343a40);color:#fff;text-align:center;border-radius:.375rem;padding:.5rem .75rem;position:absolute;z-index:1000;bottom:125%;left:50%;margin-left:-60px;width:120px;font-size:.875rem;font-weight:500;transition:all .3s ease;transform:translateY(10px);box-shadow:0 .25rem .5rem rgba(0,0,0,.1)}.tooltip-text::after{content:'';position:absolute;top:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:var(--dark-color,#343a40) transparent transparent transparent}.tooltip:hover .tooltip-text{visibility:visible;opacity:1;transform:translateY(0)}.tooltip-right .tooltip-text{top:-5px;left:125%;bottom:auto;margin-left:0;width:auto;white-space:nowrap;transform:translateX(-10px)}.tooltip-right .tooltip-text::after{top:50%;left:0;margin-left:-10px;margin-top:-5px;border-color:transparent var(--dark-color,#343a40) transparent transparent}.tooltip-right:hover .tooltip-text{transform:translateX(0)}.tooltip-bottom .tooltip-text{top:125%;bottom:auto;transform:translateY(-10px)}.tooltip-bottom .tooltip-text::after{top:0;margin-top:-10px;border-color:transparent transparent var(--dark-color,#343a40) transparent}.tooltip-bottom:hover .tooltip-text{transform:translateY(0)}.tooltip-left .tooltip-text{top:-5px;right:125%;left:auto;bottom:auto;margin-left:0;width:auto;white-space:nowrap;transform:translateX(10px)}.tooltip-left .tooltip-text::after{top:50%;right:0;left:auto;margin-right:-10px;margin-top:-5px;border-color:transparent transparent transparent var(--dark-color,#343a40)}.tooltip-left:hover .tooltip-text{transform:translateX(0)}.tooltip-primary .tooltip-text{background:var(--primary-color,#667eea)}.tooltip-primary .tooltip-text::after{border-top-color:var(--primary-color,#667eea)}.tooltip-success .tooltip-text{background:var(--success-color,#28a745)}.tooltip-success .tooltip-text::after{border-top-color:var(--success-color,#28a745)}.tooltip-warning .tooltip-text{background:var(--warning-color,#ffc107);color:var(--dark-color,#212529)}.tooltip-warning .tooltip-text::after{border-top-color:var(--warning-color,#ffc107)}.tooltip-danger .tooltip-text{background:var(--danger-color,#dc3545)}.tooltip-danger .tooltip-text::after{border-top-color:var(--danger-color,#dc3545)}.tooltip-sm .tooltip-text{padding:.25rem .5rem;font-size:.75rem;width:100px;margin-left:-50px}.tooltip-lg .tooltip-text{padding:.75rem 1rem;font-size:1rem;width:160px;margin-left:-80px}.tooltip-visible .tooltip-text{visibility:visible;opacity:1;transform:translateY(0)}.tooltip-html .tooltip-text{width:auto;max-width:200px;text-align:left;white-space:normal}.tooltip-bounce:hover .tooltip-text{animation:tooltipBounce .6s ease}@keyframes tooltipBounce{0%,100%,20%,50%,80%{transform:translateY(0)}40%{transform:translateY(-10px)}60%{transform:translateY(-5px)}}