/*
Theme Name: SeRemo
Theme URI: https://segala.ch/
Author: SeRemo
Description: Finale klassische Frameset-Homepage mit Titel-Frame, linkem Menü und breitem Inhaltsbereich.
Version: 1.0.3
Requires at least: 6.2
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: seremo
*/

:root{--retro-bg:#c0c0c0;--retro-panel:#e8e8e8;--retro-dark:#000080;--retro-blue:#0000ee;--retro-visited:#551a8b;--retro-border-light:#fff;--retro-border-mid:#808080;--retro-border-dark:#202020;--retro-text:#111;--retro-max:1500px}
*{box-sizing:border-box}
html{font-size:16px}
body{margin:0;color:var(--retro-text);background-color:#7f7f7f;background-image:linear-gradient(45deg,#777 25%,transparent 25%),linear-gradient(-45deg,#777 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#777 75%),linear-gradient(-45deg,transparent 75%,#777 75%);background-size:8px 8px;background-position:0 0,0 4px,4px -4px,-4px 0;font-family:Arial,Helvetica,sans-serif;line-height:1.55}
a{color:var(--retro-blue);text-decoration:underline}
a:visited{color:var(--retro-visited)}
a:hover,a:focus{color:#d00000;background:#ffff99}
img{max-width:100%;height:auto}
.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.screen-reader-text:focus{clip:auto!important;width:auto;height:auto;top:8px;left:8px;padding:10px;background:#fff;color:#000;z-index:100000}

.site-shell{width:calc(100% - 32px);max-width:var(--retro-max);margin:18px auto;background:var(--retro-bg);border:3px outset var(--retro-panel);box-shadow:8px 8px 0 rgba(0,0,0,.4)}
.site-header{padding:8px;border-bottom:2px groove #fff}
.titlebar{display:flex;align-items:center;gap:12px;min-height:64px;padding:8px 12px;color:#fff;background:linear-gradient(90deg,#000080,#1084d0);border:2px inset #eee}
.custom-logo{display:block;max-height:58px;width:auto}
.site-branding{min-width:0}
.site-title{margin:0;font:700 clamp(26px,4vw,48px)/1 "Times New Roman",serif;text-shadow:2px 2px #000}
.site-title a,.site-title a:visited{color:#fff;text-decoration:none;background:none}
.site-description{margin:5px 0 0;font-family:"Courier New",monospace;font-size:13px;color:#fff}
.titlebar-buttons{margin-left:auto;white-space:nowrap;font:700 18px/1 monospace}
.titlebar-buttons span{display:inline-block;width:25px;height:24px;margin-left:4px;text-align:center;padding-top:2px;color:#000;background:#c0c0c0;border:2px outset #fff}

.primary-nav{margin-top:8px;padding:5px;background:#c0c0c0;border:2px inset #fff}
.primary-nav ul{display:flex;flex-wrap:wrap;gap:5px;list-style:none;margin:0;padding:0}
.primary-nav li{position:relative;margin:0}
.primary-nav a,.primary-nav a:visited{display:block;padding:5px 11px;color:#000;background:#d4d0c8;border:2px outset #fff;font-weight:700;text-decoration:none}
.primary-nav a:hover,.primary-nav a:focus{color:#000;background:#ffff99;border-style:inset}
.primary-nav .sub-menu{display:none;position:absolute;left:0;top:100%;z-index:20;min-width:220px;padding:4px;background:#c0c0c0;border:2px outset #fff}
.primary-nav li:hover>.sub-menu,.primary-nav li:focus-within>.sub-menu{display:block}
.primary-nav .sub-menu .sub-menu{left:100%;top:0}

.retro-strip{display:flex;gap:6px;margin-top:8px;padding:4px 7px;background:#fff;border:2px inset #ddd;font:12px "Courier New",monospace}
.retro-strip span:last-child{margin-left:auto}
.content-grid{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:12px;padding:12px}
.main-content,.sidebar{min-width:0}
.window{margin:0 0 14px;background:var(--retro-panel);border:3px outset #fff}
.window-title{display:flex;align-items:center;gap:8px;margin:0;padding:5px 8px;color:#fff;background:var(--retro-dark);font:700 15px Arial,sans-serif}
.window-title:before{content:"▣";color:#fff}
.window-body{padding:clamp(14px,3vw,34px);background:#fff;border-top:2px inset #aaa}
.entry-title{margin:0 0 12px;font:700 clamp(26px,4vw,46px)/1.1 "Times New Roman",serif;color:#000}
.entry-title a,.entry-title a:visited{color:#000080}
.entry-meta{margin:0 0 18px;padding:5px 8px;background:#ffffcc;border:1px dashed #808080;font:12px "Courier New",monospace}
.entry-content{font-family:Georgia,"Times New Roman",serif;font-size:clamp(17px,1.35vw,21px)}
.entry-content>*{max-width:none!important}
.entry-content:after{display:block;clear:both;content:""}
.entry-content table{width:100%;border-collapse:collapse;font-family:Arial,sans-serif;font-size:.85em}
.entry-content th,.entry-content td{padding:7px;border:1px solid #808080}
.entry-content th{background:#000080;color:#fff}
.entry-content blockquote{margin:1.5em 0;padding:10px 18px;background:#ffffcc;border-left:8px solid #000080}
.entry-content pre{max-width:100%;overflow:auto;padding:12px;color:#0f0;background:#000;border:3px inset #777;font:14px/1.5 "Courier New",monospace}
.entry-content .alignwide,.entry-content .alignfull{width:100%;max-width:none;margin-left:0;margin-right:0}
.post-thumbnail img{display:block;width:100%;margin-bottom:16px;border:3px ridge #c0c0c0}
.read-more,.page-numbers,.button,button,input[type=submit]{display:inline-block;padding:6px 12px;color:#000!important;background:#d4d0c8;border:2px outset #fff;border-radius:0;font:700 14px Arial,sans-serif;text-decoration:none;cursor:pointer}
.read-more:active,.button:active,button:active,input[type=submit]:active{border-style:inset}

.widget{margin-bottom:12px;background:#eee;border:3px outset #fff}
.widget-title{margin:0;padding:5px 8px;color:#fff;background:#000080;font-size:15px}
.widget>div,.widget>ul,.widget>ol,.widget>form,.widget>p{margin:0;padding:10px 14px}
.widget ul{list-style:square}
.widget li{margin:4px 0}
.retro-box{padding:10px;text-align:center;background:#000;color:#0f0;border:3px inset #777;font:13px "Courier New",monospace}
.pagination{display:flex;flex-wrap:wrap;gap:5px;margin:16px 0}
.page-numbers.current{color:#fff!important;background:#000080;border-style:inset}

.comments-area{margin-top:15px;padding:16px;background:#fff;border:3px outset #fff}
.comment-list{padding-left:25px}
.comment-body{margin-bottom:12px;padding:10px;border:1px dotted #777}
input,textarea,select{max-width:100%;padding:7px;background:#fff;border:2px inset #ddd;font:inherit}
textarea{width:100%}
.site-footer{padding:12px;border-top:2px groove #fff;text-align:center;font:12px "Courier New",monospace}
.footer-counter{display:inline-block;margin:5px;padding:3px 8px;color:#0f0;background:#000;border:2px inset #888;letter-spacing:3px}

@media(max-width:900px){.site-shell{width:calc(100% - 16px);margin:8px auto;box-shadow:4px 4px 0 rgba(0,0,0,.35)}.content-grid{grid-template-columns:1fr}.sidebar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.widget{margin:0}.primary-nav .sub-menu{position:static;display:block;margin-left:14px;border-width:1px}.titlebar-buttons{display:none}}
@media(max-width:600px){.site-shell{width:100%;margin:0;border-width:0;box-shadow:none}.site-header,.content-grid{padding:7px}.titlebar{min-height:54px}.site-description,.retro-strip span:last-child{display:none}.primary-nav ul{display:block}.primary-nav li{margin:3px 0}.primary-nav .sub-menu{margin-left:12px}.window-body{padding:14px}.entry-content{font-size:17px}.sidebar{display:block}.widget{margin-bottom:10px}}

/* Version 2: klassische Frameset-Homepage */
body{height:100vh;overflow:hidden;background:#5c5c5c;background-image:none;font-family:"Times New Roman",Times,serif}
.frameset-site{display:grid;grid-template-rows:126px minmax(0,1fr) 25px;width:calc(100% - 20px);height:calc(100vh - 20px);margin:10px;background:#c0c0c0;border:4px ridge #eee}
.admin-bar .frameset-site{height:calc(100vh - 52px)}
.top-frame{display:flex;align-items:center;gap:16px;min-width:0;padding:12px 24px;background:#000080;border:5px ridge #d8d8d8;color:#fff;overflow:hidden}
.top-frame .custom-logo{max-height:82px}
.frame-site-title{min-width:0}
.frame-site-title h1{margin:0;font:700 clamp(34px,5vw,72px)/.95 "Times New Roman",serif;white-space:nowrap;text-shadow:3px 3px #000}
.frame-site-title h1 a,.frame-site-title h1 a:visited{color:#ffff00;text-decoration:none;background:transparent}
.frame-site-title p{margin:7px 0 0;color:#fff;font:16px "Courier New",monospace;white-space:nowrap}
.retro-login,.retro-login:visited{flex:0 0 auto;margin-left:auto;padding:8px 16px;color:#000;background:#c0c0c0;border:3px outset #fff;font:700 14px "Courier New",monospace;text-decoration:none;box-shadow:2px 2px 0 #000}
.retro-login:hover,.retro-login:focus{color:#000;background:#ffff00;border-style:inset}
.retro-login:active{transform:translate(1px,1px);box-shadow:1px 1px 0 #000}
.frame-body{display:grid;grid-template-columns:285px minmax(0,1fr);min-height:0;background:#808080}
.main-frame{grid-column:2;grid-row:1;min-width:0;overflow-y:auto;padding:18px;background:#fff;border:5px ridge #d8d8d8;scrollbar-color:#808080 #c0c0c0}
.menu-frame{grid-column:1;grid-row:1;min-width:0;overflow-y:auto;padding:10px;background:#c0c0c0;border:5px ridge #d8d8d8}
.menu-frame-title{margin:0 0 9px;padding:5px;text-align:center;color:#fff;background:#000080;border:2px inset #ddd;font:700 18px Arial,sans-serif}
.frame-nav ul{display:block;list-style:none;margin:0 0 14px;padding:0}
.frame-nav li{margin:5px 0}
.frame-nav a,.frame-nav a:visited{display:block;padding:6px 8px;color:#0000ee;background:#e8e8e8;border:2px outset #fff;font:700 15px Arial,sans-serif;text-decoration:underline}
.frame-nav a:hover,.frame-nav a:focus{color:#fff;background:#000080}
.frame-nav a:active,
.frame-nav li.current-menu-item>a,
.frame-nav li.current_page_item>a,
.frame-nav li.current-menu-ancestor>a,
.frame-nav li.current_page_ancestor>a,
.frame-nav li.is-open>a{color:#fff!important;background:#000080!important}
.frame-nav li{position:relative}
.frame-nav .sub-menu,.frame-nav .children{display:none;margin:4px 0 4px 15px}
.frame-nav li.is-open>.sub-menu,.frame-nav li.is-open>.children{display:block}
.frame-nav .submenu-toggle{position:absolute;right:5px;top:5px;width:25px;height:25px;padding:0;color:#000;background:#c0c0c0;border:2px outset #fff;font:700 17px/19px Arial,sans-serif;z-index:2}
.frame-nav li>a{padding-right:36px}
.menu-frame .widget{font-family:Arial,sans-serif}
.menu-frame .retro-box{margin-top:10px}
.frame-status{display:flex;align-items:center;gap:12px;padding:2px 8px;background:#c0c0c0;border:2px inset #fff;font:12px "Courier New",monospace;overflow:hidden;white-space:nowrap}
.frame-status span:last-child{margin-left:auto}
.main-frame .window{max-width:none;margin-bottom:18px;border:2px solid #999;background:#fff}
.main-frame .window-title{background:#d6d6d6;color:#000080;border-bottom:1px solid #888;font-family:Arial,sans-serif}
.main-frame .window-body{padding:clamp(18px,3vw,42px);border:0}
.main-frame .entry-content{font-size:clamp(18px,1.35vw,22px)}
.main-frame .entry-content>*{max-width:none!important;width:auto!important}
.main-frame .entry-title{color:#000080}
.main-frame .comments-area{border:2px solid #999}

@media(max-width:760px){body{height:auto;overflow:auto;background:#c0c0c0}.frameset-site,.admin-bar .frameset-site{display:block;width:100%;height:auto;min-height:100vh;margin:0;border-width:0}.top-frame{min-height:95px;padding:12px}.frame-site-title h1{font-size:36px;white-space:normal}.frame-site-title p{font-size:12px;white-space:normal}.retro-login,.retro-login:visited{padding:6px 9px;font-size:11px}.frame-body{display:flex;flex-direction:column}.main-frame{order:2;overflow:visible;padding:8px;border-width:3px}.menu-frame{order:1;overflow:visible;border-width:3px}.frame-nav>ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}.frame-nav li{margin:0}.frame-nav .sub-menu,.frame-nav .children{display:none}.frame-nav li.is-open>.sub-menu,.frame-nav li.is-open>.children{display:block}.frame-status{height:28px}.main-frame .window-body{padding:14px}}
