/**
 * UPLINQ — Extended Utilities & Bootstrap Overrides
 *
 * This file is loaded after Bootstrap and style.css.
 * Use it for:
 *   • Fine-tuning Bootstrap component defaults
 *   • Adding helpers not in style.css
 *   • One-off section/block overrides
 *
 * @package UPLINQ
 */


/* =========================================================================
   BOOTSTRAP VARIABLE OVERRIDES
   (align Bootstrap utilities with UPLINQ brand tokens)
   ========================================================================= */

:root {
  /* Map BS5 color variables → UPLINQ tokens */
  --bs-primary:             var( --uplinq-accent );
  --bs-primary-rgb:         79, 126, 255;
  --bs-link-color:          var( --uplinq-accent );
  --bs-link-hover-color:    var( --uplinq-accent-hover );
  --bs-border-radius:       var( --uplinq-radius-md );
  --bs-border-radius-sm:    var( --uplinq-radius-sm );
  --bs-border-radius-lg:    var( --uplinq-radius-lg );
  --bs-border-radius-xl:    var( --uplinq-radius-xl );
  --bs-border-radius-xxl:   var( --uplinq-radius-2xl );
  --bs-border-radius-pill:  var( --uplinq-radius-full );
  --bs-font-sans-serif:     var( --uplinq-font-body );
  --bs-font-monospace:      var( --uplinq-font-mono );
  --bs-body-font-family:    var( --uplinq-font-body );
  --bs-body-font-size:      var( --uplinq-fs-base );
  --bs-body-line-height:    var( --uplinq-lh-relaxed );
  --bs-body-color:          var( --uplinq-gray-800 );
  --bs-body-bg:             var( --uplinq-white );
}


/* =========================================================================
   READING PROGRESS BAR
   ========================================================================= */

#uplinq-reading-progress {
  position: fixed;
  top: 0;
  left: 0;
  width: 0;
  height: 3px;
  background: linear-gradient( 90deg, var( --uplinq-accent ), var( --uplinq-highlight ) );
  z-index: calc( var( --uplinq-z-toast ) + 10 );
  transition: width .1s linear;
  border-radius: 0 var( --uplinq-radius-full ) var( --uplinq-radius-full ) 0;
}


/* =========================================================================
   BACK TO TOP BUTTON
   ========================================================================= */

#back-to-top {
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  z-index: var( --uplinq-z-overlay );
  width: 46px;
  height: 46px;
  border-radius: var( --uplinq-radius-lg );
  background: var( --uplinq-accent );
  color: var( --uplinq-white );
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: var( --uplinq-shadow-lg );
  opacity: 0;
  transform: translateY( 12px );
  pointer-events: none;
  transition: opacity var( --uplinq-transition ), transform var( --uplinq-transition );
}

#back-to-top.visible {
  opacity: 1;
  transform: translateY( 0 );
  pointer-events: auto;
}

#back-to-top:hover {
  background: var( --uplinq-accent-hover );
  transform: translateY( -2px );
}


/* =========================================================================
   COPY CODE BUTTON
   ========================================================================= */

.uplinq-copy-btn {
  position: absolute;
  top: .65rem;
  right: .65rem;
  font-size: .7rem;
  padding: .2rem .55rem;
  opacity: 0;
  transition: opacity var( --uplinq-transition-fast );
}

pre:hover .uplinq-copy-btn {
  opacity: 1;
}


/* =========================================================================
   SCROLL REVEAL
   ========================================================================= */

[data-reveal] {
  opacity: 0;
  transform: translateY( 20px );
  transition: opacity .55s ease, transform .55s ease;
}

[data-reveal].revealed {
  opacity: 1;
  transform: none;
}

[data-reveal="left"]  { transform: translateX( -24px ); }
[data-reveal="right"] { transform: translateX(  24px ); }
[data-reveal="scale"] { transform: scale( .95 ); }

[data-reveal].revealed { transform: none; }


/* =========================================================================
   NAVIGATION BODY LOCK (mobile)
   ========================================================================= */

body.nav-open {
  overflow: hidden;
}


/* =========================================================================
   WP CORE ALIGNMENT HELPERS
   ========================================================================= */

.alignleft  { float: left; margin: 0 var( --uplinq-space-xl ) var( --uplinq-space-lg ) 0; }
.alignright { float: right; margin: 0 0 var( --uplinq-space-lg ) var( --uplinq-space-xl ); }
.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: var( --uplinq-space-lg );
}

