/* Basic Reset and Body Styles */
body {
    margin: 0;
    padding: 0;
    font-family: sans-serif; /* Common default, adjust as needed */
    line-height: 1.6;
    background-color: #f8f9fa; /* Light background typical of wiki skins */
    color: #202122; /* Standard text color */
}

/* skin-vector class on body */
/* Often used for theme-specific adjustments, might be empty here */
/* body.skin-vector { } */

/* Noprint class for elements to hide when printing */
.noprint {
    /* Styles for screen */
}

@media print {
    .noprint {
        display: none !important;
    }
}

/* Site Header (top bar) */
#site-header {
    background-color: #f0f0f0; /* Light grey background */
    border-bottom: 1px solid #a2a9b1; /* Separator line */
    padding: 0.5em 1em; /* Adjust padding as needed */
    margin-bottom: 1em; /* Space below the header */
    overflow: hidden; /* Contains floated elements if any */
    position: relative; /* Needed for positioning logo */
}

#site-header .logo {
    float: left; /* Position logo on the left */
    font-size: 1.5em; /* Make logo text larger */
    font-weight: bold;
    color: #000; /* Black text for logo */
    text-decoration: none;
    padding: 0.2em 0; /* Vertical padding to align */
    margin-right: 1em;
}

/* Page Container (wraps main content and sidebars) */
#page-container {
    width: 960px; /* Example fixed width, adjust as needed */
    max-width: 100%; /* Make it responsive below the max width */
    margin: 0 auto; /* Center the container */
    padding: 0 1em; /* Horizontal padding */
    overflow: hidden; /* Contains floated columns */
}

/* Base elements - likely part of the structure but hidden/empty visually */
/* page-base, head-base might be used by JS or specific theme logic */
/* #page-base, #head-base { } */

/* Panel (Left Sidebar - typically navigation/tools) */
#panel {
    float: left; /* Position panel on the left */
    width: 200px; /* Example width, adjust as needed */
    margin-right: 20px; /* Space between panel and content */
    padding: 1em 0; /* Vertical padding */
    /* background-color: #fff; /* Optional: Add background for clarity */
    /* border-right: 1px solid #a2a9b1; /* Optional: Separator line */
}

#panel .portal h5 {
    font-size: 1.1em;
    margin: 0.5em 0;
    padding-bottom: 0.3em;
    border-bottom: 1px solid #a2a9b1; /* Separator for portal titles */
}

#panel .portal .body ul {
    list-style: none; /* Remove default list bullets */
    margin: 0;
    padding: 0;
}

#panel .portal .body li {
    margin: 0.3em 0;
    padding: 0;
}

#panel .portal .body a {
    color: #0645ad; /* Standard link color */
    text-decoration: none;
}

#panel .portal .body a:hover {
    text-decoration: underline;
}

/* Logo within the panel - specifically for DokuWiki Vector */
#panel #p-logo {
     /* Styles for the logo area within the panel */
     /* Note: background-image is set inline in HTML, could move here */
     /* background-image:url(/lib/tpl/vector/static/3rd/dokuwiki/logo.png); */
     background-repeat: no-repeat;
     background-position: 50% 50%; /* Center the logo */
     background-size: contain; /* Ensure logo fits */
     height: 100px; /* Example height for logo area */
     margin-bottom: 1em;
}
/* Anchor tag inside p-logo */
#panel #p-logo a {
    display: block; /* Make the whole area clickable */
    height: 100%; /* Match parent height */
    text-indent: -9999px; /* Hide text if image is used */
    overflow: hidden;
}


/* Head (Navigation strip? Appears above content) */
/* Given the structure, this seems to be horizontal nav positioned to the right of the panel */
#head {
    margin-left: 220px; /* Align with content area, clearing the panel */
    padding-bottom: 1em; /* Space below the head section */
    overflow: hidden; /* Contains floated elements */
}

#head #left-navigation {
    float: left; /* Keep navigation aligned left within its container */
}

