/* ================================================
   Heritage Paws Color System for Breeders Online
   Professional, Warm, Trustworthy
   ================================================ */

:root {
  /* Primary Brand Colors */
  --heritage-primary: #2C5530;        /* Heritage Green - Main brand color */
  --heritage-primary-dark: #1F3D22;   /* Darker shade for hover states */
  --heritage-primary-light: #3A6B3F;  /* Lighter shade for accents */
  
  /* Secondary Colors */
  --heritage-secondary: #7A9B76;      /* Warm Sage - Softer companion color */
  --heritage-secondary-dark: #5F7A5C; /* Darker shade */
  --heritage-secondary-light: #95B691;/* Lighter shade */
  
  /* Neutral Colors */
  --heritage-dark: #1A1F2E;           /* Charcoal - Primary text */
  --heritage-grey: #6B7280;           /* Warm Grey - Secondary text */
  --heritage-grey-light: #9CA3AF;     /* Light grey for borders */
  --heritage-light: #F6F5F2;          /* Soft Stone - Background */
  --heritage-white: #FFFFFF;          /* Pure White - Cards */
  
  /* Accent Colors */
  --heritage-amber: #C19A6B;          /* Camel - Softer Premium/Special */
  --heritage-amber-light: #D4B896;    /* Lighter camel */
  --heritage-blue: #1E5F8E;           /* Trust Blue - Links/Info */
  --heritage-blue-light: #2B7AB8;     /* Lighter blue */
  --heritage-success: #059669;        /* Success Meadow - Confirmations */
  --heritage-danger: #DC2626;         /* Alert Rose - Warnings/Errors */
  
  /* Gradients (Minimal Use) */
  --heritage-gradient: linear-gradient(135deg, var(--heritage-primary) 0%, var(--heritage-secondary) 100%);
  --heritage-gradient-subtle: linear-gradient(15deg, var(--heritage-primary) 0%, var(--heritage-primary-light) 100%);
  
  /* Shadows */
  --heritage-shadow-sm: 0 1px 2px 0 rgba(26, 31, 46, 0.05);
  --heritage-shadow: 0 4px 6px -1px rgba(26, 31, 46, 0.1);
  --heritage-shadow-lg: 0 10px 15px -3px rgba(26, 31, 46, 0.1);
  --heritage-shadow-xl: 0 20px 25px -5px rgba(26, 31, 46, 0.1);
  
  /* Button Shadows */
  --heritage-btn-shadow: 0 2px 4px rgba(44, 85, 48, 0.15);
  --heritage-btn-shadow-hover: 0 4px 12px rgba(44, 85, 48, 0.25);
  
  /* Border Radius */
  --heritage-radius-sm: 4px;
  --heritage-radius: 8px;
  --heritage-radius-lg: 12px;
  --heritage-radius-xl: 20px;
  --heritage-radius-full: 9999px;
}

/* ================================================
   Global Overrides
   ================================================ */

/* Body and Base Typography */
body {
  color: var(--heritage-dark);
  background-color: var(--heritage-white);
}

/* Headings */
h1, h2, h3, h4, h5, h6 {
  color: var(--heritage-dark);
}

/* Paragraphs and Secondary Text - removed !important to allow context-specific overrides */
p {
  color: var(--heritage-grey);
}

.text-muted {
  color: var(--heritage-grey) !important;
}

/* Links */
a {
  color: var(--heritage-blue);
  transition: color 0.3s ease;
}

a:hover {
  color: var(--heritage-blue-light);
}

/* ================================================
   Button Styles
   ================================================ */

/* Primary Button */
.btn-primary {
  background-color: var(--heritage-primary) !important;
  border-color: var(--heritage-primary) !important;
  color: var(--heritage-white) !important;
  font-weight: 500;
  transition: all 0.3s ease;
  box-shadow: var(--heritage-btn-shadow);
  background-image: none !important;
}