.alignwide {
  margin-left:  -4vw;
  margin-right: -4vw;
}

.alignfull {
  margin-left:  calc( -1 * ( ( 100vw - 100% ) / 2 ) );
  margin-right: calc( -1 * ( ( 100vw - 100% ) / 2 ) );
  max-width: 100vw;
  width: 100vw;
}

@media ( max-width: 768px ) {
  .alignleft,
  .alignright {
    float: none;
    margin: 0 0 var( --uplinq-space-lg );
  }

  .alignwide {
    margin-left: 0;
    margin-right: 0;
  }
}


/* =========================================================================
   WP CORE BLOCK STYLES
   ========================================================================= */

.wp-block-image img {
  border-radius: var( --uplinq-radius-lg );
}

.wp-block-image figcaption {
  text-align: center;
  font-size: var( --uplinq-fs-sm );
  color: var( --uplinq-gray-500 );
  margin-top: var( --uplinq-space-sm );
}

.wp-block-pullquote {
  border-top: 4px solid var( --uplinq-accent );
  border-bottom: 4px solid var( --uplinq-accent );
  padding: var( --uplinq-space-2xl );
  text-align: center;
}

.wp-block-pullquote blockquote {
  border-left: none;
  background: none;
  border-radius: 0;
  padding: 0;
}

.wp-block-pullquote blockquote p {
  font-size: var( --uplinq-fs-2xl );
  font-weight: 700;
  color: var( --uplinq-primary );
  font-style: normal;
}

.wp-block-table table {
  border: 1px solid var( --uplinq-gray-200 );
  border-radius: var( --uplinq-radius-lg );
  overflow: hidden;
}

.wp-block-table th {
  background: var( --uplinq-gray-50 );
  font-weight: 700;
}

.wp-block-buttons .wp-block-button__link {
  font-family: var( --uplinq-font-heading );
  font-weight: 700;
  border-radius: var( --uplinq-radius-lg );
  transition: all var( --uplinq-transition );
}

.wp-block-cover {
  border-radius: var( --uplinq-radius-xl );
  overflow: hidden;
}


/* =========================================================================
   NOTICE / CALLOUT BLOCKS
   ========================================================================= */

.wp-block-notice,
.wp-block-callout,
.uplinq-notice {
  padding: var( --uplinq-space-lg );
  border-radius: var( --uplinq-radius-lg );
  margin-bottom: var( --uplinq-space-xl );
  border-left: 4px solid currentColor;
}

.uplinq-notice--info    { background: #EFF6FF; color: #1D4ED8; border-color: #3B82F6; }
.uplinq-notice--success { background: #F0FDF4; color: #166534; border-color: #22C55E; }
.uplinq-notice--warning { background: #FFFBEB; color: #92400E; border-color: #F59E0B; }
.uplinq-notice--danger  { background: #FEF2F2; color: #991B1B; border-color: #EF4444; }


/* =========================================================================
   MISC FIXES
   ========================================================================= */

/* Fix Bootstrap modal focus trap with sticky header */
.modal-open .uplinq-header {
  padding-right: var( --bs-scrollbar-width, 0px );
}

/* Ensure images inside cards don't overflow */
.uplinq-card .wp-post-image {
  max-width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Remove margin from last paragraph in widgets */
.uplinq-widget p:last-child {
  margin-bottom: 0;
}

/* Gravity Forms / Contact Form 7 styling */
.uplinq-entry-content .gform_wrapper input,
.uplinq-entry-content .wpcf7 input,
.uplinq-entry-content .wpcf7 textarea,
.uplinq-entry-content .wpcf7 select {
  border: 1.5px solid var( --uplinq-gray-300 );
  border-radius: var( --uplinq-radius-lg );
  padding: .65rem 1rem;
  width: 100%;
  font-family: var( --uplinq-font-body );
  transition: border-color var( --uplinq-transition-fast ),
              box-shadow   var( --uplinq-transition-fast );
}

.uplinq-entry-content .wpcf7 input:focus,
.uplinq-entry-content .wpcf7 textarea:focus {
  border-color: var( --uplinq-accent );
  box-shadow: 0 0 0 3px rgba( 79, 126, 255, .15 );
  outline: none;
}