#head .vectorTabs ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#head .vectorTabs li {
    display: inline-block; /* Arrange tabs horizontally */
    margin-right: 0.5em;
    padding: 0.5em 1em;
    border: 1px solid #a2a9b1;
    border-bottom: none; /* No bottom border for tabs */
    border-radius: 5px 5px 0 0; /* Rounded top corners */
    background-color: #e9ecef; /* Light background for inactive tabs */
}

#head .vectorTabs li.selected {
    background-color: #fff; /* White background for selected tab */
    border-color: #a2a9b1;
    border-bottom-color: #fff; /* Hide the bottom border to blend with content */
}

#head .vectorTabs a {
    color: #0645ad;
    text-decoration: none;
    font-weight: bold;
}

#head .vectorTabs a:hover {
    text-decoration: underline;
}


/* Content Area (Main page content) */
#content {
    margin-left: 220px; /* Align with head area, clearing the panel */
    background-color: #fff; /* White background for content area */
    padding: 1em; /* Padding inside the content box */
    border: 1px solid #a2a9b1; /* Border around the content */
    border-radius: 5px;
    overflow: hidden; /* Contains floats within content */
}

#content a {
     color: #0645ad; /* Standard link color */
     text-decoration: none;
}

#content a:hover {
    text-decoration: underline;
}


/* Breadcrumbs */
.catlinks {
    font-size: 0.9em;
    color: #54595d; /* Greyish text */
    margin: 0 0 1em 0; /* Space below breadcrumbs */
    padding: 0;
}

.catlinks a {
    color: #0645ad;
    text-decoration: none;
}

.catlinks a:hover {
    text-decoration: underline;
}

.catlinks span.bchead {
     font-weight: bold; /* "You are here:" text */
}

.catlinks bdi {
    /* Bidirectional isolation */
    /* No specific style needed usually */
}

.catlinks .home {
    /* Styles for the home link wrapper */
}

/* Separator between breadcrumb items - often done with ::before or ::after */
/* Or just inline text like " » " as seen in the HTML */
.catlinks p {
    margin: 0; /* Remove default paragraph margin */
    padding: 0;
}


/* Body Content Wrapper (DokuWiki specific class) */
#bodyContent.dokuwiki {
    /* General styles for the main text area */
    margin-top: 1em; /* Space below breadcrumbs */
}


/* Table of Contents */
#dw__toc {
    float: right; /* Position TOC on the right */
    width: 250px; /* Example width */
    margin: 0 0 1em 1em; /* Top, Right, Bottom, Left margins */
    padding: 1em;
    border: 1px solid #a2a9b1;
    background-color: #f9f9f9; /* Light background */
    border-radius: 5px;
}

#dw__toc h3 {
    font-size: 1.1em;
    margin-top: 0;
    padding-bottom: 0.3em;
    border-bottom: 1px solid #a2a9b1; /* Separator */
    cursor: pointer; /* Indicate clickable header */
    font-weight: bold;
}

#dw__toc ul.toc {
    list-style: none;
    margin: 0;
    padding: 0;
}

#dw__toc ul.toc ul { /* Nested lists for sub-levels */
    margin-top: 0;
}

#dw__toc .li {
    margin: 0.3em 0;
    padding: 0;
}

#dw__toc .level1 > .li {
    font-weight: bold; /* Make level 1 items bold */
}

#dw__toc .level2 > .li {
    margin-left: 1.5em; /* Indent level 2 */
    font-weight: normal;
}
/* Add more levels if needed (level3, etc.) */


/* Headings */
h1, h2, h3, h4, h5, h6 {
    margin: 1em 0 0.5em 0;
    padding: 0.5em 0;
    border-bottom: 1px solid #eee; /* Separator line */
    font-weight: normal; /* DokuWiki Vector often uses normal weight for content headings */
    color: #000; /* Black or dark grey */
}

h1 { font-size: 1.8em; }
h2 { font-size: 1.5em; }
h3 { font-size: 1.3em; }
/* Add h4, h5, h6 if used */

