/* =========================================================
   CS Grăsuții România
   MyBB 1.8 - RoundoDarko Premium

   File: responsive.css / mobile fallback
   Version: v1 FINAL CLEAN

   Scope:
   - fallback responsive general pentru MyBB stock;
   - fără să calce agresiv peste modulele premium locked;
   - corectează pagini stock care folosesc tabele vechi;
   - păstrează Header/Footer/Index/ForumDisplay/PostBit/UserCP/ModCP
     în fișierele lor dedicate.
========================================================= */


/* =========================================================
   01. TABLET / SMALL DESKTOP
========================================================= */

@media only screen and (max-width:1200px){

	.wrapper{
		width:min(100% - 42px, 1200px);
		min-width:0;
		max-width:none;
	}

	#container{
		min-width:0;
	}

	#content{
		box-sizing:border-box;
		overflow:hidden;
	}

	.thead > .float_right{
		float:none;
		display:block;
		margin-top:8px;
	}

	.usernav-spacer{
		padding-right:0;
	}

	select{
		max-width:100%;
		margin-bottom:5px;
	}

	table{
		max-width:100%;
	}

	#receivedrequests,
	#sentrequests{
		width:100% !important;
	}

	#show_smilies td{
		display:table-cell;
	}

	.attribute_footer{
		float:none;
		margin-bottom:20px;
	}

	#pm_folder_list{
		height:auto !important;
		max-height:700px;
		overflow:auto;
	}

	#redirect_box{
		width:90% !important;
	}

	#log_reg_table{
		width:100%;
	}

	#guest_info_header{
		margin-top:4px;
	}

	#member_info_header{
		margin-top:-8px;
	}

	.title-img{
		margin-top:5px;
	}

	.title-img-guest{
		margin-top:2px !important;
		margin-bottom:2px;
	}

	.mobile_hide{
		display:none !important;
	}

	.mobile_only,
	.mobile-only{
		display:block;
	}

	.mobile_only_tr{
		display:table-row;
	}

	.desktop-only,
	#desktop-only,
	#desktop-only-table{
		display:none !important;
	}

	.mobile-only-inl{
		display:inline-block;
	}

	.desktop-only-inl{
		display:none !important;
	}
}


/* =========================================================
   02. GENERAL MOBILE BASE
========================================================= */

@media only screen and (max-width:900px){

	body{
		margin-bottom:20px !important;
	}

	.wrapper{
		width:min(100% - 26px, 100%);
		min-width:0;
		max-width:none;
	}

	#container{
		min-width:0;
	}

	#content{
		box-sizing:border-box;
		margin-top:10px !important;
		padding:12px 0;
		overflow:hidden;
	}

	.mobile_width{
		width:100% !important;
		box-sizing:border-box;
	}

	.mobile_no_float{
		float:none !important;
	}

	.mobile_line_break{
		display:block;
	}

	.floating_button{
		float:none;
		display:block;
		margin-top:5px;
	}

	.v-center{
		top:0;
	}

	.red_alert{
		width:100%;
		box-sizing:border-box;
	}

	.modal{
		width:90%;
		max-width:90%;
	}

	form #message{
		width:100% !important;
		box-sizing:border-box;
	}
}


/* =========================================================
   03. MOBILE FORMS
========================================================= */

@media only screen and (max-width:900px){

	input.textbox,
	input.text,
	.textbox,
	textarea,
	select{
		max-width:100%;
		box-sizing:border-box;
		font-size:16px !important;
	}

	input.textbox,
	.textbox{
		width:100% !important;
	}

	textarea{
		width:100%;
	}

	input[type="checkbox"],
	input[type="radio"]{
		width:auto !important;
	}
}


/* =========================================================
   04. MOBILE TABLE FALLBACK
   Aplicat doar pe pagini stock/formulare, nu global pe toate td.
========================================================= */

@media only screen and (max-width:900px){

	body[class*="newreply"] .tborder td[class*="trow"],
	body[class*="newthread"] .tborder td[class*="trow"],
	body[class*="editpost"] .tborder td[class*="trow"],
	body[class*="private.php send"] .tborder td[class*="trow"],
	body[class*="search.php"] .tborder td[class*="trow"],
	body[class*="avatar"] .tborder td[class*="trow"],
	body[class*="password"] .tborder td[class*="trow"],
	body[class*="email"] .tborder td[class*="trow"],
	body[class*="changename"] .tborder td[class*="trow"],
	body[class*="editsig"] .tborder td[class*="trow"],
	body[class*="contact_us"] .tborder td[class*="trow"]{
		display:block;
		width:auto !important;
		text-align:left;
	}

	body[class*="usercp.php options"] td[width*="50%"],
	body[class="member.php register"] td[width*="50%"]{
		display:block;
		width:auto !important;
	}

	.tcat_menu{
		display:block !important;
	}
}


