/* ==========================================================================
   Enhanced Goals CSS — Modern Goal Management Interface (Rewritten/Cleaned)
   - Removes duplication (.goals-btn + .goals-btn-goals)
   - Fixes “text fading” pitfalls (no opacity on card parents)
   - Keeps tokens, but reduces bloat and improves consistency
   - Keeps your visual style (glass + gradients) with safer defaults
   ========================================================================== */

/* ----------------------------- */
/* Design Tokens                 */
/* ----------------------------- */
:root{
  /* Brand */
  --color-primary: #875806;
  --color-primary-hover: #875806;
  --color-primary-light: #e0e7ff;

  --color-secondary: #875806;
  --color-secondary-hover: #875806;

  --color-success: #10b981;
  --color-success-hover: #059669;
  --color-success-light: #d1fae5;

  --color-warning: #f59e0b;
  --color-warning-hover: #d97706;
  --color-warning-light: #fef3c7;

  --color-danger: #ef4444;
  --color-danger-hover: #dc2626;
  --color-danger-light: #fee2e2;

  --color-info: #06b6d4;
  --color-info-hover: #0891b2;
  --color-info-light: #cffafe;

  /* Neutrals */
  --color-gray-50:  #f9fafb;
  --color-gray-100: #f3f4f6;
  --color-gray-200: #e5e7eb;
  --color-gray-300: #d1d5db;
  --color-gray-400: #9ca3af;
  --color-gray-500: #6b7280;
  --color-gray-600: #4b5563;
  --color-gray-700: #374151;
  --color-gray-800: #1f2937;
  --color-gray-900: #111827;

  /* Layout */
  --space-xs: .25rem;
  --space-sm: .5rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;

  --radius-sm: .375rem;
  --radius-md: .5rem;
  --radius-lg: .75rem;
  --radius-xl: 1rem;
  --radius-2xl: 1.5rem;
  --radius-full: 9999px;

  --shadow-sm: 0 1px 2px rgba(0,0,0,.06);
  --shadow-md: 0 8px 20px rgba(2, 8, 23, .10);
  --shadow-lg: 0 14px 34px rgba(2, 8, 23, .14);
  --shadow-xl: 0 24px 60px rgba(2, 8, 23, .18);

  --gradient-primary: linear-gradient(135deg, #9d8359 0%, #c5a572 100%);
  --gradient-success: linear-gradient(135deg, #10b981 0%, #059669 100%);
  --gradient-warning: linear-gradient(135deg, #c5a572 0%, #d97706 100%);
  --gradient-info:    linear-gradient(135deg, #06b6d4 0%, #0891b2 100%);
  --gradient-glass:   linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.05));

  --font-sans: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  --font-mono: ui-monospace,SFMono-Regular,'SF Mono',Consolas,'Liberation Mono',Menlo,monospace;

  --transition-fast: .15s ease-out;
  --transition-base: .30s ease-out;
  --transition-slow: .50s ease-out;

  --z-dropdown: 1000;
  --z-sticky: 1020;
  --z-fixed: 1030;
  --z-modal: 1040;
  --z-popover: 1050;
  --z-tooltip: 1060;
}

/* Dark mode (light tokens invert) */
@media (prefers-color-scheme: dark){
  :root{
    --color-gray-50:  #0b1220;
    --color-gray-100: #0f172a;
    --color-gray-200: #1f2937;
    --color-gray-300: #334155;
    --color-gray-400: #64748b;
    --color-gray-500: #94a3b8;
    --color-gray-600: #cbd5e1;
    --color-gray-700: #e2e8f0;
    --color-gray-800: #f1f5f9;
    --color-gray-900: #ffffff;
  }
}

/* ----------------------------- */
/* Base                          */
/* ----------------------------- */
*{ box-sizing: border-box; }

 .goals-container,
 .goals-container-goals{
   max-width: 1400px;
   margin: 0 auto;
   padding: var(--space-lg);
   font-family: var(--font-sans);
   background: var(--color-gray-50);
   min-height: 100vh;
 }

/* Optional: prevent the “blue selection blocks” on headers */
.period-header,
.period-header *{
  -webkit-user-select: none;
  user-select: none;
}

 /* ----------------------------- */
 /* Header (glass)                */
 /* ----------------------------- */
 .goals-header,
 .goals-header-goals{
   border-radius: var(--radius-2xl);
   padding: var(--space-3xl);
   margin-bottom: var(--space-2xl);
   color: #fff;
   text-align: center;
   box-shadow: var(--shadow-xl);
   position: relative;
   overflow: hidden;
 }

 .goals-header::before,
 .goals-header-goals::before{
   content: "";
   position: absolute;
   inset: 0;
   background: var(--gradient-glass);
   backdrop-filter: blur(10px);
   z-index: 1;
 }

 .goals-header > *,
 .goals-header-goals > *{
   position: relative;
   z-index: 2;
 }

 .goals-header h1,
 .goals-header-goals h1{
   font-size: clamp(2rem, 5vw, 3rem);
   font-weight: 800;
   margin: 0 0 var(--space-md);
   letter-spacing: -0.025em;
   background: linear-gradient(135deg, #fff, #f0f0f0);
   -webkit-background-clip: text;
   background-clip: text;
   -webkit-text-fill-color: transparent;
   text-shadow: none;
 }

 .goals-header p,
 .goals-header-goals p{
   font-size: 1.15rem;
   margin: 0 auto var(--space-xl);
   max-width: 640px;
   opacity: .95;
 }

/* ----------------------------- */
/* Buttons (single system)       */
/* ----------------------------- */
.goals-btn,
.goals-btn-goals{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-sm);
  padding: var(--space-md) var(--space-lg);
  border: none;
  border-radius: var(--radius-lg);
  font-size: .875rem;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
  letter-spacing: .06em;
  text-transform: uppercase;
  position: relative;
  overflow: hidden;
  transition: transform var(--transition-fast), box-shadow var(--transition-fast), background var(--transition-fast);
  backdrop-filter: blur(8px);
}

.goals-btn::before,
.goals-btn-goals::before{
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-110%);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.18), transparent);
  transition: transform var(--transition-slow);
}

