/* Print rules shared by every public theme, the hub and the admin panel.
   Assets\CSS serves this first, then print-site.css (public sites only), then the
   area's own print.css, all as /css/print.css loaded with media="print".
   Colours print as designed, so backgrounds and coloured text survive the
   browser's "background graphics" setting; chrome is hidden instead. */

@page {
    size: auto;
    margin: 14mm 12mm;
}

html,
body {
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: #fff none !important;
}

body {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
}

*,
*::before,
*::after {
    animation: none !important;
    transition: none !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

/* Opt-out and opt-in hooks for templates and page content. */
.print-hide,
.no-print,
.noprint,
.hidden-print,
.d-print-none {
    display: none !important;
}

.print-show {
    display: block !important;
}

iframe,
video,
embed,
object,
.g-recaptcha,
.grecaptcha-badge,
.modal,
.modal-backdrop,
.tooltip,
.popover {
    display: none !important;
}

img,
svg,
canvas {
    max-width: 100% !important;
}

img {
    height: auto;
}

h1, h2, h3, h4, h5, h6 {
    break-after: avoid;
    page-break-after: avoid;
    break-inside: avoid;
    page-break-inside: avoid;
}

p, li, dd, blockquote {
    orphans: 3;
    widows: 3;
}

img,
svg,
canvas,
figure,
blockquote,
pre,
tr,
.print-avoid-break {
    break-inside: avoid;
    page-break-inside: avoid;
}

thead {
    display: table-header-group;
}

pre {
    white-space: pre-wrap !important;
}

a[href]::after,
abbr[title]::after {
    content: none !important;
}

/* Contact header (global/defaults/print-header.tpl), hidden on screen by its
   hidden attribute. */
.print-header[hidden] {
    display: flex !important;
    align-items: center;
    gap: 14px;
    margin: 0 0 16px;
    padding: 0 0 10px;
    border-bottom: 3px solid var(--print-brand, #333);
    font: 13px/1.4 Arial, Helvetica, sans-serif;
    color: #333;
    break-inside: avoid;
    page-break-inside: avoid;
}

.print-header__logo {
    width: 64px;
    height: auto;
    flex: none;
}

.print-header__name {
    display: block;
    margin: 0 0 2px;
    font-size: 19px;
    font-weight: 700;
    color: #111;
}

.print-header__details span + span::before {
    content: "\00a0\00b7\00a0";
}

/* Opening hours and areas covered, printed after the contact page content by
   global/defaults/print-footer.tpl. */
.print-footer[hidden] {
    display: flex !important;
    gap: 24px;
    margin: 20px 0 0;
    padding: 12px 0 0;
    border-top: 2px solid var(--print-brand, #333);
    font: 13px/1.45 Arial, Helvetica, sans-serif;
    color: #222;
    break-inside: avoid;
    page-break-inside: avoid;
}

.print-footer__section {
    flex: 1 1 0;
}

.print-footer__heading {
    margin: 0 0 6px;
    font-size: 15px;
    font-weight: 700;
    color: #111;
}

.print-footer__hours {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 2px 14px;
    margin: 0;
}

.print-footer__hours dt {
    font-weight: 700;
}

.print-footer__hours dd {
    margin: 0;
}

.print-footer p {
    margin: 0;
}

/* Print rules for the public instructor sites, covering the chrome rendered by
   the global widgets. Each theme's css/print.css follows with its own header,
   navigation, hero, sidebar and footer selectors. */

.navbar,
#back-to-top,
.back-to-top,
.ldc-whatsapp,
.social-share,
ul.social,
.findme,
a.app,
.ios-app,
.android-app,
.users,
.basket,
#session,
nav[aria-label="Breadcrumb"],
.breadcrumb,
.carousel-control,
.carousel-indicators,
.call-button,
.btn,
button,
input[type="submit"],
input[type="button"],
form[action="/contacts"],
form[action="/prices"],
form[action="/search"],
form[action="/login"],
form[action="/forgot"],
form[action="/register"],
form[action="#review"],
.prices-search,
.postcode-prices:has(form),
.ldc-offer-band__cta {
    display: none !important;
}

/* Share buttons (widgets/social.tpl), and any card that holds only them. */
div:has(> a[href*="facebook.com/sharer.php"]),
.card:has(a[href*="facebook.com/sharer.php"]) {
    display: none !important;
}

/* Tailwind themes: navigation, mobile drawers, contact top bars, the layout
   sidebar and every fixed layer (drawers, back-to-top, decorative backdrops),
   which would otherwise repeat on each printed page. */
#navigation,
#mobile-menu,
#mobile-drawer,
[role="region"][aria-label="Contact details"],
#main-content aside,
.fixed {
    display: none !important;
}

#main-content .lg\:grid-cols-12 {
    display: block !important;
}

.min-h-screen {
    min-height: 0 !important;
}

/* Tailwind page header (the .site-hero root of header.tpl / header-home.tpl):
   kept as a compact band in the theme's colours with only its title and
   strapline; decoration, artwork, calls to action and breadcrumbs drop out. */
.site-hero {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 0 18px !important;
    padding: 18px 22px !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 8px;
    break-inside: avoid;
    page-break-inside: avoid;
}

/* Only the H1, the strapline straight after it and the elements wrapping them
   print; badges, cards, stats, artwork and buttons around them drop out. */
.site-hero *:not(:has(h1)):not(h1):not(h1 *):not(h1 + p):not(h1 + p *):not(h1 + h2):not(h1 + h2 *) {
    display: none !important;
}

.site-hero :where(*:has(h1)) {
    display: block !important;
    width: auto !important;
    max-width: none !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
    transform: none !important;
}

.site-hero h1 {
    margin: 0 0 6px !important;
    font-size: 28px !important;
    line-height: 1.2 !important;
}

.site-hero h2,
.site-hero p {
    margin: 0 !important;
    font-size: 15px !important;
    line-height: 1.4 !important;
}

/* Content runs the full width of the page at any paper size or orientation. */
.container,
.container-fluid {
    width: auto !important;
    max-width: none !important;
}

/* Horizontal scroll carousels wrap onto further rows instead of clipping. */
.snap-x {
    flex-wrap: wrap !important;
    overflow: visible !important;
}

/* Tabs and accordions print every pane, not just the open one. */
.tab-content > .tab-pane,
.panel-collapse.collapse,
.accordion .collapse {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    height: auto !important;
}

.nav-tabs {
    display: none !important;
}

/* WYSIWYG content images keep their float but never overflow the page. */
#content img,
#main-content img {
    max-width: 100% !important;
    height: auto !important;
}

/* flare: phone call-outs sit in both the content column (small screens) and the
   sidebar; the contact header replaces them. */

#content .phone-block,
#content .social-icons,
#content aside#sidebar,
footer#footer,
#page-title .l-plate {
    display: none !important;
}

main#content {
    background: none !important;
}

#content > .container > .row > [class*="col-md-"] {
    float: none !important;
    width: 100% !important;
}

/* Page title */
#page-title {
    position: static !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
    background: none !important;
    border: 0 !important;
}

#page-title .container {
    padding: 0 !important;
    background: none !important;
    text-align: left !important;
}

#page-title h1,
#page-title h2 {
    margin: 0 0 4px !important;
    text-align: left !important;
    color: #111 !important;
}

#page-title h2 {
    color: #555 !important;
}

