:root{
    --swd-blue-color: #5575bf;
    --swd-orange-color: #cc6600;
    --swd-font-family: "SWD Font";
    --title-font-family: Comfortaa, "Open Sans";
    --body-font-family: Manrope, Roboto;
    --bs-primary: #5575bf;
    --bs-secondary: #cc6600;
}

.bg-primary {
    background-color: var(--swd-blue-color)!important;
}

.bg-secondary {
    background-color: var(--swd-orange-color)!!important
}

.section-block { border: 1px solid #ddd; padding: 1rem; margin-bottom: 1rem; border-radius: 6px; background: #f9f9f9; }

#sidebar.collapsed {
  width: 70px;
  overflow: hidden;
}
#sidebar.collapsed .nav-link span,
#sidebar.collapsed h1 {
  display: none;
}
#sidebarToggle {
  font-size: 1.2rem;
}
#sidebar.collapsed .label,
#sidebar.collapsed h1 {
  display: none;
}

#sidebar .nav-link {
  display: flex;
  align-items: center;
  gap: 10px;
  white-space: nowrap;
}

#sidebar .nav-link i {
  font-size: 1.2rem;
}

.sidebar-toggle-circle {
  position: fixed;
  top: 1rem;
  left: 10.5rem;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 50%;
  border: none;
  background: #fff;
  color: #333;
  z-index: 1050;
  box-shadow: 0 2px 5px rgba(0,0,0,0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: left 0.3s ease;
}

#sidebar.collapsed + .sidebar-toggle-circle {
  left: 3.7rem;
}

.sidebar-toggle-circle i {
  font-size: 1rem;
  transition: transform 0.3s ease;
}

#sidebar.collapsed + .sidebar-toggle-circle i {
  transform: rotate(180deg);
}

.navbar .navbar-nav .nav-link{
    justify-content: left;
}

#sidebar.collapsed .nav-link{
    justify-content: center;
}