/* =========================================================
   05. MOBILE HEADER FALLBACK
   Header Premium are CSS dedicat. Aici doar clase vechi.
========================================================= */

@media only screen and (max-width:900px){

	.show_hide_mobile_header{
		font-weight:900;
		cursor:pointer;
		color:#ffffff;
	}

	.mobile_header{
		padding:10px 16px;
		background:rgba(8,14,20,.96);
		border:1px solid rgba(57,255,20,.14);
		border-radius:16px;
		box-shadow:0 12px 30px rgba(0,0,0,.24);
	}

	.mobile_header a{
		display:block;
		padding:11px 6px;
		border-bottom:1px solid rgba(255,255,255,.07);
		color:var(--cs-muted, #8da096);
		font-size:14px;
		font-weight:800;
	}

	.mobile_header a:last-child{
		border-bottom:0;
	}

	.mobile_header a:hover{
		background:rgba(57,255,20,.08);
		color:#ffffff;
	}

	.mobile_header i{
		margin-right:12px;
		color:var(--cs-green, #39ff14);
	}

	.top_links{
		display:none;
	}

	#panel .upper{
		height:auto;
		padding:8px 0;
		line-height:normal;
	}

	.upper .wrapper{
		box-sizing:border-box;
		padding-left:12px;
		padding-right:12px;
	}

	.upper .wrapper [style*="float:left"]{
		float:none !important;
		display:inline-block;
	}

	.upper .wrapper [style*="float:left;margin-top:-2px;margin-left:30px"]{
		display:none;
	}

	.upper .wrapper [style*="float:right;margin-top:-8px;margin-left:15px"]{
		position:relative;
		top:4px;
	}

	#header ul.menu{
		position:relative;
		top:6px;
		float:right;
	}
}


/* =========================================================
   06. MOBILE INDEX / SIDEBAR FALLBACKS
========================================================= */

@media only screen and (max-width:900px){

	.sidebar,
	.forums,
	.sidebar-pm,
	.forums-pm{
		float:none !important;
		width:auto !important;
	}

	.forums{
		margin-top:8px;
	}

	.forums td[width="25%"]{
		display:block;
		width:auto;
	}

	.private_home_center_text{
		position:static;
		top:auto;
		left:auto;
		padding:30px 0;
	}

	.private_main_box{
		height:auto !important;
	}
}


/* =========================================================
   07. MOBILE MEMBERLIST / PROFILE FALLBACKS
========================================================= */

@media only screen and (max-width:900px){

	.memberlist_search_width{
		width:240px !important;
		max-width:100%;
	}

	.memberlist_card{
		display:block;
		width:100%;
		box-sizing:border-box;
		margin:20px 0 0;
	}

	.profile-containter_extras{
		margin:0;
		margin-top:-160px;
	}

	.left-sidebar{
		width:100% !important;
		margin-bottom:30px;
	}

	.sidebar-inner{
		padding:0 !important;
	}

	ul.tabs li{
		display:inline-block !important;
	}
}


/* =========================================================
   08. MOBILE THREADLIST FALLBACKS
========================================================= */

@media only screen and (max-width:900px){

	.mobile_thread_sep{
		margin-bottom:20px;
		border-bottom:1px solid rgba(255,255,255,.08);
	}

	.mobile_modbit{
		float:right;
	}

	.threadlisting{
		margin-bottom:20px !important;
	}

	.threadlisting > td{
		display:inline-block;
		max-width:250px;
		margin:0;
		padding:0;
		border-bottom:0;
	}

	.thread_info{
		margin-left:30px !important;
	}

	.desktop-td-only [class*="trow"]{
		display:none;
	}

	.mobile-td-only [class*="trow"]{
		display:table-cell;
	}
}


/* =========================================================
   09. MOBILE POST FALLBACKS
   PostBit Premium are CSS dedicat. Aici doar clase vechi.
========================================================= */

