/*
 * HCBA Farm Directory - Plugin Styles v1.2
 * Brand: #404E3F | #5DC001 | white | black
 * Headings: Akshar 800 | Body: DM Sans 600
 */

:root {
    --hcba-dark:      #404E3F;
    --hcba-green:     #5DC001;
    --hcba-white:     #ffffff;
    --hcba-light:     #f5f7f5;
    --hcba-border:    #dce8dc;
    --hcba-text:      #404E3F;
    --hcba-muted:     #7a8f7a;
    --hcba-danger:    #c0392b;
    --hcba-radius:    10px;
    --hcba-shadow:    0 2px 12px rgba(64,78,63,0.09);
    --hcba-shadow-lg: 0 6px 32px rgba(64,78,63,0.13);
}

/* ==========================================================================
   SUPPRESS THEME META ON SHORTCODE PAGES (not on single farm - handled inline)
   ========================================================================== */
.hcba-page .entry-meta, .hcba-page .post-meta, .hcba-page .entry-footer,
.hcba-page .posted-on, .hcba-page .byline, .hcba-page .cat-links,
.hcba-page .tags-links, .hcba-page .post-date, .hcba-page .entry-date,
.hcba-page .author, .hcba-page .post-thumbnail, .hcba-page .wp-block-post-date,
.hcba-page .wp-block-post-author, .hcba-page .page-header,
.hcba-page .breadcrumbs, .hcba-page .breadcrumb, .hcba-page .rank-math-breadcrumb,
.hcba-page .yoast-breadcrumb, .hcba-page .wpseo-breadcrumb,
.hcba-page .entry-title, .hcba-page .page-title { display: none !important; }

/* ==========================================================================
   GLOBAL BASE
   ========================================================================== */