.goals-btn:hover::before,
.goals-btn-goals:hover::before{ transform: translateX(110%); }

.goals-btn:active,
.goals-btn-goals:active{ transform: scale(.985); }

.goals-btn-primary,
.goals-btn-primary-goals{
  background: var(--color-primary);
  color: #fff;
  box-shadow: var(--shadow-md);
}
.goals-btn-primary:hover,
.goals-btn-primary-goals:hover{
  background: var(--color-primary-hover);
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg);
}

.goals-btn-info,
.goals-btn-info-goals{
  background: #06b6d4;
  color: #fff;
  box-shadow: var(--shadow-md);
}
.goals-btn-info:hover,
.goals-btn-info-goals:hover{
  background: #0891b2;
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg);
}

.goals-btn-success,
.goals-btn-success-goals{
  background: var(--color-success);
  color: #fff;
  box-shadow: var(--shadow-md);
}
.goals-btn-success:hover,
.goals-btn-success-goals:hover{
  background: var(--color-success-hover);
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg);
}

.goals-btn-dashboard,
.goals-btn-dashboard-goals{
  background: var(--color-success);
  color: #fff;
  box-shadow: var(--shadow-md);
}
.goals-btn-dashboard:hover,
.goals-btn-dashboard-goals:hover{
  background: var(--color-success-hover);
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg);
}

.goals-btn-warning,
.goals-btn-warning-goals{
  background: var(--color-warning);
  color: #fff;
  box-shadow: var(--shadow-md);
}
.goals-btn-warning:hover,
.goals-btn-warning-goals:hover{
  background: var(--color-warning-hover);
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg);
}

