@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

/* Global Styles for LayerShield */
body {
    font-family: 'Poppins', Arial, sans-serif !important;
    background-color: #f4f6f9;
}

:root {
    --primary-color: #0d0f3d;
}

.btn-premium {
    transition: all 0.3s ease;
}

.btn-primary-premium {
    background: var(--primary-color) !important;
    box-shadow: 0 4px 15px rgba(13, 15, 61, 0.3) !important;
    color: white !important;
}

.btn-primary-premium:hover {
    filter: brightness(1.2) !important;
    box-shadow: 0 6px 20px rgba(13, 15, 61, 0.4) !important;
}

.btn-success-premium {
    background: #10b981 !important;
    box-shadow: 0 4px 15px rgba(16, 185, 129, 0.3) !important;
    color: white !important;
}

.btn-success-premium:hover {
    filter: brightness(1.1) !important;
    box-shadow: 0 6px 20px rgba(16, 185, 129, 0.4) !important;
}

.btn-danger-premium {
    background: linear-gradient(135deg, #cc0000 0%, #990000 100%) !important;
    box-shadow: 0 4px 15px rgba(153, 0, 0, 0.4) !important;
    color: white !important;
}

.btn-danger-premium:hover {
    filter: brightness(1.2) !important;
    box-shadow: 0 6px 20px rgba(153, 0, 0, 0.5) !important;
}

.btn-cancel-premium {
    background: linear-gradient(135deg, #cc0000 0%, #ff0000 100%) !important;
    box-shadow: 0 4px 15px rgba(204, 0, 0, 0.3) !important;
    color: white !important;
}

.btn-cancel-premium:hover {
    filter: brightness(1.1) !important;
    box-shadow: 0 6px 20px rgba(204, 0, 0, 0.4) !important;
}

/* Responsive Custom Styles for LayerShield */
/* Extra small devices (phones, less than 640px) */
@media (max-width: 639px) {
    /* Add your custom mobile CSS overrides here */
    
}

/* Small devices (tablets, 640px and up to 767px) */
@media (min-width: 640px) and (max-width: 767px) {
    /* Add your custom tablet CSS overrides here */

}

/* Medium devices (landscape tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 1023px) {

}

/* Large devices (desktops, 1024px and up) */
@media (min-width: 1024px) {
    
}
