/**
 * TIRI Airdrop & Rewards - Core CSS
 * Version: 3.1.0
 * Last Updated: 2025-04-28
 * 
 * This file contains core variables and base styles used across
 * both admin and public-facing components of the plugin.
 */

:root {
    /* Brand Colors */
    --tiri-primary-color: #10B981;
    --tiri-primary-color-dark: #059669;
    --tiri-primary-color-light: #6EE7B7;
    
    --tiri-secondary-color: #34D399;
    --tiri-secondary-color-dark: #10B981;
    --tiri-secondary-color-light: #A7F3D0;
    
    --tiri-accent-color: #F59E0B;
    --tiri-accent-color-dark: #D97706;
    --tiri-accent-color-light: #FCD34D;
    
    /* UI Colors */
    --tiri-success-color: #10B981;
    --tiri-warning-color: #F59E0B;
    --tiri-error-color: #EF4444;
    --tiri-info-color: #3B82F6;
    --tiri-danger-color: #EF4444;
    
    /* Neutral Colors */
    --tiri-text-color: #333333;
    --tiri-text-muted: #666666;
    --tiri-border-color: #e5e5e5;
    --tiri-background-color: #ffffff;
    --tiri-card-bg-color: #ffffff;
    --tiri-header-bg-color: #f5f5f5;
    
    /* Typography */
    --tiri-font-family: "Barlow Condensed", sans-serif;
    --tiri-heading-weight: 600;
    --tiri-body-size: 15px;
    
    /* Layout */
    --tiri-border-radius: 8px;
    --tiri-button-radius: 4px;
    --tiri-card-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    --tiri-content-width: 1200px;
    --tiri-spacing-sm: 8px;
    --tiri-spacing-md: 16px;
    --tiri-spacing-lg: 24px;
    --tiri-spacing-xl: 32px;
    
    /* Animation */
    --tiri-transition-fast: 0.2s ease;
    --tiri-transition-normal: 0.3s ease;
    --tiri-transition-slow: 0.5s ease;
}

/* Dark Mode Variables */
body.tiri-dark-mode {
    --tiri-text-color: #f0f0f0;
    --tiri-text-muted: #bbbbbb;
    --tiri-border-color: #444444;
    --tiri-background-color: #1e1e1e;
    --tiri-card-bg-color: #2d2d2d;
    --tiri-header-bg-color: #333333;
    --tiri-card-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* Base Typography */
.tiri-container {
    font-family: var(--tiri-font-family);
    font-size: var(--tiri-body-size);
    color: var(--tiri-text-color);
    line-height: 1.5;
}

.tiri-container h1, 
.tiri-container h2, 
.tiri-container h3, 
.tiri-container h4, 
.tiri-container h5, 
.tiri-container h6 {
    color: var(--tiri-text-color);
    font-weight: var(--tiri-heading-weight);
    margin-top: 0;
    line-height: 1.2;
}

.tiri-container a {
    color: var(--tiri-primary-color);
    text-decoration: none;
    transition: color var(--tiri-transition-fast);
}

.tiri-container a:hover {
    color: var(--tiri-primary-color-dark);
}

/* Utility Classes */
.tiri-text-primary { color: var(--tiri-primary-color); }
.tiri-text-secondary { color: var(--tiri-secondary-color); }
.tiri-text-accent { color: var(--tiri-accent-color); }
.tiri-text-success { color: var(--tiri-success-color); }
.tiri-text-warning { color: var(--tiri-warning-color); }
.tiri-text-error { color: var(--tiri-error-color); }
.tiri-text-info { color: var(--tiri-info-color); }
.tiri-text-muted { color: var(--tiri-text-muted); }

.tiri-bg-primary { background-color: var(--tiri-primary-color); }
.tiri-bg-secondary { background-color: var(--tiri-secondary-color); }
.tiri-bg-accent { background-color: var(--tiri-accent-color); }
.tiri-bg-light { background-color: var(--tiri-background-color); }
.tiri-bg-card { background-color: var(--tiri-card-bg-color); }

.tiri-rounded { border-radius: var(--tiri-border-radius); }
.tiri-shadow { box-shadow: var(--tiri-card-shadow); }

.tiri-m-0 { margin: 0; }
.tiri-mt-sm { margin-top: var(--tiri-spacing-sm); }
.tiri-mt-md { margin-top: var(--tiri-spacing-md); }
.tiri-mt-lg { margin-top: var(--tiri-spacing-lg); }
.tiri-mb-sm { margin-bottom: var(--tiri-spacing-sm); }
.tiri-mb-md { margin-bottom: var(--tiri-spacing-md); }
.tiri-mb-lg { margin-bottom: var(--tiri-spacing-lg); }

.tiri-p-sm { padding: var(--tiri-spacing-sm); }
.tiri-p-md { padding: var(--tiri-spacing-md); }
.tiri-p-lg { padding: var(--tiri-spacing-lg); }

.tiri-flex { display: flex; }
.tiri-flex-col { flex-direction: column; }
.tiri-items-center { align-items: center; }
.tiri-justify-between { justify-content: space-between; }
.tiri-flex-wrap { flex-wrap: wrap; }
.tiri-flex-grow { flex-grow: 1; }

.tiri-grid { display: grid; }
.tiri-gap-sm { gap: var(--tiri-spacing-sm); }
.tiri-gap-md { gap: var(--tiri-spacing-md); }
.tiri-gap-lg { gap: var(--tiri-spacing-lg); }

/* Responsive Utilities */
@media (max-width: 768px) {
    .tiri-hidden-mobile { display: none !important; }
    .tiri-flex-col-mobile { flex-direction: column !important; }
    .tiri-text-center-mobile { text-align: center !important; }
}

/* Animation Classes */
@keyframes tiri-fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes tiri-slide-up {
    from { transform: translateY(20px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

@keyframes tiri-spin {
    to { transform: rotate(360deg); }
}

.tiri-animate-fade-in { animation: tiri-fade-in var(--tiri-transition-normal); }
.tiri-animate-slide-up { animation: tiri-slide-up var(--tiri-transition-normal); }
.tiri-animate-spin { animation: tiri-spin 1s linear infinite; }

/* RTL Support */
[dir="rtl"] .tiri-container {
    text-align: right;
}

/* Accessibility */
.tiri-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border-width: 0;
}

/* Focus Styles for Accessibility */
.tiri-container a:focus,
.tiri-container button:focus,
.tiri-container [tabindex]:focus {
    outline: 2px solid var(--tiri-primary-color);
    outline-offset: 2px;
}
