/* ==========================================================================
   Prodigy HMS — site-wide overrides on the Velzon theme
   Loaded LAST in layouts/head-css.php, after app.min.css and custom.min.css.

   assets/css/app.min.css and custom.min.css are vendor files: a theme update
   overwrites them, so corrections to theme behaviour belong here instead.
   ========================================================================== */


/* ── 1. The gap above page content ──────────────────────────────────────────
   The fixed topbar is 70px tall, and the system was clearing it THREE times
   over, each fix added independently:

     layouts/topbar.php   body { padding-top: 70px }              70px
     layouts/topbar.php   .topbar-spacer { height: 70px }         70px
     app.min.css          .page-content { padding-top:            94px
                                          calc(70px + 1.5rem) }
                                                          total = 234px

   A 70px bar was therefore pushed clear by 234px, leaving ~164px of dead
   space above the first card on every page — measured on list_patients.php
   at 1600x900.

   Exactly one mechanism is needed. The .topbar-spacer is kept as the single
   source of clearance because it works on any page, including the handful
   that render no .page-content at all (training_log.php, case_studies.php,
   supervisor_feedback.php, supervised_consultations.php). Its responsive
   heights in topbar.php already track the topbar at each breakpoint.

   With clearance handled by the spacer, .page-content's padding-top is no
   longer structural — it is now purely the visual gap between the bar and
   the first card. The body padding-top is removed in layouts/topbar.php.

   Tune the gap here; do not reintroduce a second clearance. */
:root {
    --pg-content-gap: 1.25rem;
}

.page-content {
    padding-top: var(--pg-content-gap);
}

/* The theme's layout variants each restate the padding. Match them all so the
   gap stays put if the layout mode is ever switched. */
[data-layout="horizontal"] .page-content,
[data-layout="semibox"]    .page-content {
    padding-top: var(--pg-content-gap);
}

@media (min-width: 1024.1px) {
    /* [data-layout=horizontal] adds margin-top:70px — a third clearance. */
    [data-layout="horizontal"] .page-content { margin-top: 0; }
}


/* ── 2. First-child margin collapse ─────────────────────────────────────────
   Some pages open with a heading or .row carrying its own top margin, which
   lands on top of the gap above and quietly widens it again. Suppress it for
   the first element only. */
.page-content > .container-fluid > *:first-child,
.page-content > .container > *:first-child {
    margin-top: 0;
}