.header { text-align: center; margin-bottom: 2rem; }
.header h1 { margin-bottom: 0.5rem; }
.section { margin-bottom: 2.5rem; }
.section h2 { font-size: 1.25rem; border-left: 4px solid #5575bf; padding-left: 0.75rem; margin-bottom: 1rem; }
.price-table { width: 100%; border-collapse: collapse; margin-top: 15px; }
.price-table th, .price-table td { padding: 0.75rem; border: 1px solid #ddd; }
.price-table th:last-child, .price-table td:last-child { text-align: right; }
.price-total { font-weight: bold; background: #f8f8f8; }
.back { margin-top: 2rem; display: inline-block; }

.card h4 {
  margin-bottom: 0.5rem;
}
.template-actions a,
.template-actions form {
  display: inline-block;
}

.due-60 {
  background-color: #d4edda!important;
  color: #155724;
  font-weight: bold;
}

.due-30 {
  background-color: #fff3cd!important;
  color: #856404;
  font-weight: bold;
}

.due-14 {
  background-color: #f8d7da!important;
  color: #721c24;
  font-weight: bold;
}

.overdue {
  background-color: #c82333 !important;
  color: #fff;
  font-weight: bold;
}

.active { color: green; }
.completed { color: blue; }
.archived { opacity: 0.5; }

.flash-btn {
  animation: flashWarning 1s infinite;
}

@keyframes flashWarning {
  0%, 100% { background-color: #ffc107; }
  50% { background-color: #ff8c00; }
}

th a{
    color: inherit;
}

/* Custom task status badge colors */
@keyframes pulse-fade {
  0% { opacity: 1; }
  50% { opacity: 0.5; }
  100% { opacity: 1; }
}

.bg-waiting_start {
  background-color: #6c757d !important; /* grey */
  color: #fff;
}
.bg-waiting_start_cus {
  background-color: #ffc107 !important; /* yellow */
  color: #333 !important;;
  animation: pulse-fade .9s infinite;
}
.bg-waiting_cus {
  background-color: #f22602 !important; /* red/orange */
  color: #fff;
  animation: pulse-fade .9s infinite;
}
.bg-working {
  background-color: #0d6efd !important; /* blue */
  color: #fff;
}
.bg-scrap {
  background-color: #964b00 !important; /* brown */
  color: #fff;
}
.bg-payment {
  background-color: #968500 !important; /* amber/gold */
  color: #fff;
  animation: pulse-fade .9s infinite;
}
.bg-done {
  background-color: #198754 !important; /* green */
  color: #fff;
}

/* Overdue - red */
.task-overdue {
  background-color: #fff5f5 !important;
}
.task-overdue td {
  border-left: 1px solid #dc3545 !important;
  border-right: 1px solid #dc3545 !important;
}

/* Due within 14 days – amber */
.task-due-soon {
  background-color: #fffbea !important;
}
.task-due-soon td {
  border-left: 1px solid #ffc107 !important;
  border-right: 1px solid #ffc107 !important; 
}

/* Due within 30 days – green */
.task-upcoming {
  background-color: #f0fff4 !important;
}
.task-upcoming td {
  border-left: 1px solid #198754 !important;
  border-right: 1px solid #198754 !important;
}

/* lighter background if overdue */
tr.project-overdue {
  background-color: #fff5f5 !important;
}

.project-completed {
  opacity: 0.8;
}



/* Priority colors */

.priority-low {
  background-color: #d1e7dd !important;
  color: #0f5132 !important;;
}
.priority-medium {
  background-color: #cff4fc !important;
  color: #055160 !important;;
}
.priority-high {
  background-color: #ffeeba !important;
  color: #664d03 !important;;
}
.priority-urgent {
  background-color: #f8d7da !important;
  color: #842029 !important;;
}

.form-check-input{
    cursor:pointer;
}

.top-tabs {
  border-top: 1px solid #dee2e6;
  border-bottom: 1px solid #dee2e6;
  background-color: #fff;
  padding: 0.75rem 1rem;
}

.top-tabs .tab-link {
  display: inline-block;
  margin-right: 1.5rem;
  padding-bottom: 0.5rem;
  text-decoration: none;
  color: #333;
  font-weight: 500;
  border-bottom: 2px solid transparent;
  transition: all 0.2s ease;
}

.top-tabs .tab-link:hover {
  color: #000;
  border-bottom: 2px solid #ccc;
}

.top-tabs .tab-link.active {
  border-bottom: 3px solid #000;
  color: #000;
}

.modal-dialog-scrollable .modal-content{
    overflow-y: scroll;
}

/* color badge styles for tags */
.tag-red { background-color: #e3342f; color: #fff; }
.tag-orange { background-color: #f6993f; color: #fff; }
.tag-yellow { background-color: #ffed4a; color: #333; }
.tag-green { background-color: #38c172; color: #fff; }
.tag-blue { background-color: #3490dc; color: #fff; }
.tag-indigo { background-color: #6574cd; color: #fff; }
.tag-purple { background-color: #9561e2; color: #fff; }
.tag-grey { background-color: #6c757d; color: #fff; }
.tag-brown { background-color: #964B00; color: #fff; }

.tag-badge {
  padding: 0.25em 0.6em;
  font-size: 0.75rem;
  border-radius: 0.35rem;
  display: inline-block;
  white-space: nowrap;
}

/* Style for dropdown items, Style for selected tag items */
.choices__item--choice.tag-red, .choices__item--selectable.tag-red { background-color: #e3342f; color: #fff; }
.choices__item--choice.tag-blue, .choices__item--selectable.tag-blue { background-color: #3490dc; color: #fff; }
.choices__item--choice.tag-green, .choices__item--selectable.tag-green { background-color: #38c172; color: #fff; }
.choices__item--choice.tag-yellow, .choices__item--selectable.tag-yellow { background-color: #ffed4a; color: #333; }
.choices__item--choice.tag-orange, .choices__item--selectable.tag-orange { background-color: #f6993f; color: #fff; }
.choices__item--choice.tag-indigo, .choices__item--selectable.tag-indigo { background-color: #6574cd; color: #fff; }
.choices__item--choice.tag-purple,.choices__item--selectable.tag-purple { background-color: #9561e2; color: #fff; }
.choices__item--choice.tag-grey,.choices__item--selectable.tag-grey { background-color: #6c757d; color: #fff; }
.choices__item--choice.tag-brown, .choices__item--selectable.tag-brown { background-color: #964B00; color: #fff; }

.choices__item--selectable {
  display: inline-flex;
  align-items: center;
  border-radius: 20px;
  padding: 5px 10px;
  margin: 2px;
  font-size: 14px;
  white-space: nowrap;
  color: #fff;
}

/* Common dropdown choice enhancements */
.choices__item--choice {
  border-radius: 6px;
  padding: 6px 12px;
  margin: 4px 8px;
  font-weight: 500;
  transition: background-color 0.2s ease;
  display: inline-block;
  text-align: left;
  min-width: 150px;
}

/* Optional: improve visibility on dark backgrounds */
.choices__item--choice {
  text-shadow: 0 1px 2px rgba(0,0,0,0.2);
}

/* Hover effect */
.choices__item--choice:hover {
  filter: brightness(1.05);
  cursor: pointer;
}

/* Fix long list wrapping if needed */
.choices__list--dropdown .choices__item--choice {
  display: inline-block;
  width: auto;
  white-space: nowrap;
}

.choices__list--dropdown {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 10px;
  max-height: 300px;
  overflow-y: auto;
}

.choices__item--choice {
  flex: 0 0 auto;
}


/*************** Media Queries ***************/

@media (min-width: 64rem) {
    .navbar-vertical.navbar-expand-lg {
        width: 11rem;
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        z-index: 1030;
        align-items: flex-start;
        transition: .3s transform;
        overflow-x: auto;
    }
    
    .navbar-vertical.navbar-expand-lg h1{
        text-wrap: auto;
        padding: 12px!important;
    }
    
    .page-wrapper {
        margin-left:11rem;
        padding: 2rem;
    }
}

@media (min-width: 75.25rem) {
    .container, .container-lg, .container-md, .container-sm, .container-xl {
        max-width: 100%;
        width: 95%;
    }
    
    .projects.container{
        max-width: 100%;
    }
}

@media (max-width: 991.98px) {
  .sidebar {
    position: absolute;
    left: -250px;
    transition: left 0.3s ease;
  }

  .sidebar.show {
    left: 0;
  }

  .page-wrapper {
    margin-left: 0;
    padding: 1rem;
  }
}