/* Resize 80% - Efficient CSS Custom Properties Override */
/* This file applies 80% scaling to all elements using CSS variables */

:root {
  /* Typography - Scale down font sizes */
  --font-size-base: 0.8rem;        /* 1rem * 0.8 */
  --font-size-lg: 0.9rem;          /* 1.125rem * 0.8 */
  --font-size-xl: 1rem;            /* 1.25rem * 0.8 */
  --font-size-2xl: 1.2rem;         /* 1.5rem * 0.8 */
  --font-size-3xl: 1.5rem;         /* 1.875rem * 0.8 */
  --font-size-4xl: 1.8rem;         /* 2.25rem * 0.8 */

  /* Spacing - Scale down all spacing */
  --spacing-1: 0.2rem;             /* 0.25rem * 0.8 */
  --spacing-2: 0.4rem;             /* 0.5rem * 0.8 */
  --spacing-3: 0.6rem;             /* 0.75rem * 0.8 */
  --spacing-4: 0.8rem;             /* 1rem * 0.8 */
  --spacing-5: 1rem;               /* 1.25rem * 0.8 */
  --spacing-6: 1.2rem;             /* 1.5rem * 0.8 */
  --spacing-8: 1.6rem;             /* 2rem * 0.8 */
  --spacing-10: 2rem;              /* 2.5rem * 0.8 */
  --spacing-12: 2.4rem;            /* 3rem * 0.8 */
  --spacing-16: 3.2rem;            /* 4rem * 0.8 */
  --spacing-20: 4rem;              /* 5rem * 0.8 */

  /* Border Radius - Scale down border radius */
  --radius-sm: 0.3rem;             /* 0.375rem * 0.8 */
  --radius-md: 0.4rem;             /* 0.5rem * 0.8 */
  --radius-lg: 0.6rem;             /* 0.75rem * 0.8 */
  --radius-xl: 0.8rem;             /* 1rem * 0.8 */
  --radius-2xl: 1.2rem;            /* 1.5rem * 0.8 */

  /* Additional scaling for common elements */
  --container-max-width: 960px;    /* 1200px * 0.8 */
  --card-padding: 1.6rem;          /* 2rem * 0.8 */
  --button-padding: 0.8rem 1.6rem; /* 1rem 2rem * 0.8 */
  --input-padding: 0.6rem 0.8rem;  /* 0.75rem 1rem * 0.8 */
}

/* Override specific elements that might not use CSS variables */
html {
  font-size: 12.8px;               /* 16px * 0.8 - Base font size */
}

/* Scale down common Bootstrap classes */
.container {
  max-width: 960px !important;     /* 1200px * 0.8 */
}

.container-fluid {
  padding-left: 1.6rem !important; /* 2rem * 0.8 */
  padding-right: 1.6rem !important;
}

/* Scale down common spacing classes */
.p-1 { padding: 0.2rem !important; }
.p-2 { padding: 0.4rem !important; }
.p-3 { padding: 0.6rem !important; }
.p-4 { padding: 0.8rem !important; }
.p-5 { padding: 1rem !important; }

.m-1 { margin: 0.2rem !important; }
.m-2 { margin: 0.4rem !important; }
.m-3 { margin: 0.6rem !important; }
.m-4 { margin: 0.8rem !important; }
.m-5 { margin: 1rem !important; }

/* Scale down common text sizes */
.h1 { font-size: 1.8rem !important; }  /* 2.25rem * 0.8 */
.h2 { font-size: 1.5rem !important; }  /* 1.875rem * 0.8 */
.h3 { font-size: 1.2rem !important; }  /* 1.5rem * 0.8 */
.h4 { font-size: 1rem !important; }    /* 1.25rem * 0.8 */
.h5 { font-size: 0.9rem !important; }  /* 1.125rem * 0.8 */
.h6 { font-size: 0.8rem !important; }  /* 1rem * 0.8 */

/* Scale down buttons */
.btn {
  padding: 0.6rem 1.2rem !important;   /* 0.75rem 1.5rem * 0.8 */
  font-size: 0.8rem !important;        /* 1rem * 0.8 */
}

.btn-sm {
  padding: 0.4rem 0.8rem !important;   /* 0.5rem 1rem * 0.8 */
  font-size: 0.75rem !important;       /* 0.875rem * 0.8 */
}

.btn-lg {
  padding: 0.8rem 1.6rem !important;   /* 1rem 2rem * 0.8 */
  font-size: 0.9rem !important;        /* 1.125rem * 0.8 */
}

/* Scale down form elements */
.form-control {
  padding: 0.6rem 0.8rem !important;   /* 0.75rem 1rem * 0.8 */
  font-size: 0.8rem !important;        /* 1rem * 0.8 */
}

.form-label {
  font-size: 0.8rem !important;        /* 1rem * 0.8 */
  margin-bottom: 0.4rem !important;    /* 0.5rem * 0.8 */
}

/* Scale down cards */
.card {
  border-radius: 0.6rem !important;    /* 0.75rem * 0.8 */
}

.card-body {
  padding: 1.6rem !important;          /* 2rem * 0.8 */
}

.card-header {
  padding: 1.2rem 1.6rem !important;   /* 1.5rem 2rem * 0.8 */
}

.card-footer {
  padding: 1.2rem 1.6rem !important;   /* 1.5rem 2rem * 0.8 */
}

/* Scale down navigation */
.navbar {
  padding: 0.8rem 0 !important;        /* 1rem 0 * 0.8 */
}

