/* Oldschool Yet Elegant CSS */

/* Base Styles and Typography */
body {
    font-family: Georgia, 'Times New Roman', Times, serif;
    font-size: 18px;
    line-height: 1.7;
    color: #333333;
    background-color: #f9f9f4;
    margin: 0;
    padding: 0;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Palatino Linotype", Palatino, Palladio, "URW Palladio L", "Book Antiqua", Baskerville, "Bookman Old Style", "Bitstream Charter", "Nimbus Roman No9 L", Garamond, "Apple Garamond", "ITC Garamond Narrow", "New Century Schoolbook", "Century Schoolbook", "Century Schoolbook L", Georgia, serif;
    margin-top: 1em;
    margin-bottom: 0.5em;
    font-weight: normal;
}

h1 {
    font-size: 2.2em;
    text-align: center;
    color: #00246B; /* Howard University blue */
    margin-bottom: 0.2em;
    letter-spacing: -0.01em;
}

h2 {
    font-size: 1.8em;
    color: #00246B;
    border-bottom: 2px solid #C41E3A; /* Howard University red */
    padding-bottom: 0.2em;
    margin-bottom: 0.8em;
}

h3 {
    font-size: 1.4em;
    color: #00246B;
    margin-top: 1.5em;
    margin-bottom: 0.5em;
}

p {
    margin-bottom: 1.2em;
}

a {
    color: #00246B;
    text-decoration: none;
    border-bottom: 1px dotted #00246B;
}

a:hover, a:focus {
    color: #C41E3A;
    border-bottom: 1px solid #C41E3A;
}

/* Skip Link for Accessibility */
.skip-link {
    position: absolute;
    top: -40px;
    left: 0;
    background: #C41E3A;
    color: white;
    padding: 8px 12px;
    z-index: 100;
    transition: top 0.3s;
}

.skip-link:focus {
    top: 0;
}

/* Layout Table */
.layout-table {
    width: 90%;
    max-width: 1000px;
    margin: 20px auto;
    border: 1px solid #cccccc;
    border-collapse: collapse;
    background-color: #ffffff;
}

/* Header */
.header {
    padding: 30px 20px;
    background-color: #f3f3eb;
    text-align: center;
    border-bottom: 3px double #cccccc;
}

.header h2 {
    font-size: 1.4em;
    color: #555555;
    margin-top: 0.3em;
    border-bottom: none;
    font-style: italic;
}

.university {
    font-size: 1.1em;
    color: #00246B;
    margin-top: 0.3em;
}

/* Navigation */
.navigation-cell {
    width: 220px;
    padding: 20px;
    border-right: 3px double #cccccc;
    background-color: #f9f9f4;
}

.navigation h3 {
    font-size: 1.2em;
    margin-top: 0;
    margin-bottom: 0.8em;
    padding-bottom: 5px;
    border-bottom: 1px solid #cccccc;
}

.navigation ul {
    list-style-type: none;
    padding-left: 0;
    margin-bottom: 2em;
}

.navigation li {
    margin-bottom: 0.5em;
}

.navigation a {
    display: block;
    padding: 5px 3px;
    border-bottom: 1px dotted #cccccc;
}

.navigation a:hover, .navigation a:focus {
    background-color: #f3f3eb;
}

.contact-card, .links {
    margin-top: 2em;
    padding-top: 1em;
    border-top: 1px solid #cccccc;
}

.contact-card p {
    margin-bottom: 1em;
    font-size: 0.9em;
    line-height: 1.5;
}

/* Content Area */
.content-cell {
    padding: 30px;
    vertical-align: top;
    border-left: 1px solid #cccccc;
}

/* Card Styles */
.link-cards-container {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    padding: 20px 0; /* Top/bottom padding, parent handles side padding */
}

.link-card {
    background-color: #ffffff;
    border: 1px solid #cccccc;
    border-radius: 4px;
    padding: 15px 20px;
    flex: 1 1 200px; /* Grow and shrink, base width ~200px */
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    text-align: center;
}

.link-card a {
    border-bottom: none; /* Remove default dotted border for links within cards */
    display: block; /* Make the link fill the card for easier clicking */
    height: 100%; /* Ensure the link takes full height of the card */
    width: 100%; /* Ensure the link takes full width of the card */
}

