/* <link rel="stylesheet" href="{{ asset('css/form-modal.css') }}">
    <link rel="stylesheet" href="{{ asset('css/schedule.css') }}" >
    <link rel="stylesheet" href="{{ asset('css/ag-custom-buttons.css') }}" >   */

    /* simply use custom-btn and color-button in clases eg custom-btn red-button */


/* Base button style */
.custom-btn {
    padding: 0.5rem 1rem;
    border: none;
    border-radius: 6px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

/* Hover shadow */
.custom-btn:hover {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.25);
    transform: translateY(-2px);
}

/* Variants */
.red-button {
    background-color: #e74c3c; /* Bright red */
    color: white;
}

.red-button:hover {
    background-color: #c0392b;
}

.orange-button {
    background-color: #f39c12; /* Warm orange */
    color: white;
}

.orange-button:hover {
    background-color: #d35400;
}

.green-button {
    background-color: #27ae60; /* Success green */
    color: white;
}

.green-button:hover {
    background-color: #1e8449;
}

.blue-button {
    background-color: #3498db; /* Calm blue */
    color: white;
}

/* new colors */
.purple-button {
    background-color: #9b59b6; /* Elegant purple */
    color: white;
}
.purple-button:hover {
    background-color: #8e44ad;
}

.teal-button {
    background-color: #1abc9c; /* Refreshing teal */
    color: white;
}
.teal-button:hover {
    background-color: #16a085;
}

.gray-button {
    background-color: #7f8c8d; /* Neutral gray */
    color: white;
}
.gray-button:hover {
    background-color: #626567;
}

.black-button {
    background-color: #2c3e50; /* Deep black-blue */
    color: white;
}
.black-button:hover {
    background-color: #1a252f;
}

.gold-button {
    background-color: #f1c40f; /* Rich gold */
    color: white;
}
.gold-button:hover {
    background-color: #d4ac0d;
}
/* new colors here */


.blue-button:hover {
    background-color: #21618c;
}


/* Disabled state */
.custom-btn.disabled,
.custom-btn:disabled {
    background-color: #bdc3c7; /* Gray background */
    color: #7f8c8d; /* Dark gray text */
    cursor: not-allowed;
    box-shadow: none;
    transform: none;
}

/* Optional: remove hover effects for disabled */
.custom-btn.disabled:hover,
.custom-btn:disabled:hover {
    background-color: #bdc3c7;
}