/* Dynamically generated theme CSS */
:root {
  --color-primary: #00539F;
  --color-primary-rgb: 0, 83, 159;
  --color-primary-content: #ffffff;
  --color-primary-text: #00539F;
  --color-secondary: #FFD200;
  --color-secondary-rgb: 255, 210, 0;
  --color-secondary-content: #000000;
  --color-secondary-text: #FFD200;
  --color-secondary-text-access: #8c7300;
  --color-accent: #00539f;
  --color-accent-rgb: 0, 83, 159;
  --color-accent-content: #ffffff;
  --color-accent-text: #00539f;
  --color-warning: #f59e0b;
  --color-warning-rgb: 245, 158, 11;
  --color-warning-content: #000000;
  --color-warning-text: #f59e0b;
  --color-deck-accent: #00539f;
  --color-flashcard-front-start: #ffffff;
  --color-flashcard-front-end: #f8fafc;
  --color-flashcard-front-content: #000000;
  --color-flashcard-back-start: #f9fafb;
  --color-flashcard-back-end: #e5e7eb;
  --color-flashcard-back-content: #000000;
  --color-nav-bg: #00539F;
  --color-nav-start: #00539F;
  --color-nav-end: #00539F;
  --color-nav-text: #ffffff;
  --color-nav-active-bg: #FFD200;
  --color-nav-active-text: #000000;
  --color-nav-secondary: #FFD200;
  --color-nav-secondary-text: #000000;
  --nav-padding: 0.5rem;
  --radius-button: 0rem;
  --radius-card: 0.75rem;
  --button-text-transform: uppercase;
  --padding-button: 0.75rem 1rem;
  --padding-button-sm: 0.5rem 0.75rem;
  --padding-button-lg: 1rem 1.5rem;
  --color-tag-1: #1976D2;
  --color-tag-1-text: #ffffff;
  --color-tag-2: #388E3C;
  --color-tag-2-text: #000000;
  --color-tag-3: #7B1FA2;
  --color-tag-3-text: #ffffff;
  --color-tag-4: #D32F2F;
  --color-tag-4-text: #ffffff;
  --color-tag-5: #F57C00;
  --color-tag-5-text: #000000;
  --color-danger: #ef4444;
  --color-danger-content: #ffffff;
  --color-warning: #f59e0b;
  --color-success: #10b981;
  --color-success-content: #ffffff;
  --color-info: #3b82f6;
}

/* Button base styles */
.btn {
  border-radius: 0rem;
  padding: 0.75rem 1rem;
  transition: all 0.2s;
  cursor: pointer;
  font-weight: 500;
  text-transform: var(--button-text-transform);
  border-width: 2px;
  border-style: solid;
}

/* Size variants */
.btn.btn-sm {
  padding: var(--padding-button-sm);
  font-size: 0.875rem;
}
.btn.btn-lg {
  padding: var(--padding-button-lg);
  font-size: 1.125rem;
}

/* Button styles - Outlined mode */

/* Primary buttons */
.btn-primary:not(.btn-alternate) {
  background-color: transparent;
  color: #00539F;
  border-color: #00539F;
}
.btn-primary:not(.btn-alternate):hover {
  background-color: #00539F;
  color: #ffffff;
}
.btn-primary.btn-alternate {
  background-color: #00539F;
  color: #ffffff;
  border-color: #00539F;
}
.btn-primary.btn-alternate:hover {
  opacity: 0.8;
}

/* Secondary buttons */
.btn-secondary:not(.btn-alternate) {
  background-color: transparent;
  color: #8c7300;
  border-color: #8c7300;
}
.btn-secondary:not(.btn-alternate):hover {
  background-color: #FFD200;
  color: #000000;
}
.btn-secondary.btn-alternate {
  background-color: #FFD200;
  color: #000000;
  border-color: #FFD200;
}
.btn-secondary.btn-alternate:hover {
  opacity: 0.8;
}