.link-card:hover {
    border-color: #C41E3A; /* Howard University red */
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
/* End Card Styles */

.section {
    margin-bottom: 3em;
    padding-bottom: 1em;
    border-bottom: 1px solid #cccccc;
}

.section:last-child {
    border-bottom: none;
}

.content {
    max-width: 650px;
}

.ornament {
    height: 20px;
    vertical-align: middle;
    margin-right: 8px;
}

/* Tables */
.data-table {
    width: 100%;
    margin: 1em 0;
    border-collapse: collapse;
}

.data-table th {
    text-align: left;
    padding: 10px;
    background-color: #f3f3eb;
    border-bottom: 1px solid #cccccc;
}

.data-table td {
    padding: 10px;
    border-bottom: 1px solid #eeeeee;
}

.data-table tr:nth-child(even) {
    background-color: #f9f9f4;
}

/* Lists */
.bullet-list {
    list-style-type: square;
    margin: 1em 0;
    padding-left: 1.5em;
}

.bullet-list li {
    margin-bottom: 0.5em;
}

.publications-list {
    list-style-type: none;
    padding-left: 0;
}

.publications-list li {
    margin-bottom: 1.5em;
    padding-left: 1em;
    border-left: 3px solid #f3f3eb;
}

.pub-title {
    font-weight: bold;
    font-size: 1.1em;
}

.pub-authors {
    font-size: 0.95em;
    color: #555555;
    display: block;
    margin-top: 3px;
}

.pub-link {
    display: inline-block;
    margin-top: 5px;
    font-size: 0.9em;
}

/* Footer */
.footer {
    padding: 15px 20px;
    background-color: #f3f3eb;
    border-top: 3px double #cccccc;
    font-size: 0.9em;
    color: #555555;
    text-align: center;
}

.copyright, .accessibility, .last-updated {
    margin: 0.5em 0;
}

.accessibility a {
    color: #00246B;
    text-decoration: none;
    border-bottom: 1px dotted #cccccc;
    margin: 0 5px;
}

.accessibility a:hover, .accessibility a:focus {
    color: #C41E3A;
    border-bottom: 1px solid #C41E3A;
}

/* Newsletter Page Styles */
.newsletter-page {
    background-color: #f9f9f4; /* Consistent with main body background */
    color: #333333; /* Consistent with main body text color */
    font-family: Georgia, 'Times New Roman', Times, serif; /* Consistent with main body font */
    margin: 40px; /* Consistent with general body margin */
    line-height: 1.6; /* Consistent with general body line-height */
}
.newsletter-page h1 {
    font-family: "Palatino Linotype", Palatino, Palladio, "URW Palladio L", "Book Antiqua", Baskerville, "Bookman Old Style", "Bitstream Charter", "Nimbus Roman No9 L", Garamond, "Apple Garamond", "ITC Garamond Narrow", "New Century Schoolbook", "Century Schoolbook", "Century Schoolbook L", Georgia, serif;
    font-size: 2.2em;
    text-align: center;
    color: #00246B; /* Howard University blue */
    margin-bottom: 1em; /* Increased margin for spacing */
}
.newsletter-page p { /* Style for any text directly in newsletter.html body, if added later */
    margin-bottom: 1.2em;
    text-align: center; /* Center introductory text */
}
/* Center the iframe on the newsletter page */
.newsletter-page iframe {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    margin-bottom: 20px;
}

/* Footer Newsletter Styles */
footer div[style*="text-align: center"] h3 { /* Targeting the h3 in the newsletter footer */
    font-family: "Palatino Linotype", Palatino, Palladio, "URW Palladio L", "Book Antiqua", Baskerville, "Bookman Old Style", "Bitstream Charter", "Nimbus Roman No9 L", Garamond, "Apple Garamond", "ITC Garamond Narrow", "New Century Schoolbook", "Century Schoolbook", "Century Schoolbook L", Georgia, serif;
    font-size: 1.4em; /* Consistent with other h3 */
    color: #00246B; /* Howard University blue */
    margin-top: 1em;
    margin-bottom: 0.5em;
}
footer div[style*="text-align: center"] p { /* Targeting the p in the newsletter footer */
    margin-bottom: 1em; /* Space before the iframe */
    font-size: 1em; /* Standard paragraph size */
    color: #333333; /* Standard text color */
}
/* Ensure iframe in footer is also block and has some margin if not already handled by centering div */
footer iframe {
    display: block; /* Helps with centering if parent is text-align:center */
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px; /* Add some top margin */
}

/* High Contrast Mode */
body.high-contrast {
    color: white;
    background-color: black;
}

body.high-contrast .layout-table {
    background-color: black;
    border-color: #666666;
}

body.high-contrast .header,
body.high-contrast .navigation-cell,
body.high-contrast .footer {
    background-color: #111111;
}

body.high-contrast h1,
body.high-contrast h2,
body.high-contrast h3,
body.high-contrast .university,
body.high-contrast a {
    color: #ffcc00;
}

body.high-contrast a:hover,
body.high-contrast a:focus {
    color: #ffee66;
}

body.high-contrast .data-table th {
    background-color: #333333;
}

body.high-contrast .data-table tr:nth-child(even) {
    background-color: #222222;
}

body.high-contrast .publications-list li {
    border-left-color: #333333;
}

/* Responsive adjustments for mobile */
@media screen and (max-width: 768px) {
    .layout-table, .layout-table tr, .layout-table td {
        display: block;
        width: 100%;
    }
    
    .navigation-cell {
        width: auto;
        border-right: none;
        border-bottom: 3px double #cccccc;
    }
    
    .content-cell {
        border-left: none;
    }
    
    .navigation h3 {
        cursor: pointer;
    }
    
    .navigation ul {
        display: none;
    }
    
    .navigation ul.open {
        display: block;
    }
    
    .data-table {
        display: block;
        overflow-x: auto;
    }
    .link-card {
        font-size: 1.3em;
        padding: 20px;
    }

    button,
    .socials-container ul li a {
        font-size: 1.3em;
        padding: 14px 22px;
    }

}

/* Specific styles for links.html (Dark Theme & Courier New) */
.links-dark-theme {
    background-color: black;
    color: white;
    font-family: "Courier New", Courier, monospace;
}

/* Override general heading styles for links.html if necessary */
.links-dark-theme h1,
.links-dark-theme h2,
.links-dark-theme h3,
.links-dark-theme h4,
.links-dark-theme h5,
.links-dark-theme h6 {
    font-family: "Courier New", Courier, monospace; /* Ensure headings also use Courier */
    color: white; /* Ensure headings are white */
    border-bottom-color: #555; /* Adjust heading border color for dark theme */
}

/* Override general link styles for links.html */
/* This includes links inside cards, and the Tamil link if it's not further specialized */
.links-dark-theme a {
    font-family: "Courier New", Courier, monospace; /* Ensure links also use Courier */
    color: #87CEFA; /* LightSkyBlue, good for visibility on black */
    border-bottom: 1px dotted #87CEFA; /* Dotted border with the link color */
}

.links-dark-theme a:visited {
    color: #ADD8E6; /* LightBlue, slightly different for visited */
}

.links-dark-theme a:hover,
.links-dark-theme a:focus {
    color: #FFFFFF; /* White on hover for emphasis */
    border-bottom: 1px solid #FFFFFF;
}

/* Ensure content-cell under links-dark-theme also has transparent background or inherits appropriately */
/* The general .layout-table has a white background, so .content-cell needs to be black for links.html */
.links-dark-theme .layout-table { /* Override layout-table background for links page */
    background-color: black;
}

.links-dark-theme .content-cell {
    background-color: black; /* Ensure content cell is black */
    border-left: none; /* Remove border if it was added by general .content-cell style and looks odd */
    border-right: none; /* Remove border if it was added by general .content-cell style and looks odd */
}

/* Ensure the section under links-dark-theme also has transparent background */
.links-dark-theme .section {
    background-color: black; /* Ensure section is black */
    border-bottom: 1px solid #555; /* Adjust border color for dark theme */
}

.links-dark-theme .section:last-child {
    border-bottom: none;
}

/* Adjust hr color for dark theme */
.links-dark-theme hr {
  border-top: 1px solid #666;
}

/* Card styles specific overrides for dark theme */
/* .links-dark-theme .link-cards-container styling is generally inherited or fine as is */
/* No specific changes needed for gap or padding under .links-dark-theme for the container */

.links-dark-theme .link-card {
    background-color: #1c1c1c; /* Dark gray, slightly different from black page background */
    border: 1px solid #555;    /* Lighter gray border */
    color: white;               /* Inherits from .links-dark-theme, explicitly stated for clarity */
    font-family: "Courier New", Courier, monospace; /* Inherits, but explicit for clarity */
    box-shadow: none;           /* Remove box shadow for cleaner dark theme look */
    /* text-align: center; is inherited from general .link-card */
    /* padding: 15px 20px; is inherited */
    /* flex: 1 1 200px; is inherited */
}

.links-dark-theme .link-card a {
    font-family: "Courier New", Courier, monospace; /* Ensure Courier New */
    color: #87CEFA;            /* LightSkyBlue for visibility */
    border-bottom: none;        /* Remove border from link text inside card */
    text-decoration: none;      /* Remove underline by default */
    /* display: block; height: 100%; width: 100%; are inherited for clickability */
}

.links-dark-theme .link-card a:visited {
    color: #ADD8E6; /* LightBlue for visited links, consistent with general dark theme links */
}

.links-dark-theme .link-card a:hover,
.links-dark-theme .link-card a:focus {
    color: #FFFFFF;            /* White on hover/focus */
    text-decoration: underline; /* Add underline for hover/focus feedback */
    background-color: transparent; /* Ensure no background color change on the link itself */
    border-bottom: none;        /* Ensure no border appears on hover/focus */
}

.links-dark-theme .link-card:hover {
    background-color: #333;    /* Slightly lighter gray on card hover */
    border-color: #87CEFA;     /* Border to LightSkyBlue, matching link hover */
    box-shadow: none;           /* Ensure no shadow on hover either */
}


/* Ensure the 'தமிழ் / Tamil' link also follows the dark theme link style */
/* These rules are already covered by '.links-dark-theme a' but can be kept for specificity if .language div has other text */
.links-dark-theme .language a {
    font-family: "Courier New", Courier, monospace; /* Redundant if only 'a' is inside .language */
    color: #87CEFA;
    border-bottom: 1px dotted #87CEFA;
}

.links-dark-theme .language a:visited {
    color: #ADD8E6;
}

.links-dark-theme .language a:hover,
.links-dark-theme .language a:focus {
    color: #FFFFFF;
    border-bottom: 1px solid #FFFFFF;
}

/* Styles for socials.html */
/* body.socials-page specific styles are removed as links-dark-theme will be the primary theme. */
/* .socials-container h1 styles are removed as the h1 element was removed from socials.html. */

.socials-container {
    margin: 40px auto; /* Existing layout style */
    text-align: center; /* Existing layout style */
    max-width: 800px; /* Existing layout style */
    padding: 20px; /* Existing layout style */
}

.socials-container ul {
    list-style-type: none; /* Existing layout style */
    padding: 0; /* Existing layout style */
    display: flex; /* Existing layout style */
    flex-wrap: wrap; /* Existing layout style */
    justify-content: center; /* Existing layout style */
    gap: 20px; /* Space between items - existing layout style */
}

.socials-container ul li {
    /* No specific styles needed for li itself if gap is handled by ul */
}

.socials-container ul li a {
    font-family: "Courier New", Courier, monospace; /* Dark theme font */
    color: #87CEFA; /* LightSkyBlue - consistent with .links-dark-theme a */
    background-color: #1c1c1c; /* Consistent with .links-dark-theme .link-card */
    border: 1px solid #555;    /* Consistent with .links-dark-theme .link-card */
    text-decoration: none;
    font-size: 1.2em; /* Consider adjusting if needed with Courier New */
    display: flex;
    align-items: center;
    padding: 12px 18px;
    border-radius: 5px;
    transition: background-color 0.3s, color 0.3s, border-color 0.3s;
    /* border-bottom is covered by the general 'border' rule above. */
}

.socials-container ul li a:hover,
.socials-container ul li a:focus {
    color: #FFFFFF; /* White text on hover/focus */
    background-color: #333333; /* Consistent with .links-dark-theme .link-card:hover */
    border-color: #87CEFA;     /* Consistent with .links-dark-theme .link-card:hover */
    /* border-bottom is covered by the general 'border-color' rule on hover/focus. */
}

.socials-container ul li a i {
    margin-right: 10px; /* Space between icon and text */
    font-size: 1.5em; /* Larger icons */
    color: inherit; /* Icon color matches link text color, will pick up #87CEFA or #FFFFFF on hover */
}

.hotkey { font-size: 0.8em; color: #999; margin-right: 6px; }

/* Impact severity styles */
.bullet-list li.catastrophic { color: #ff6b6b; font-weight: bold; }
.bullet-list li.silver-lining { color: #32cd32; }
.bullet-list li.neutral { color: #ffd700; }

/* Special styling for trump bill impacts page */
.impacts-page .bullet-list {
    list-style: none;
    padding-left: 0;
}

.impacts-page .bullet-list li {
    position: relative;
    margin: 12px 0;
    padding: 12px 16px 12px 48px;
    background: linear-gradient(135deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02));
    border-radius: 8px;
    border-left: 4px solid currentColor;
    opacity: 0;
    transform: translateX(-20px);
    animation: slideIn 0.6s forwards;
}

.impacts-page .bullet-list li::before {
    position: absolute;
    left: 12px;
    top: 12px;
    font-size: 1.2em;
}

.impacts-page .bullet-list li.catastrophic::before { content: "\1F4A5"; }
.impacts-page .bullet-list li.silver-lining::before { content: "\2728"; }
.impacts-page .bullet-list li.neutral::before { content: "\2696"; }

@keyframes slideIn {
    from { opacity: 0; transform: translateX(-20px); }
    to { opacity: 1; transform: translateX(0); }
}