@media only screen and (max-width:900px){

	.post{
		margin-left:0;
	}

	.post [style*="margin-left:74px"]{
		margin-left:0 !important;
	}

	.post .avatar_style{
		width:40px !important;
		height:40px !important;
	}

	.post a[data-uid]{
		float:left;
		padding-right:10px;
	}

	.postbit_avatar{
		width:30px !important;
		height:30px !important;
	}

	.postbit_avatar_margins{
		width:30px !important;
		margin-top:30px;
		margin-right:-5px;
		margin-left:23px;
	}
}


/* =========================================================
   10. MOBILE MODCP FALLBACKS
   ModCP Premium rămâne în modcp_premium.css.
========================================================= */

@media only screen and (max-width:900px){

	#modcp_pages .tborder,
	.table_fixed{
		table-layout:fixed !important;
		white-space:normal !important;
		overflow:hidden !important;
	}

	#modcp_pages td,
	.table_fixed td{
		display:table-cell !important;
		overflow:hidden !important;
	}

	body[class*="modcp.php "] td[valign="top"][width="240"],
	body[class*="modcp.php "] td[valign="top"][width="240"] + td{
		display:block;
		width:auto !important;
		margin:4px 0;
	}

	body[class="modcp.php "] td[valign="top"][width="240"] + td .tborder:nth-of-type(2) td:nth-child(2),
	body[class="modcp.php "] td[valign="top"][width="240"] + td .tborder:nth-of-type(2) td:nth-child(4),
	body[class="modcp.php "] td[valign="top"][width="240"] + td .tborder:nth-of-type(2) td:nth-child(5){
		display:none;
	}

	body[class="modcp.php "] td[valign="top"][width="240"] + td .tborder:nth-of-type(2) td{
		text-align:left;
	}

	body[class="modcp.php "] td[valign="top"][width="240"] + td .tborder:nth-of-type(2) td:first-child{
		width:65%;
	}

	body[class="modcp.php "] td[valign="top"][width="240"] + td .tborder:nth-of-type(2) td:nth-child(3){
		text-align:right;
	}

	body[class="modcp.php "] td[valign="top"][width="240"] + td .tborder:nth-of-type(3) td:nth-child(3),
	body[class="modcp.php "] td[valign="top"][width="240"] + td .tborder:nth-of-type(3) td:nth-child(4){
		display:none;
	}

	body[class="modcp.php "] td[valign="top"][width="240"] + td .tborder:nth-of-type(3) td:nth-child(2){
		text-align:right;
	}

	body[class="modcp.php editprofile"] td[valign="top"][width="240"] + td .tborder td{
		display:block;
		width:auto !important;
	}
}


/* =========================================================
   11. MOBILE MODCP REPORTS
========================================================= */