.nav-link {
  padding: 0.6rem 0.8rem !important;   /* 0.75rem 1rem * 0.8 */
  font-size: 0.8rem !important;        /* 1rem * 0.8 */
}

/* Scale down tables */
.table {
  font-size: 0.8rem !important;        /* 1rem * 0.8 */
}

.table th,
.table td {
  padding: 0.6rem !important;          /* 0.75rem * 0.8 */
}

/* Scale down modals */
.modal-dialog {
  max-width: 640px !important;         /* 800px * 0.8 */
}

.modal-content {
  border-radius: 0.6rem !important;    /* 0.75rem * 0.8 */
}

.modal-header,
.modal-body,
.modal-footer {
  padding: 1.2rem 1.6rem !important;   /* 1.5rem 2rem * 0.8 */
}

/* Scale down alerts */
.alert {
  padding: 0.8rem 1.2rem !important;   /* 1rem 1.5rem * 0.8 */
  font-size: 0.8rem !important;        /* 1rem * 0.8 */
}

/* Scale down badges */
.badge {
  font-size: 0.7rem !important;        /* 0.875rem * 0.8 */
  padding: 0.3rem 0.6rem !important;   /* 0.375rem 0.75rem * 0.8 */
}

/* Scale down pagination */
.pagination {
  font-size: 0.8rem !important;        /* 1rem * 0.8 */
}

.page-link {
  padding: 0.4rem 0.8rem !important;   /* 0.5rem 1rem * 0.8 */
}

/* Scale down dropdowns */
.dropdown-menu {
  font-size: 0.8rem !important;        /* 1rem * 0.8 */
}

.dropdown-item {
  padding: 0.4rem 1rem !important;     /* 0.5rem 1.25rem * 0.8 */
}

/* Scale down progress bars */
.progress {
  height: 0.8rem !important;           /* 1rem * 0.8 */
}

/* Scale down list groups */
.list-group-item {
  padding: 0.8rem 1.2rem !important;   /* 1rem 1.5rem * 0.8 */
  font-size: 0.8rem !important;        /* 1rem * 0.8 */
}

/* Scale down breadcrumbs */
.breadcrumb {
  font-size: 0.8rem !important;        /* 1rem * 0.8 */
}

.breadcrumb-item {
  padding: 0.4rem 0 !important;        /* 0.5rem 0 * 0.8 */
}

/* Scale down tooltips and popovers */
.tooltip {
  font-size: 0.7rem !important;        /* 0.875rem * 0.8 */
}

.popover {
  font-size: 0.8rem !important;        /* 1rem * 0.8 */
}

/* Scale down carousel */
.carousel-caption {
  padding: 0.8rem !important;          /* 1rem * 0.8 */
  font-size: 0.8rem !important;        /* 1rem * 0.8 */
}

/* Scale down jumbotron/hero sections */
.jumbotron {
  padding: 3.2rem 2rem !important;     /* 4rem 2.5rem * 0.8 */
}

/* Scale down grid gaps */
.g-1 > * { padding: 0.2rem !important; }
.g-2 > * { padding: 0.4rem !important; }
.g-3 > * { padding: 0.6rem !important; }
.g-4 > * { padding: 0.8rem !important; }
.g-5 > * { padding: 1rem !important; }

/* Scale down utilities */
.text-sm { font-size: 0.75rem !important; }  /* 0.875rem * 0.8 */
.text-lg { font-size: 0.9rem !important; }   /* 1.125rem * 0.8 */
.text-xl { font-size: 1rem !important; }     /* 1.25rem * 0.8 */

/* Scale down custom elements that might not use variables */
.section-title {
  font-size: 1.8rem !important;        /* 2.25rem * 0.8 */
}

.lead {
  font-size: 1rem !important;          /* 1.25rem * 0.8 */
}

.display-1 { font-size: 3.2rem !important; }  /* 4rem * 0.8 */
.display-2 { font-size: 2.8rem !important; }  /* 3.5rem * 0.8 */
.display-3 { font-size: 2.4rem !important; }  /* 3rem * 0.8 */
.display-4 { font-size: 2rem !important; }    /* 2.5rem * 0.8 */

/* Scale down spacing utilities */
.mt-1 { margin-top: 0.2rem !important; }
.mt-2 { margin-top: 0.4rem !important; }
.mt-3 { margin-top: 0.6rem !important; }
.mt-4 { margin-top: 0.8rem !important; }
.mt-5 { margin-top: 1rem !important; }

.mb-1 { margin-bottom: 0.2rem !important; }
.mb-2 { margin-bottom: 0.4rem !important; }
.mb-3 { margin-bottom: 0.6rem !important; }
.mb-4 { margin-bottom: 0.8rem !important; }
.mb-5 { margin-bottom: 1rem !important; }

.pt-1 { padding-top: 0.2rem !important; }
.pt-2 { padding-top: 0.4rem !important; }
.pt-3 { padding-top: 0.6rem !important; }
.pt-4 { padding-top: 0.8rem !important; }
.pt-5 { padding-top: 1rem !important; }

.pb-1 { padding-bottom: 0.2rem !important; }
.pb-2 { padding-bottom: 0.4rem !important; }
.pb-3 { padding-bottom: 0.6rem !important; }
.pb-4 { padding-bottom: 0.8rem !important; }
.pb-5 { padding-bottom: 1rem !important; }



