.grid-container {
  --spacing: 1rem;
  --column-count: 4;
  --min-width: 12.5rem;
  --max-width: 1fr;
  
  --gap-count: calc(var(--column-count) - 1);
  --total-gap-width: calc(var(--gap-count) * var(--spacing));
  --grid-item--max-width: calc((100% - var(--total-gap-width)) / var(--column-count));

  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(max(var(--min-width), var(--grid-item--max-width)), var(--max-width)));
  grid-gap: var(--spacing);
}

:root {
  --bs-primary: #ebc94a;              /* اللون الذهبي الأساسي */
  --bs-primary-rgb: 212, 175, 55;
  --bs-body-color: #000000

}

.btn,
.btn-primary,
.btn-secondary,
.btn-success,
.btn-danger,
.btn-warning,
.btn-info,
.btn-light,
.btn-dark {
  /* لون النص داخل الزر */
  --bs-btn-color: #fff;

  /* اللون الذهبي الأساسي */
  --bs-btn-bg: #d4af37;

  /* حدود الزر */
  --bs-btn-border-color: #d4af37;

  /* لون عند التمرير (ذهبي أفتح لكن غني) */
  --bs-btn-hover-bg: #ebc94a;

  /* حدود عند التمرير */
  --bs-btn-hover-border-color: #ebc94a;

  /* لون النص عند التمرير */
  --bs-btn-hover-color: #fff;

  /* لون عند الضغط (ذهبي أدكن قليلاً) */
  --bs-btn-active-bg: #b89628;

  /* حدود عند الضغط */
  --bs-btn-active-border-color: #b89628;

  /* لون النص عند الضغط */
  --bs-btn-active-color: #fff;

  /* ظل التركيز */
  --bs-btn-focus-shadow-rgb: 212, 175, 55;

  /* عند تعطيل الزر */
  --bs-btn-disabled-bg: #d4af37;
  --bs-btn-disabled-border-color: #d4af37;
  --bs-btn-disabled-color: #fff;

  border-width: 2px;
  transition: all 0.3s ease;
}
.footer-bottom {
  background-color: #2e5c41;       /* لون الفوتر */
  color: #d4af37 !important;                 /* النص باللون الذهبي */
  font-size: 0.875rem;
  padding-block: 1rem;
  text-align: center;
  border-top: 1px solid #333;     /* خط فاصل أنيق */
}
:root {
  --absolute-white: #f0d25e;
 --absolute-white-rgb: 240, 210, 94;
}