/*
Theme Name: Skynet Resurection 2004
Theme URI: https://fallout.czech-games.net/
Author: Fallout Skynet / original webdesign Mustafa
Description: Věrná WordPress rekonstrukce historického vzhledu Fallout Skynetu z období 2004. Původní grafika, moderní WordPress kostra a responzivní mobilní navigace.
Version: 1.0.2
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: skynet-resurection-2004
*/

:root {
    --retro-bg: #000;
    --retro-panel: #373737;
    --retro-panel-dark: #303030;
    --retro-text: #ececec;
    --retro-muted: #bdbdbd;
    --retro-orange: #ffae00;
    --retro-orange-2: #f07b00;
    --retro-green: #28ad36;
    --retro-red: #b90000;
    --retro-line: #df8300;
}

* { box-sizing: border-box; }
html { background: var(--retro-bg); }
body {
    margin: 0;
    background: #000;
    color: var(--retro-text);
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    line-height: 1.55;
}
img { max-width: 100%; height: auto; }
a { color: #fff; text-decoration: underline; }
a:hover, a:focus { color: #ffcc00; }

.retro-site {
    width: 903px;
    max-width: 100%;
    margin: 18px auto 0;
}
.retro-header {
    display: block;
    width: 903px;
    max-width: 100%;
    line-height: 0;
}
.retro-header img {
    display: block;
    width: 100%;
    height: auto;
}
.retro-mobile-toggle {
    display: none;
    width: 100%;
    border: 0;
    border-top: 1px solid #ff9d00;
    border-bottom: 1px solid #6d3a00;
    padding: 10px 14px;
    background: linear-gradient(#f89b00,#d76700);
    color: #fff;
    font: bold 12px Verdana, sans-serif;
    text-align: left;
    cursor: pointer;
}
.retro-mobile-toggle::after { content: "☰"; float: right; font-size: 16px; line-height: 1; }
.retro-mobile-toggle[aria-expanded="true"]::after { content: "×"; }

.retro-frame {
    display: grid;
    grid-template-columns: 22px 146px 10px 536px 15px 145px 29px;
    align-items: stretch;
}
.retro-edge-left { background: url('assets/images/konceptsl_02.gif') top left repeat-y; }
.retro-gap-left { background: url('assets/images/konceptsl_04.gif') top left repeat-y; }
.retro-gap-right { background: url('assets/images/konceptsl_06.gif') top left repeat-y; }
.retro-edge-right { background: url('assets/images/konceptsl_08.gif') top left repeat-y; }
.retro-left,
.retro-main,
.retro-right { background: var(--retro-panel); min-width: 0; }
.retro-left { padding: 17px 0 28px; }
.retro-main { padding: 17px 6px 32px; overflow-wrap: anywhere; }
.retro-right { padding: 17px 0 28px; }

.retro-section { margin: 0 0 14px; }
.retro-section-head {
    display: block;
    width: 146px;
    max-width: 100%;
    height: auto;
    margin: 0 0 7px;
}
.retro-right .retro-section-head { width: 145px; }
.retro-left ul,
.retro-left .menu,
.retro-right ul {
    margin: 0;
    padding: 0 9px 0 27px;
    list-style-type: diamond;
}
.retro-left li,
.retro-right li { margin: 2px 0; }
.retro-left a { font-size: 11px; }
.retro-left .current-menu-item > a,
.retro-left .current_page_item > a { color: #ffcc00; }
.retro-left .sub-menu {
    margin-top: 2px;
    padding-left: 14px;
}

/* Collapsible nested navigation. Parent entries use a retro +/- marker instead
   of the normal list bullet. JavaScript only adds these classes after it has
   prepared the controls, so menus remain fully visible if JS is unavailable. */
.retro-left .retro-has-children {
    list-style: none;
    position: relative;
}
.retro-left .retro-submenu-toggle {
    display: inline-block;
    width: 13px;
    height: 15px;
    margin: 0 1px 0 -15px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #fff;
    font: bold 11px/15px Verdana, Arial, Helvetica, sans-serif;
    text-align: center;
    vertical-align: baseline;
    cursor: pointer;
}
.retro-left .retro-submenu-toggle:hover,
.retro-left .retro-submenu-toggle:focus,
.retro-left .retro-has-children.is-submenu-open > .retro-submenu-toggle {
    color: #ffcc00;
    outline: none;
}
.retro-left .retro-has-children > .retro-parent-link {
    cursor: pointer;
}
.retro-left .retro-submenus-ready .sub-menu[hidden] {
    display: none !important;
}
.retro-left .retro-current-item > a {
    color: #ffcc00;
}

.retro-editorial {
    padding: 2px 8px 10px;
    text-align: center;
    color: #fff;
    font-size: 10px;
    line-height: 1.25;
}
.retro-widget { margin: 0 0 15px; }
.retro-widget-title {
    margin: 0 0 8px;
    padding: 4px 8px;
    border-left: 5px solid #444;
    border-right: 5px solid #444;
    background: linear-gradient(#f28b00,#d96b00);
    color: #fff;
    font-size: 11px;
    font-weight: bold;
}
.retro-widget > :not(.retro-widget-title) { margin-left: 8px; margin-right: 8px; }
.retro-search { padding: 0 8px; }
.retro-search input[type="search"] {
    width: 100%;
    border: 1px dashed #f00;
    background: #373737;
    color: #fff;
    padding: 5px;
    font: 10px Verdana, sans-serif;
}
.retro-search button {
    margin-top: 7px;
    border: 1px solid #f00;
    background: #373737;
    color: #fff;
    padding: 4px 7px;
    font: 10px Verdana, sans-serif;
    cursor: pointer;
}

.retro-dashboard {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    margin: 6px 6px 20px;
    padding: 0 0 18px;
    border-bottom: 1px solid var(--retro-line);
}
.retro-dashboard h2 {
    margin: 0 0 10px;
    color: var(--retro-orange);
    font-size: 12px;
    text-align: center;
}
.retro-dashboard ul { list-style: none; margin: 0; padding: 0; }
.retro-dashboard li {
    position: relative;
    padding: 1px 0 1px 12px;
    color: #d6d6d6;
    font-size: 11px;
}
.retro-dashboard li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .62em;
    width: 0;
    height: 0;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 6px solid #8c8c8c;
}
.retro-dashboard a { text-decoration: none; color: #e7e7e7; }
.retro-dashboard a:hover { color: #ffcc00; text-decoration: underline; }
.retro-dashboard .retro-date { font-weight: bold; color: #dcdcdc; }
.retro-dashboard-foot {
    grid-column: 1 / -1;
    margin-top: 2px;
    color: #c8c8c8;
    text-align: center;
    font-size: 10px;
}
.retro-dashboard-foot a { color: var(--retro-green); }

.retro-article {
    margin: 0 0 26px;
    padding: 0 0 20px;
    border-bottom: 1px solid var(--retro-line);
}
.retro-article:last-child { margin-bottom: 0; }
.retro-entry-title {
    margin: 0 0 3px;
    color: #fff;
    font-size: 12px;
    line-height: 1.45;
}
.retro-entry-title a { color: #fff; text-decoration: none; }
.retro-entry-title a:hover { color: #ffcc00; text-decoration: underline; }
.retro-title-date { color: var(--retro-orange); font-weight: bold; }
.retro-entry-meta {
    margin: 0 0 13px;
    color: #cfcfcf;
    font-size: 9px;
}
.retro-entry-meta a { color: var(--retro-green); text-decoration: none; }
.entry-content,
.entry-summary { font-size: 11px; color: #e6e6e6; }
.entry-content p,
.entry-summary p { margin: 0 0 12px; }
.entry-content h1, .entry-content h2, .entry-content h3,
.entry-content h4, .entry-content h5, .entry-content h6 {
    color: var(--retro-orange);
    font-family: Verdana, Arial, sans-serif;
    line-height: 1.3;
}
.entry-content h1 { font-size: 18px; }
.entry-content h2 { font-size: 15px; border-bottom: 1px solid #5a5a5a; padding-bottom: 4px; }
.entry-content h3 { font-size: 13px; }
.entry-content blockquote {
    margin: 14px 10px;
    padding: 8px 12px;
    border-left: 3px solid var(--retro-orange-2);
    background: #303030;
}
.entry-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 12px 0;
}
.entry-content th,
.entry-content td { border: 1px solid #555; padding: 5px 6px; vertical-align: top; }
.entry-content th { background: #2c2c2c; color: var(--retro-orange); }
.entry-content pre,
.entry-content code { max-width: 100%; overflow: auto; }
.entry-content iframe,
.entry-content video { max-width: 100%; }
.entry-content .alignleft { float: left; margin: 0 12px 8px 0; }
.entry-content .alignright { float: right; margin: 0 0 8px 12px; }
.entry-content .aligncenter { display: block; margin-left: auto; margin-right: auto; }

.retro-page-title {
    margin: 0 0 18px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--retro-line);
    color: var(--retro-orange);
    font-size: 15px;
}
.retro-pagination { margin-top: 18px; text-align: center; font-size: 10px; }
.retro-pagination .page-numbers { margin: 0 2px; }
.retro-pagination .current { color: var(--retro-orange); }
.retro-no-results { padding: 10px; }

.retro-comments { margin-top: 20px; border-top: 1px solid var(--retro-line); padding-top: 14px; }
.retro-comments h2, .retro-comments h3 { color: var(--retro-orange); font-size: 12px; }
.retro-comments ol { padding-left: 22px; }
.retro-comments textarea,
.retro-comments input[type="text"],
.retro-comments input[type="email"],
.retro-comments input[type="url"] {
    width: 100%;
    border: 1px solid #666;
    background: #2f2f2f;
    color: #fff;
    padding: 6px;
}
.retro-comments input[type="submit"] {
    border: 1px solid #f00;
    background: #373737;
    color: #fff;
    padding: 6px 9px;
}

.fswl-wiki-link {
    color: #fff !important;
    text-decoration-line: underline !important;
    text-decoration-style: dotted !important;
    text-decoration-color: #fff !important;
    text-underline-offset: 3px;
}
.fswl-wiki-link:hover { color: #ffcc00 !important; text-decoration-color: #ffcc00 !important; }

.retro-footer {
    position: relative;
    width: 903px;
    max-width: 100%;
    min-height: 64px;
    background: #000 url('assets/images/konceptsl_32.gif') top center / 100% auto no-repeat;
}
.retro-footer-text {
    position: absolute;
    inset: auto 36px 8px 190px;
    color: #aaa;
    font-size: 9px;
    text-align: right;
}
.retro-footer-text a { color: #bbb; text-decoration: none; }

.screen-reader-text {
    border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%); height: 1px;
    margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important;
}
.screen-reader-text:focus {
    background: #fff; clip: auto !important; clip-path: none; color: #111; display: block;
    font-size: 14px; height: auto; left: 5px; padding: 10px; top: 5px; width: auto; z-index: 100000;
}

@media (max-width: 760px) {
    body { font-size: 13px; }
    .retro-site { margin-top: 0; width: 100%; }
    .retro-header { width: 100%; }
    .retro-mobile-toggle { display: block; }
    .retro-frame { display: flex; flex-direction: column; }
    .retro-edge-left, .retro-gap-left, .retro-gap-right, .retro-edge-right { display: none; }
    .retro-left {
        display: none;
        order: 1;
        padding: 12px 10px 6px;
        border-bottom: 1px solid #111;
    }
    .retro-left.is-open { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px 12px; }
    .retro-left .retro-section { margin-bottom: 6px; }
    .retro-left .retro-section-head { width: 146px; max-width: 100%; }
    .retro-left ul, .retro-left .menu { padding-left: 24px; }
    .retro-left a { font-size: 12px; }
    .retro-main { order: 2; width: 100%; padding: 16px 14px 28px; }
    .retro-right { order: 3; width: 100%; padding: 14px; border-top: 1px solid var(--retro-line); }
    .retro-right .retro-section-head { width: 145px; }
    .retro-editorial { max-width: 520px; margin: 0 auto; }
    .retro-dashboard { gap: 16px; margin-left: 0; margin-right: 0; }
    .entry-content, .entry-summary { font-size: 12px; }
    .retro-footer { min-height: 48px; background-size: 100% auto; }
    .retro-footer-text { position: static; padding: 34px 12px 8px; text-align: center; }
}

@media (max-width: 470px) {
    .retro-left.is-open { grid-template-columns: 1fr; }
    .retro-dashboard { grid-template-columns: 1fr; }
    .retro-dashboard-foot { grid-column: 1; }
    .retro-main { padding-left: 10px; padding-right: 10px; }
    .entry-content .alignleft, .entry-content .alignright { float: none; display: block; margin: 8px auto; }
}