@tailwind base;
@tailwind components;
@tailwind utilities;

@media print {

  /* ---------------- Hard reset ---------------- */
  *,
  *::before,
  *::after {
    box-shadow: none !important;
    text-shadow: none !important;
    animation: none !important;
    transition: none !important;

    /* Force text to pure black */
    color: #000 !important;
    -webkit-text-fill-color: #000 !important;

    /* Kill borders completely */
    border-color: #fff !important;
    border-width: 0 !important;

    /* Kill all backgrounds (incl. gradients) */
    background-color: #fff !important;
    background-image: none !important;
  }


  /* Kill ALL shadows everywhere */
  *,
  *::before,
  *::after {
    box-shadow: none !important;
    text-shadow: none !important;
    filter: none !important;
    outline: none !important;
  }
/* ---------------- Clamp margins ---------------- */
  [class*="mt-"],
  [class*="mb-"],
  [class*="my-"] {
    margin-top: 0.25rem !important;   /* mt-3 */
    margin-bottom: 0.25rem !important;/* mb-3 */
  }

  [class*="ml-"],
  [class*="mr-"],
  [class*="mx-"] {
    margin-left: 0.25rem !important;  /* mx-3 */
    margin-right: 0.25rem !important;
  }
 
  .mdi,
  [class^="mdi-"],
  [class*=" mdi-"],
  i.mdi,
  svg.mdi {
    display: none !important;
  }
  /* ---------------- Clamp padding ---------------- */
  [class*="pt-"],
  [class*="pb-"],
  [class*="py-"] {
    padding-top: 0.25rem !important;  /* py-3 */
    padding-bottom: 0.25rem !important;
  }

  [class*="pl-"],
  [class*="pr-"],
  [class*="px-"] {
    padding-left: 0.25rem !important; /* px-3 */
    padding-right: 0.25rem !important;
  }
  /* Kill ALL borders everywhere */
  *,
  *::before,
  *::after,
  table,
  th,
  td,
  hr {
    border: 0 !important;
    border-width: 0 !important;
    border-style: none !important;
  }

  hr {
    display: none !important;
  }

  html,
  body {
    background-color: #fff !important;
    background-image: none !important;
  }

  /* Kill Tailwind gradient variables + bg opacity */
  * {
    --tw-bg-opacity: 1 !important;
    --tw-gradient-from: #fff !important;
    --tw-gradient-to: #fff !important;
    --tw-gradient-stops: #fff, #fff !important;
  }

  /* Force bg utilities to white (covers bg-[color] and friends) */
  [class*="bg-"],
  [class*="from-"],
  [class*="to-"],
  [class*="via-"],
  [class*="bg-gradient"],
  .bg-gradient-to-b,
  .bg-gradient-to-t,
  .bg-gradient-to-r,
  .bg-gradient-to-l {
    background-color: #fff !important;
    background-image: none !important;
  }

  /* ---------------- Hide UI ---------------- */
  header,
  footer,
  aside,
  nav,
  [role="navigation"],
  [role="navigation"][aria-label="Breadcrumb"],
  .breadcrumb,
  .nav-sticky,
  .defaultscroll,
  select,
  button,
#author-info,
  form,
  label,
  script,
  #debug,
  #explore,
  #teasers,
  [id^="ROS_"] {
    display: none !important;
  }

  /* ---------------- Links = plain text ---------------- */
  a {
    text-decoration: none !important;
  }
  a::after {
    content: none !important;
  }

  /* ---------------- Masthead (top-left) ---------------- */
  body {
    position: relative !important;
    padding-top: 16mm !important; /* space for masthead */
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  body::before {
    content: "MovieInsider.com";
    position: absolute;
    top: 0;
    left: 0;

    font-size: 18pt;
    font-weight: 800;
    letter-spacing: 0.06em;
    text-transform: uppercase;

    width: 100%;
    padding: 2mm 0 3mm 0;
  }

  /* Hairline rule under masthead */
  body::after {
    content: "";
    position: absolute;
    top: 12mm;
    left: 0;
    right: 0;
    height: 0;
    border-top: 1px solid #000; /* visible line */
  }

  /* ---------------- Legal footer ---------------- */
  html::after {
    content: "Copyright © The Movie Insider LLC";
    position: fixed;
    bottom: 10mm;
    left: 20mm;
    font-size: 9pt;
    color: #000 !important;
  }

  /* ---------------- Page setup ---------------- */
  @page {
    size: A4;
    margin: 18mm 20mm 14mm;
  }

  /* ---------------- Page break safety ---------------- */
  h1, h2, h3 {
    page-break-after: avoid;
  }
  table,
  figure {
    page-break-inside: avoid;
  }
}