/* Core layout & theme */
:root {
    --brand: #00796b;
    --brand-dark: #00695c;
    --panel-bg: #fff;
    --text: #333;
    --acc-text: #0f6b3a;
}

body { 
    font-family: Arial, sans-serif; 
    margin: 0; 
    padding: 0; 
    background: #f4f4f4; 
    color: var(--text); 
    line-height: 1.6;
}

header { 
    background: var(--brand); 
    color: white; 
    padding: 20px; 
    text-align: center; 
}

header h1 { margin: 0; font-size: 1.8em; }
header p { margin: 5px 0 0; font-size: 1em; color: #e0f2f1; }

main { 
    padding: 20px; 
    max-width: 900px; 
    margin: 16px auto; 
}

.card {
    background: rgba(255, 255, 255, 0.22);
    backdrop-filter: blur(16px) saturate(130%);
    -webkit-backdrop-filter: blur(16px) saturate(130%);

    border-radius: 16px;
    border: 1.5px solid rgba(255, 255, 255, 0.32);

    padding: 20px;
    margin-bottom: 16px;

    box-shadow: 0 8px 20px rgba(0,0,0,0.12);

    transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(0,0,0,0.14);
}

/* Summary List Styles */
.summary-list { 
    list-style: none; 
    padding: 0; 
    margin: 10px 0 0; 
}

.summary-list li { 
    padding: 8px 0; 
    border-bottom: 1px solid #f0f0f0; 
}

.summary-list li:last-child { border-bottom: none; }

/* Skip link */
.skip-link { position: absolute; left: -999px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.skip-link:focus { left: 10px; top: 10px; width: auto; height: auto; padding: 8px 12px; background: #000; color: #fff; z-index: 9999; }

/* Accordion Styles */
.accordion-item { border-bottom: 1px solid #e6e6e6; padding: 5px 0; }
.accordion-button { 
    display: flex;
    padding: 15px; 
    align-items: center; 
    justify-content: space-between; 
    width: 100%; 
    background: transparent; 
    border: none;
    font-size: 1.05em; 
    text-align: left; 
    color: var(--acc-text); 
    cursor: pointer; 
    border-radius: 6px;
    -webkit-tap-highlight-color: transparent; 
}

@media (hover: hover) {
    .accordion-button:hover { 
        background: #f9f9f9; 
    }
}

.accordion-button:not([aria-expanded="true"]):focus {
    background: transparent !important;
    box-shadow: none !important;
}

.accordion-button[aria-expanded="true"] { 
    background: var(--brand) !important; 
    color: #fff !important; 
    font-weight: 700; 
}

.accordion-panel { 
    max-height: 0; 
    overflow: hidden; 
    padding: 0 40px; 
    transition: max-height 0.28s ease, padding 0.28s ease; 
}

.accordion-panel.open { 
    padding-top: 15px; 
    padding-bottom: 15px;
    max-height: 1000px; 
}

/* Navigation Buttons */
.bottom-buttons { text-align: center; }
.contact-btn, .back-home { 
    display: inline-block; 
    padding: 12px 22px; 
    background: var(--brand); 
    color: white; 
    text-decoration: none; 
    border-radius: 6px; 
    margin: 8px; 
    font-weight: bold; 
    transition: 0.25s ease; 
}

.contact-btn:hover, .back-home:hover { 
    background: var(--brand-dark); 
    transform: translateY(-3px); 
    box-shadow: 0 4px 12px rgba(0,0,0,0.15); 
}

/* --- Back to Top Button (Same as Blog Page) --- */
#backToTop {
    display: none;
    position: fixed;
    bottom: 20px;
    right: 20px;
    background: rgba(0, 121, 107, 0.5);
    color: #fff;
    border: none;
    border-radius: 50%;
    padding: 12px 16px;
    font-size: 24px;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
    z-index: 9999;
    transition: background 0.25s, transform 0.25s;
    outline: none;
}

#backToTop span {
    color: #fff;
    text-shadow: 0 2px 8px #00796b, 0 0 20px #fff;
    font-weight: bold;
}

#backToTop:hover {
    background: rgba(0, 77, 64, 0.7);
    transform: scale(1.1);
}

/* Show only on mobile screens */
@media (max-width: 700px) {
    #backToTop.show {
        display: block;
    }
}

/* Force hide on desktop */
@media (min-width: 701px) {
    #backToTop {
        display: none !important;
    }
}

/* --- Corrected AI Summary Box Style --- */
.ai-summary-box {
    background: #e0f2f1 !important; /* Added !important to beat global glass style */
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 25px;
    
    /* Force the teal left border and REMOVE the other glass borders */
    border-left: 5px solid #00796b !important;
    border-right: none !important;
    border-top: none !important;
    border-bottom: none !important;

    /* Ensure it doesn't behave like a standard card */
    box-shadow: none !important;
    transform: none !important;
    color: #222 !important;
}

/* Ensure no hover effect on this specific box */
.ai-summary-box:hover {
    transform: none !important;
    box-shadow: none !important;
}

/* Dark Mode Section */
@media (prefers-color-scheme: dark) {
    :root { 
        --panel-bg: #232323; 
        --text: #e0e0e0; 
        --acc-text: #4db6ac; 
    }

    body {
        background: #181818;
    }

    .card {
        background: rgba(34, 34, 34, 0.33) !important;
        backdrop-filter: blur(16px) saturate(130%);
        -webkit-backdrop-filter: blur(16px) saturate(130%);

        border: 1.5px solid rgba(200, 200, 200, 0.18);
        color: #e0e0e0 !important;

        box-shadow: 0 8px 20px rgba(0,0,0,0.35);
    }

    .bottom-buttons.card {
        background: rgba(34, 34, 34, 0.33) !important;
        border: 1.5px solid rgba(200, 200, 200, 0.18);
    }

        .accordion-button[aria-expanded="true"] {
        background: #004d40 !important;
        color: #fff !important;
    }

    .ai-summary-box { 
        background: #1a2726 !important; 
        color: #e0e0e0 !important; 
        
        /* Force only the left border and kill the global glass borders */
        border-left: 5px solid #26a69a !important; 
        border-right: none !important;
        border-top: none !important;
        border-bottom: none !important;

        /* Ensure no glowing shadows from global style */
        box-shadow: none !important;
    }

        .accordion-button:not([aria-expanded="true"]):hover { 
        background: #2a2a2a !important; 
        color: var(--acc-text) !important;
    }

    .accordion-button:not([aria-expanded="true"]):focus {
        background: transparent !important;
    }
}

footer { 
  background: linear-gradient(to right, #004d40, #00695c) !important; 
  color: #ffffff !important; 
  text-align: center; 
  padding: 15px 10px; 
  width: 100%;
  box-sizing: border-box;
  display: block;
  margin-top: 30px; /* Gives some breathing room below your content */
}

/* Container styling */
.summary-list {
    list-style: none; /* Removes default bullets */
    padding: 0;
}

.summary-list li {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
    font-family: Arial, sans-serif;
    font-size: 16px;
}

/* Icon styling */
.list-icon {
    width: 24px;   /* Sets a uniform width */
    height: 24px;  /* Sets a uniform height */
    margin-right: 12px; /* Space between icon and text */
    object-fit: contain;
}