.btn-primary:hover {
  background-color: var(--heritage-primary-dark, #1F3D22) !important;
  border-color: var(--heritage-primary-dark, #1F3D22) !important;
  color: white !important;
  transform: translateY(-2px);
  box-shadow: var(--heritage-btn-shadow-hover);
}

.btn-primary:active,
.btn-primary:focus {
  background-color: var(--heritage-primary-dark) !important;
  border-color: var(--heritage-primary-dark) !important;
  box-shadow: inset 0 2px 4px rgba(0,0,0,0.1);
}

/* Outline Primary Button */
.btn-outline-primary {
  color: var(--heritage-primary) !important;
  border-color: var(--heritage-primary) !important;
  border-width: 2px;
  background-color: transparent !important;
  transition: all 0.3s ease;
}

.btn-outline-primary:hover {
  background-color: var(--heritage-primary) !important;
  border-color: var(--heritage-primary) !important;
  color: var(--heritage-white) !important;
  transform: translateY(-2px);
  box-shadow: var(--heritage-btn-shadow-hover);
}

/* Secondary Button */
.btn-secondary {
  background-color: var(--heritage-secondary) !important;
  border-color: var(--heritage-secondary) !important;
  color: var(--heritage-white) !important;
  transition: all 0.3s ease;
}

.btn-secondary:hover {
  background-color: var(--heritage-secondary-dark) !important;
  border-color: var(--heritage-secondary-dark) !important;
  transform: translateY(-2px);
  box-shadow: var(--heritage-btn-shadow-hover);
}

/* Success Button - Using Amber for premium/important actions */
.btn-success {
  background-color: var(--heritage-amber) !important;
  border-color: var(--heritage-amber) !important;
  color: white !important;
  transition: all 0.3s ease;
}

.btn-success:hover {
  background-color: var(--heritage-amber-light) !important;
  border-color: var(--heritage-amber-light) !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(217, 119, 6, 0.25);
}

/* Danger Button */
.btn-danger {
  background-color: var(--heritage-danger) !important;
  border-color: var(--heritage-danger) !important;
  transition: all 0.3s ease;
}

.btn-danger:hover {
  background-color: #B91C1C !important;
  border-color: #B91C1C !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(220, 38, 38, 0.25);
}

/* Info Button (using Trust Blue) */
.btn-info {
  background-color: var(--heritage-blue) !important;
  border-color: var(--heritage-blue) !important;
  color: var(--heritage-white) !important;
  transition: all 0.3s ease;
}

.btn-info:hover {
  background-color: var(--heritage-blue-light) !important;
  border-color: var(--heritage-blue-light) !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(30, 95, 142, 0.25);
}

/* Warning Button (using Amber) */
.btn-warning {
  background-color: var(--heritage-amber) !important;
  border-color: var(--heritage-amber) !important;
  color: var(--heritage-white) !important;
  transition: all 0.3s ease;
}

.btn-warning:hover {
  background-color: var(--heritage-amber-light) !important;
  border-color: var(--heritage-amber-light) !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(217, 119, 6, 0.25);
}

/* Large Buttons */
.btn-lg {
  border-radius: var(--heritage-radius-xl);
  padding: 0.75rem 2rem;
}

/* Small Buttons */
.btn-sm {
  border-radius: var(--heritage-radius-sm);
  padding: 0.25rem 1rem;
}

/* ================================================
   Card Styles
   ================================================ */

.card {
  background-color: var(--heritage-white);
  border: 1px solid rgba(107, 114, 128, 0.1);
  border-radius: var(--heritage-radius-lg);
  box-shadow: var(--heritage-shadow);
  transition: all 0.3s ease;
}

.card:hover {
  box-shadow: var(--heritage-shadow-xl);
  transform: translateY(-4px);
}

.card-header {
  background-color: var(--heritage-light);
  border-bottom: 1px solid rgba(107, 114, 128, 0.1);
  color: var(--heritage-dark);
}

/* ================================================
   Form Styles
   ================================================ */

.form-control,
.form-select {
  border-color: var(--heritage-grey-light);
  color: var(--heritage-dark);
  border-radius: var(--heritage-radius);
  transition: all 0.3s ease;
}

.form-control:focus,
.form-select:focus {
  border-color: var(--heritage-primary);
  box-shadow: 0 0 0 0.2rem rgba(44, 85, 48, 0.15);
}

.form-label {
  color: var(--heritage-dark);
  font-weight: 500;
}

/* ================================================
   Background Utilities
   ================================================ */

.bg-primary {
  background-color: var(--heritage-primary) !important;
}

.bg-secondary {
  background-color: var(--heritage-secondary) !important;
}

.bg-success {
  background-color: var(--heritage-success) !important;
}

.bg-danger {
  background-color: var(--heritage-danger) !important;
}

.bg-warning {
  background-color: var(--heritage-amber) !important;
}

.bg-info {
  background-color: var(--heritage-blue) !important;
}

.bg-light {
  background-color: var(--heritage-light) !important;
}

.bg-dark {
  background-color: var(--heritage-dark) !important;
}

/* Background with gradient for hero sections */
.bg-gradient-primary {
  background: var(--heritage-gradient-subtle) !important;
}

/* ================================================
   Text Color Utilities
   ================================================ */

.text-primary {
  color: var(--heritage-primary) !important;
}

.text-secondary {
  color: var(--heritage-grey) !important;
}

/* Bootstrap text utilities - preserve these */
.text-white {
  color: #fff !important;
}

.text-dark {
  color: var(--heritage-dark) !important;
}

.text-success {
  color: var(--heritage-success) !important;
}

.text-danger {
  color: var(--heritage-danger) !important;
}

.text-warning {
  color: var(--heritage-amber) !important;
}

.text-info {
  color: var(--heritage-blue) !important;
}

/* ================================================
   Border Utilities
   ================================================ */

.border-primary {
  border-color: var(--heritage-primary) !important;
}

.border-secondary {
  border-color: var(--heritage-secondary) !important;
}

/* ================================================
   Badge Styles
   ================================================ */

.badge.bg-primary {
  background-color: var(--heritage-primary) !important;
}

.badge.bg-secondary {
  background-color: var(--heritage-secondary) !important;
}

.badge.bg-success {
  background-color: var(--heritage-amber) !important;
  color: white !important;
}

.bg-success {
  background-color: var(--heritage-amber) !important;
}

.badge.bg-danger {
  background-color: var(--heritage-danger) !important;
}

.badge.bg-warning {
  background-color: var(--heritage-amber) !important;
  color: var(--heritage-white) !important;
}

.badge.bg-info {
  background-color: var(--heritage-blue) !important;
}

/* ================================================
   Alert Styles
   ================================================ */

.alert-primary {
  background-color: rgba(44, 85, 48, 0.1);
  border-color: var(--heritage-primary);
  color: var(--heritage-primary-dark);
}

.alert-success {
  background-color: rgba(5, 150, 105, 0.1);
  border-color: var(--heritage-success);
  color: #047857;
}

.alert-danger {
  background-color: rgba(220, 38, 38, 0.1);
  border-color: var(--heritage-danger);
  color: #B91C1C;
}

.alert-warning {
  background-color: rgba(217, 119, 6, 0.1);
  border-color: var(--heritage-amber);
  color: #B45309;
}

.alert-info {
  background-color: rgba(30, 95, 142, 0.1);
  border-color: var(--heritage-blue);
  color: #164E73;
}

/* ================================================
   Progress Bar
   ================================================ */

.progress-bar {
  background-color: var(--heritage-primary);
}

.progress-bar.bg-success {
  background-color: var(--heritage-success) !important;
}

.progress-bar.bg-warning {
  background-color: var(--heritage-amber) !important;
}

.progress-bar.bg-danger {
  background-color: var(--heritage-danger) !important;
}

/* ================================================
   Pagination
   ================================================ */

.pagination .page-link {
  color: var(--heritage-primary);
  border-color: var(--heritage-grey-light);
  transition: all 0.3s ease;
}

.pagination .page-link:hover {
  background-color: var(--heritage-light);
  border-color: var(--heritage-primary);
  color: var(--heritage-primary-dark);
}

.pagination .page-item.active .page-link {
  background-color: var(--heritage-primary);
  border-color: var(--heritage-primary);
  color: var(--heritage-white);
}

/* ================================================
   Dropdown Menu
   ================================================ */

.dropdown-menu {
  border: 1px solid rgba(107, 114, 128, 0.1);
  box-shadow: var(--heritage-shadow-lg);
  border-radius: var(--heritage-radius);
}

.dropdown-item {
  color: var(--heritage-dark);
  transition: all 0.2s ease;
}

.dropdown-item:hover {
  background-color: var(--heritage-light);
  color: var(--heritage-primary);
}

.dropdown-item.active,
.dropdown-item:active {
  background-color: var(--heritage-primary);
  color: var(--heritage-white);
}

/* ================================================
   Modal Styles
   ================================================ */

.modal-content {
  border: none;
  border-radius: var(--heritage-radius-lg);
  box-shadow: var(--heritage-shadow-xl);
}

.modal-header {
  background-color: var(--heritage-light);
  border-bottom: 1px solid rgba(107, 114, 128, 0.1);
  border-radius: var(--heritage-radius-lg) var(--heritage-radius-lg) 0 0;
}

.modal-footer {
  background-color: var(--heritage-light);
  border-top: 1px solid rgba(107, 114, 128, 0.1);
  border-radius: 0 0 var(--heritage-radius-lg) var(--heritage-radius-lg);
}

/* ================================================
   Table Styles
   ================================================ */

.table {
  color: var(--heritage-dark);
}

.table thead th {
  background-color: var(--heritage-light);
  color: var(--heritage-dark);
  font-weight: 600;
  border-color: rgba(107, 114, 128, 0.1);
}

.table-striped tbody tr:nth-of-type(odd) {
  background-color: rgba(246, 245, 242, 0.5);
}

.table-hover tbody tr:hover {
  background-color: var(--heritage-light);
}

/* ================================================
   Text Overlay Fixes - Ensure readability
   ================================================ */

/* Keep white text on image overlays */
.card-cover .text-white,
.text-bg-dark .text-white,
.card-cover h1,
.card-cover h2,
.card-cover h3,
.card-cover h4,
.card-cover h5,
.card-cover h6,
.card-cover p,
.card-cover small,
.card-cover span {
  color: white !important;
}

/* Ensure text shadow for better readability */
.text-shadow-1 {
  text-shadow: 0 .125rem .25rem rgba(0, 0, 0, .8) !important;
}

/* Keep white text on colored backgrounds */
.bg-primary *:not(.btn),
.bg-success *:not(.btn),
.bg-danger *:not(.btn),
.bg-warning *:not(.btn),
.bg-info *:not(.btn),
.bg-dark *:not(.btn),
.alert-membership *:not(.btn),
.preview-alert *:not(.btn),
.membership-status *,
.price-tag *,
.stats-card *,
.profile-card .card-header *,
.modern-card .card-header *,
.section-header *,
.search-header .container *,
.subscribe-hero *,
.subscription-card .card-header *,
.section-card .card-header *,
.section-card .card-header h1,
.section-card .card-header h2,
.section-card .card-header h3,
.section-card .card-header h4,
.section-card .card-header h5,
.section-card .card-header h6,
.section-card .card-header i,
.section-card .card-header span,
.section-card .card-header p {
  color: white !important;
}

/* Preview alert specific - ensure white text */
.preview-alert,
.preview-alert h5,
.preview-alert ul,
.preview-alert li {
  color: white !important;
}

/* ================================================
   Custom Scrollbar
   ================================================ */

::-webkit-scrollbar {
  width: 12px;
  height: 12px;
}

::-webkit-scrollbar-track {
  background: var(--heritage-light);
}

::-webkit-scrollbar-thumb {
  background: var(--heritage-secondary);
  border-radius: var(--heritage-radius);
}

::-webkit-scrollbar-thumb:hover {
  background: var(--heritage-secondary-dark);
}