/*
* assets/css/pages/single-guide.css
*
* Styles for the Single Guide page to differentiate it from the Single Blog page.
* Uses a light and airy color scheme.
*/

/* --- Single Page Hero --- */
.single-guide .hero-overlay {
    background-color: rgba(96, 125, 139, 0.7); /* Professional Blue-Grey Overlay */
}

/* --- Sidebar Widget Light Theme --- */
.single-guide .sidebar-column .widget {
    background-color: #ffffff;
    color: #495057; /* Standard dark text color */
    border-color: #e9ecef; /* Light grey border */
}

.single-guide .sidebar-column .widget-title {
    color: #212529; /* Darker title text */
    border-bottom-color: #e9ecef;
}

/* --- Sidebar Interactive Elements --- */

/* Table of Contents */
.single-guide .toc-widget .table-of-contents li a {
    color: #495057; /* Standard dark text */
}

.single-guide .toc-widget .table-of-contents li a:hover {
    background-color: #fff8f0; /* Very light orange background on hover */
    color: #212529; /* Darker text on hover */
    border-left-color: #f97316; /* Accent orange */
}

/* CTA Widget */
.single-guide .cta-widget p {
    color: #495057; /* Standard dark text */
}

.single-guide .widget.cta-widget .btn-cta-primary {
    background-color: #f97316; /* Accent orange */
    color: #ffffff;
}
.single-guide .widget.cta-widget .btn-cta-primary:hover {
    background-color: #e86a04; /* Slightly darker orange */
}

/* Social Icons */
.single-guide .social-share-widget a {
    color: #6c757d; /* Muted gray for icons */
}

.prose-blue h1, .prose-blue h2, .prose-blue h3, .prose-blue h4, .prose-blue h5, .prose-blue h6 {
    color: #1e3a8a; /* primary-dark-blue */
}

.prose-blue p, .prose-blue li, .prose-blue blockquote {
    color: #374151; /* gray-700 */
}

.prose-blue a {
    color: #f97316; /* accent-orange */
    transition: color 0.3s ease;
}

.prose-blue a:hover {
    color: #ea580c; /* darker orange */
}

.prose-blue strong {
    color: #1e3a8a;
}

.prose-blue blockquote {
    border-left-color: #93c5fd; /* blue-300 */
    color: #1d4ed8; /* blue-700 */
    background-color: #eff6ff; /* blue-50 */
    padding: 1em 1.5em;
}

/* --- Sidebar Widgets --- */
.sidebar-column .widget {
    background-color: #ffffff;
    border-radius: 0.5rem;
    padding: 1.5rem;
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
}

.sidebar-column .widget-title {
    font-size: 1.25rem;
    font-weight: 700;
    color: #1e3a8a; /* primary-dark-blue */
    margin-bottom: 1rem;
    padding-bottom: 0.75rem;
    border-bottom: 1px solid #e5e7eb; /* gray-200 */
}

/* Table of Contents Widget */
.toc-widget .table-of-contents ul {
    list-style: none;
    padding: 0;
    margin: 0;
    space-y: 0.5rem;
}

.toc-widget .table-of-contents li a {
    display: block;
    padding: 0.5rem 1rem;
    border-radius: 0.375rem;
    color: #374151; /* gray-700 */
    font-weight: 500;
    transition: all 0.2s ease-in-out;
    border-left: 3px solid transparent;
}

.toc-widget .table-of-contents li a:hover {
    background-color: #eff6ff; /* blue-50 */
    color: #1d4ed8; /* blue-700 */
    border-left-color: #3b82f6; /* blue-500 */
    transform: translateX(4px);
}

/* Social Share Widget */
.social-share-widget .flex {
    gap: 1rem;
}

.social-share-widget a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    border-radius: 9999px;
    background-color: #f3f4f6; /* gray-100 */
    color: #4b5563; /* gray-600 */
    transition: all 0.3s ease;
}

.social-share-widget a:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

.social-share-widget .facebook:hover { background-color: #1877F2; color: white; }
.social-share-widget .twitter-x:hover { background-color: #000000; color: white; }
.social-share-widget .instagram:hover { background: #d6249f; background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%); color: white; }
.social-share-widget .linkedin:hover { background-color: #0A66C2; color: white; }

.single-guide .entry-content {
    background-color: #ffffff;
    border-radius: 0.5rem;
    padding: 2rem;
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
}

@media (min-width: 768px) {
    .single-guide .entry-content {
        padding: 3rem;
    }
}

.prose-blue h2, .prose-blue h3, .prose-blue h4 {
    color: #001f3f;
    font-weight: 700;
}

.prose-blue h2 {
    font-size: 1.875rem; /* 30px */
    margin-top: 2em;
    margin-bottom: 1em;
    padding-bottom: 0.5em;
    border-bottom: 1px solid #e5e7eb; /* gray-200 */
}

.prose-blue h3 {
    font-weight: 600;
    font-size: 1.5rem; /* 24px */
    margin-top: 1.8em;
    margin-bottom: 0.8em;
}

.prose-blue h4 {
    font-weight: 600;
    font-size: 1.25rem; /* 20px */
    margin-top: 1.6em;
    margin-bottom: 0.6em;
}

.prose-blue ul {
    list-style-type: disc;
    padding-left: 1.5em;
}

.prose-blue ol {
    list-style-type: decimal;
    padding-left: 1.5em;
}

.prose-blue li {
    margin-bottom: 0.5em;
}