/* Section specific classes on headings - likely for editing icons, not visual style here */
/* .sectionedit1, .sectionedit2 { } */

/* Content Level Divisions (Used for indentation) */
/* This structure is a bit mixed with hX tags and levels. Adjusting based on inferred use */
/* Example: level2 used for main content blocks */
/* .level2 {
    margin-left: 2em; /* Optional: Add indentation if needed */
/* } */


/* Paragraphs */
p {
    margin: 0 0 1em 0; /* Space below paragraphs */
}

/* Specific list styles used in content (e.g., related words, items) */
ul li.items,
ul li.popular-item {
    display: inline-block; /* Arrange horizontally */
    margin: 0.3em; /* Space between items */
    padding: 0.5em 1em;
    border: 1px solid #ccc; /* Border around items */
    border-radius: 4px; /* Rounded corners */
    background-color: #f9f9f9; /* Light background */
}

ul li.items a,
ul li.popular-item a {
    text-decoration: none; /* Remove underline from links in these items */
    color: #0645ad;
}
ul li.items a:hover,
ul li.popular-item a:hover {
     text-decoration: underline; /* Add underline on hover */
}

/* Horizontal Rule */
.hr {
    border-top: 1px solid #ccc; /* Simple grey line */
    margin: 1.5em 0; /* Space above and below */
    clear: both; /* Ensure it clears floats */
}


/* Clearfix */
.clearer {
    clear: both; /* Standard way to clear floats */
    height: 0;
    line-height: 0;
    font-size: 0;
}

/* Footer */
#footer {
    clear: both; /* Ensure footer is below all floated content */
    margin-top: 2em; /* Space above the footer */
    padding: 1em;
    background-color: #f0f0f0; /* Light grey background */
    border-top: 1px solid #a2a9b1; /* Separator line */
    text-align: center; /* Center footer content */
    font-size: 0.9em;
    color: #54595d;
}

#footer ul#footer-info {
    list-style: none;
    margin: 0;
    padding: 0;
    display: inline-block; /* Center the list horizontally */
}

#footer ul#footer-info li {
    display: inline-block; /* Arrange footer info items horizontally */
    margin: 0 1em; /* Space between items */
    padding: 0;
}

#footer a {
    color: #0645ad;
    text-decoration: none;
}

#footer a:hover {
    text-decoration: underline;
}

/* License Div (within footer info) */
#footer .license {
    display: inline; /* Keep license text inline */
}


/* Specific styles observed in ciyu.html */
/* Image within the main content area */
#bodyContent img {
    max-width: 100%; /* Ensure images don't overflow content */
    height: auto;
    /* Optional: Add margin, border, padding */
    /* margin-bottom: 1em; */
    /* border: 1px solid #ccc; */
    /* padding: 5px; */
}

/* Styles for dictionary entries (implied from ciyu.html loops) */
/* h3 for dictionary name */
#bodyContent h3 {
    font-size: 1.2em;
    margin-top: 1.5em; /* More space above new dictionary entries */
    border-bottom: none; /* Remove border under h3 if it's part of an entry */
}

/* Bold text for the word/term itself */
#bodyContent p b {
    font-weight: bold;
}

/* Styles for inline lists of items like '大家都在问' */
#bodyContent .level2 ul {
     list-style: none;
     margin: 0;
     padding: 0;
}

#bodyContent .level2 ul li {
    margin: 0.3em 0; /* Space between list items */
    padding: 0;
}


/* Dynamic mulu ID - unlikely to be used for standard CSS layout, but included for completeness */
/* The PHP code adds the $mulu value as an ID to several structural elements. */
/* This is highly unusual and likely not how standard CSS is applied. */
/* If these IDs were used for styling, it would be very specific and hard to guess. */
/* We will ignore these dynamic IDs for the general layout reconstruction. */
/* For example, styles like: */
/* #gmsmesd.toggle { ... } */
/* #haiou118.toc { ... } */
/* are possible but unpredictable. */