/**
 * Theme Name:     WB 2025 - Child
 * Author:         Waseem Bari
 * Template:       twentytwentyfive
 * Text Domain:	   wb-2025-child
 * Description:    Twenty Twenty-Five emphasizes simplicity and adaptability.
 */



/* styling for password-protected form content */
.post-password-form {
  display: flex;
  flex-direction: column; /* stack input and button vertically */
  align-items: center;    /* center horizontally */
  justify-content: center; /* center vertically */
  height: 100vh;           /* fill viewport height */
}
.post-password-form input,
.post-password-form button {
  font-family: var(--wp--preset--font-family--montserrat);
  font-size: larger;
  padding: 0.3rem;
  margin: 0.25rem; /* space between input and button */
  border-radius: 100px; /* makes it fully rounded */
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
.post-password-form-invalid-password {
		color: yellow;
}

/* back to top btn */
#back-to-top {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 20px;
  background-color: #007bff;
  color: white;
  padding: 10px 15px;
  border-radius: 5px;
  cursor: pointer;
}

/* Custom text selection color */
::selection {
    background-color: #000000;
    color: #ffffff;
}

/* Firefox */
::-moz-selection {
    background-color: #000000;
    color: #ffffff;
}

/* Invert color selection
::selection {
    background-color: #ffffff;
    color: #000000;
    mix-blend-mode: difference;
}
/* Firefox
::-moz-selection {
    background-color: #ffffff;
    color: #000000;
    mix-blend-mode: difference;
} */

/* =============================================
   Glow Image — Blurred Shadow Clone
   Control Panel: adjust these variables only
   ============================================= */

.glow-image {
    --glow-blur: 20px;        /* Blur amount of shadow clone */
    --glow-spread: 10px;      /* How far shadow clone spreads */
    --glow-opacity: 0.5;      /* Opacity of shadow clone */
    --glow-scale: 1.05;       /* Scale of shadow clone */
    /*--glow-radius: 12px;      /* Border radius of both images */
    --glow-transition: 0.4s;  /* Hover transition speed */

    position: relative !important;
    display: inline-block !important;
}

/* The blurred clone behind */
.glow-image::after {
    content: "" !important;
    position: absolute !important;
    inset: calc(var(--glow-spread) * -1) !important;
    z-index: -1 !important;
    border-radius: var(--glow-radius) !important;

    background-image: var(--glow-src) !important;
    background-size: cover !important;
    background-position: center !important;

    filter: blur(var(--glow-blur)) !important;
    opacity: var(--glow-opacity) !important;
    transform: scale(var(--glow-scale)) !important;

    transition: opacity var(--glow-transition) ease,
                filter var(--glow-transition) ease !important;
}

/* Front image */
.glow-image img {
    position: relative !important;
    z-index: 1 !important;
    border-radius: var(--glow-radius) !important;
    display: block !important;
    width: 100% !important;
}