.lightbox-overlay {
      position: fixed;
      top: 0	;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.8);
      display: flex;
      justify-content: center;
      align-items: center;
      z-index: 1000;
      opacity: 0;
      visibility: hidden;
      transition: opacity 0.3s ease, visibility 0.3s ease;
    }

    .lightbox-overlay.active {
      opacity: 1;
      visibility: visible;
    }

    /* Lightbox container */
    .lightbox-content {
      background: white;
      border-radius: 8px;
      box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
      position: relative;
      /* 🔧 CONTROL SIZE HERE */
      width: 80vw;        /* 80% of viewport width */
      height: 80vh;       /* 80% of viewport height */
      max-width: 1000px;  /* Optional: max width */
      max-height: 800px;  /* Optional: max height */
      display: flex;
      flex-direction: column;
	  padding-bottom: 60px;
    }

    /* Close button */
    .close-btn {
		  position: absolute;
		  bottom: 20px;          /* Distance from bottom */
		  left: 50%;             /* Center horizontally */
		  transform: translateX(-50%); /* Perfect centering */
		  background: #ff4444;
		  color: white;
		  border: none;
		  border-radius: 25px;   /* Pill shape */
		  padding: 10px 20px;    /* Wider click area */
		  font-size: 16px;
		  cursor: pointer;
		  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
		  z-index: 1001;
    }

    .close-btn:hover {
      background: #cc0000;
    }

    /* PDF viewer */
    .pdf-viewer {
      flex: 1;
      width: 100%;
      height: 100%;
      border: none;
      border-radius: 0 0 8px 8px;
    }