.hcba-directory-wrap, .hcba-auth-wrap, .hcba-edit-profile-wrap {
    font-family: 'DM Sans', sans-serif !important;
    font-weight: 600 !important;
    color: var(--hcba-text) !important;
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

.hcba-directory-wrap *, .hcba-auth-wrap *, .hcba-edit-profile-wrap * { box-sizing: border-box; }

.hcba-directory-wrap h1, .hcba-directory-wrap h2, .hcba-directory-wrap h3,
.hcba-auth-wrap h1, .hcba-auth-wrap h2, .hcba-auth-wrap h3,
.hcba-edit-profile-wrap h1, .hcba-edit-profile-wrap h2, .hcba-edit-profile-wrap h3 {
    font-family: 'Akshar', sans-serif !important;
    font-weight: 800 !important;
    color: var(--hcba-dark) !important;
    line-height: 1.15 !important;
    margin-top: 0 !important;
}

.hcba-accent-icon { color: var(--hcba-green) !important; }

/* ==========================================================================
   BUTTONS
   ========================================================================== */
.hcba-btn {
    display: inline-flex !important; align-items: center !important; justify-content: center !important;
    gap: 0.45rem !important; padding: 0.7rem 1.6rem !important;
    border: 2px solid transparent !important; border-radius: var(--hcba-radius) !important;
    font-family: 'DM Sans', sans-serif !important; font-weight: 600 !important; font-size: 0.95rem !important;
    cursor: pointer !important; text-decoration: none !important;
    transition: background 0.2s, color 0.2s, border-color 0.2s, transform 0.15s !important;
    line-height: 1 !important; white-space: nowrap !important;
}
.hcba-btn:hover { transform: translateY(-1px) !important; text-decoration: none !important; }
.hcba-btn:active { transform: translateY(0) !important; }
.hcba-btn-primary { background: var(--hcba-green) !important; color: var(--hcba-white) !important; border-color: var(--hcba-green) !important; }
.hcba-btn-primary:hover { background: var(--hcba-dark) !important; border-color: var(--hcba-dark) !important; color: var(--hcba-white) !important; }
.hcba-btn-secondary { background: var(--hcba-dark) !important; color: var(--hcba-white) !important; border-color: var(--hcba-dark) !important; }
.hcba-btn-secondary:hover { background: var(--hcba-green) !important; border-color: var(--hcba-green) !important; color: var(--hcba-white) !important; }
.hcba-btn-outline { background: transparent !important; color: var(--hcba-dark) !important; border-color: var(--hcba-border) !important; }
.hcba-btn-outline:hover { background: var(--hcba-dark) !important; color: var(--hcba-white) !important; border-color: var(--hcba-dark) !important; }
.hcba-btn-full { width: 100% !important; }
.hcba-btn-sm { padding: 0.48rem 1rem !important; font-size: 0.84rem !important; }
.hcba-btn-lg { padding: 0.9rem 2.2rem !important; font-size: 1.05rem !important; }
.hcba-btn:disabled { opacity: 0.65 !important; cursor: not-allowed !important; transform: none !important; }

/* ==========================================================================
   HEADER BUTTON [hcba_header_btn]
   ========================================================================== */
.hcba-header-btn {
    display: inline-flex !important; align-items: center !important; gap: 0.5rem !important;
    text-decoration: none !important; font-family: 'DM Sans', sans-serif !important;
    font-weight: 600 !important; font-size: 0.9rem !important;
    padding: 0.45rem 1rem !important; border-radius: 50px !important;
    transition: all 0.2s !important; white-space: nowrap !important;
}
.hcba-header-btn-login { background: var(--hcba-green) !important; color: var(--hcba-white) !important; border: 2px solid var(--hcba-green) !important; }
.hcba-header-btn-login:hover { background: var(--hcba-dark) !important; border-color: var(--hcba-dark) !important; color: var(--hcba-white) !important; }
.hcba-header-btn-user { background: var(--hcba-white) !important; color: var(--hcba-dark) !important; border: 2px solid var(--hcba-border) !important; }
.hcba-header-btn-user:hover { border-color: var(--hcba-green) !important; color: var(--hcba-dark) !important; }
.hcba-header-btn-avatar { width: 30px !important; height: 30px !important; border-radius: 50% !important; object-fit: cover !important; border: 2px solid var(--hcba-green) !important; flex-shrink: 0 !important; }
.hcba-header-btn-caret { font-size: 0.7rem !important; opacity: 0.6; }

/* ==========================================================================
   FORMS
   ========================================================================== */
.hcba-form-group { margin-bottom: 1.25rem; }
.hcba-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.hcba-form-group label { display: flex !important; align-items: center !important; gap: 0.4rem !important; font-weight: 600 !important; font-size: 0.87rem !important; color: var(--hcba-dark) !important; margin-bottom: 0.4rem !important; font-family: 'DM Sans', sans-serif !important; }
.hcba-form-group label i { color: var(--hcba-green) !important; font-size: 0.8rem !important; }
.hcba-form-group input[type="text"],
.hcba-form-group input[type="email"],
.hcba-form-group input[type="url"],
.hcba-form-group input[type="tel"],
.hcba-form-group input[type="password"],
.hcba-form-group textarea {
    width: 100% !important; padding: 0.65rem 0.95rem !important;
    border: 2px solid var(--hcba-border) !important; border-radius: 8px !important;
    font-family: 'DM Sans', sans-serif !important; font-weight: 600 !important;
    font-size: 0.93rem !important; color: var(--hcba-dark) !important;
    background: var(--hcba-white) !important; outline: none !important;
    transition: border-color 0.2s, box-shadow 0.2s !important; box-shadow: none !important;
}
.hcba-form-group input:focus, .hcba-form-group textarea:focus { border-color: var(--hcba-green) !important; box-shadow: 0 0 0 3px rgba(93,192,1,0.14) !important; }
.hcba-form-group textarea { resize: vertical !important; min-height: 100px !important; }
.hcba-req { color: var(--hcba-green) !important; font-weight: 800 !important; }
.hcba-field-hint { font-size: 0.81rem !important; color: var(--hcba-muted) !important; margin: -0.7rem 0 0.75rem !important; line-height: 1.5 !important; }

.hcba-checkbox-grid { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(165px, 1fr)) !important; gap: 0.35rem !important; padding: 0.85rem !important; background: var(--hcba-light) !important; border: 2px solid var(--hcba-border) !important; border-radius: 8px !important; }
.hcba-checkbox-label { display: flex !important; align-items: center !important; gap: 0.5rem !important; font-size: 0.87rem !important; font-weight: 600 !important; color: var(--hcba-dark) !important; cursor: pointer !important; padding: 0.35rem 0.5rem !important; border-radius: 6px !important; transition: background 0.15s !important; font-family: 'DM Sans', sans-serif !important; }
.hcba-checkbox-label:hover { background: rgba(93,192,1,0.1) !important; }
.hcba-checkbox-label input[type="checkbox"] { width: 16px !important; height: 16px !important; accent-color: var(--hcba-green) !important; flex-shrink: 0 !important; cursor: pointer !important; }

