/* Custom styles for Site Installation Management System */

.ordered_list li{
    list-style-type: decimal;
}

.btn-primary {
    @apply bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-4 rounded-md transition duration-200;
}

.btn-secondary {
    @apply bg-gray-600 hover:bg-gray-700 text-white font-medium py-2 px-4 rounded-md transition duration-200;
}

.btn-success {
    @apply bg-green-600 hover:bg-green-700 text-white font-medium py-2 px-4 rounded-md transition duration-200;
}

.btn-danger {
    @apply bg-red-600 hover:bg-red-700 text-white font-medium py-2 px-4 rounded-md transition duration-200;
}

.form-input {
    @apply block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500;
}

.form-select {
    @apply block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500;
}

.form-textarea {
    @apply block w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-blue-500 focus:border-blue-500 resize-vertical;
}

.alert-success {
    @apply bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded mb-4;
}

.alert-error {
    @apply bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded mb-4;
}

.alert-warning {
    @apply bg-yellow-100 border border-yellow-400 text-yellow-700 px-4 py-3 rounded mb-4;
}

.alert-info {
    @apply bg-blue-100 border border-blue-400 text-blue-700 px-4 py-3 rounded mb-4;
}

.table-responsive {
    @apply overflow-x-auto shadow-md rounded-lg;
}

.table {
    @apply min-w-full bg-white;
}

.table th {
    @apply px-6 py-3 border-b-2 border-gray-300 text-left text-xs font-semibold text-gray-600 uppercase tracking-wider;
}

.table td {
    @apply px-6 py-4 whitespace-nowrap text-sm text-gray-900 border-b border-gray-200;
}

.sidebar {
    @apply bg-white shadow-md h-screen w-64 fixed left-0 top-16 overflow-y-auto;
}

.sidebar-item {
    @apply block px-4 py-2 text-gray-700 hover:bg-gray-100 hover:text-blue-600 transition duration-200;
}

.sidebar-item.active {
    @apply bg-blue-100 text-blue-600 border-r-2 border-blue-600;
}

.card {
    @apply bg-white shadow-md rounded-lg p-6 mb-6;
}

.card-header {
    @apply border-b border-gray-200 pb-4 mb-4;
}

.card-title {
    @apply text-lg font-semibold text-gray-900;
}

.badge {
    @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium;
}

.badge-success {
    @apply bg-green-100 text-green-800;
}

.badge-warning {
    @apply bg-yellow-100 text-yellow-800;
}

.badge-danger {
    @apply bg-red-100 text-red-800;
}

.badge-info {
    @apply bg-blue-100 text-blue-800;
}

.badge-secondary {
    @apply bg-gray-100 text-gray-800;
}