/* Safari Muscat Airfare Request Generator - Custom Styles */ /* --- Typography & Base --- */ body { font-family: 'Poppins', sans-serif; background-color: #f8f9fa; color: #333; } /* --- Main Container --- */ .form-container { max-width: 800px; margin: 2rem auto; background-color: #ffffff; border-radius: 0.75rem; box-shadow: 0 8px 30px rgba(0, 0, 0, 0.05); padding: 2.5rem; } /* --- Header --- */ .company-header { text-align: center; border-bottom: 1px solid #eee; padding-bottom: 1.5rem; margin-bottom: 2rem; } .company-header h1 { font-weight: 600; color: #2c3e50; font-size: 1.75rem; } .company-header p { margin-bottom: 0.25rem; color: #555; font-size: 0.95rem; } /* --- Section Styling --- */ .form-section { margin-bottom: 2rem; } .section-title { font-weight: 600; font-size: 1.2rem; color: #333; margin-bottom: 1.5rem; display: flex; align-items: center; } .section-title i { font-size: 1.1rem; margin-right: 0.75rem; color: #40E0D0; /* Accent Color */ } /* --- Form Elements --- */ .form-control, .form-select { border-radius: 0.5rem; border: 1px solid #ced4da; padding: 0.75rem 1rem; transition: border-color 0.2s, box-shadow 0.2s; } .form-control:focus, .form-select:focus { border-color: #40E0D0; box-shadow: 0 0 0 0.25rem rgba(64, 224, 208, 0.2); } .form-control[readonly] { background-color: #e9ecef; font-weight: 600; } .form-check-input:checked { background-color: #40E0D0; border-color: #40E0D0; } /* --- Total Fare Section --- */ .total-fare-section { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 2px dashed #eee; } .grand-total-label { font-size: 1.2rem; font-weight: 600; color: #2c3e50; } .grand-total-input { font-size: 1.5rem; font-weight: 600; color: #40E0D0; text-align: right; } /* --- Buttons --- */ .btn { border-radius: 0.5rem; padding: 0.75rem 1.5rem; font-weight: 600; transition: all 0.3s ease; } .btn-primary { background-color: #40E0D0; border-color: #40E0D0; } .btn-primary:hover { background-color: #36c4b4; border-color: #36c4b4; transform: translateY(-2px); } .btn-secondary { background-color: #6c757d; border-color: #6c757d; } .btn-secondary:hover { background-color: #5a6268; border-color: #5a6268; } .btn-light { background-color: #f8f9fa; border-color: #ced4da; } /* --- Layover Section --- */ #layoverDetails { display: none; /* Hidden by default */ margin-top: 1rem; padding: 1.5rem; background-color: #fcfcfc; border: 1px solid #eee; border-radius: 0.5rem; } /* --- Preview Modal --- */ .modal-header { border-bottom: 1px solid #eee; } .modal-title { font-weight: 600; } #previewContent h5 { font-weight: 600; color: #40E0D0; margin-top: 1rem; margin-bottom: 1rem; font-size: 1.1rem; border-bottom: 1px solid #f0f0f0; padding-bottom: 0.5rem; } #previewContent p { margin-bottom: 0.5rem; } #previewContent .table { margin-top: 1rem; }