/* ============================================================
   "What Are the Differences between SR 15-18 and SR 15-19?"

   Location: 2023SRA/css/sr1518.css
   Loaded by sra_enqueue_page_bundles(), keyed on data-sra-bundle="sr1518".
   Depends on 'chld_thm_cfg_child'. Pairs with /js/sr1518.js.

   Migrated out of an inline <style> block in the post content.

   EIGHTEEN SITE-WIDE LEAKS FIXED
     The original declared these unscoped, so on this page they restyled the
     entire document - header, navigation, footer and all:

       html   *   body   h2   h2::after   h3   h3::after   h4   h4::after
       p   ul   li   table   th   td   tr:hover   a   a:hover

     Every rule is now scoped under .sr1518 on the post wrapper. The html and
     body rules became rules on that wrapper, since that is what they were
     actually trying to style.

   The 31 class names are kept exactly as they were. Several are generic -
   .container, .active, .tab-btn, .quote-box - which is why this is a bundle
   rather than an addition to style.css: putting .active or .container in a
   site-wide stylesheet would collide with the Services page and others.

   Nothing here changes rendering. This post ranks fourth for
   "SR 15-18 vs SR 15-19", above the Federal Reserve's own letters, and four
   of its anchors are Google sitelinks. Appearance and ids are unchanged.
   ============================================================ */

