/* Compact Layout CSS - Reduces excessive spacing across the application */

/* ============================================ */
/* HEADER REDUCTION */
/* ============================================ */

/* Reduce top bar height */
.top-bar {
    padding: 0.25rem 0 !important;
    font-size: 0.7rem !important;
}

.top-bar-item {
    font-size: 0.65rem !important;
    margin-left: 0.5rem !important;
}

.top-bar-select {
    font-size: 0.65rem !important;
    padding: 0.1rem 0.3rem !important;
}

/* Reduce main header height */
.main-header {
    margin-bottom: 0 !important;
    padding: 0 !important;
}

.main-header .navbar {
    padding: 0.3rem 0 !important;
    min-height: auto !important;
}

.navbar-brand img.navbar-logo {
    height: 35px !important; /* Reduced from default */
    width: auto !important;
}

.navbar-nav .nav-link {
    padding: 0.3rem 0.7rem !important;
    font-size: 0.85rem !important;
}

.btn-register {
    padding: 0.3rem 0.8rem !important;
    font-size: 0.85rem !important;
}

header {
    margin-bottom: 0 !important;
}

main {
    padding-top: 0.5rem !important; /* Small gap to prevent overlap */
    margin-top: 0 !important;
}

/* ============================================ */
/* STEPPER COMPACT DESIGN */
/* ============================================ */

/* Reduce stepper section padding */
.stepper-section {
    padding: 1rem 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0.5rem !important;
    background: #ffffff !important;
    position: relative !important;
    z-index: 1 !important;
    min-height: 80px !important;
}

/* Reduce booking stepper spacing */
.booking-stepper {
    max-width: 700px !important;
    margin: 0 auto !important;
    padding: 55px 30px 1px 10px;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* Step container */
.booking-stepper .step,
.step {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    position: relative !important;
    min-height: 65px !important;
}

/* Compact stepper icons - Keep circular but smaller */
.booking-stepper .step .step-icon,
.stepper-section .step-icon,
.step-icon {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    border-radius: 50% !important;
    font-size: 1rem !important;
    background: #e9ecef !important;
    color: #6c757d !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 2 !important;
    transition: all 0.3s !important;
    margin-bottom: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    border: none !important;
    overflow: visible !important;
}

.booking-stepper .step .step-icon i,
.stepper-section .step-icon i,
.step-icon i {
    display: block !important;
    font-size: 1rem !important;
    line-height: 1 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.step.active .step-icon {
    background: #ec4353 !important;
    color: white !important;
    box-shadow: 0 3px 10px rgba(236, 67, 83, 0.3) !important;
}

.step.completed .step-icon {
    background: #28a745 !important;
    color: white !important;
}

/* Compact stepper labels */
.step-label {
    margin-top: 0.4rem !important;
    font-size: 0.75rem !important;
    color: #495057 !important;
    font-weight: 500 !important;
    text-align: center !important;
    white-space: nowrap !important;
}

.step.active .step-label {
    color: #ec4353 !important;
    font-weight: 600 !important;
}

.step.completed .step-label {
    color: #28a745 !important;
}

/* Compact stepper lines */
.step-line {
    width: 50px !important;
    height: 2px !important;
    background: #dee2e6 !important;
    margin: 0 0.5rem !important;
    flex-shrink: 0 !important;
    align-self: center !important;
    margin-top: -20px !important;
}

.step-line.completed {
    background: #28a745 !important;
}

/* Reduce container spacing */
.container, .container-fluid {
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
}

/* ============================================ */
/* GLOBAL FONT SIZE REDUCTION */
/* ============================================ */

body {
    font-size: 0.85rem !important;
}

h1 { font-size: 1.5rem !important; }
h2 { font-size: 1.3rem !important; }
h3 { font-size: 1.1rem !important; }
h4 { font-size: 1rem !important; }
h5 { font-size: 0.9rem !important; }
h6 { font-size: 0.85rem !important; }

label {
    font-size: 0.85rem !important;
    margin-bottom: 0.25rem !important;
}

/* ============================================ */
/* CARD COMPACT DESIGN */
/* ============================================ */

/* Tighten card spacing */
.card {
    margin-bottom: 0.5rem !important;
}

.card-body {
    padding: 0.75rem !important;
}

.card-header {
    padding: 0.5rem 0.75rem !important;
    font-size: 0.9rem !important;
}

/* Reduce section spacing - MORE AGGRESSIVE */
section {
    padding-top: 3.5rem !important;
    padding-bottom: 0.5rem !important;
    margin-top: 0 !important;
    margin-bottom: 0.5rem !important;
}

section.stepper-section,
section.compose-section,
section.schedule-section,
section.select-package-section,
section.print-media-section {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
    margin: 0 !important;
}

/* ============================================ */
/* FORM COMPACT DESIGN */
/* ============================================ */

/* Tighten form spacing */
.form-group, .mb-3 {
    margin-bottom: 0.5rem !important;
}

/* Compact form controls */
.form-control, .form-select {
    padding: 0.35rem 0.5rem !important;
    font-size: 0.85rem !important;
    height: auto !important;
}

textarea.form-control {
    padding: 0.35rem 0.5rem !important;
    font-size: 0.85rem !important;
}

.form-check {
    margin-bottom: 0.25rem !important;
    font-size: 0.85rem !important;
}

.form-check-input {
    margin-top: 0.15rem !important;
}

.form-check-label {
    font-size: 0.85rem !important;
}

/* Reduce row spacing */
.row {
    margin-bottom: 0.5rem;
}

/* Compact package cards */
.package-card {
    padding: 1rem !important;
    margin-bottom: 0.75rem !important;
}

/* Compact invoice/summary tables */
.table-sm td, .table-sm th {
    padding: 0.5rem !important;
}

/* ============================================ */
/* BUTTON COMPACT DESIGN */
/* ============================================ */

/* Reduce button spacing */
.btn {
    padding: 0.35rem 0.75rem !important;
    font-size: 0.85rem !important;
}

.btn-lg {
    padding: 0.5rem 1rem !important;
    font-size: 0.9rem !important;
}

.btn-sm {
    padding: 0.25rem 0.5rem !important;
    font-size: 0.75rem !important;
}

/* Invoice Summary Compact */
.invoice-summary {
    margin-bottom: 0.5rem !important;
}

.invoice-summary h6,
.invoice-summary .h6 {
    font-size: 0.85rem !important;
    margin-bottom: 0.25rem !important;
}

.invoice-summary .card-body {
    padding: 0.5rem 0.75rem !important;
}

.invoice-summary .d-flex {
    margin-bottom: 0.25rem !important;
}

/* Compact alerts */
.alert {
    padding: 0.75rem 1rem !important;
    margin-bottom: 0.75rem !important;
}

/* Reduce spacing in compose section */
.compose-card {
    margin-bottom: 0.75rem !important;
}

.compose-footer {
    padding: 0.75rem 1rem !important;
    margin-top: 0.5rem !important;
}

/* ============================================ */
/* AD PREVIEW & COMPOSE COMPACT DESIGN */
/* ============================================ */

/* Compact preview container */
#adPreviewContainer {
    padding: 0.5rem !important;
    min-height: 200px !important;
    font-size: 0.85rem !important;
}

/* Compact ad preview text */
#adPreviewContainer h3,
#adPreviewContainer h4 {
    font-size: 1rem !important;
    margin-bottom: 0.25rem !important;
}