.goals-btn-danger,
.goals-btn-danger-goals{
  background: var(--color-danger);
  color: #fff;
  box-shadow: var(--shadow-md);
}
.goals-btn-danger:hover,
.goals-btn-danger-goals:hover{
  background: var(--color-danger-hover);
  transform: translateY(-2px);
  box-shadow: var(--shadow-lg);
}

 /* Mobile - unit stats become 1 column */
 @media (max-width: 720px){
   .unit-section .goals-stats-overview,
   .unit-section .goals-stats-overview-goals{
     grid-template-columns: 1fr !important;
     gap: 12px;
   }
 }

 /* Global stats responsive adjustments */
 @media (max-width: 1200px){
   .goals-stats-overview:not(.unit-section .goals-stats-overview),
   .goals-stats-overview-goals:not(.unit-section .goals-stats-overview-goals){
     grid-template-columns: repeat(2, 1fr);
     gap: 16px;
   }
 }

 @media (max-width: 768px){
   .goals-stats-overview:not(.unit-section .goals-stats-overview),
   .goals-stats-overview-goals:not(.unit-section .goals-stats-overview-goals){
     grid-template-columns: 1fr;
     gap: 14px;
   }
 }

 .goals-stat-card,
 .goals-stat-card-goals{
   --icon-1: #c5a572;
   --icon-2: #9d8359;

   background: rgba(255,255,255,.96);
   border: 1px solid rgba(255,255,255,.16);
   border-radius: 20px;
   padding: 12px 14px;
   display: flex;
   align-items: center;
   gap: 12px;
   box-shadow: var(--shadow-lg);
   position: relative;
   overflow: visible; /* permite tooltip/hover expandir */
   height: auto; /* altura automática */
   min-width: 260px; /* garante espaço mínimo para não esmagar */
   width: 100%;
   transition: all 0.2s ease;
   /* IMPORTANT: no opacity here */
 }

 /* Cards dentro de unidades podem ser um pouco menores */
 .unit-section .goals-stat-card,
 .unit-section .goals-stat-card-goals{
   min-width: 200px; /* menor que o global, mas ainda suficiente */
   padding: 10px 12px;
   gap: 10px;
 }

 .goals-stat-card::before,
 .goals-stat-card-goals::before{
   content:"";
   position:absolute;
   top:0; left:0; right:0;
   height:4px;
   background: var(--gradient-primary);
   transform: scaleX(0);
   transform-origin: left;
   transition: transform var(--transition-base);
 }

 .goals-stat-card:hover,
 .goals-stat-card-goals:hover{
   transform: translateY(-2px);
   box-shadow: var(--shadow-xl);
 }
 .goals-stat-card:hover::before,
 .goals-stat-card-goals:hover::before{ transform: scaleX(1); }

 /* Variants only change icon gradient */
 .goals-stat-card.completed,
 .goals-stat-card-goals.completed{ --icon-1: #10b981; --icon-2: #059669; }
 .goals-stat-card.active,
 .goals-stat-card-goals.active{ --icon-1: #c5a572; --icon-2: #9d8359; }
 .goals-stat-card.progress,
 .goals-stat-card-goals.progress{ --icon-1: #06b6d4; --icon-2: #0891b2; }

 .goals-stat-icon,
 .goals-stat-icon-goals{
   width: 56px;
   height: 56px;
   border-radius: 14px;
   display: grid;
   place-items: center;
   background: linear-gradient(135deg, var(--icon-1), var(--icon-2));
   color: #fff;
   flex: 0 0 auto;
   transition: transform var(--transition-fast);
   box-shadow: 0 6px 12px rgba(0,0,0,.12);
 }

 .goals-stat-card:hover .goals-stat-icon,
 .goals-stat-card-goals:hover .goals-stat-icon-goals{ transform: scale(1.05); }

 .goals-stat-icon i,
 .goals-stat-icon-goals i{ font-size: 1.4rem; color: #fff; }
 
 /* Cards dentro de unidades - ícone menor */
 .unit-section .goals-stat-icon,
 .unit-section .goals-stat-icon-goals{
   width: 48px;
   height: 48px;
   border-radius: 12px;
 }
 
 .unit-section .goals-stat-icon i,
 .unit-section .goals-stat-icon-goals i{ font-size: 1.2rem; }

 .goals-stat-content,
 .goals-stat-content-goals{
   min-width: 0; /* permite ellipsis corretamente */
   flex: 1; /* ocupa espaço disponível */
   display:flex;
   flex-direction:column;
   gap: 2px;
   text-align: left;
 }

 .goals-stat-label,
 .goals-stat-label-goals{
   font-size: .75rem;
   letter-spacing: .06em;
   text-transform: uppercase;
   font-weight: 800;
   color: rgba(15,23,42,.75);
   line-height: 1.1;
   margin: 0;
 }

 .goals-stat-value,
 .goals-stat-value-goals{
   font-size: 1.8rem;
   line-height: 1;
   font-weight: 900;
   color: #0f172a;
   font-family: var(--font-mono);
   margin: 0;
 }

 /* Informações extras ocultas por padrão, mostradas no hover */
 .goals-stat-subtext,
 .goals-stat-subtext-goals,
 .goals-stat-note,
 .goals-stat-note-goals{
   font-size: .75rem;
   color: rgba(15,23,42,.6);
   font-weight: 500;
   margin: 0;
   opacity: 0;
   max-height: 0;
   overflow: hidden;
   transition: opacity 0.2s ease, max-height 0.2s ease, margin 0.2s ease;
   line-height: 1.2;
 }
 
 .goals-stat-note,
 .goals-stat-note-goals{ 
   font-style: italic;
   font-size: .7rem;
 }
 
 /* Mostrar informações extras no hover */
 .goals-stat-card:hover .goals-stat-subtext,
 .goals-stat-card:hover .goals-stat-subtext-goals,
 .goals-stat-card-goals:hover .goals-stat-subtext,
 .goals-stat-card-goals:hover .goals-stat-subtext-goals,
 .goals-stat-card:hover .goals-stat-note,
 .goals-stat-card:hover .goals-stat-note-goals,
 .goals-stat-card-goals:hover .goals-stat-note,
 .goals-stat-card-goals:hover .goals-stat-note-goals{
   opacity: 1;
   max-height: 50px;
   margin-top: 4px;
 }
 
 /* Ajustar gap do content no hover para acomodar informações extras */
 .goals-stat-card:hover .goals-stat-content,
 .goals-stat-card-goals:hover .goals-stat-content-goals{
   gap: 4px;
 }

 /* ----------------------------- */
 /* Cards Grid                    */
 /* ----------------------------- */
 .goals-cards-grid,
 .goals-cards-grid-goals{
   display: grid;
   grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
   gap: var(--space-lg);
   align-items: start;
 }

 .goals-card,
 .goals-card-goals{
   background: rgba(255,255,255,.86);
   backdrop-filter: blur(18px);
   border-radius: var(--radius-xl);
   overflow: hidden;
   box-shadow: var(--shadow-md);
   border: 1px solid rgba(255,255,255,.22);
   transition: transform var(--transition-base), box-shadow var(--transition-base);
   position: relative;
 }

 .goals-card:hover,
 .goals-card-goals:hover{
   transform: translateY(-6px);
   box-shadow: var(--shadow-xl);
 }

 .goals-card-header,
 .goals-card-header-goals{
   padding: var(--space-lg) var(--space-lg) var(--space-md);
   border-bottom: 1px solid rgba(2,8,23,.06);
 }

 .goals-card-title,
 .goals-card-title-goals{
   font-size: 1.15rem;
   font-weight: 800;
   color: var(--color-gray-900);
   margin: var(--space-sm) 0 var(--space-xs);
   line-height: 1.3;
   letter-spacing: -0.02em;
 }

 .goals-card-description,
 .goals-card-description-goals{
   color: var(--color-gray-600);
   font-size: .875rem;
   line-height: 1.5;
   margin: 0;
 }

 .goals-card-content,
 .goals-card-content-goals{
   padding: var(--space-lg);
 }

 /* ----------------------------- */
 /* Badges                        */
 /* ----------------------------- */
 .goals-period-badge,
 .goals-period-badge-goals,
 .goals-status-badge,
 .goals-status-badge-goals{
   display: inline-flex;
   align-items: center;
   gap: .35rem;
   padding: var(--space-xs) var(--space-md);
   border-radius: var(--radius-full);
   font-size: .75rem;
   font-weight: 800;
   text-transform: uppercase;
   letter-spacing: .1em;
   margin-right: var(--space-sm);
   backdrop-filter: blur(10px);
   border: 1px solid transparent;
 }

.goals-period-badge.daily{
  background: var(--color-warning-light);
  color: var(--color-warning-hover);
  border-color: var(--color-warning);
}
.goals-period-badge.weekly{
  background: var(--color-info-light);
  color: var(--color-info-hover);
  border-color: var(--color-info);
}
.goals-period-badge.monthly{
  background: var(--color-primary-light);
  color: var(--color-primary-hover);
  border-color: var(--color-primary);
}
.goals-period-badge.quarterly{
  background: #fce7f3;
  color: #be185d;
  border-color: #f472b6;
}
.goals-period-badge.annual{
  background: var(--color-success-light);
  color: var(--color-success-hover);
  border-color: var(--color-success);
}

.goals-status-badge.active{
  background: var(--color-success-light);
  color: var(--color-success-hover);
  border-color: var(--color-success);
}
.goals-status-badge.completed{
  background: var(--color-info-light);
  color: var(--color-info-hover);
  border-color: var(--color-info);
}
.goals-status-badge.inactive{
  background: var(--color-gray-100);
  color: var(--color-gray-600);
  border-color: var(--color-gray-300);
}

 /* ----------------------------- */
 /* Progress                      */
 /* ----------------------------- */
 .goals-progress-section,
 .goals-progress-section-goals{
   margin-bottom: var(--space-lg);
   padding: var(--space-md);
   background: var(--gradient-glass);
   border-radius: var(--radius-lg);
   backdrop-filter: blur(10px);
   border: 1px solid rgba(255,255,255,.20);
 }

 .goals-progress-header,
 .goals-progress-header-goals{
   display:flex;
   justify-content: space-between;
   align-items: center;
   margin-bottom: var(--space-md);
 }

 .goals-progress-label,
 .goals-progress-label-goals{
   font-size: .85rem;
   font-weight: 800;
   color: var(--color-gray-800);
   text-transform: uppercase;
   letter-spacing: .05em;
 }

 .goals-progress-percentage,
 .goals-progress-percentage-goals{
   font-size: 1.25rem;
   font-weight: 900;
   color: var(--color-primary);
   font-family: var(--font-mono);
 }

 .goals-progress-bar,
 .goals-progress-bar-goals{
   width: 100%;
   height: 14px;
   background: var(--color-gray-200);
   border-radius: var(--radius-full);
   overflow: hidden;
   margin-bottom: var(--space-md);
   box-shadow: inset 0 2px 4px rgba(0,0,0,.08);
 }

 .goals-progress-fill,
 .goals-progress-fill-goals{
   height: 100%;
   background: var(--gradient-primary);
   border-radius: var(--radius-full);
   transition: width var(--transition-base);
 }

 .goals-progress-fill.exceeded,
 .goals-progress-fill-goals.exceeded{ background: var(--gradient-success); }
 /* Metas negativas: cores invertidas */
 /* Abaixo de 100% = BOM (verde) */
 .goals-progress-fill.negative-goal,
 .goals-progress-fill-goals.negative-goal{ background: linear-gradient(90deg, #10b981, #059669); }
 /* Acima de 100% = RUIM (vermelho) */
 .goals-progress-fill.negative-goal.exceeded,
 .goals-progress-fill-goals.negative-goal.exceeded{ background: linear-gradient(90deg, #dc3545, #e74c3c); }
 .goals-progress-percentage.negative-goal,
 .goals-progress-percentage-goals.negative-goal{ color: #10b981 !important; }
 .goals-progress-percentage.negative-goal.exceeded,
 .goals-progress-percentage-goals.negative-goal.exceeded{ color: #dc3545 !important; }

 .goals-values-display,
 .goals-values-display-goals{
   display:flex;
   justify-content: space-between;
   align-items: center;
   font-size: .875rem;
   padding: var(--space-sm) 0;
 }

 .goals-values-display span:first-child,
 .goals-values-display-goals span:first-child{
   font-weight: 800;
   color: var(--color-gray-800);
   font-family: var(--font-mono);
 }

 .goals-values-display span:last-child,
 .goals-values-display-goals span:last-child{
   color: var(--color-gray-600);
   font-weight: 600;
 }

 .goals-progress-text,
 .goals-progress-text-goals{
   text-align:center;
   font-size:.875rem;
   color: var(--color-gray-600);
   font-weight: 600;
   margin-top: var(--space-sm);
   padding: var(--space-xs) var(--space-sm);
   background: var(--color-gray-50);
   border-radius: var(--radius-md);
   border: 1px solid var(--color-gray-200);
 }

 /* ----------------------------- */
 /* Form / Quick add              */
 /* ----------------------------- */
 .goals-progress-update,
 .goals-progress-update-goals{
   margin-bottom: var(--space-xl);
   padding: var(--space-lg);
   background: var(--gradient-glass);
   border-radius: var(--radius-xl);
   border: 1px solid rgba(255,255,255,.20);
   backdrop-filter: blur(10px);
 }

 .goals-input-group,
 .goals-input-group-goals{
   display:flex;
   gap: var(--space-md);
   align-items: flex-start;
 }

 .goals-input-wrapper,
 .goals-input-wrapper-goals{ flex: 1; }

 .goals-input,
 .goals-input-goals{
   width: 100%;
   padding: var(--space-md) var(--space-lg);
   border: 2px solid var(--color-gray-200);
   border-radius: var(--radius-lg);
   font-size: 1rem;
   transition: border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
   margin-bottom: var(--space-sm);
   background: rgba(255,255,255,.90);
   backdrop-filter: blur(10px);
   font-family: var(--font-mono);
 }

 .goals-input:focus,
 .goals-input-goals:focus{
   outline: none;
   border-color: var(--color-primary);
   box-shadow: 0 0 0 4px rgba(99,102,241,.12);
   transform: scale(1.01);
 }

 .goals-quick-add,
 .goals-quick-add-goals{
   display:flex;
   gap: var(--space-sm);
   flex-wrap: wrap;
 }

 .goals-btn-quick-add,
 .goals-btn-quick-add-goals{
   padding: var(--space-sm) var(--space-md);
   background: var(--color-gray-100);
   color: var(--color-gray-700);
   border: 1px solid var(--color-gray-200);
   border-radius: var(--radius-md);
   font-size: .75rem;
   font-weight: 800;
   cursor: pointer;
   transition: transform var(--transition-fast), background var(--transition-fast), color var(--transition-fast), box-shadow var(--transition-fast);
   text-transform: uppercase;
   letter-spacing: .05em;
 }

 .goals-btn-quick-add:hover,
 .goals-btn-quick-add-goals:hover{
   background: var(--color-primary);
   color: #fff;
   border-color: var(--color-primary);
   transform: translateY(-2px);
   box-shadow: var(--shadow-md);
 }

 /* ----------------------------- */
 /* Messages                      */
 /* ----------------------------- */
 .goals-message-container,
 .goals-message-container-goals{ margin-top: var(--space-md); min-height: 24px; }

 .goals-message,
 .goals-message-goals{
   padding: var(--space-md) var(--space-lg);
   border-radius: var(--radius-lg);
   font-size: .875rem;
   font-weight: 800;
   display:flex;
   align-items:center;
   gap: var(--space-sm);
   backdrop-filter: blur(10px);
   animation: goals-slide-in .25s ease-out;
 }

 @keyframes goals-slide-in{
   from{ opacity: 0; transform: translateY(-10px); }
   to{ opacity: 1; transform: translateY(0); }
 }

 .goals-message::before,
 .goals-message-goals::before{ content: "✓"; font-weight: 900; }
 .goals-message.success,
 .goals-message-goals.success{
   background: var(--color-success-light);
   color: var(--color-success-hover);
   border: 1px solid var(--color-success);
 }
 .goals-message.error::before,
 .goals-message-goals.error::before{ content: "✗"; }
 .goals-message.error,
 .goals-message-goals.error{
   background: var(--color-danger-light);
   color: var(--color-danger-hover);
   border: 1px solid var(--color-danger);
 }

/* ----------------------------- */
/* Motion Preferences            */
/* ----------------------------- */
@media (prefers-reduced-motion: reduce){
  *{
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .goals-card:hover,
  .goals-stat-card:hover,
  .goals-btn:hover,
  .goals-btn-goals:hover{ transform: none; }
}

/* ----------------------------- */
/* Responsive                    */
/* ----------------------------- */
@media (max-width: 1024px){
  .goals-container{ padding: var(--space-md); }
  .goals-cards-grid{ grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--space-md); }
}

@media (max-width: 768px){
  .goals-header{ padding: var(--space-xl); }
  .goals-header h1{ font-size: 2rem; }

  .goals-header-actions{ flex-direction: column; align-items: center; gap: var(--space-md); }
  .goals-header-actions .goals-btn,
  .goals-header-actions .goals-btn-goals{ width: 100%; max-width: 280px; }

  .goals-input-group{ flex-direction: column; }
}

@media (max-width: 480px){
  .goals-stat-card{ padding: var(--space-md); gap: var(--space-md); }
  .goals-stat-icon{ width: 48px; height: 48px; border-radius: 14px; }
  .goals-stat-value{ font-size: 2rem; }
  .goals-card-content{ padding: var(--space-md); }
}

/* ----------------------------- */
/* Print                         */
/* ----------------------------- */
@media print{
  .goals-container{ background: #fff; }
  .goals-header{ background: #fff; color: #000; box-shadow: none; }
  .goals-btn, .goals-btn-goals{ display: none; }
  .goals-card{ background:#fff; box-shadow:none; border: 1px solid #000; break-inside: avoid; }
}

/* ----------------------------- */
/* Utilities                     */
/* ----------------------------- */
.goals-hidden{ display:none; }
.goals-text-center{ text-align:center; }
.goals-text-left{ text-align:left; }
.goals-text-right{ text-align:right; }
.goals-sr-only{
  position:absolute;
  width:1px; height:1px;
  padding:0; margin:-1px;
  overflow:hidden;
  clip: rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

/* Optional: scrollbar */
.goals-container::-webkit-scrollbar{ width: 8px; }
.goals-container::-webkit-scrollbar-track{ background: var(--color-gray-100); border-radius: var(--radius-full); }
.goals-container::-webkit-scrollbar-thumb{ background: var(--gradient-primary); border-radius: var(--radius-full); }
.goals-container::-webkit-scrollbar-thumb:hover{ background: var(--color-primary-hover); }

/* Floating Action Button (kept) */
.goals-fab{
  position: fixed;
  bottom: var(--space-xl);
  right: var(--space-xl);
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: var(--gradient-primary);
  color: #fff;
  border: none;
  box-shadow: var(--shadow-lg);
  cursor: pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 1.5rem;
  transition: transform var(--transition-fast), box-shadow var(--transition-fast);
  z-index: var(--z-fixed);
}

.goals-fab:hover{ transform: scale(1.06); box-shadow: var(--shadow-xl); }
.goals-fab:active{ transform: scale(.98); }