.sr1518 {
            scroll-behavior: smooth;
            height: 100%;
            overflow-x: hidden;
        }

        .sr1518 * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        .sr1518 {
            font-family: 'Open Sans','Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            line-height: 1.7;
            color: #333;
            font-size: 16px;
            min-height: 100vh;
            overflow-x: hidden;
            width: 100%;
        }

        .sr1518 .container {
            max-width: 1400px;
            margin: 0 auto;
            padding: 0;
            width: 100%;
            overflow-x: hidden;
        }

        .sr1518 .hero-section {
            background: linear-gradient(135deg, #3a4373 0%, #4a61a3 100%);
            color: white;
            padding: 60px 0;
            text-align: center;
            margin-bottom: 40px;
        }

        .sr1518 .hero-section h1 {
            font-size: 2.5rem;
            font-weight: 700;
            margin-bottom: 20px;
            text-shadow: 0 2px 4px rgba(0,0,0,0.3);
        }

        .sr1518 .content-section {
            padding: 0;
            margin-bottom: 30px;
        }

        .sr1518 .update-notice {
            background: #f0f9f0;
            border: 1px solid #4ade80;
            border-radius: 8px;
            padding: 15px;
            margin: 15px 0;
            font-size: 14px;
        }

        .sr1518 .update-notice strong {
            color: #16a34a;
        }

        .sr1518 h2 {
            color: #1e293b;
            font-size: 1.8rem;
            font-weight: 600;
            margin-bottom: 20px;
            padding: 8px 0;
            position: relative;
            padding-bottom: 12px;
        }

        .sr1518 h2::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 60px;
            height: 2px;
            background: #4a61a3;
        }

        .sr1518 h3 {
            color: #334155;
            font-size: 1.4rem;
            font-weight: 600;
            margin: 28px 0 15px 0;
            padding: 4px 0;
            position: relative;
            padding-bottom: 8px;
        }

        .sr1518 h3::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 40px;
            height: 1px;
            background: #6b7db3;
        }

        .sr1518 h4 {
            color: #475569;
            font-size: 1.2rem;
            font-weight: 600;
            margin: 22px 0 10px 0;
            position: relative;
            padding-bottom: 6px;
        }

        .sr1518 h4::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            width: 30px;
            height: 1px;
            background: #8b9dc3;
        }

        .sr1518 p {
            margin-bottom: 18px;
            text-align: justify;
        }

        .sr1518 .quote-box {
            color: #374151;
            padding: 12px 20px 12px 45px;
            margin: 20px 0 20px 40px;
            background: rgba(74, 97, 163, 0.02);
            border-radius: 0 3px 3px 0;
            position: relative;
        }

        .sr1518 .quote-box::before {
            content: '"';
            font-size: 60px;
            position: absolute;
            top: -10px;
            left: 15px;
            opacity: 0.3;
            color: #6b7db3;
        }

        .sr1518 ul {
            margin: 15px 0;
            padding-left: 30px;
        }

        .sr1518 li {
            margin-bottom: 10px;
            line-height: 1.6;
        }

        .sr1518 .subsections-list {
            padding-left: 60px;
        }

        .sr1518 .table-container {
            background: white;
            border-radius: 8px;
            overflow: hidden;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
            margin: 20px 0;
        }

        .sr1518 table {
            width: 100%;
            border-collapse: collapse;
        }

        .sr1518 th {
            background: #3a4373;
            color: white;
            padding: 15px;
            text-align: left;
            font-weight: 600;
        }

        .sr1518 td {
            padding: 15px;
            border-bottom: 1px solid #e0e0e0;
        }

        .sr1518 tr:hover {
            background: #f8f9fa;
        }

        .sr1518 /* Desktop Categories Table */
        .categories-table {
            width: 100%;
            border-collapse: collapse;
            margin: 20px 0;
            background: white;
            border-radius: 8px;
            overflow: hidden;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
        }

        .sr1518 .categories-table th {
            background: #3a4373;
            color: white;
            padding: 15px;
            text-align: left;
            font-weight: 600;
            font-size: 1.1rem;
        }

        .sr1518 .categories-table td {
            padding: 15px 12px;
            border-bottom: 1px solid #e0e0e0;
            vertical-align: top;
        }

        .sr1518 .categories-table .category-name {
            background: #f0f4ff;
            font-weight: 700;
            color: #3a4373;
            width: 25%;
            font-size: 1.1rem;
        }

        .sr1518 .categories-table .category-desc {
            color: #555;
            font-size: 14px;
            line-height: 1.6;
        }

        .sr1518 .categories-table tr:last-child td {
            border-bottom: none;
        }

        .sr1518 .categories-table tr:hover {
            background: #f8f9fa;
        }

        .sr1518 /* Mobile Categories Cards */
        .mobile-categories {
            display: none;
        }

        .sr1518 .category-card {
            margin-bottom: 16px;
            border-radius: 8px;
            overflow: hidden;
            box-shadow: 0 2px 8px rgba(0,0,0,0.1);
        }

        .sr1518 .category-card:last-child {
            margin-bottom: 0;
        }

        .sr1518 .category-header {
            background: #3a4373;
            color: white;
            font-weight: 700;
            font-size: 18px;
            padding: 16px 20px;
        }

        .sr1518 .category-content {
            background: white;
            color: #555;
            font-size: 16px;
            line-height: 1.6;
            padding: 16px 20px;
        }

        .sr1518 /* Desktop Main Navigation - Horizontal */
        .desktop-main-tabs {
            margin: 20px 0;
            position: sticky;
            top: 0;
            background: white;
            z-index: 100;
            padding: 10px 0;
        }

        .sr1518 .desktop-main-tabs .tabs-nav {
            display: flex;
            border-bottom: 1px solid #e2e8f0;
            gap: 40px;
        }

        .sr1518 .desktop-main-tabs .tab-btn {
            background: none;
            border: none;
            padding: 12px 0;
            font-size: 16px;
            font-weight: 500;
            color: #64748b;
            text-decoration: none;
            position: relative;
            transition: color 0.3s ease;
        }

        .sr1518 .desktop-main-tabs .tab-btn:hover {
            color: #4a61a3;
        }

        .sr1518 .desktop-main-tabs .tab-btn.active {
            color: #4a61a3;
            font-weight: 600;
        }

        .sr1518 .desktop-main-tabs .tab-btn.active::after {
            content: '';
            position: absolute;
            bottom: -1px;
            left: 0;
            right: 0;
            height: 3px;
            background: #4a61a3;
            border-radius: 2px 2px 0 0;
        }

        .sr1518 /* Mobile Main Navigation - Vertical */
        .mobile-main-tabs {
            display: none;
            margin: 0;
            padding: 15px;
            background: white;
        }

        .sr1518 .mobile-main-tabs .tabs-nav {
            display: flex;
            flex-direction: column;
            gap: 0;
        }

        .sr1518 .mobile-main-tabs .tab-btn {
            background: white;
            border: 1px solid #e2e8f0;
            border-bottom: none;
            padding: 18px 20px;
            font-size: 16px;
            font-weight: 500;
            color: #374151;
            text-decoration: none;
            position: relative;
            transition: all 0.3s ease;
            text-align: left;
        }

        .sr1518 .mobile-main-tabs .tab-btn:first-child {
            border-radius: 8px 8px 0 0;
        }

        .sr1518 .mobile-main-tabs .tab-btn:last-child {
            border-bottom: 1px solid #e2e8f0;
            border-radius: 0 0 8px 8px;
        }

        .sr1518 .mobile-main-tabs .tab-btn::after {
            content: '›';
            position: absolute;
            right: 20px;
            color: #cbd5e1;
            font-size: 18px;
        }

        .sr1518 .mobile-main-tabs .tab-btn:hover {
            background: #f8fafc;
            color: #4a61a3;
        }

        .sr1518 .mobile-main-tabs .tab-btn.active {
            background: rgba(74, 97, 163, 0.05);
            color: #4a61a3;
            font-weight: 600;
            border-left: 4px solid #4a61a3;
        }

        .sr1518 /* Nested section tabs styling */
        .section-tabs-container {
            margin: 20px 0;
        }

        .sr1518 .section-tabs-container .tabs-nav {
            display: flex;
            flex-wrap: wrap;
            gap: 20px;
            align-items: flex-start;
            border-bottom: none;
            margin-bottom: 20px;
            width: 100%;
        }

        .sr1518 .tab-group {
            position: relative;
            flex: 1;
            min-width: 100%;
        }

        .sr1518 .group-header {
            font-weight: 600;
            color: #4a61a3;
            padding: 8px 12px;
            background: rgba(74, 97, 163, 0.05);
            border-radius: 6px 6px 0 0;
            border-bottom: 2px solid #4a61a3;
            margin-bottom: 4px;
            font-size: 16px;
            width: 100%;
        }

        .sr1518 .group-items {
            display: flex;
            flex-wrap: wrap;
            gap: 8px;
            width: 100%;
        }

        .sr1518 .section-tabs-container .tab-btn {
            background: transparent;
            border: none;
            border-bottom: 2px solid transparent;
            border-radius: 6px 6px 0 0;
            padding: 12px 16px;
            font-size: 16px;
            font-weight: 500;
            color: #64748b;
            margin: 0;
            text-decoration: none;
            transition: all 0.3s ease;
            position: relative;
            bottom: 0;
            flex: 1;
            min-width: calc(50% - 4px);
            text-align: left;
        }

        .sr1518 .section-tabs-container .tab-btn:hover {
            color: #334155;
            border-bottom-color: #cbd5e1;
            background: rgba(74, 97, 163, 0.02);
        }

        .sr1518 .section-tabs-container .tab-btn.active {
            color: #4a61a3;
            border-bottom-color: #4a61a3;
            background: rgba(74, 97, 163, 0.05);
            font-weight: 600;
        }

        .sr1518 /* Return to tabs button */
        .return-to-tabs {
            display: inline-flex;
            align-items: center;
            justify-content: center;
            background: rgba(58, 67, 115, 0.08);
            border: 1px solid #4a61a3;
            border-radius: 20px;
            padding: 6px 12px;
            margin-left: 15px;
            font-size: 12px;
            color: #4a61a3;
            text-decoration: none;
            transition: all 0.3s ease;
            cursor: pointer;
            vertical-align: middle;
        }

        .sr1518 .return-to-tabs:hover {
            background: #4a61a3;
            color: white;
            text-decoration: none;
        }

        .sr1518 .return-to-tabs::before {
            content: "↑";
            margin-right: 4px;
            font-weight: bold;
        }

        .sr1518 .section-heading-container {
            display: flex;
            flex-direction: column-reverse;
            align-items: flex-end;
            margin: 30px 0 15px 0;
            gap: 8px;
        }

        .sr1518 .section-heading-container h3 {
            margin: 0;
            align-self: flex-start;
            width: 100%;
        }

        .sr1518 /* Continue button */
        .continue-to-next {
            background: linear-gradient(135deg, #4a61a3 0%, #3a4373 100%);
            color: white;
            border: none;
            border-radius: 25px;
            padding: 12px 24px;
            font-size: 16px;
            font-weight: 600;
            cursor: pointer;
            transition: all 0.3s ease;
            margin: 40px auto 20px auto;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
        }

        .sr1518 .continue-to-next:hover {
            transform: translateY(-2px);
            background: linear-gradient(135deg, #5a71b3 0%, #4a5383 100%);
        }

        .sr1518 .continue-to-next::after {
            content: "→";
            font-size: 18px;
            font-weight: bold;
        }

        .sr1518 /* Category tooltip */
        .category-tooltip {
            position: relative;
            cursor: help;
            border-bottom: 1px dotted #4a61a3;
            color: #3a4373;
            font-weight: 600;
            overflow: visible;
        }

        .sr1518 .category-tooltip:hover {
            color: #4a61a3;
        }

        .sr1518 .category-tooltip .tooltip-text {
            visibility: hidden;
            width: 280px;
            background-color: #2c2c2c;
            color: #fff;
            text-align: left;
            border-radius: 8px;
            padding: 12px;
            position: fixed;
            z-index: 1000;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            opacity: 0;
            transition: opacity 0.3s;
            font-size: 13px;
            line-height: 1.4;
            font-weight: normal;
            box-shadow: 0 4px 12px rgba(0,0,0,0.3);
            max-width: min(280px, 90vw);
            white-space: normal;
            word-wrap: break-word;
            pointer-events: none;
        }

        .sr1518 .category-tooltip .tooltip-text::after {
            display: none;
        }

        .sr1518 .category-tooltip:hover .tooltip-text {
            visibility: visible;
            opacity: 1;
        }

        /* Mobile tooltip adjustments */
        @media (max-width: 768px) {
            .sr1518 .category-tooltip .tooltip-text {
                width: 90vw;
                max-width: 300px;
                font-size: 12px;
                padding: 10px;
            }
        }

        /* Small mobile adjustments */
        @media (max-width: 480px) {
            .sr1518 .category-tooltip .tooltip-text {
                width: 95vw;
                max-width: 280px;
                font-size: 11px;
                padding: 8px;
            }
        }

        /* Tablet adjustments */
        @media (max-width: 1024px) and (min-width: 769px) {
            .sr1518 .category-tooltip .tooltip-text {
                max-width: 300px;
            }
        }

        .sr1518 .footnote {
            font-size: 14px;
            color: #666;
            margin-top: 20px;
            padding-top: 15px;
            border-top: 1px solid #e0e0e0;
        }

        .sr1518 a {
            color: #2c5aa0;
            text-decoration: none;
            font-weight: 500;
        }

        .sr1518 a:hover {
            text-decoration: underline;
            color: #1a4480;
        }

        /* Mobile/Tablet Responsive */
        @media (max-width: 1024px) {
            .sr1518 .container {
                padding: 0;
                max-width: 100%;
            }

            .sr1518 .content-section {
                padding: 20px 15px;
            }

            .sr1518 /* Show mobile navigation,
.sr1518 hide desktop */
            .desktop-main-tabs {
                display: none;
            }

            .sr1518 .mobile-main-tabs {
                display: block;
            }

            .sr1518 /* Show mobile categories,
.sr1518 hide desktop table */
            .categories-table {
                display: none;
            }

            .sr1518 .mobile-categories {
                display: block;
            }

            .sr1518 .section-tabs-container .tabs-nav {
                flex-direction: column;
                gap: 12px;
            }

            .sr1518 .group-items {
                display: flex;
                flex-direction: column;
                gap: 4px;
            }

            .sr1518 .section-tabs-container .tab-btn {
                min-width: 100%;
                flex: none;
                border-radius: 4px;
                border-bottom: none;
            }
        }

        @media (max-width: 768px) {
            .sr1518 .hero-section h1 {
                font-size: 2rem;
            }

            .sr1518 .content-section {
                padding: 10px 15px;
            }

            .sr1518 /* Hide continue buttons on mobile */
            .continue-to-next {
                display: none;
            }

            .sr1518 /* Mobile continuous scroll - show all main tab content */
            #main-background,
.sr1518 #main-sections,
.sr1518 #main-appendices,
.sr1518 #main-bank-lists {
                display: block !important;
            }

            .sr1518 .quote-box {
                padding: 12px 15px 12px 35px;
                margin: 20px 0 20px 25px;
            }

            .sr1518 .quote-box::before {
                font-size: 40px;
                top: -5px;
                left: 10px;
            }

            .sr1518 .table-container {
                overflow-x: auto;
            }

            .sr1518 table th,
.sr1518 table td {
                padding: 10px 8px;
                font-size: 14px;
            }
        }