#adPreviewContainer p {
    font-size: 0.85rem !important;
    margin-bottom: 0.25rem !important;
}

/* Edition badge compact */
.badge {
    padding: 0.25rem 0.5rem !important;
    font-size: 0.75rem !important;
}

/* Reduce calendar spacing */
.calendar-container {
    margin: 0.5rem auto !important;
}

.calendar-header {
    padding: 0.5rem !important;
    margin-bottom: 0.75rem !important;
}

/* Compact selected dates list */
.selected-dates-list {
    gap: 0.5rem !important;
    min-height: 30px !important;
}

/* Navigation button spacing */
.d-flex.justify-content-between {
    margin-top: 0 !important;
}

/* Compact publication info sidebar */
.sticky-top {
    top: 10px !important;
}

/* Reduce edition badge spacing */
.badge {
    padding: 0.5rem 1rem !important;
}

/* Tighten invoice summary */
.invoice-summary {
    margin-bottom: 0.75rem !important;
}

/* Reduce enhancement section spacing */
.enhancement-section {
    padding: 1rem !important;
}

/* Compact offer cards */
.offer-option {
    padding: 0.75rem !important;
    margin-bottom: 0.5rem !important;
}

/* Remove excessive margins from headings */
h1, h2, h3, h4, h5, h6 {
    margin-bottom: 0.75rem !important;
}

/* Compact list items */
.list-group-item {
    padding: 0.75rem 1rem !important;
}

/* Reduce modal padding */
.modal-body {
    padding: 1rem !important;
}

.modal-header, .modal-footer {
    padding: 0.75rem 1rem !important;
}

/* Tighten navigation spacing */
.nav-link {
    padding: 0.5rem 1rem !important;
}

/* Compact tables */
table {
    margin-bottom: 0.75rem !important;
}

/* Reduce page-specific spacing */
.print-media-section,
.compose-section,
.schedule-section,
.select-package-section {
    padding: 1rem 0 !important;
}

/* Override Bootstrap's default spacing utilities where needed - MORE AGGRESSIVE */
.py-5 {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}

.py-4 {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}

.my-5 {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
}

.my-4 {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
}

.py-3 {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}

.my-3 {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
}

.mb-4 {
    margin-bottom: 0.5rem !important;
}

.mb-5 {
    margin-bottom: 0.5rem !important;
}

.mt-4 {
    margin-top: 0.5rem !important;
}

.mt-5 {
    margin-top: 0.5rem !important;
}

/* Ensure content starts closer to header */
main, .main-content {
    padding-top: 0 !important;
    margin-top: 0 !important;
}