Marwan Alwali ab2c4a36c5 update
2025-10-02 10:13:03 +03:00

113 lines
2.8 KiB
CSS

/* Custom styles for Airport Management System */
@font-face {
font-family: 'SaudiRiyalSymbol';
src: url('saudiriyalsymbol.woff2') format('woff2'),
url('saudiriyalsymbol.woff') format('woff'),
url('saudiriyalsymbol.otf') format('opentype');
}
.symbol {
font-family: 'SaudiRiyalSymbol', sans-serif;
font-size: inherit;
margin: 20px auto;
color: inherit;
font-weight: bold;
}
.avatar-sm {
width: 32px;
height: 32px;
font-size: 0.75rem;
color: #fff;
}
.bg-gradient {
background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
}
.metric-card {
background: linear-gradient(135deg, #764ba2 0%, #667eea 100%);
color: white;
border-radius: 5px;
padding: 20px;
margin-bottom: 20px;
box-shadow: 0 4px 15px rgba(0,0,0,0.1);
transition: transform 0.2s;
}
.metric-card:hover {
transform: translateY(-2px);
}
.metric-value {
font-size: 2.5rem;
font-weight: bold;
margin-bottom: 5px;
}
.metric-label {
font-size: 0.9rem;
opacity: 0.9;
}
.metric-change {
font-size: 0.8rem;
margin-top: 5px;
}
.alert-card { background: linear-gradient(135deg, #ee5a24 0%, #ff6b6b 100%);}
.success-card { background: linear-gradient(135deg, #40c057 0%, #51cf66 100%);}
.warning-card { background: linear-gradient(135deg, #fab005 0%, #ffd43b 100%); color: #333;}
.info-card { background: linear-gradient(135deg, #339af0 0%, #74c0fc 100%);}
/* Different card colors for different systems */
.ebt-card { background: linear-gradient(135deg, #764ba2 0%, #667eea 100%); }
.fuel-card { background: linear-gradient(135deg, #ee5a24 0%, #ff6b6b 100%); }
.sales-card { background: linear-gradient(135deg, #339af0 0%, #74c0fc 100%); }
.facility-card { background: linear-gradient(135deg, #40c057 0%, #51cf66 100%); }
.store-card { background: linear-gradient(135deg, #7a1e3a 0%, #fa709a 100%); }
.timeline {
position: relative;
padding-left: 30px;
}
.timeline::before {
content: '';
position: absolute;
left: 15px;
top: 0;
bottom: 0;
width: 2px;
background: #dee2e6;
}
.timeline-item {
position: relative;
margin-bottom: 20px;
}
.timeline-marker {
position: absolute;
left: -22px;
top: 0;
width: 12px;
height: 12px;
border-radius: 50%;
border: 2px solid #fff;
box-shadow: 0 0 0 2px #dee2e6;
}
.timeline-content {
background: #f8f9fa;
padding: 10px 15px;
border-radius: 8px;
border-left: 3px solid #dee2e6;
}
.timeline-title {
margin: 0 0 5px 0;
font-size: 0.9rem;
font-weight: 600;
}
.timeline-text {
margin: 0;
font-size: 0.85rem;
color: #6c757d;
}