/** * Frontend styles for WooCommerce Tier and Package Prices */ .wc-tpp-pricing-container { margin: 20px 0; padding: 20px; background: #f9f9f9; border: 1px solid #e0e0e0; border-radius: 8px; } .wc-tpp-tier-pricing-table, .wc-tpp-package-pricing-table { margin-bottom: 30px; } .wc-tpp-tier-pricing-table:last-child, .wc-tpp-package-pricing-table:last-child { margin-bottom: 0; } .wc-tpp-tier-pricing-table h3, .wc-tpp-package-pricing-table h3 { margin: 0 0 15px 0; font-size: 1.2em; color: #333; } /* Tier pricing table */ .wc-tpp-table { width: 100%; border-collapse: collapse; background: #fff; border-radius: 4px; overflow: hidden; } .wc-tpp-table thead { background: #333; color: #fff; } .wc-tpp-table th { padding: 12px; text-align: left; font-weight: 600; font-size: 0.9em; } .wc-tpp-table tbody tr { border-bottom: 1px solid #e0e0e0; transition: all 0.2s; cursor: pointer; } .wc-tpp-table tbody tr:hover { background: #f5f5f5; transform: translateX(2px); } .wc-tpp-table tbody tr.wc-tpp-active-tier { background: #e7f3e7; font-weight: 600; } .wc-tpp-table td { padding: 12px; font-size: 0.95em; } .wc-tpp-tier-label { display: inline-block; margin-top: 4px; color: #666; font-style: italic; font-size: 0.9em; } /* Package pricing */ .wc-tpp-packages { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 15px; } .wc-tpp-package { background: #fff; border: 2px solid #e0e0e0; border-radius: 8px; padding: 20px; text-align: center; transition: all 0.3s; cursor: pointer; } .wc-tpp-package:hover { border-color: #333; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); transform: translateY(-2px); } .wc-tpp-package.wc-tpp-selected { border-color: #4CAF50; background: #f0f8f0; } .wc-tpp-package-header h4 { margin: 0 0 15px 0; font-size: 1.1em; color: #333; } .wc-tpp-package-details { margin-bottom: 15px; } .wc-tpp-package-qty { font-size: 1.4em; margin-bottom: 10px; } .wc-tpp-package-qty strong { color: #333; } .wc-tpp-package-price { font-size: 1.6em; font-weight: 700; color: #4CAF50; margin-bottom: 5px; } .wc-tpp-package-unit-price { font-size: 0.85em; color: #666; } .wc-tpp-select-package { width: 100%; padding: 10px 20px; background: #333; color: #fff; border: none; border-radius: 4px; cursor: pointer; font-size: 0.95em; transition: background 0.3s; } .wc-tpp-select-package:hover { background: #555; } .wc-tpp-package.wc-tpp-selected .wc-tpp-select-package { background: #4CAF50; } .wc-tpp-package.wc-tpp-selected .wc-tpp-select-package:hover { background: #45a049; } /* Cart notices */ .wc-tpp-notice { color: #4CAF50; font-style: italic; } /* Catalog "View Options" button */ a.wc-tpp-view-options { display: inline-block; text-align: center; text-decoration: none; position: relative; /* Match WooCommerce button styling */ font-size: 1em; font-weight: 700; padding: 0.618em 1em; line-height: 1.5; border-radius: 3px; cursor: pointer; transition: all 0.2s ease; } a.wc-tpp-view-options::before { content: "\f06e"; font-family: "dashicons"; margin-right: 5px; display: inline-block; font-size: 1em; vertical-align: middle; line-height: 1; } /* Hover state for View Options button */ a.wc-tpp-view-options:hover { opacity: 0.85; text-decoration: none; } /* Cart quantity display for restricted products */ .wc-tpp-cart-quantity { display: inline-block; padding: 5px 10px; background: #f5f5f5; border: 1px solid #ddd; border-radius: 3px; font-weight: 600; } /* Restriction notice */ .wc-tpp-restriction-notice { padding: 10px 15px; background: #fff3cd; border: 1px solid #ffc107; border-radius: 4px; margin-bottom: 15px; color: #856404; font-size: 0.95em; } /* Disabled add to cart button */ .single_add_to_cart_button.disabled, .single_add_to_cart_button:disabled { opacity: 0.5; cursor: not-allowed; pointer-events: none; } /* Responsive design */ @media (max-width: 768px) { .wc-tpp-packages { grid-template-columns: 1fr; } .wc-tpp-table { font-size: 0.9em; } .wc-tpp-table th, .wc-tpp-table td { padding: 8px; } }