/**
 * Agro-Connect Main Stylesheet
 * --------------------------------------------------------------------------
 * CSS Custom Properties, Bootstrap Overrides, and Component Styles.
 */

:root {
    /* Brand Colors */
    --primary-green: #2D6A4F;
    --secondary-green: #52B788;
    --light-green: #D8F3DC;
    --accent-gold: #F4A261;
    --accent-red: #E76F51;
    
    /* UI Colors */
    --text-dark: #1B2332;
    --text-muted: #6B7280;
    --border-light: #E5E7EB;
    --bg-light: #F7F8FA;
    
    /* Shadows & Radii */
    --shadow-card: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --shadow-hover: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --radius-md: 0.5rem;
    --radius-lg: 1rem;
}

body {
    font-family: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
    color: var(--text-dark);
    background-color: var(--bg-light);
}

/* --------------------------------------------------------------------------
   Bootstrap Overrides 
-------------------------------------------------------------------------- */
.text-primary { color: var(--primary-green) !important; }
.bg-primary { background-color: var(--primary-green) !important; }
.btn-primary {
    background-color: var(--primary-green);
    border-color: var(--primary-green);
    color: #fff;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    background-color: #1e4b38 !important;
    border-color: #1e4b38 !important;
    box-shadow: 0 0 0 0.25rem rgba(45, 106, 79, 0.25) !important;
}

.text-warning { color: var(--accent-gold) !important; }
.bg-warning { background-color: var(--accent-gold) !important; }
.btn-warning {
    background-color: var(--accent-gold);
    border-color: var(--accent-gold);
    color: #fff;
}

.form-control:focus, .form-select:focus {
    border-color: var(--secondary-green);
    box-shadow: 0 0 0 0.25rem rgba(82, 183, 136, 0.25);
}

.card { border-radius: var(--radius-md); }

/* --------------------------------------------------------------------------
   Components
-------------------------------------------------------------------------- */

/* Utilities */
.transition-all { transition: all 0.3s ease; }
.cursor-pointer { cursor: pointer; }
.border-bottom-dashed { border-bottom: 1px dashed var(--border-light); }

/* Profile Cards */
.profile-card .card {
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}
.profile-card:hover .card {
    transform: translateY(-5px);
    box-shadow: var(--shadow-hover) !important;
}
.profile-card__cover {
    border-top-left-radius: calc(var(--radius-md) - 1px);
    border-top-right-radius: calc(var(--radius-md) - 1px);
}

/* Contact Gate (Privacy Blur) */
.contact-gate .card-body {
    filter: blur(5px);
    opacity: 0.5;
    pointer-events: none;
    user-select: none;
}
.contact-gate .gate-overlay {
    z-index: 10;
    background: rgba(255, 255, 255, 0.6);
    backdrop-filter: blur(2px);
}

/* Wizard Progress */
.wizard-progress {
    height: 8px;
    border-radius: 4px;
    background-color: var(--border-light);
    overflow: hidden;
}
.wizard-step-active {
    font-weight: 700;
    color: var(--primary-green);
}

/* Search Filter Sidebar */
.filter-sidebar {
    background-color: #fff;
    border-right: 1px solid var(--border-light);
    height: calc(100vh - 60px);
    overflow-y: auto;
}
.geo-select:disabled {
    background-color: #e9ecef;
    cursor: not-allowed;
}

/* Subscription Plan Cards */
.plan-card {
    transition: transform 0.3s ease;
    border: 1px solid var(--border-light);
}
.plan-card:hover {
    transform: translateY(-8px);
}
.plan-card--featured {
    border: 2px solid var(--primary-green);
    transform: scale(1.05);
    z-index: 2;
}
.plan-card--featured:hover {
    transform: scale(1.05) translateY(-8px);
}

/* Drag & Drop Dropzone */
.upload-dropzone {
    transition: all 0.2s ease;
}
.upload-dropzone.dragover {
    background-color: var(--light-green) !important;
    border-color: var(--primary-green) !important;
}

/* Back to Top Button */
#backToTop {
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: none;
    z-index: 1050;
    border-radius: 50%;
    width: 45px;
    height: 45px;
    box-shadow: var(--shadow-card);
}