/*!
Theme Name: my_theme
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: my_theme
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.
*/

/* Custom styles can be added here or compiled via SASS */

/* ============================================================================
 * Blog Detail Page Styles
 * ========================================================================== */
.blog-detail-layout {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
  width: 100%;
}
@media (min-width: 1024px) {
  .blog-detail-layout {
    display: grid !important;
    grid-template-columns: 320px minmax(0, 1fr) !important;
    gap: 3rem !important;
    align-items: start !important;
  }
}

.blog-detail-sidebar {
  width: 100%;
}
@media (min-width: 1024px) {
  .blog-detail-sidebar {
    width: 320px !important;
    max-width: 320px !important;
    position: sticky !important;
    top: 6.5rem !important;
    align-self: start !important;
    z-index: 20;
  }
}

.blog-sidebar-sticky {
  position: static;
}
@media (min-width: 1024px) {
  .blog-sidebar-sticky {
    position: sticky !important;
    top: 6.5rem !important;
    max-height: calc(100vh - 8rem);
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: #DDE6ED transparent;
  }
}

.blog-detail-main {
  width: 100%;
  min-width: 0;
}

.blog-share-icon {
  width: 15px !important;
  height: 15px !important;
  max-width: 15px !important;
  max-height: 15px !important;
  flex-shrink: 0 !important;
  display: inline-block !important;
}

.blog-toc-link {
  display: block;
  color: #5A6B7A;
  text-decoration: none;
  font-size: 0.8125rem;
  line-height: 1.45;
  transition: color 0.15s ease;
}
.blog-toc-link:hover {
  color: #0F1B24;
}
.blog-toc-link.is-active {
  color: #0077B8;
  font-weight: 600;
}

.blog-article-content {
  font-size: 1.125rem;
  line-height: 1.8;
  color: #2D3E4E;
}
.blog-article-content p {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}
.blog-article-content h2 {
  font-family: inherit;
  font-size: 1.875rem;
  font-weight: 800;
  color: #0F1B24;
  letter-spacing: -0.02em;
  line-height: 1.25;
  margin-top: 2.75rem;
  margin-bottom: 1.25rem;
  scroll-margin-top: 6.5rem;
}
@media (min-width: 768px) {
  .blog-article-content h2 {
    font-size: 2.125rem;
  }
}
.blog-article-content h3 {
  font-size: 1.375rem;
  font-weight: 700;
  color: #0F1B24;
  margin-top: 2.25rem;
  margin-bottom: 1rem;
  scroll-margin-top: 6.5rem;
}
.blog-article-content ul,
.blog-article-content ol {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
  padding-left: 1.5rem;
}
.blog-article-content ul {
  list-style-type: disc;
}
.blog-article-content ol {
  list-style-type: decimal;
}
.blog-article-content li {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}
.blog-article-content blockquote {
  border-left: 4px solid #0077B8;
  padding-left: 1.25rem;
  font-style: italic;
  color: #03334C;
  margin-top: 2rem;
  margin-bottom: 2rem;
}
.blog-article-content strong {
  color: #0F1B24;
  font-weight: 700;
}
.blog-article-content a {
  color: #0077B8;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.blog-article-content a:hover {
  color: #005A8C;
}

/* ============================================================================
 * Mobile Floating Sticky Bottom Action Bar (WhatsApp Us / Inquire Now)
 * ========================================================================== */
.mobile-sticky-action-bar {
  display: flex !important;
  position: fixed !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  height: 52px !important;
  z-index: 99999 !important;
  box-shadow: 0 -3px 12px rgba(0, 0, 0, 0.15);
  margin: 0 !important;
  padding: 0 !important;
}

@media (min-width: 768px) {
  .mobile-sticky-action-bar {
    display: none !important;
  }
}

.mobile-sticky-bar-btn {
  flex: 1 1 50% !important;
  width: 50% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.5rem !important;
  font-family: inherit !important;
  font-weight: 700 !important;
  font-size: 0.9375rem !important;
  color: #ffffff !important;
  text-decoration: none !important;
  line-height: 1 !important;
  padding: 0 0.5rem !important;
  border: none !important;
  box-sizing: border-box !important;
}

.mobile-sticky-btn-whatsapp {
  background-color: #25D366 !important;
}

.mobile-sticky-btn-whatsapp:hover,
.mobile-sticky-btn-whatsapp:active {
  background-color: #20BD5A !important;
}

.mobile-sticky-btn-inquire {
  background-color: #0077B8 !important;
}

.mobile-sticky-btn-inquire:hover,
.mobile-sticky-btn-inquire:active {
  background-color: #006094 !important;
}

.mobile-sticky-bar-btn svg {
  display: inline-block !important;
  vertical-align: middle !important;
  color: #ffffff !important;
  fill: #ffffff !important;
  flex-shrink: 0 !important;
}

.mobile-sticky-bar-btn svg path {
  fill: #ffffff !important;
  color: #ffffff !important;
}

@media (max-width: 767px) {
  body {
    padding-bottom: 52px !important;
  }
}