/* Accent buttons */
.btn-accent:not(.btn-alternate) {
  background-color: transparent;
  color: #00539f;
  border-color: #00539f;
}
.btn-accent:not(.btn-alternate):hover {
  background-color: #00539f;
  color: #ffffff;
}
.btn-accent.btn-alternate {
  background-color: #00539f;
  color: #ffffff;
  border-color: #00539f;
}
.btn-accent.btn-alternate:hover {
  opacity: 0.8;
}

/* Warning buttons */
.btn-warning:not(.btn-alternate) {
  background-color: transparent;
  color: #9f6607;
  border-color: #9f6607;
}
.btn-warning:not(.btn-alternate):hover {
  background-color: #f59e0b;
  color: #000000;
}
.btn-warning.btn-alternate {
  background-color: #f59e0b;
  color: #000000;
  border-color: #f59e0b;
}
.btn-warning.btn-alternate:hover {
  opacity: 0.8;
}

/* Danger buttons */
.btn-danger:not(.btn-alternate) {
  background-color: transparent;
  color: var(--color-danger);
  border-color: var(--color-danger);
}
.btn-danger:not(.btn-alternate):hover {
  background-color: var(--color-danger);
  color: var(--color-danger-content);
}
.btn-danger.btn-alternate {
  background-color: var(--color-danger);
  color: var(--color-danger-content);
  border-color: var(--color-danger);
}
.btn-danger.btn-alternate:hover {
  opacity: 0.8;
}

/* Success buttons */
.btn-success:not(.btn-alternate) {
  background-color: transparent;
  color: var(--color-success);
  border-color: var(--color-success);
}
.btn-success:not(.btn-alternate):hover {
  background-color: var(--color-success);
  color: var(--color-success-content);
}
.btn-success.btn-alternate {
  background-color: var(--color-success);
  color: var(--color-success-content);
  border-color: var(--color-success);
}
.btn-success.btn-alternate:hover {
  opacity: 0.8;
}

/* White buttons */
.btn-white:not(.btn-alternate) {
  background-color: transparent;
  color: white;
  border-color: white;
}
.btn-white:not(.btn-alternate):hover {
  background-color: white;
  color: #00539F;
}
.btn-white.btn-alternate {
  background-color: white;
  color: #00539F;
  border-color: white;
}
.btn-white.btn-alternate:hover {
  background-color: #f9fafb;
  color: #00539F;
  border-color: #f9fafb;
}

/* Navigation styles - supports both gradient and solid */
.nav-gradient {
  background: #00539F;
  padding: 0.5rem 1rem;
  color: #ffffff;
}

/* Legacy gradient support */
.bg-flashcard-gradient {
  background: linear-gradient(135deg, #00539F 0%, #00539F 100%);
  padding: 0.5rem 1rem;
  color: #ffffff;
}

/* Navigation secondary color */
.text-ud-yellow {
  color: #FFD200;
}
.bg-ud-yellow {
  background-color: #FFD200;
  color: #000000;
}
.hover\:bg-yellow-400:hover {
  background-color: #FFD200;
  color: #000000;
  opacity: 0.8;
}

/* Override flashcard gradients */
.flashcard-front {
  background: var(--flashcard-gradient-front);
  color: var(--color-flashcard-front-content);
}

.flashcard-back {
  background: var(--flashcard-gradient-back);
  color: var(--color-flashcard-back-content);
}

.deck-builder-card {
  background: var(--flashcard-gradient-front);
}

.flashcard-front-study {
  background: var(--flashcard-gradient-front);
}

.flashcard-back-study {
  background: var(--flashcard-gradient-back);
}

/* Card radius overrides */
.flashcard-face, .deck-card {
  border-radius: 0.75rem;
}

/* CSS variable gradients */
:root {
  --flashcard-gradient-front: linear-gradient(135deg, var(--color-flashcard-front-start) 0%, var(--color-flashcard-front-end) 100%);
  --flashcard-gradient-back: linear-gradient(135deg, var(--color-flashcard-back-start) 0%, var(--color-flashcard-back-end) 100%);
}