/* Custom text shadow for banner headings */
.site-heading h1 {
    text-shadow: 
        0 0 8px rgba(64, 64, 64, 0.6),
        0 0 15px rgba(64, 64, 64, 0.4),
        1px 1px 3px rgba(64, 64, 64, 0.7) !important;
    color: #ffffff !important;
}

.site-heading .subheading {
    text-shadow: 
        0 0 6px rgba(64, 64, 64, 0.5),
        0 0 12px rgba(64, 64, 64, 0.3),
        1px 1px 2px rgba(64, 64, 64, 0.6) !important;
    color: #ffffff !important;
}

/* Navbar with semi-transparent white background for better readability */
.navbar-custom {
    background-color: rgba(255, 255, 255, 0.65) !important; /* Reduced opacity from 0.85 to 0.65 */
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}

/* Ensure navbar text remains readable with the white background */
.navbar-custom .navbar-brand,
.navbar-custom .nav li a {
    color: #404040 !important;
}

.navbar-custom .navbar-brand:hover,
.navbar-custom .navbar-brand:focus,
.navbar-custom .nav li a:hover,
.navbar-custom .nav li a:focus {
    color: #0085a1 !important;
}

/* Fix hamburger menu visibility on white navbar */
.navbar-custom .navbar-toggle .icon-bar {
    background-color: #404040 !important;
}

.navbar-custom .navbar-toggle:hover .icon-bar,
.navbar-custom .navbar-toggle:focus .icon-bar {
    background-color: #222 !important;
}

/* Adjust banner heading vertical centering to account for navbar */
.intro-header .site-heading {
    padding-top: 180px !important; /* Increased from default 150px to account for navbar height */
}

/* For smaller screens, adjust accordingly and fix header cropping */
@media only screen and (max-width: 767px) {
    .intro-header .site-heading {
        padding-top: 100px !important; /* Reduced from 130px to prevent cropping */
        padding-bottom: 80px !important; /* Add bottom padding to prevent cropping */
    }
    
    .intro-header .site-heading h1 {
        font-size: 40px !important; /* Reduce font size on mobile to fit better */
        margin-bottom: 10px !important;
    }
    
    .intro-header .site-heading .subheading {
        font-size: 16px !important; /* Reduce subheading font size */
    }
}

/* Fix table responsiveness for mobile devices */
@media only screen and (max-width: 767px) {
    /* Make tables responsive by allowing horizontal scroll */
    .post-container table:not(.termine-table) { /* Apply general horizontal scroll to non-termine tables */
        display: block !important;
        width: 100% !important;
        overflow-x: auto !important;
        white-space: nowrap !important;
        -webkit-overflow-scrolling: touch !important;
    }
    
    .post-container table:not(.termine-table) th,
    .post-container table:not(.termine-table) td {
        white-space: nowrap !important;
        padding: 8px 12px !important;
        font-size: 14px !important;
    }
    
    /* Stack table content vertically for termine-table on very small screens */
    /* Add a class "termine-table" to the table in your markdown/html if it's not already there */
    .post-container table.termine-table,
    .post-container table.termine-table thead,
    .post-container table.termine-table tbody,
    .post-container table.termine-table th,
    .post-container table.termine-table td,
    .post-container table.termine-table tr {
        display: block !important;
    }
    
    .post-container table.termine-table thead tr {
        position: absolute !important;
        top: -9999px !important;
        left: -9999px !important;
    }
    
    .post-container table.termine-table tr {
        border: 1px solid #ccc !important;
        margin-bottom: 10px !important;
        padding: 10px !important;
    }
    
    .post-container table.termine-table td {
        border: none !important;
        position: relative !important;
        padding-left: 40% !important; /* Adjust padding to make space for label */
        white-space: normal !important; /* Allow text to wrap */
        min-height: 22px; /* Ensure a minimum height for cells */
    }
    
    .post-container table.termine-table td:before {
        /* Use data-label attribute for cell labels */
        content: attr(data-label) !important; 
        position: absolute !important;
        left: 6px !important;
        width: 35% !important; /* Adjust width of the label */
        padding-right: 10px !important;
        white-space: nowrap !important;
        font-weight: bold !important;
    }
}

/* Fix Termine page text cropping on small devices */
@media only screen and (max-width: 767px) {
  .post-container {
    padding-left: 10px !important;
    padding-right: 10px !important;
    box-sizing: border-box;
  }
  .post-container h1, .post-container h2, .post-container h3, .post-container h4, .post-container h5, .post-container h6 {
    word-break: break-word;
    font-size: 1.3em;
  }
  .post-container p, .post-container ul, .post-container ol, .post-container table {
    word-break: break-word;
    overflow-wrap: break-word;
  }
}

/* Custom styling for post metadata in post list */
.post-preview > .post-meta {
    font-family: -apple-system, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", STHeiti, "Microsoft YaHei", "Microsoft JhengHei", "Source Han Sans SC", "Noto Sans CJK SC", "Source Han Sans CN", "Noto Sans SC", "Source Han Sans TC", "Noto Sans CJK TC", "WenQuanYi Micro Hei", SimSun, sans-serif !important;
    font-style: normal !important;
    font-size: 12px !important;
    color: gray !important;
    margin-top: 0 !important;
}

.post-preview > .post-meta > a {
    font-family: -apple-system, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", STHeiti, "Microsoft YaHei", "Microsoft JhengHei", "Source Han Sans SC", "Noto Sans CJK SC", "Source Han Sans CN", "Noto Sans SC", "Source Han Sans TC", "Noto Sans CJK TC", "WenQuanYi Micro Hei", SimSun, sans-serif !important;
    font-style: normal !important;
    font-size: 12px !important;
    color: gray !important;
}

/* Responsive font sizes for larger screens */
@media only screen and (min-width: 768px) {
    .post-preview .post-meta {
        font-size: 13px !important;
    }
    
    .post-preview > .post-meta > a {
        font-size: 13px !important;
    }
}