.calendar.grid{display:grid;grid-template-columns:repeat(7,1fr);gap:10px;padding-right:6px;padding-bottom:12px}
.weekday{padding:.25rem 0;border-bottom:2px solid var(--bs-primary)}
.day.card{min-height:160px;border-color:var(--bs-primary-border-subtle, var(--bs-border-color))}
.day.card.today{outline:2px solid var(--bs-primary); box-shadow:0 0 0 .2rem rgba(13,110,253,.35)}
.day.card.past{opacity:.55; filter:saturate(.8)}
.day .card-body{padding:.5rem .65rem}

/* two-column compact routines */
.routines-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:.5rem}
.routines-grid .form-check{margin-bottom:.2rem}
.routines-grid .form-check .form-check-label{cursor:pointer}
.day .card-header{background:var(--bs-primary-bg-subtle);border-bottom:1px solid var(--bs-primary-border-subtle)}

/* Custom checkbox colors based on routine colors */
.custom-checkbox {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  transform-origin: center;
}

.custom-checkbox:checked {
  animation: checkboxPop 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

@keyframes checkboxPop {
  0% { transform: scale(1); }
  50% { transform: scale(1.2); }
  100% { transform: scale(1); }
}

.custom-checkbox[data-routine-color="primary"]:checked {
  background-color: var(--bs-primary) !important;
  border-color: var(--bs-primary) !important;
}

.custom-checkbox[data-routine-color="secondary"]:checked {
  background-color: var(--bs-secondary) !important;
  border-color: var(--bs-secondary) !important;
}

.custom-checkbox[data-routine-color="success"]:checked {
  background-color: var(--bs-success) !important;
  border-color: var(--bs-success) !important;
}

.custom-checkbox[data-routine-color="danger"]:checked {
  background-color: var(--bs-danger) !important;
  border-color: var(--bs-danger) !important;
}

.custom-checkbox[data-routine-color="warning"]:checked {
  background-color: var(--bs-warning) !important;
  border-color: var(--bs-warning) !important;
}

.custom-checkbox[data-routine-color="info"]:checked {
  background-color: var(--bs-info) !important;
  border-color: var(--bs-info) !important;
}

.custom-checkbox[data-routine-color="light"]:checked {
  background-color: var(--bs-light) !important;
  border-color: var(--bs-light) !important;
}

.custom-checkbox[data-routine-color="dark"]:checked {
  background-color: var(--bs-dark) !important;
  border-color: var(--bs-dark) !important;
}

/* Custom HEX colors for checkboxes */
.custom-checkbox[data-routine-color^="#"]:checked {
  background-color: var(--routine-color) !important;
  border-color: var(--routine-color) !important;
}

/* Strikethrough and darkening for unchecked routines */
.form-check-label {
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.custom-checkbox:not(:checked) + .form-check-label {
  text-decoration: line-through;
  opacity: 0.6;
  filter: brightness(0.7);
}

.custom-checkbox:checked + .form-check-label {
  animation: labelGlow 0.6s ease-out;
}

@keyframes labelGlow {
  0% { 
    text-shadow: 0 0 5px currentColor;
    transform: scale(1);
  }
  50% { 
    text-shadow: 0 0 15px currentColor;
    transform: scale(1.05);
  }
  100% { 
    text-shadow: none;
    transform: scale(1);
  }
}

/* Apply custom HEX colors to labels */
.form-check-label[data-routine-color^="#"] {
  color: var(--routine-color) !important;
}
/* Respect theme background/text */
textarea.form-control{background:var(--bs-body-bg);color:var(--bs-body-color)}
body.bg-light{background-color:var(--bs-body-bg)!important}

/* tighter routine checkboxes */
.form-check.small{margin-bottom:.1rem}
.form-check.small .form-check-input{height:.9rem;width:.9rem}
.form-check.small .form-check-label{margin-left:.25rem;font-size:.78rem}

/* Prominent day cards styling */
.routines-grid-prominent{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:.75rem;row-gap:.5rem}
.routines-grid-prominent .form-check{margin-bottom:.3rem}
.routines-grid-prominent .form-check .form-check-input{height:1.1rem;width:1.1rem}
.routines-grid-prominent .form-check .form-check-label{margin-left:.4rem;font-size:.9rem;font-weight:500}
.streak-badge{color:#6c757d;font-weight:500;transition:all 0.3s ease}
.streak-badge:hover{opacity:1 !important;transform:scale(1.1)}
.prominent-day-content .form-range{height:.6rem}
.prominent-day-content .form-range::-webkit-slider-runnable-track{height:.6rem}
.prominent-day-content .form-range::-moz-range-track{height:.6rem}
.prominent-day-content .form-range::-ms-track{height:.6rem}

/* mood range gradient */
.form-range::-webkit-slider-runnable-track{height:.5rem;background:linear-gradient(90deg,#dc3545 0%, #ffc107 50%, #198754 100%);border-radius:1rem}
.form-range::-moz-range-track{height:.5rem;background:linear-gradient(90deg,#dc3545 0%, #ffc107 50%, #198754 100%);border-radius:1rem}
.form-range::-ms-track{height:.5rem;background:linear-gradient(90deg,#dc3545 0%, #ffc107 50%, #198754 100%);border-radius:1rem;border-color:transparent;color:transparent}

/* mood range handle as thin black vertical line */
.form-range{background:transparent;}
.form-range::-webkit-slider-thumb{appearance:none;margin-top:-4px; /* center on 0.5rem track */ width:3px;height:0.9rem;background:#000;border:none;border-radius:0}
.form-range:focus::-webkit-slider-thumb{outline:none}
.form-range::-moz-range-thumb{width:3px;height:0.9rem;background:#000;border:none;border-radius:0}
.form-range::-ms-thumb{width:3px;height:0.9rem;background:#000;border:none;border-radius:0}

/* Dark theme mood slider */
[data-bs-theme="dark"] .form-range::-webkit-slider-thumb {
  background: #ffffff;
}

[data-bs-theme="dark"] .form-range::-moz-range-thumb {
  background: #ffffff;
}

[data-bs-theme="dark"] .form-range::-ms-thumb {
  background: #ffffff;
}

/* Dark theme styling */
[data-bs-theme="dark"] {
  --bs-body-bg: #000000;
  --bs-body-color: #ffffff;
  --bs-primary: #4a9eff;
  --bs-primary-rgb: 74, 158, 255;
  --bs-border-color: #1a1a1a;
  --bs-card-bg: #0a0a0a;
  --bs-card-border-color: #1a1a1a;
}

[data-bs-theme="dark"] body {
  background-color: #000000 !important;
  color: #ffffff;
}

[data-bs-theme="dark"] .container {
  background-color: #000000;
}

[data-bs-theme="dark"] .card {
  background-color: #0a0a0a;
  border-color: #1a1a1a;
}

[data-bs-theme="dark"] .card-header {
  background-color: #1a1a1a;
  border-color: #2a2a2a;
}

[data-bs-theme="dark"] .day.card {
  background-color: #0a0a0a;
  border-color: #1a1a1a;
}

[data-bs-theme="dark"] .day.card.today {
  background-color: #1a1a1a;
  border-color: #4a9eff;
  box-shadow: 0 0 0 0.2rem rgba(74, 158, 255, 0.25);
}

[data-bs-theme="dark"] .day.card.past {
  opacity: 0.6;
  filter: saturate(0.8);
}

[data-bs-theme="dark"] .weekday {
  background-color: #1a1a1a;
  color: #ffffff;
  border-bottom-color: #4a9eff;
}

[data-bs-theme="dark"] .empty {
  background-color: #000000;
}

[data-bs-theme="dark"] .form-control {
  background-color: #1a1a1a;
  border-color: #2a2a2a;
  color: #ffffff;
}

[data-bs-theme="dark"] .form-control:focus {
  background-color: #1a1a1a;
  border-color: #4a9eff;
  color: #ffffff;
  box-shadow: 0 0 0 0.2rem rgba(74, 158, 255, 0.25);
}

[data-bs-theme="dark"] .form-check-input {
  background-color: #1a1a1a;
  border-color: #2a2a2a;
}

[data-bs-theme="dark"] .form-check-input:checked {
  background-color: #4a9eff;
  border-color: #4a9eff;
}

/* Dark theme custom checkbox colors */
[data-bs-theme="dark"] .custom-checkbox[data-routine-color="primary"]:checked {
  background-color: #4a9eff !important;
  border-color: #4a9eff !important;
}

[data-bs-theme="dark"] .custom-checkbox[data-routine-color="secondary"]:checked {
  background-color: #6c757d !important;
  border-color: #6c757d !important;
}

[data-bs-theme="dark"] .custom-checkbox[data-routine-color="success"]:checked {
  background-color: #28a745 !important;
  border-color: #28a745 !important;
}

[data-bs-theme="dark"] .custom-checkbox[data-routine-color="danger"]:checked {
  background-color: #dc3545 !important;
  border-color: #dc3545 !important;
}

[data-bs-theme="dark"] .custom-checkbox[data-routine-color="warning"]:checked {
  background-color: #ffc107 !important;
  border-color: #ffc107 !important;
}

[data-bs-theme="dark"] .custom-checkbox[data-routine-color="info"]:checked {
  background-color: #17a2b8 !important;
  border-color: #17a2b8 !important;
}

[data-bs-theme="dark"] .custom-checkbox[data-routine-color="light"]:checked {
  background-color: #f8f9fa !important;
  border-color: #f8f9fa !important;
}

[data-bs-theme="dark"] .custom-checkbox[data-routine-color="dark"]:checked {
  background-color: #343a40 !important;
  border-color: #343a40 !important;
}

/* Dark theme HEX colors for checkboxes */
[data-bs-theme="dark"] .custom-checkbox[data-routine-color^="#"]:checked {
  background-color: var(--routine-color) !important;
  border-color: var(--routine-color) !important;
}

/* Dark theme celebration effect */
[data-bs-theme="dark"] .all-completed {
  animation: celebrationPulseDark 2s ease-out;
}

@keyframes celebrationPulseDark {
  0% { 
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(74, 158, 255, 0.7);
  }
  50% { 
    transform: scale(1.02);
    box-shadow: 0 0 0 20px rgba(74, 158, 255, 0);
  }
  100% { 
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(74, 158, 255, 0);
  }
}

[data-bs-theme="dark"] .form-check-label {
  color: #ffffff;
}

[data-bs-theme="dark"] .btn-outline-primary {
  border-color: #4a9eff;
  color: #4a9eff;
}

[data-bs-theme="dark"] .btn-outline-primary:hover {
  background-color: #4a9eff;
  border-color: #4a9eff;
  color: #ffffff;
}

[data-bs-theme="dark"] .btn-outline-secondary {
  border-color: #6c757d;
  color: #6c757d;
}

[data-bs-theme="dark"] .btn-outline-secondary:hover {
  background-color: #6c757d;
  border-color: #6c757d;
  color: #ffffff;
}

[data-bs-theme="dark"] .btn-primary {
  background-color: #4a9eff;
  border-color: #4a9eff;
}

[data-bs-theme="dark"] .btn-primary:hover {
  background-color: #3a8eef;
  border-color: #3a8eef;
}

[data-bs-theme="dark"] .btn-success {
  background-color: #28a745;
  border-color: #28a745;
}

[data-bs-theme="dark"] .btn-success:hover {
  background-color: #218838;
  border-color: #218838;
}

[data-bs-theme="dark"] .text-primary {
  color: #4a9eff !important;
}

[data-bs-theme="dark"] .text-secondary {
  color: #6c757d !important;
}

[data-bs-theme="dark"] .text-muted {
  color: #adb5bd !important;
}

[data-bs-theme="dark"] .streak-badge {
  color: #adb5bd !important;
}

[data-bs-theme="dark"] .modal-content {
  background-color: #0a0a0a;
  border-color: #1a1a1a;
}

[data-bs-theme="dark"] .modal-header {
  background-color: #1a1a1a;
  border-color: #2a2a2a;
}

[data-bs-theme="dark"] .modal-footer {
  background-color: #1a1a1a;
  border-color: #2a2a2a;
}

[data-bs-theme="dark"] .list-group-item {
  background-color: #0a0a0a;
  border-color: #1a1a1a;
  color: #ffffff;
}

[data-bs-theme="dark"] .form-select {
  background-color: #1a1a1a;
  border-color: #2a2a2a;
  color: #ffffff;
}

[data-bs-theme="dark"] .form-select:focus {
  background-color: #1a1a1a;
  border-color: #4a9eff;
  color: #ffffff;
}

/* Subtle vertical lines for dark theme */
[data-bs-theme="dark"] .calendar.grid {
  background: linear-gradient(90deg, transparent 49.9%, #1a1a1a 50%, transparent 50.1%);
  background-size: 14.2857% 100%;
  background-repeat: repeat-x;
}

[data-bs-theme="dark"] .day.card {
  position: relative;
}

[data-bs-theme="dark"] .day.card::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  width: 1px;
  height: 100%;
  background-color: #1a1a1a;
  opacity: 0.3;
}

/* Confetti particles */
.confetti-particle {
  position: fixed;
  width: 8px;
  height: 8px;
  background: var(--confetti-color, #ff6b6b);
  border-radius: 50%;
  pointer-events: none;
  z-index: 9999;
  animation: confettiFall 2s ease-out forwards;
}

@keyframes confettiFall {
  0% {
    transform: translateY(-10px) rotate(0deg);
    opacity: 1;
  }
  100% {
    transform: translateY(100vh) rotate(720deg);
    opacity: 0;
  }
}

/* Confetti shapes */
.confetti-particle.square {
  border-radius: 0;
}

.confetti-particle.triangle {
  width: 0;
  height: 0;
  background: transparent;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-bottom: 8px solid var(--confetti-color, #ff6b6b);
}

.confetti-particle.star {
  background: var(--confetti-color, #ff6b6b);
  clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
}

/* Celebration effect when all routines are completed */
.all-completed {
  animation: celebrationPulse 2s ease-out;
}

@keyframes celebrationPulse {
  0% { 
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(76, 175, 80, 0.7);
  }
  50% { 
    transform: scale(1.02);
    box-shadow: 0 0 0 20px rgba(76, 175, 80, 0);
  }
  100% { 
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(76, 175, 80, 0);
  }
}

@media (max-width: 992px){.day.card{min-height:180px}}
@media (max-width: 768px){.calendar.grid{grid-template-columns:repeat(2,1fr)}}