/* Cat-themed styling */
    .tool-container {
        background-color: #fff;
        border-radius: 10px;
        box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    }
    
    .cat-purple {
        color: #6f42c1;
    }
    
    .result-card {
        border-left: 5px solid #6f42c1;
        transition: all 0.3s ease;
    }
    
    .dosage-option {
        border-radius: 8px;
        padding: 15px;
        margin-bottom: 15px;
        border: 1px solid #e3e6f0;
    }
    
    .dosage-option h5 {
        color: #6f42c1;
        font-size: 1.1rem;
    }
    
    .safety-chart {
        background-color: #f8f9fc;
        border-radius: 8px;
    }
    
    .safety-chart th {
        background-color: #6f42c1;
        color: white;
    }
    
    .benefit-card {
        background-color: #f8f9fc;
        border-radius: 8px;
        padding: 15px;
        margin-bottom: 15px;
        height: 100%;
    }
    
    .warning-card {
        margin-bottom: 15px;
        border-radius: 8px;
        overflow: hidden;
    }
    
    .warning-card .card-header {
        font-weight: bold;
    }
    
    /* Status indicators */
    .status-safe {
        background-color: #28a745;
        color: white;
    }
    
    .status-caution {
        background-color: #fd7e14;
        color: white;
    }
    
    .status-danger {
        background-color: #dc3545;
        color: white;
    }
    
    /* Loading spinner */
    .loading-spinner {
        display: none;
        width: 1.5rem;
        height: 1.5rem;
    }
    
    #benadrylForm.is-submitting .loading-spinner {
        display: inline-block;
    }
    
    #benadrylForm.is-submitting .submit-text {
        display: none;
    }
    
    /* Liquid dosage helper */
    .liquid-helper {
        background-color: #e9f7fe;
        border-radius: 8px;
        padding: 15px;
        margin-top: 15px;
    }
    
    .syringe {
        width: 30px;
        height: 60px;
        background-color: #6f42c1;
        display: inline-block;
        position: relative;
        margin-right: 10px;
    }
    
    .syringe::after {
        content: "";
        position: absolute;
        bottom: -10px;
        left: 5px;
        width: 20px;
        height: 10px;
        background-color: #6f42c1;
        clip-path: polygon(0 0, 100% 0, 50% 100%);
    }