/*
 Theme Name:   GT Roblox Tools
 Theme URI:    https://generatepress.com
 Description:  GT Roblox Tools
 Author:       Kevin Kunkel
 Author URI:   https://gaming-tools.com
 Template:     generatepress
 Version:      0.1
*/


/* ----------------Template CSS (Mobile First) ----------------*/
.site-branding-container .site-logo{margin-right:13px}
.nav-float-right #site-navigation{margin-left:45px}
.main-navigation .main-nav ul li a{padding-left:18px;padding-right:18px}
.inside-article{padding-top:10px!important}
.gt-footer ul{padding:0 20px;font-size:16px;list-style:none;margin:0 auto;text-align:center;display:flex;flex-direction:row;justify-content:center;line-height:30px;margin-top:4px;flex-wrap:wrap}
.gt-footer li{margin:0 12px}
h1,h2,h3{margin-top:24px}
p{margin-bottom:20px}
.gt-archive{display:flex;flex-wrap:wrap;align-items:stretch;gap:20px;}
.gt-archive .blockquote{flex:1 1 calc(50% - 10px);max-width:calc(50% - 10px);box-sizing:border-box;}
@media(max-width:768px){.archive .blockquote{flex:1 1 100%;max-width:100%;}}
.center{text-align:center;margin:0 auto}
.red-text{color:#E43C12}

/* --- Roblox Color System & Infoboxen --- */
:root{--primary-color:#7F5EF5;--bg-color:#fff;--dark-gray:#1A1A2D;--light-purple-white:#F8F6FF;--info-border:#7F5EF5;--info-bg:#F0EEFA;--idea-border:#FFD700;--idea-bg:#FFFACD;--warning-border:#FF4500;--warning-bg:#FFECE6;--positive-border:#32CD32;--positive-bg:#E6FFE6;--quote-border:#8A2BE2;--quote-bg:#F2E6FF;--conclusion-border:#4682B4;--conclusion-bg:#E6F2FF;--disclaimer-bg:#0F1E25;--disclaimer-border:#40445C;}
.roblox-box{display:flex;align-items:center;padding:15px 15px 10px;margin-bottom:20px;border-width:2px;border-style:solid;border-radius:17px;}
.roblox-box-icon-container{width:70px;height:70px;margin-right:20px;display:flex;justify-content:center;align-items:center;border-radius:50%;flex-shrink:0;padding:5px;}
.roblox-box-icon{font-size:2.5em;line-height:1;}
.roblox-box-content{flex-grow:1;}
.roblox-box-content h3{margin-top:10px;margin-bottom:4px;font-size:1.3em;}
.roblox-info .roblox-box-icon-container{background-color:#DDD9F7;}
.roblox-box-custom-image{width:84px;height:84px;margin-right:20px;margin-top:-7px;object-fit:contain;flex-shrink:0;}
.roblox-info{border-color:var(--info-border);background-color:var(--info-bg);}
.roblox-idea{border-color:var(--idea-border);background-color:var(--idea-bg);}
.roblox-warning{border-color:var(--warning-border);background-color:var(--warning-bg);}
.roblox-positive{border-color:var(--positive-border);background-color:var(--positive-bg);}
.roblox-quote{border-color:#5A5A6D;background-color:var(--dark-gray);color:var(--bg-color);}
.roblox-quote .roblox-box-icon{filter:invert(0%);}
.roblox-conclusion{border-color:var(--conclusion-border);background-color:var(--conclusion-bg);}
.roblox-disclaimer{background-color:var(--disclaimer-bg);border-color:var(--disclaimer-border);color:var(--bg-color);padding:20px 72px 12px 22px;color:#B3B3B3;font-style:italic}
.roblox-disclaimer .roblox-box-custom-image{width:74px;height:74px;margin-top:-10px}
.roblox-disclaimer .roblox-box-content{padding-top:8px}
.roblox-disclaimer .focus-text{color:var(--primary-color);font-weight:bold}
.roblox-disclaimer .disclaimer-text{color:orange;}
@media(max-width:1023px){
.roblox-box{flex-direction:column;text-align:center;align-items:center;}
.roblox-box-icon-container,.roblox-box-custom-image{margin-right:0;margin-bottom:10px;margin-top:0;}
.roblox-box-content h3{margin-top:0;}
.roblox-disclaimer{padding:5px 20px}
.roblox-disclaimer .roblox-box-custom-image{width:84px;height:84px;margin:10px 0 -16px}
}


/* --- Roblox Calculator CSS --- */
.tool-wrapper{width:100%;padding:0 0 20px;background:#1E2C32;border-radius:12px;margin-bottom:20px;font-family:'Segoe UI',sans-serif;color:#fff}
.tool-header{font-size:1.8em;background:#0F1E25;padding:16px;margin:0;border-top-left-radius:12px;border-top-right-radius:12px;text-align:center}
.tool-header img{max-height:115px;margin-top:-6px}
.header-logo{}
.tool-flex{display:flex;justify-content:center;align-items:center;gap:20px;margin:18px 0 0 0;flex-wrap:wrap}
.tool-box{flex:1;max-width:100%;margin:0 auto;margin-left:5%;margin-right:5%;background:#1E2C32;padding:20px;border-radius:12px;text-align:center;position:relative;border:1px solid #3D5159}
.tool-label{font-weight:bold;letter-spacing:1px;background:rgba(0,0,0,0.15);padding:6px;border-radius:6px;font-size:0.9em;margin-bottom:10px}
.tool-box-robux .tool-label{color:#f5e6b7}
.tool-box-usd .tool-label{color:#51ff6a}
.tool-input-wrapper{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:10px;background:#303F45;border:1px solid #3D5159;border-radius:10px;box-shadow:inset 0 1px 3px rgba(0,0,0,0.6);padding:15px}
.tool-input{background:transparent;border:none;font-size:2.4em;font-weight:900;text-align:left;width:100%;outline:none;text-align:center;padding:15px!important}
.tool-input-robux{color:#f5e6b7}
.tool-input-usd{color:#51ff6a}
.tool-slider{width:100%;margin-top:15px}
.tool-slider-robux{accent-color:#f5e6b7}
.tool-slider-usd{accent-color:#51ff6a}
.tool-icon{height:28px}
.tool-switch{display:flex;align-items:center;justify-content:center}
.tool-switch img{height:40px;opacity:0.6}
.tool-exchange{margin:30px 5% 30px 5%;background:#1E2C32;padding:10px 15px;border-radius:10px;display:flex;justify-content:space-between;align-items:center;border:1px solid #3D5159;box-shadow:inset 0 1px 3px rgba(0,0,0,0.6);font-size:1em}
.tool-exchange-label{color:#999;font-style:italic}
.tool-exchange-input{background:transparent;border:none;color:#fff;font-size:2em;text-align:right;width:480px}

@media(max-width:768px){
.tool-flex{flex-direction:column!important;gap:14px!important}
.tool-input-wrapper{flex-direction:row!important;justify-content:center!important;align-items:center!important;padding:4px 20px 4px}
.tool-slider{max-width:100%!important;margin-top:12px}
.tool-input{font-size:1.8em!important;text-align:center!important;padding:0!important}
.tool-box{padding:12px!important;max-width:100%!important;width:90%}
.tool-icon{height:24px!important}
.tool-exchange{text-align:center;gap:6px}
.tool-exchange-input{font-size:1.6em!important;width:100%!important;text-align:center!important}
.tool-exchange-label{width:100%!important;text-align:center!important}
}

/* Input fields: spinner sichtbar, Hintergrund transparent */
input[type="number"],input[type="text"]{background-color:transparent;color:inherit;border:none;outline:none;appearance:textfield;-moz-appearance:textfield;-webkit-appearance:textfield}
input[type="number"]:focus,input[type="text"]:focus{background-color:transparent!important;color:inherit;outline:none;box-shadow:none}

/* --- Roblox Calculator Spinner Style Update --- */
.spinner-buttons{display:flex;flex-direction:column;gap:2px;margin-left:5px}
.spinner-buttons button{background:#1E2C32;color:#8f60ff;border:none;padding:2px 4px;font-size:1em;cursor:pointer;line-height:1}
.spinner-buttons button:hover{background:#2a3b44}
input[type="number"].custom-spinner::-webkit-inner-spin-button,input[type="number"].custom-spinner::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
input[type="number"].custom-spinner::-webkit-inner-spin-button,input[type="number"].custom-spinner::-webkit-outer-spin-button{display:none}
input.custom-spinner{-moz-appearance:textfield}
@media (max-width: 768px) {
.spinner-buttons{display:flex!important;flex-direction:column!important;gap:2px;margin-left:5px}
.spinner-buttons button{font-size:1em;padding:2px 4px;background:#1E2C32;color:#8f60ff}
.tool-input-wrapper{justify-content:center!important}
}

.currency-toggle-wrapper{max-width:100%;margin-bottom:20px;text-align:center}
.currency-toggle-headline{margin-bottom:1rem;font-size:1.4rem;font-weight:600;color:#fff}
.currency-toggle{display:flex;justify-content:center;font-family:sans-serif}
.currency-toggle a{flex:1;padding:.6rem 1rem;text-decoration:none;font-size:1rem;font-weight:600;color:#fff;background-color:#2b2b2b;border:1px solid #444;transition:background-color .2s ease}
.currency-toggle a:first-child{border-radius:8px 0 0 8px;border-right:none}
.currency-toggle a:last-child{border-radius:0 8px 8px 0}
.currency-toggle a.active{background-color:#a259ff;color:#fff;cursor:default;pointer-events:none}
.currency-toggle a:hover:not(.active){background-color:#3a3a3a}




/* --- Roblox Vorlagen --- */

.robux-table{width:100%;border-collapse:collapse;background-color:#1E2C32;color:#e0e0e0;font-family:sans-serif;font-size:15px;margin-top:20px;border-radius:8px;overflow:hidden}
.robux-table thead{background-color:#0d151a}
.robux-table th,.robux-table td{padding:12px 16px;text-align:left;border:1px solid #3c4a50}
.robux-table tbody tr:hover{background-color:#27363c}
.robux-year{color:#8a5cf7;font-weight:700}
.robux-icon{width:18px;height:18px;vertical-align:middle;margin-right:6px}

.robux-scenarios{display:flex;flex-wrap:wrap;gap:20px;margin:20px 0;justify-content:center}
.scenario-box{background-color:#1e2c32;color:#fff;padding:6px 32px;border:1px solid #3c4a50;border-radius:12px;flex:1 1 calc(33.333% - 20px);min-width:250px;text-align:center}
.scenario-box h3{font-size:18px;margin-bottom:10px;font-style:italic}
.scenario-arrow{font-size:30px;margin:10px 0;color:#8a5cf7}
.scenario-box p{font-size:14px;color:#ccc}

.robux-faq-toggle-wrap{display:flex;flex-wrap:wrap;gap:16px;margin:20px 0;justify-content:center}
.faq-toggle-box{background-color:#fff;border-radius:12px;box-shadow:0 0 12px #00000014;border:1px solid #ddd;flex:1 1 calc(50% - 16px);min-width:250px;max-width:500px;overflow:hidden}
.faq-toggle-question{background-color:#f3f3f3;padding:6px 14px;font-weight:700;font-size:16px;color:#333;border-bottom:1px solid #e0e0e0;display:flex;align-items:center;gap:7px}
.faq-icon-wrapper img{width:40px;height:40px;flex-shrink:0;object-fit:contain;display:block}
.faq-question-text{display:inline-block;line-height:1.3}
.faq-toggle-answer{padding:12px 16px;font-size:15px;color:#444}
@media (max-width: 700px) {
.faq-toggle-box{flex:1 1 100%}
}









/* --- Cheese --- */
.cheese-test{background:tomatox}
.cheese-center{margin:0 auto;text-align:center}
.cheese-wide{width:100%}
.cheese-big-wide{width:100%}

.cheese-medium{width:336px}
.double-cheese{margin-bottom:20px}
.blogpost-center{position:relative;left:180px}

.mobile-cheese-small{width:100%;margin-bottom:20px}



/* --- Tools / Data --- */

.tool{position:relative}
.tool-content{background:#fff;padding:20px;filter: drop-shadow(0px 2px 14px rgba(0,0,0,0.2))}
.tool-content p{margin-bottom:10px}
.tool-blogpost{padding:20px}
.blogpost,.data-blogpost{max-width:800px;margin:0 auto}
.data{margin-bottom:32px}
.data h1,.data h2,.data p{text-align:center}
.tool-content h1{margin-top:-2px}


/* --- List Category Posts --- */

.lcp_catlist{list-style:none;margin:0;display:flex;flex-direction:row;flex-wrap:wrap}
.lcp_catlist li{width:49%;position:relative;padding:0 24px 2px 220px;min-height:152px;margin-bottom:40px}
.lcp_catlist li:nth-child(2n){margin-left:2%}
.lcp_catlist li a:first-of-type{text-decoration:none;font-size:22px;font-weight:700;line-height:28px}
.lcp_catlist li a:first-child+a{position:absolute;left:0;top:4px}
.lcp_excerpt{;border-top:1px solid #ccc;margin-top:4px;padding-top:4px}





/* ---------------------------- Desktop only ---------------------------- */
@media all and (min-width:1024px){

/* --- Tools / Data --- */

.toolbox{max-width:1360px;display:flex;flex-direction:row;flex-wrap:nowrap;margin-bottom:30px}
.banana-tool{width:360px;}
.tool{width:calc(100% - 360px)}

.data .tool{width:calc(100%)}
.data .tool-content{padding-left:20px;padding-right:20px}

.tool-content{padding:40px 360px 40px 40px;min-height:500px}
.tool-content.content-full{padding:40px 40px 10px 40px}
.tool-content.content-full.tool-empty{padding:0;background:none}
.tool-character{width:360px;position:absolute;right:-2px;top:60px}
.tool-blogpost{padding:0 20px 0 380px}
}

/* ------- Medium Desktop -------- */
@media all and (min-width:1024px) and (max-width:1480px){
.tool-content{padding:40px 40px 40px 40px}
.tool-character{width:390px;position:relative;left:0;right:auto;top:auto;bottom:auto;background:#fff;width:100%;padding-bottom:10px;text-align:center}

}

/* ------- Small Desktop -------- */
@media all and (min-width:1024px) and (max-width:1224px){

}


/* ---------------------------- Mobile only ----------------------------- */
@media all and (max-width:1023px){
.sub-menu-right{margin-left:0!important}
.main-nav li{border-top:1px solid #333}
.main-nav li a{line-height:60px!important}
.main-nav li:last-child{margin-bottom:-18px}
.inside-article{padding-top:0!important}
.site-logo img{margin-left:15px}

/* --- Table Fix mit Wrapper --- */
.robux-table-wrapper{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.robux-table{width:100%;min-width:100%;border-collapse:collapse}
.robux-table th,.robux-table td{white-space:nowrap}


/* --- Tools / Data --- */
.data{padding:0;margin-bottom:20px}
.toolbox,.data{margin:-20px -20px 0 -20px}
.tool-content{position:relative;z-index:2;margin-top:200px;padding:16px 13px}
.tool-blogpost{padding:20px 0 0}
.tool-content.content-full{margin-top:0}
.tool-character{z-index:1;text-align:center;position:absolute;top:-200px;width:100%}
.tool-header img{max-height:60px;width:auto}

/* --- Cheese --- */
.cheese-frame{width:calc(100% - 40px)}
.blogpost-center{left:auto}

/* --- List Category Posts --- */
.lcp_catlist li{width:100%;margin-bottom:20px;padding:0 0 20px 105px;border-bottom:1px solid #ccc;min-height:auto}
.lcp_catlist li a:first-of-type{font-size:18px;font-weight:700;line-height:24px}
.lcp_catlist li a:last-of-type{width:90px;max-width:90px}
.lcp_catlist li:nth-child(2n){margin-left:0}
.lcp_excerpt{border:none;padding:0;margin:0;font-size:16px;line-height:22px}

}