/** * HVAC TEC Integration Styles * Provides seamless integration between HVAC plugin and TEC Community Events */ /* Container styling */ .hvac-tec-wrapper { max-width: 1200px; margin: 0 auto; padding: 20px; } /* Page header styling */ .hvac-tec-wrapper .hvac-page-header { margin-bottom: 30px; border-bottom: 1px solid #eee; padding-bottom: 20px; } .hvac-tec-wrapper h1 { color: #1a1a1a; font-size: 32px; margin-bottom: 10px; font-weight: 600; } .hvac-page-description { color: #666; font-size: 16px; margin-bottom: 20px; line-height: 1.5; } /* Event metadata styling */ .hvac-event-meta { background: #f8f9fa; padding: 15px 20px; border-radius: 6px; margin-bottom: 25px; border-left: 4px solid #0073aa; } .hvac-event-meta span { display: inline-block; margin-right: 25px; color: #666; font-size: 14px; } .hvac-event-meta strong { color: #333; font-weight: 600; } /* Notice styling */ .hvac-error-notice { background: #fff5f5; border-left: 4px solid #dc3232; padding: 15px 20px; margin-bottom: 20px; border-radius: 0 4px 4px 0; } .hvac-success-notice { background: #f0f8ff; border-left: 4px solid #00a32a; padding: 15px 20px; margin-bottom: 20px; border-radius: 0 4px 4px 0; } .hvac-error-notice p, .hvac-success-notice p { margin: 0; font-size: 14px; line-height: 1.4; } /* Quick action buttons */ .hvac-quick-actions { display: flex; gap: 12px; margin-bottom: 25px; flex-wrap: wrap; } .hvac-quick-actions .button { padding: 10px 16px; background: #f7f7f7; border: 1px solid #ddd; border-radius: 4px; text-decoration: none; color: #333; font-size: 14px; font-weight: 500; transition: all 0.3s ease; display: inline-flex; align-items: center; } .hvac-quick-actions .button:hover { background: #0073aa; color: white; border-color: #0073aa; text-decoration: none; } .hvac-quick-actions .button.active { background: #0073aa; color: white; border-color: #0073aa; } .hvac-quick-actions .button.danger { background: #dc3232; color: white; border-color: #dc3232; } .hvac-quick-actions .button.danger:hover { background: #a00; border-color: #a00; } /* TEC form container styling */ .hvac-tec-form-container { background: #fff; border-radius: 8px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); overflow: hidden; } /* Hide TEC default navigation when our menu is present */ .hvac-navigation-wrapper + .tribe-community-events .tribe-events-community-nav { display: none; } /* Style TEC forms to match HVAC design */ .hvac-tec-wrapper .tribe-community-events { background: transparent; padding: 20px; } .hvac-tec-wrapper .tribe-community-events input[type="text"], .hvac-tec-wrapper .tribe-community-events input[type="email"], .hvac-tec-wrapper .tribe-community-events input[type="url"], .hvac-tec-wrapper .tribe-community-events input[type="tel"], .hvac-tec-wrapper .tribe-community-events input[type="number"], .hvac-tec-wrapper .tribe-community-events textarea, .hvac-tec-wrapper .tribe-community-events select { border: 1px solid #ddd; border-radius: 4px; padding: 10px 12px; font-size: 14px; line-height: 1.4; transition: border-color 0.3s ease; width: 100%; max-width: 100%; } .hvac-tec-wrapper .tribe-community-events input[type="text"]:focus, .hvac-tec-wrapper .tribe-community-events input[type="email"]:focus, .hvac-tec-wrapper .tribe-community-events input[type="url"]:focus, .hvac-tec-wrapper .tribe-community-events input[type="tel"]:focus, .hvac-tec-wrapper .tribe-community-events input[type="number"]:focus, .hvac-tec-wrapper .tribe-community-events textarea:focus, .hvac-tec-wrapper .tribe-community-events select:focus { border-color: #0073aa; outline: none; box-shadow: 0 0 0 1px #0073aa; } /* Hide duplicate headers and unnecessary elements */ .hvac-tec-wrapper .tribe-community-events h2:first-child { display: none; } .hvac-tec-wrapper .tribe-community-events .tribe-events-community-nav { display: none; } /* Style form sections */ .hvac-tec-wrapper .tribe-section { margin-bottom: 25px; padding: 20px; background: #fafafa; border-radius: 6px; border: 1px solid #eee; } .hvac-tec-wrapper .tribe-section-header h3 { margin: 0 0 10px 0; color: #333; font-size: 18px; font-weight: 600; } .hvac-tec-wrapper .tribe-section-description { margin: 0 0 15px 0; color: #666; font-size: 13px; line-height: 1.4; } /* Button styling */ .hvac-tec-wrapper .tribe-community-events button[type="submit"], .hvac-tec-wrapper .tribe-community-events input[type="submit"] { background: #0073aa; color: white; border: 1px solid #0073aa; border-radius: 4px; padding: 12px 24px; font-size: 16px; font-weight: 600; cursor: pointer; transition: all 0.3s ease; text-transform: none; } .hvac-tec-wrapper .tribe-community-events button[type="submit"]:hover, .hvac-tec-wrapper .tribe-community-events input[type="submit"]:hover { background: #005a87; border-color: #005a87; } .hvac-tec-wrapper .tribe-community-events button[type="submit"]:disabled, .hvac-tec-wrapper .tribe-community-events input[type="submit"]:disabled { background: #ccc; border-color: #ccc; cursor: not-allowed; } /* Loading states */ .hvac-loading { display: inline-flex; align-items: center; gap: 8px; color: #666; font-size: 14px; } .hvac-loading::before { content: ""; width: 16px; height: 16px; border: 2px solid #f3f3f3; border-top: 2px solid #0073aa; border-radius: 50%; animation: hvac-spin 1s linear infinite; } @keyframes hvac-spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /* Responsive design */ @media (max-width: 768px) { .hvac-tec-wrapper { padding: 15px; } .hvac-quick-actions { flex-direction: column; gap: 8px; } .hvac-quick-actions .button { width: 100%; justify-content: center; } .hvac-event-meta span { display: block; margin-bottom: 5px; margin-right: 0; } .hvac-tec-wrapper h1 { font-size: 24px; } } /* Integration with HVAC navigation */ .hvac-navigation-wrapper + .hvac-tec-wrapper .hvac-page-header { margin-top: 0; } /* Breadcrumb integration */ .hvac-breadcrumbs + .hvac-page-header { border-top: none; padding-top: 0; } /* Enhanced accessibility */ .hvac-tec-wrapper .tribe-community-events label { font-weight: 600; color: #333; margin-bottom: 5px; display: block; } .hvac-tec-wrapper .tribe-community-events .tribe-field-required { color: #dc3232; } /* Error styling for form validation */ .hvac-tec-wrapper .tribe-community-events .tribe-field-error input, .hvac-tec-wrapper .tribe-community-events .tribe-field-error textarea, .hvac-tec-wrapper .tribe-community-events .tribe-field-error select { border-color: #dc3232; box-shadow: 0 0 0 1px #dc3232; } .hvac-tec-wrapper .tribe-community-events .tribe-field-error-message { color: #dc3232; font-size: 12px; margin-top: 5px; display: block; } /* Success feedback */ .hvac-form-success { background: #d4edda; color: #155724; border: 1px solid #c3e6cb; border-radius: 4px; padding: 15px; margin-bottom: 20px; } .hvac-form-success .dashicons { color: #155724; margin-right: 8px; }