@media only screen and (max-width:900px){

	body[class="modcp.php allreports"] td[valign="top"][width="240"] + td .tborder td.tcat:not(:first-child){
		display:none;
	}

	body[class="modcp.php allreports"] td[valign="top"][width="240"] + td .tborder td:not(.thead):not(.tcat){
		display:block;
		text-align:left;
	}

	body[class="modcp.php allreports"] td[valign="top"][width="240"] + td .tborder td::before{
		display:block;
		position:relative;
		padding-bottom:3px;
		color:var(--cs-muted, #8da096);
		font-size:11px;
		font-weight:900;
		text-transform:uppercase;
		letter-spacing:.04em;
	}

	body[class="modcp.php allreports"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]{
		display:block;
		width:auto;
		border-width:0 1px;
	}

	body[class="modcp.php allreports"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(1)::before{
		content:"Conținut raportat";
	}

	body[class="modcp.php allreports"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(2)::before{
		content:"Motiv raport";
	}

	body[class="modcp.php allreports"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(3)::before{
		content:"Raportat de";
	}

	body[class="modcp.php allreports"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(4)::before{
		content:"Număr rapoarte";
	}

	body[class="modcp.php allreports"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(5)::before{
		content:"Data raportării";
	}
}


/* =========================================================
   12. MOBILE MODCP ACTIVE REPORTS
========================================================= */

@media only screen and (max-width:900px){

	body[class="modcp.php reports"] td[valign="top"][width="240"] + td .tborder td:nth-child(3){
		display:none;
	}

	body[class="modcp.php reports"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]{
		display:block;
		border-width:0;
		text-align:left;
	}

	body[class="modcp.php reports"] td[valign="top"][width="240"] + td .tborder .tcat:nth-child(2),
	body[class="modcp.php reports"] td[valign="top"][width="240"] + td .tborder .tcat:nth-child(4){
		display:none;
	}

	body[class="modcp.php reports"] td[valign="top"][width="240"] + td .tborder .tcat:nth-child(5){
		text-align:right;
	}

	body[class="modcp.php reports"] td[valign="top"][width="240"] + td .tborder tr,
	body[class="modcp.php reports"] td[valign="top"][width="240"] + td .tborder td.thead{
		display:block;
		position:relative;
	}

	body[class="modcp.php reports"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(5){
		position:absolute;
		z-index:3;
		top:0;
		right:0;
	}

	body[class="modcp.php reports"] td[valign="top"][width="240"] + td .tborder td::before{
		display:block;
		position:relative;
		padding-bottom:3px;
		color:var(--cs-muted, #8da096);
		font-size:11px;
		font-weight:900;
		text-transform:uppercase;
		letter-spacing:.04em;
	}

	body[class="modcp.php reports"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(1)::before{
		content:"Conținut raportat";
	}

	body[class="modcp.php reports"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(2)::before{
		content:"Motiv raport";
	}

	body[class="modcp.php reports"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(3)::before{
		content:"Număr rapoarte";
	}

	body[class="modcp.php reports"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(4)::before{
		content:"Ultima raportare";
	}
}


/* =========================================================
   13. MOBILE MODCP LOGS / BANS / WARNINGS
========================================================= */

@media only screen and (max-width:900px){

	body[class="modcp.php modlogs"] td[valign="top"][width="240"] + td .tborder:nth-of-type(1) td{
		text-align:left;
	}

	body[class="modcp.php modlogs"] td[valign="top"][width="240"] + td .tborder td::before,
	body[class="modcp.php banning"] td[valign="top"][width="240"] + td .tborder td::before,
	body[class="modcp.php warninglogs"] td[valign="top"][width="240"] + td .tborder td::before{
		display:block;
		position:relative;
		padding-bottom:3px;
		color:var(--cs-muted, #8da096);
		font-size:11px;
		font-weight:900;
		text-transform:uppercase;
		letter-spacing:.04em;
	}

	body[class="modcp.php modlogs"] td[valign="top"][width="240"] + td .tborder:nth-of-type(1) .tcat:not(:first-child),
	body[class="modcp.php banning"] td[valign="top"][width="240"] + td .tborder td.tcat:not(:first-child),
	body[class="modcp.php warninglogs"] td[valign="top"][width="240"] + td .tborder td.tcat:not(:first-child){
		display:none;
	}

	body[class="modcp.php modlogs"] td[valign="top"][width="240"] + td .tborder:nth-of-type(1) td[class*="trow"],
	body[class="modcp.php banning"] td[valign="top"][width="240"] + td .tborder td[class*="trow"],
	body[class="modcp.php warninglogs"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]{
		display:block;
		text-align:left;
	}

	body[class="modcp.php modlogs"] td[valign="top"][width="240"] + td .tborder:nth-of-type(1) td[class*="trow"]:nth-child(1)::before{
		content:"Utilizator";
	}

	body[class="modcp.php modlogs"] td[valign="top"][width="240"] + td .tborder:nth-of-type(1) td[class*="trow"]:nth-child(2)::before{
		content:"Dată";
	}

	body[class="modcp.php modlogs"] td[valign="top"][width="240"] + td .tborder:nth-of-type(1) td[class*="trow"]:nth-child(3)::before{
		content:"Acțiune";
	}

	body[class="modcp.php modlogs"] td[valign="top"][width="240"] + td .tborder:nth-of-type(1) td[class*="trow"]:nth-child(4)::before{
		content:"Informații";
	}

	body[class="modcp.php modlogs"] td[valign="top"][width="240"] + td .tborder:nth-of-type(1) td[class*="trow"]:nth-child(5)::before{
		content:"IP";
	}

	body[class="modcp.php banning"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(1)::before{
		content:"Utilizator";
	}

	body[class="modcp.php banning"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(2)::before{
		content:"Motiv";
	}

	body[class="modcp.php banning"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(3)::before{
		content:"Durată";
	}

	body[class="modcp.php banning"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(4)::before{
		content:"Banat de";
	}

	body[class="modcp.php warninglogs"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(1)::before{
		content:"Utilizator avertizat";
	}

	body[class="modcp.php warninglogs"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(2)::before{
		content:"Avertisment";
	}

	body[class="modcp.php warninglogs"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(3)::before{
		content:"Data";
	}

	body[class="modcp.php warninglogs"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(4)::before{
		content:"Expiră";
	}

	body[class="modcp.php warninglogs"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(5)::before{
		content:"Emis de";
	}

	body[class="modcp.php warninglogs"] td[valign="top"][width="240"] + td .tborder td[class*="trow"]:nth-child(6)::before{
		content:"Detalii";
	}

	body[class="modcp.php finduser"] td[valign="top"][width="240"] + td .tborder:nth-of-type(1) td:nth-child(2),
	body[class="modcp.php finduser"] td[valign="top"][width="240"] + td .tborder:nth-of-type(1) td:nth-child(3),
	body[class="modcp.php finduser"] td[valign="top"][width="240"] + td .tborder:nth-of-type(1) td:nth-child(4){
		display:none;
	}
}


/* =========================================================
   14. MOBILE MODERATION.PHP FALLBACKS
========================================================= */

@media only screen and (max-width:900px){

	body[class="moderation.php threadnotes"] form .tborder:not(:first-child) td.tcat:not(:first-child),
	body[class="moderation.php delayedmoderation"] .container .tborder.delayed_mod_queue td.tcat:not(:first-child){
		display:none;
	}

	body[class="moderation.php threadnotes"] form .tborder:not(:first-child) td:not(.tcat),
	body[class="moderation.php delayedmoderation"] .container .tborder.delayed_mod_queue td[class*="trow"],
	body[class="moderation.php delayedmoderation"] td[class*="trow"],
	body[class="moderation.php merge"] td[class*="trow"],
	body[class="moderation.php split"] td[class*="trow"],
	body[class="moderation.php move"] td[class*="trow"]{
		display:block;
		width:auto !important;
		text-align:left;
	}

	body[class="moderation.php threadnotes"] form .tborder:not(:first-child) td:not(.tcat)::before,
	body[class="moderation.php delayedmoderation"] .container .tborder.delayed_mod_queue td[class*="trow"]::before{
		display:block;
		position:relative;
		padding-bottom:3px;
		color:var(--cs-muted, #8da096);
		font-size:11px;
		font-weight:900;
		text-transform:uppercase;
		letter-spacing:.04em;
		text-align:left;
	}

	body[class="moderation.php threadnotes"] form .tborder:nth-child(2) td[class*="trow"]:nth-child(2)::before{
		content:"Dată";
	}

	body[class="moderation.php threadnotes"] form .tborder:nth-child(2) td[class*="trow"]:nth-child(3)::before{
		content:"Acțiune";
	}

	body[class="moderation.php threadnotes"] form .tborder:nth-child(2) td[class*="trow"]:nth-child(4)::before{
		content:"Informații";
	}

	body[class="moderation.php threadnotes"] .tcat,
	body[class="moderation.php delayedmoderation"] .container .tborder.delayed_mod_queue td.tcat{
		text-align:left;
	}

	body[class="moderation.php delayedmoderation"] .container .tborder.delayed_mod_queue td[class*="trow"]:nth-child(2)::before{
		content:"Zile până la acțiune";
	}

	body[class="moderation.php delayedmoderation"] .container .tborder.delayed_mod_queue td[class*="trow"]:nth-child(3)::before{
		content:"Acțiune";
	}

	body[class="moderation.php delayedmoderation"] .container .tborder.delayed_mod_queue td[class*="trow"]:nth-child(4)::before{
		content:"Informații";
	}

	body[class="moderation.php delayedmoderation"] .container .tborder.delayed_mod_queue td[class*="trow"]:nth-child(5)::before{
		content:"Acțiuni";
	}
}


/* =========================================================
   15. MOBILE PM / SEARCH / SPECIAL FORMS
========================================================= */

@media only screen and (max-width:900px){

	body[class="private.php "] .box-bgs ~ .tborder.tborder td[class*="trow"]:nth-child(2),
	body[class="private.php "] .box-bgs ~ .tborder.tborder td[class*="trow"]:nth-child(4){
		display:none;
	}

	.search_page .tborder td{
		display:block;
		width:auto !important;
		border-width:1px 2px;
	}

	form[action*="newthread.php?fid=67"] .tborder,
	form[action*="editpost.php"] .tborder{
		width:100% !important;
	}
}


/* =========================================================
   16. SMALL MOBILE
========================================================= */

@media only screen and (max-width:600px){

	.wrapper{
		width:min(100% - 18px, 100%);
	}

	#content{
		padding:10px 0;
	}

	.modal{
		width:94%;
		max-width:94%;
	}

	.profile-containter_extras{
		margin-top:-120px;
	}

	.memberlist_search_width{
		width:100% !important;
	}

	#backtop{
		right:10px;
		bottom:55px;
	}
}