body {
    background: #EEEEEE;
}

footer {
    height: 40px;
    text-align: center;
    font-size: 12px;
    color: #6c757d;
    line-height: 40px;
    bottom: 0;
    width: 100%;
}

.custom-table-bg,
.custom-table-bg thead,
.custom-table-bg tbody,
.custom-table-bg tr,
.custom-table-bg th,
.custom-table-bg td {
  background-color: #EEEEEE !important;
}

.no-underline {
  text-decoration: none;
}

.flash-message {
    color: red;
}

.font-11 {
    font-size: 11px;
}

.bold-label {
    font-weight:bold;
}

.col-3-width {
  width: 3%;
}

.col-6-width {
  width: 6%;
}

.navbar-blue {
    background-color: #0566b0;
}

.pad-80 {
    padding-top: 80px;
}

.width-200 {
    width: 200px;
}

.z-10 {
    z-index: 10;
}

.alert-message-area {
    visibility: hidden;
    min-height: 30px;
}

.title-bg {
    background: linear-gradient(to left, #db3d14, #ff6a00);
    color:white;
}

.object-cover {
    object-fit: cover;
}

.jumbotron {
  display: flex;
  align-items: center;
  margin: 0;
  height: 100vh;
  color: white;
  background-color: #333;
}

.space-above {
    margin-top: 20px;
    padding-top: 20px;
}

.navbar a,
.navbar-brand,
.navbar-nav .nav-link,
.navbar-toggler {
color: white !important;
}

.navbar .dropdown-menu a {
color: black !important; /* dropdown items stay readable */
}

#nav {
    position:fixed;
    height: 100%;
    background-color: #EEEEEE;
}

.gradient-custom {
    /* fallback for old browsers */
    background: #feada6;

    /* Chrome 10-25, Safari 5.1-6 */
    background: -webkit-linear-gradient(to right, rgba(254,173,166,0.5), rgba(245,239,239,0.5));

    /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
    background: linear-gradient(to right, rgba(254,173,166,0.5), rgba(245,239,239,0.5));
  }

.wrapper {
    min-height: calc(100vh - 40px);
}

/* Styles for table columns starts here */
table {
  table-layout: fixed;
  width: 100%;           /* required for fixed layout to take effect */
}

th, td {
  white-space: normal;          /* allow wrapping */
  word-break: break-word;       /* break long words */
}

.fullname-column {
  width: 20%;
}

.sector-column {
  width: 25%;
}

.zone-column {
  width: 15%;
}

.id-column {
  width: 8%;
}

.fifteen-pct-column {
  width: 15%;
}

/* Styles for Tom Select */
/* Base: match Bootstrap .form-select */
.ts-wrapper.form-select .ts-control {
  box-sizing: border-box;
  min-height: calc(2.25rem + 2px);
  height: calc(2.25rem + 2px);
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  line-height: 1.5;
  border: 1px solid var(--bs-border-color, #ced4da);
  border-radius: 0.375rem;
  background-color: var(--bs-body-bg, #fff);
}

/* Make text/input not expand the height */
.ts-wrapper .ts-control > input {
  margin: 0;
  padding: 0;
  height: 1.5rem;
  line-height: 1.5;
}

/* Multi-select chips: keep compact so height stays uniform */
.ts-wrapper.multi .ts-control .item {
  margin: 0 0.25rem 0 0;
  padding: 0.125rem 0.375rem;
  line-height: 1.25;
}

/* Remove Tom Select’s extra vertical padding */
.ts-wrapper .ts-control {
  padding-top: 0.375rem !important;
  padding-bottom: 0.375rem !important;
}

/* Keep dropdown typography consistent with Bootstrap */
.ts-dropdown {
  font-size: inherit;
  line-height: 1.5;
}



/* Styles for Bootstrap select starts here */

/* --- Global font size for bootstrap-select --- */
.bootstrap-select .dropdown-toggle,
.bootstrap-select .dropdown-menu,
.bootstrap-select .dropdown-menu li a span.text,
.bootstrap-select .dropdown-menu li a,
.bootstrap-select .filter-option-inner-inner,
.bootstrap-select .bs-searchbox .form-control,
.bootstrap-select .bs-actionsbox .btn {
  font-size: 11px !important;
  line-height: 1.2;
}

/* --- Control (the button itself) --- */
.bootstrap-select .dropdown-toggle {
  min-height: 26px;
  padding: 2px 6px;
}

/* --- Dropdown menu options --- */
.bootstrap-select .dropdown-menu li a {
  padding: 2px 6px;
}

/* --- Action box (Tümünü Seç / Seçimleri Kaldır) --- */
.bootstrap-select .bs-actionsbox .btn {
  padding: 2px 6px;
  min-height: 24px;
}

/* --- Checkbox size inside options --- */
.bootstrap-select .dropdown-menu li a .bs-ok-default:after {
  transform: scale(0.7);  /* shrink checkmark */
  margin-top: -2px;
}

/* Compact option row */
.bootstrap-select .dropdown-menu li a {
  position: relative;
  padding-left: 1.3rem;   /* space for checkbox */
  font-size: 11px;
  line-height: 1.2;
  min-height: 20px;       /* tighter row */
}

/* Remove the old tick */
.bootstrap-select .check-mark,
.bootstrap-select .bs-ok-default {
  display: none !important;
}

/* Draw a small square before each option */
.bootstrap-select .dropdown-menu li a::before {
  content: "☐";
  position: absolute;
  left: 6px;
  font-size: 12px;
  line-height: 1;
  color: #555; /* neutral gray */
}

/* When selected, show a checked box */
.bootstrap-select .dropdown-menu li.selected a::before {
  content: "☑";
}

/* Styles for Bootstrap-select ends here */

.intro-img {
  width: 50px;
  height: auto;
}

/* Readonly fields */
.readonly-fieldset {
  pointer-events: none; /* disables mouse/touch */
  opacity: 0.6;         /* greyed-out look */
}

/* styles for calendar */
#calendar .ec-highlight {
  background-color: rgba(255, 193, 7, 0.3) !important; /* yellow */
  outline: 2px solid #ffc107;
  border-radius: 6px;
}

#calendar .ec-event.ec-preview {
  display: none !important;
}

#calendar .ec-event {
  color: black;
}