/* BootstrapColors theme: icietla
   Target: Bootstrap 5.3.8
   https://bootstrapcolors.com/ */

:root {
    --bs-primary: #482457;
    --bs-primary-rgb: 72, 36, 87;
/*    --bs-secondary: #dde5b6ff;
    --bs-secondary-rgb: 221, 229, 182;*/
    --bs-link-color: #7E4B3D;
    --bs-link-hover-color: #8C4107;
    --bs-body-bg: #F8E9CF;
    --bs-body-bg-rgb: 248, 233, 207;
    --bct-theme: #F8E9CF;
    --bct-theme-rgb: 248, 233, 207;
    --bct-theme-text: #482457;
    --bct-accent: #0EA5E9;
    --bct-accent-rgb: 14, 165, 233;
    --bct-accent-text: #111111;
    --bct-gradient-end: #75725E;
    --bct-primary-hover: #9E4908;
    --bct-gradient-hover-end: #676453;
    --bct-primary-active: #904207;
    --bct-gradient-active-end: #5E5B4B;
    --bct-theme-gradient: linear-gradient(135deg, var(--bs-primary), var(--bct-gradient-end));
    --bct-theme-gradient-hover: linear-gradient(135deg, var(--bct-primary-hover), var(--bct-gradient-hover-end));
    --bct-theme-gradient-active: linear-gradient(135deg, var(--bct-primary-active), var(--bct-gradient-active-end));
    --bct-radius: .75rem;
    --bct-border: var(--bs-border-color);
    --bct-shadow: 0 .6rem 1.7rem rgba(180, 83, 9, .10);
    --bct-focus-shadow: 0 0 0 .25rem rgba(180, 83, 9, .25);
    --bct-close-filter: invert(1) grayscale(100%) brightness(200%);
}

[data-bs-theme="dark"] {
    --bs-primary: #FFFFFF;
    --bs-primary-rgb: 255, 255, 255;
    --bs-link-color: #CB8753;
    --bs-link-hover-color: #D8A67F;
    --bs-body-bg: #482457;
    --bs-body-bg-rgb: 72, 36, 87;
    --bct-theme: #BC6422;
    --bct-theme-text: #111111;
    --bct-accent: #21ACEB;
    --bct-accent-rgb: 33, 172, 235;
    --bct-accent-text: #111111;
    --bct-gradient-end: #817F6E;
    --bct-primary-hover: #C37438;
    --bct-gradient-hover-end: #8E8C7D;
    --bct-primary-active: #A2561D;
    --bct-gradient-active-end: #6F6D5F;
    --bct-close-filter: none;
}