.hcba-notice { padding: 0.75rem 1rem !important; border-radius: 8px !important; margin-bottom: 1.1rem !important; font-size: 0.9rem !important; display: flex !important; align-items: center !important; gap: 0.5rem !important; font-family: 'DM Sans', sans-serif !important; font-weight: 600 !important; }
.hcba-notice.success { background: #e8f5e0 !important; color: #2d6600 !important; border: 1px solid #b8e090 !important; }
.hcba-notice.error   { background: #fde8e8 !important; color: var(--hcba-danger) !important; border: 1px solid #f5b7b1 !important; }
.hcba-notice-full    { width: 100% !important; margin-bottom: 1.5rem !important; }
.hcba-notice-block   { padding: 1rem 1.25rem; border-radius: 8px; font-family: 'DM Sans', sans-serif; font-weight: 600; font-size: 0.95rem; display: flex; align-items: center; gap: 0.5rem; }
.hcba-notice-info    { background: #e6f0e6; color: var(--hcba-dark); border: 1px solid var(--hcba-border); }
.hcba-info-banner    { background: #e8f5e0; border: 1px solid #b8e090; padding: 0.75rem 1rem; border-radius: 8px; font-size: 0.87rem; color: #2d6600; display: flex; align-items: flex-start; gap: 0.5rem; margin-bottom: 1.25rem; line-height: 1.5; font-family: 'DM Sans', sans-serif; font-weight: 600; }

/* ==========================================================================
   DIRECTORY
   ========================================================================== */
.hcba-directory-wrap { max-width: 1200px; margin: 0 auto; padding: 2.5rem 1.5rem; }
.hcba-dir-header { text-align: center; margin-bottom: 2.5rem; }
.hcba-dir-header h2 { font-size: 2.4rem !important; margin-bottom: 0.5rem !important; }
.hcba-dir-header p  { color: var(--hcba-muted) !important; font-size: 1rem !important; margin: 0 !important; }

.hcba-commodities-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(175px, 1fr)); gap: 1.1rem; }

.hcba-commodity-card { background: var(--hcba-white); border: 2px solid var(--hcba-border); border-radius: 14px; padding: 1.7rem 1rem 1.4rem; text-align: center; cursor: pointer; transition: all 0.22s ease; box-shadow: var(--hcba-shadow); text-decoration: none !important; display: block; color: var(--hcba-text) !important; }
.hcba-commodity-card:hover { border-color: var(--hcba-green); background: var(--hcba-green); transform: translateY(-5px); box-shadow: 0 10px 28px rgba(93,192,1,0.28); text-decoration: none !important; }
.hcba-commodity-card:hover h3 { color: var(--hcba-white) !important; }
.hcba-commodity-card:hover .hcba-farm-count { color: rgba(255,255,255,0.8) !important; }
.hcba-commodity-card:hover .hcba-commodity-icon { background: rgba(255,255,255,0.22) !important; color: var(--hcba-white) !important; }
.hcba-commodity-icon { width: 64px; height: 64px; border-radius: 50%; background: rgba(93,192,1,0.1); display: flex; align-items: center; justify-content: center; margin: 0 auto 0.9rem; font-size: 1.5rem; color: var(--hcba-green); transition: all 0.22s; }
.hcba-commodity-card h3 { font-size: 0.93rem !important; margin: 0 0 0.25rem !important; color: var(--hcba-dark) !important; }
.hcba-farm-count { font-size: 0.78rem; color: var(--hcba-muted); font-weight: 600; }

.hcba-farms-view { width: 100%; }
.hcba-farms-view-header { display: flex; align-items: center; gap: 1.5rem; margin-bottom: 2rem; padding-bottom: 1.5rem; border-bottom: 2px solid var(--hcba-border); flex-wrap: wrap; }
.hcba-farms-view-title h2 { font-size: 2rem !important; margin-bottom: 0.2rem !important; }
.hcba-farms-view-title p  { color: var(--hcba-muted) !important; margin: 0 !important; font-size: 0.9rem !important; }

.hcba-back-btn { display: inline-flex; align-items: center; gap: 0.45rem; background: var(--hcba-dark); color: var(--hcba-white) !important; border: none; padding: 0.6rem 1.2rem; border-radius: 8px; cursor: pointer; font-family: 'DM Sans', sans-serif; font-weight: 600; font-size: 0.88rem; transition: background 0.2s; white-space: nowrap; text-decoration: none !important; flex-shrink: 0; }
.hcba-back-btn:hover { background: var(--hcba-green) !important; color: var(--hcba-white) !important; }

.hcba-farms-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 1.4rem; }

.hcba-farm-card { background: var(--hcba-white); border: 2px solid var(--hcba-border); border-radius: 14px; overflow: hidden; transition: all 0.22s ease; box-shadow: var(--hcba-shadow); text-decoration: none !important; display: block; color: var(--hcba-text) !important; }
.hcba-farm-card:hover { border-color: var(--hcba-green); transform: translateY(-4px); box-shadow: 0 10px 28px rgba(93,192,1,0.2); text-decoration: none !important; color: var(--hcba-text) !important; }
.hcba-farm-card-thumb { width: 100%; height: 190px; object-fit: cover; display: block; }
.hcba-farm-card-placeholder { width: 100%; height: 190px; background: linear-gradient(135deg, #e8ede8 0%, #dde8dd 100%); display: flex; align-items: center; justify-content: center; font-size: 3rem; color: #b0c8b0; }
.hcba-farm-card-body { padding: 1.2rem; }
.hcba-farm-card-name { font-family: 'Akshar', sans-serif !important; font-weight: 800 !important; font-size: 1.15rem !important; color: var(--hcba-dark) !important; margin: 0 0 0.65rem !important; line-height: 1.2 !important; }
.hcba-farm-card-meta { display: flex; align-items: flex-start; gap: 0.4rem; font-size: 0.83rem; color: var(--hcba-muted); margin-bottom: 0.3rem; line-height: 1.4; }
.hcba-farm-card-meta i { color: var(--hcba-green); margin-top: 2px; flex-shrink: 0; font-size: 0.78rem; }
.hcba-farm-card-footer { padding: 0.7rem 1.2rem; background: var(--hcba-light); border-top: 1px solid var(--hcba-border); display: flex; align-items: center; justify-content: space-between; font-size: 0.83rem; color: var(--hcba-green); font-weight: 600; font-family: 'DM Sans', sans-serif; }
.hcba-farm-card:hover .hcba-farm-card-footer .fa-arrow-right { transform: translateX(4px); }
.hcba-farm-card-footer .fa-arrow-right { transition: transform 0.2s; }
.hcba-loading { grid-column: 1 / -1; text-align: center; padding: 3.5rem 2rem; color: var(--hcba-muted); font-family: 'DM Sans', sans-serif; font-weight: 600; font-size: 1rem; }
.hcba-empty-state { grid-column: 1 / -1; text-align: center; padding: 3rem 2rem; color: var(--hcba-muted); font-size: 0.95rem; display: flex; align-items: center; justify-content: center; gap: 0.5rem; font-family: 'DM Sans', sans-serif; font-weight: 600; }

/* ==========================================================================
   AUTH PAGE
   ========================================================================== */
.hcba-auth-wrap { max-width: 560px; margin: 0 auto; padding: 2rem 1rem; }
.hcba-auth-box { background: var(--hcba-white); border-radius: 16px; box-shadow: var(--hcba-shadow-lg); overflow: hidden; border: 2px solid var(--hcba-border); }
.hcba-auth-tabs { display: flex; border-bottom: 2px solid var(--hcba-border); background: var(--hcba-white); }
.hcba-tab-btn { flex: 1; padding: 1rem; border: none; background: transparent; color: var(--hcba-muted); font-family: 'DM Sans', sans-serif; font-weight: 600; font-size: 0.9rem; cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 0.45rem; transition: all 0.2s; border-bottom: 3px solid transparent; margin-bottom: -2px; position: relative; }
.hcba-tab-btn:hover:not(.active) { color: var(--hcba-dark); background: var(--hcba-light); }
.hcba-tab-btn.active { color: var(--hcba-green) !important; border-bottom-color: var(--hcba-green) !important; background: transparent !important; font-weight: 600 !important; }
.hcba-tab-content { display: none; padding: 2rem; }
.hcba-tab-content.active { display: block; }
.hcba-tab-content h2 { font-size: 1.65rem !important; margin-bottom: 0.25rem !important; display: flex !important; align-items: center !important; gap: 0.5rem !important; }
.hcba-auth-sub   { color: var(--hcba-muted); margin-bottom: 1.5rem; font-size: 0.9rem; }
.hcba-terms-note { font-size: 0.78rem; color: var(--hcba-muted); margin-top: 0.9rem; text-align: center; line-height: 1.5; }
.hcba-switch-tab { font-size: 0.85rem; text-align: center; margin-top: 0.85rem; color: var(--hcba-muted); }
.hcba-switch-link { color: var(--hcba-green); font-weight: 600; text-decoration: none; }
.hcba-switch-link:hover { color: var(--hcba-dark); text-decoration: underline; }

/* ==========================================================================
   EDIT PROFILE - UM STYLE
   ========================================================================== */
.hcba-edit-profile-wrap { max-width: 860px; margin: 0 auto; padding: 2rem 1.5rem; }
.hcba-um-header { background: var(--hcba-white); border-radius: 16px; box-shadow: var(--hcba-shadow-lg); overflow: hidden; border: 1px solid var(--hcba-border); margin-bottom: 0; }
.hcba-cover-wrap { width: 100%; height: 220px; background: var(--hcba-dark); background-size: cover; background-position: center; position: relative; cursor: pointer; }
.hcba-cover-placeholder { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; color: rgba(255,255,255,0.4); font-family: 'DM Sans', sans-serif; font-size: 0.9rem; gap: 0.5rem; }
.hcba-cover-placeholder i { font-size: 2rem; }
.hcba-cover-edit-btn { position: absolute; bottom: 12px; right: 12px; background: rgba(0,0,0,0.55); color: var(--hcba-white) !important; padding: 0.4rem 0.9rem; border-radius: 6px; font-family: 'DM Sans', sans-serif; font-weight: 600; font-size: 0.82rem; cursor: pointer; display: inline-flex; align-items: center; gap: 0.4rem; transition: background 0.2s; text-decoration: none !important; }
.hcba-cover-edit-btn:hover { background: var(--hcba-green); }
.hcba-um-identity-row { display: flex; align-items: flex-end; gap: 1.25rem; padding: 0 1.5rem 1.25rem; margin-top: -36px; position: relative; flex-wrap: wrap; }
.hcba-um-avatar-wrap { position: relative; flex-shrink: 0; }
.hcba-um-avatar-wrap img { width: 90px; height: 90px; border-radius: 50%; object-fit: cover; border: 4px solid var(--hcba-white); box-shadow: 0 2px 12px rgba(0,0,0,0.18); display: block; }
.hcba-avatar-edit-btn { position: absolute; bottom: 2px; right: 2px; width: 26px; height: 26px; border-radius: 50%; background: var(--hcba-green); color: var(--hcba-white) !important; display: flex; align-items: center; justify-content: center; font-size: 0.7rem; cursor: pointer; text-decoration: none !important; box-shadow: 0 1px 4px rgba(0,0,0,0.2); }
.hcba-um-name-col { flex: 1; padding-bottom: 0.25rem; }
.hcba-um-name-col h2 { font-size: 1.4rem !important; margin: 0 !important; }
.hcba-um-header-actions { display: flex; align-items: center; gap: 0.5rem; padding-bottom: 0.25rem; }
.hcba-um-tabs { display: flex; border-top: 1px solid var(--hcba-border); background: var(--hcba-dark); padding: 0 1rem; }
.hcba-um-tab { padding: 0.85rem 1.25rem; border: none; background: transparent; color: rgba(255,255,255,0.5); font-family: 'DM Sans', sans-serif; font-weight: 600; font-size: 0.88rem; cursor: pointer; display: flex; align-items: center; gap: 0.4rem; border-bottom: 3px solid transparent; margin-bottom: -1px; transition: color 0.2s, border-color 0.2s; }
.hcba-um-tab:hover { color: rgba(255,255,255,0.8); }
.hcba-um-tab.active { color: var(--hcba-green) !important; border-bottom-color: var(--hcba-green) !important; }
.hcba-um-panel { display: none; margin-top: 1.25rem; }
.hcba-um-panel.active { display: block; }
.hcba-profile-section { background: var(--hcba-white); border: 2px solid var(--hcba-border); border-radius: 14px; padding: 1.5rem; box-shadow: var(--hcba-shadow); }
.hcba-social-field-row { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.25rem; }
.hcba-social-field-row:last-child { margin-bottom: 0; }
.hcba-social-icon { width: 38px; height: 38px; border-radius: 8px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; color: var(--hcba-white); font-size: 1rem; }
.hcba-profile-save-bar { display: flex; align-items: center; gap: 1rem; padding: 1.25rem 1.5rem; background: var(--hcba-light); border-radius: 14px; border: 2px solid var(--hcba-border); flex-wrap: wrap; margin-top: 1.25rem; }
.hcba-save-hint { font-size: 0.82rem; color: var(--hcba-muted); }
.hcba-photo-section { display: flex; align-items: center; gap: 1.75rem; }
.hcba-photo-preview-wrap img { width: 110px; height: 110px; border-radius: 12px; object-fit: cover; border: 3px solid var(--hcba-green); display: block; }
.hcba-upload-hint { font-size: 0.78rem !important; color: var(--hcba-muted) !important; margin-top: 0.5rem !important; }

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 768px) {
    .hcba-directory-wrap { padding: 1.5rem 1rem; }
    .hcba-form-row { grid-template-columns: 1fr; gap: 0; }
    .hcba-commodities-grid { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 0.85rem; }
    .hcba-farms-grid { grid-template-columns: 1fr; }
    .hcba-farms-view-header { gap: 0.75rem; }
    .hcba-checkbox-grid { grid-template-columns: repeat(2, 1fr); }
    .hcba-um-identity-row { flex-wrap: wrap; gap: 0.75rem; padding: 0 1rem 1rem; }
    .hcba-um-header-actions { width: 100%; }
    .hcba-um-tabs { overflow-x: auto; }
    .hcba-edit-profile-wrap { padding: 1rem; }
    .hcba-cover-wrap { height: 160px; }
}

@media (max-width: 480px) {
    .hcba-directory-wrap, .hcba-auth-wrap, .hcba-edit-profile-wrap { padding: 0.75rem; }
    .hcba-tab-content { padding: 1.25rem; }
    .hcba-tab-btn { font-size: 0.8rem; padding: 0.85rem 0.5rem; }
    .hcba-commodity-card { padding: 1.1rem 0.75rem; }
    .hcba-commodity-icon { width: 50px; height: 50px; font-size: 1.2rem; }
    .hcba-profile-save-bar { flex-direction: column; align-items: flex-start; }
    .hcba-header-btn-label { display: none; }
    .hcba-btn-lg { padding: 0.8rem 1.4rem !important; font-size: 0.95rem !important; }
}