.btn-icietla,
.btn-outline-icietla {
  border-radius: 50rem;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease, background .18s ease;
  transform: translateZ(0);
}
.btn-icietla {
  --bs-btn-color: #FFFFFF;
  --bs-btn-bg: #B45309;
  --bs-btn-border-color: #B45309;
  --bs-btn-hover-color: #FFFFFF;
  --bs-btn-hover-bg: #9E4908;
  --bs-btn-hover-border-color: #944407;
  --bs-btn-active-color: #FFFFFF;
  --bs-btn-active-bg: #904207;
  --bs-btn-active-border-color: #893F07;
  --bs-btn-disabled-color: #FFFFFF;
  --bs-btn-disabled-bg: #B45309;
  --bs-btn-disabled-border-color: #B45309;
  background-image: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,0) 62%), var(--bct-theme-gradient);
  box-shadow: 0 .35rem 1rem rgba(180, 83, 9, .16);
  
}
.btn-icietla:hover:not(:disabled),
.btn-outline-icietla:hover:not(:disabled) { transform: translateY(-2px); box-shadow: 0 .8rem 1.8rem rgba(180, 83, 9, .22), 0 0 1.35rem rgba(14, 165, 233, .30); }
.btn-icietla:active:not(:disabled),
.btn-outline-icietla:active:not(:disabled) { transform: translateY(1px); }
.btn-icietla:hover:not(:disabled) { background-image: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,0) 62%), var(--bct-theme-gradient-hover); }
.btn-icietla:active:not(:disabled) { background-image: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,0) 62%), var(--bct-theme-gradient-active); }
.btn-outline-icietla {
  --bs-btn-color: #B45309; --bs-btn-border-color: #B45309;
  --bs-btn-hover-color: #FFFFFF; --bs-btn-hover-bg: #B45309; --bs-btn-hover-border-color: #B45309;
  --bs-btn-active-color: #FFFFFF; --bs-btn-active-bg: #B45309; --bs-btn-active-border-color: #B45309;
  
}
.btn-outline-icietla:hover:not(:disabled) { background-image: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,0) 62%), var(--bct-theme-gradient-hover); }
.btn-outline-icietla:active:not(:disabled) { background-image: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,0) 62%), var(--bct-theme-gradient-active); }
.text-icietla { color: #B45309 !important; }
.bg-icietla { background-color: #B45309 !important; color: #FFFFFF !important; }
.border-icietla { border-color: #B45309 !important; }

.text-accent-icietla { color: var(--bct-accent) !important; }
.bg-accent-icietla { background-color: var(--bct-accent) !important; color: var(--bct-accent-text) !important; }
.border-accent-icietla { border-color: var(--bct-accent) !important; }
.link-icietla { color: #B45309 !important; }
.link-icietla:hover { color: #8C4107 !important; }
.alert-icietla { --bs-alert-color: #512504; --bs-alert-bg: #F5E7DD; --bs-alert-border-color: #E9CBB5; --bs-alert-link-color: #442003; }
.list-group-item-icietla { color: #532604; background-color: #F6EAE1; border-color: #EACFBA; }
.list-group-item-icietla.list-group-item-action:hover,
.list-group-item-icietla.list-group-item-action:focus { color: #411E03; background-color: #F0DDCE; }
.table-icietla {
  --bs-table-color: #442003; --bs-table-bg: #F8EEE6; --bs-table-border-color: #E7C8B0;
  --bs-table-striped-bg: #F2E0D3; --bs-table-striped-color: #3D1C03;
  --bs-table-active-bg: #E9CBB5; --bs-table-active-color: #361903;
  --bs-table-hover-bg: #ECD4C2; --bs-table-hover-color: #361903;
}

/* Surfaces */
.card { --bs-card-border-color: var(--bct-border); --bs-card-border-radius: var(--bct-radius); --bs-card-inner-border-radius: calc(var(--bct-radius) - 1px); --bs-card-cap-bg: color-mix(in srgb, var(--bs-primary) 4%, transparent); }
.modal { --bs-modal-border-color: var(--bct-border); --bs-modal-border-radius: var(--bct-radius); --bs-modal-inner-border-radius: calc(var(--bct-radius) - 1px); }
.modal-header { background-color: var(--bs-primary); background-image: var(--bct-theme-gradient); color: var(--bct-theme-text); border-bottom-color: color-mix(in srgb, var(--bs-primary) 72%, var(--bs-border-color)); border-top-left-radius: calc(var(--bct-radius) - 1px); border-top-right-radius: calc(var(--bct-radius) - 1px); }
.modal-header .btn-close { filter: var(--bct-close-filter); }
.dropdown-menu { --bs-dropdown-border-color: var(--bct-border); --bs-dropdown-border-radius: var(--bct-radius); --bs-dropdown-box-shadow: var(--bct-shadow); --bs-dropdown-link-hover-color: var(--bs-primary); --bs-dropdown-link-hover-bg: color-mix(in srgb, var(--bs-primary) 8%, var(--bs-body-bg)); --bs-dropdown-link-active-color: var(--bct-theme-text); --bs-dropdown-link-active-bg: var(--bs-primary); }
.accordion { --bs-accordion-border-color: var(--bct-border); --bs-accordion-border-radius: var(--bct-radius); --bs-accordion-inner-border-radius: calc(var(--bct-radius) - 1px); --bs-accordion-btn-focus-border-color: var(--bs-primary); --bs-accordion-btn-focus-box-shadow: var(--bct-focus-shadow); --bs-accordion-active-color: color-mix(in srgb, var(--bs-primary) 72%, var(--bs-body-color)); --bs-accordion-active-bg: color-mix(in srgb, var(--bs-primary) 8%, var(--bs-body-bg)); }
.toast { --bs-toast-border-color: var(--bct-border); --bs-toast-border-radius: var(--bct-radius); }
.offcanvas { --bs-offcanvas-border-color: var(--bct-border); }
.offcanvas-header { background-color: var(--bs-primary); background-image: var(--bct-theme-gradient); color: var(--bct-theme-text); border-bottom: 1px solid color-mix(in srgb, var(--bs-primary) 72%, var(--bs-border-color)); }
.offcanvas-header .btn-close { filter: var(--bct-close-filter); }
.card,
.modal-content,
.dropdown-menu,
.accordion-item,
.toast,
.offcanvas { border-color: var(--bct-border); border-radius: var(--bct-radius); box-shadow: var(--bct-shadow); background: linear-gradient(135deg, color-mix(in srgb, var(--bs-body-bg) 82%, #fff) 0%, color-mix(in srgb, var(--bs-body-bg) 92%, var(--bs-primary)) 36%, color-mix(in srgb, var(--bs-body-bg) 82%, #000) 100%); }

/* Forms, checks, radios, switches and ranges */
.form-control,
.form-select,
.form-check-input,
.input-group-text { border-radius: var(--bct-radius); border-color: var(--bct-border); }
.form-control:focus,
.form-select:focus,
.form-check-input:focus,
.form-range:focus,
.btn:focus-visible,
.btn-check:focus-visible + .btn,
.page-link:focus,
.nav-link:focus-visible,
.navbar-toggler:focus,
.btn-close:focus { border-color: var(--bs-primary); box-shadow: var(--bct-focus-shadow); outline: 0; }
.form-check-input:checked,
.form-check-input[type="checkbox"]:indeterminate { background-color: var(--bs-primary); border-color: var(--bs-primary); }
.form-check-input { accent-color: var(--bs-primary); }
.form-range::-webkit-slider-thumb { background-color: var(--bs-primary); }
.form-range::-moz-range-thumb { background-color: var(--bs-primary); }
.form-range::-webkit-slider-thumb:active { background-color: color-mix(in srgb, var(--bs-primary) 70%, #fff); }
.form-range::-moz-range-thumb:active { background-color: color-mix(in srgb, var(--bs-primary) 70%, #fff); }

/* Navigation, tabs, pills and navbar */
.nav { --bs-nav-link-color: var(--bs-primary); --bs-nav-link-hover-color: color-mix(in srgb, var(--bs-primary) 78%, #000); }
.nav-pills { --bs-nav-pills-link-active-bg: var(--bs-primary); }
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link { color: var(--bct-theme-text); background-image: var(--bct-theme-gradient); }
.nav-tabs { --bs-nav-tabs-border-color: var(--bct-border); --bs-nav-tabs-link-hover-border-color: color-mix(in srgb, var(--bs-primary) 28%, var(--bct-border)); --bs-nav-tabs-link-active-color: var(--bs-primary); --bs-nav-tabs-link-active-border-color: var(--bs-primary) var(--bs-primary) var(--bs-body-bg); }
.navbar { --bs-navbar-color: color-mix(in srgb, var(--bs-primary) 56%, var(--bs-body-color)); --bs-navbar-hover-color: var(--bs-primary); --bs-navbar-active-color: var(--bs-primary); --bs-navbar-brand-color: var(--bs-primary); --bs-navbar-brand-hover-color: color-mix(in srgb, var(--bs-primary) 78%, #000); --bs-navbar-toggler-border-color: var(--bct-border); }
.navbar-toggler { border-radius: var(--bct-radius); }

/* Pagination */
.pagination { --bs-pagination-color: var(--bs-primary); --bs-pagination-border-color: var(--bct-border); --bs-pagination-border-radius: var(--bct-radius); --bs-pagination-hover-color: color-mix(in srgb, var(--bs-primary) 78%, #000); --bs-pagination-hover-bg: color-mix(in srgb, var(--bs-primary) 8%, var(--bs-body-bg)); --bs-pagination-hover-border-color: color-mix(in srgb, var(--bs-primary) 32%, var(--bct-border)); --bs-pagination-focus-color: var(--bs-primary); --bs-pagination-focus-bg: color-mix(in srgb, var(--bs-primary) 8%, var(--bs-body-bg)); --bs-pagination-focus-box-shadow: var(--bct-focus-shadow); --bs-pagination-active-color: var(--bct-theme-text); --bs-pagination-active-bg: var(--bs-primary); --bs-pagination-active-border-color: var(--bs-primary); }
.page-item.active .page-link { background-image: var(--bct-theme-gradient); }

/* Progress */
.progress { --bs-progress-bg: color-mix(in srgb, var(--bs-primary) 10%, var(--bs-secondary-bg)); --bs-progress-border-radius: var(--bct-radius); }
.progress-bar { background-color: var(--bs-primary); background-image: var(--bct-theme-gradient); color: var(--bct-theme-text); }

/* Tooltips and popovers */
.tooltip { --bs-tooltip-bg: var(--bs-primary); --bs-tooltip-color: var(--bct-theme-text); --bs-tooltip-border-radius: var(--bct-radius); --bs-tooltip-opacity: .98; }
.popover { --bs-popover-border-color: var(--bct-border); --bs-popover-border-radius: var(--bct-radius); --bs-popover-box-shadow: var(--bct-shadow); --bs-popover-header-bg: color-mix(in srgb, var(--bs-primary) 9%, var(--bs-body-bg)); --bs-popover-header-color: var(--bs-primary); }

/* Carousel */
.carousel { --bs-carousel-indicator-active-bg: var(--bs-primary); --bs-carousel-caption-color: var(--bs-body-color); }
.carousel-indicators [data-bs-target] { background-color: color-mix(in srgb, var(--bs-primary) 62%, var(--bs-body-color)); }
.carousel-indicators .active { background-color: var(--bs-primary); }
.carousel-control-prev:focus-visible,
.carousel-control-next:focus-visible { outline: 0; box-shadow: inset var(--bct-focus-shadow); }

/* Miscellaneous Bootstrap accents */
.dropdown-item.active,
.dropdown-item:active { background-color: var(--bs-primary); background-image: var(--bct-theme-gradient); color: var(--bct-theme-text); }
.badge.text-bg-theme { background-color: #B45309 !important; background-image: var(--bct-theme-gradient); color: #FFFFFF !important; }
.spinner-border.text-theme,
.spinner-grow.text-theme { color: var(--bs-primary) !important; }
.breadcrumb { --bs-breadcrumb-divider-color: color-mix(in srgb, var(--bs-primary) 38%, var(--bs-secondary-color)); --bs-breadcrumb-item-active-color: color-mix(in srgb, var(--bs-primary) 64%, var(--bs-body-color)); }

/* Directional fill is opt-in: use .link-icietla.link-theme-fill on links that should animate. */
.link-icietla { text-decoration: none; }
.link-theme-fill {
  position: relative;
  display: inline-block;
  isolation: isolate;
  overflow: hidden;
  padding: .12em .42em;
  border-radius: max(.3rem, calc(var(--bct-radius) * .55));
  text-decoration: none !important;
  transition: color .2s ease, box-shadow .2s ease;
}
.link-theme-fill::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image: var(--bct-theme-gradient);
  transform: scaleX(0);
  transform-origin: right center;
  transition: transform .22s ease;
}
.link-theme-fill:hover,
.link-theme-fill:focus-visible {
  color: var(--bct-theme-text) !important;
  text-decoration: none !important;
}
.link-theme-fill:hover::before,
.link-theme-fill:focus-visible::before { transform: scaleX(1); }
.link-theme-fill:focus-visible { outline: 0; box-shadow: var(--bct-focus-shadow); }

[data-bs-theme="dark"] .alert-icietla { --bs-alert-color: #E7C8B0; --bs-alert-bg: #361903; --bs-alert-border-color: #5E2B05; }
[data-bs-theme="dark"] .list-group-item-icietla { color: #EACFBA; background-color: #2B1402; border-color: #562804; }
[data-bs-theme="dark"] .table-icietla { --bs-table-color: #EFD9C9; --bs-table-bg: #200F02; --bs-table-border-color: #4F2504; --bs-table-striped-bg: #321703; --bs-table-hover-bg: #411E03; }

[data-bs-theme="dark"] .card,
[data-bs-theme="dark"] .modal-content,
[data-bs-theme="dark"] .dropdown-menu,
[data-bs-theme="dark"] .accordion-item,
[data-bs-theme="dark"] .toast,
[data-bs-theme="dark"] .offcanvas {
  background: linear-gradient(135deg, color-mix(in srgb, var(--bs-body-bg) 82%, #fff) 0%, color-mix(in srgb, var(--bs-body-bg) 92%, var(--bs-primary)) 36%, color-mix(in srgb, var(--bs-body-bg) 82%, #000) 100%);
}

@media (prefers-reduced-motion: reduce) {
  .btn-icietla, .btn-outline-icietla, .bct-interactive, .link-icietla, .link-theme-fill { transition: none !important; transform: none !important; }
  .btn-icietla::after, .btn-outline-icietla::after, .link-theme-fill::before { transition: none !important; }
}
