html { background:#444 url("../img/bg.png") repeat; }
body { margin:0; padding:0; font-family:'Share', Verdana, Arial; font-size:13px; color:#333; }

img,td,th{border:0}
img#logo{padding:18px 25px 0px 5px;float:left;}
h1,h2,h3,h4,h5,h6{color:#333;}

div#header { padding:0 10px; margin:0px auto 5px auto; width:880px; height:75px; }
div#menu { float:left; margin:0; padding:0; }
div#menu ul { list-style:none; margin:0; padding:0; }
div#menu li { display:inline; margin:0; padding:0; }
div#menu a {
    float:left;
    height:30px;
    width:150px;
    padding-top:45px;
    display:block;
    text-decoration:none;
    color:white;
    font-size:18px;
    text-shadow: #333 1px 1px;
    -webkit-transition: background 200ms ease-in 100ms, color 200ms ease-in 100ms, text-shadow 200ms ease-in 100ms;
    -moz-transition: background 200ms ease-in 100ms, color 200ms ease-in 100ms, text-shadow 200ms ease-in 100ms;
    -o-transition: background 200ms ease-in 100ms, color 200ms ease-in 100ms, text-shadow 200ms ease-in 100ms;
    transition: background 200ms ease-in 100ms, color 200ms ease-in 100ms, text-shadow 200ms ease-in 100ms;
}
div#menu a:hover { color:orange; background-color:rgba(255,255,255,0.2); }
div#menu a.active { color:orange; }
div#main {
    width:900px;
    margin:5px auto;
    padding:0;
    background-color:white;
    border-radius:8px;
    min-height:500px;
    -moz-box-shadow: 0px 5px 15px rgba(0,0,0,0.6);
    -webkit-box-shadow: 0px 5px 15px rgba(0,0,0,0.6);
    box-shadow: 0px 5px 15px rgba(0,0,0,0.6);
}
div.ui-tabs-panel a, div.ui-tabs-panel a:visited { color:#000099; }
div.ui-tabs-panel a:hover, div.ui-tabs-panel a:active { color:#000033; text-decoration:none; }
div.ui-tabs { padding: 0; }
div.ui-tabs .ui-corner-all { border-radius: 4px 4px 0 0; }
div#footer {
    font-size:x-small;
    color:#FCFCFC;
    padding:0px 5px 10px 5px;
    margin:0px auto 10px auto;
    width:890px;
}
div#footer a, div#footer a:visited { color:#FCFCFC; font-size:12px; font-weight:bold; text-decoration:none; }
div#footer a:hover, div#footer a:active { color:#FFFFFF; text-decoration:underline; }
div#footer table { width: 100%; }
div#footer table tr td { width:33%; }
div#errorbox {
    text-align: center;
    width: 500px;
    margin: 0 auto;
    padding-top: 200px;
}
div#loading { display:none; float:right; margin-top:25px; }
div.halfleft { width:49%; float:left; }
div.halfright { width:49%; float:right; }
div.choser { text-align:right; margin-bottom:10px; }
div.motd {
    border:1px solid #ccc;
    margin:15px 5px 0 5px;
    padding:5px;
    height:300px;
    overflow:scroll;
}
div.motd pre { font-family:"Courier New", Courier, monospace; }
div.topic { border:1px dashed #ccc; padding:10px; font-family:"Courier New", Courier, monospace; }
span.val { color:#0066CC; }
div.clear { clear:both; }
table.details th { text-align:left; vertical-align:top; }

/* jQuery-UI overrides */
.ui-widget {
    font-family:'Share', Verdana, Arial !important;
    font-size:13px !important;
}
.ui-widget .ui-widget {
    font-size:13px !important;
}
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
    font-family:'Share', Verdana, Arial !important;
    font-size:13px !important;
}
.ui-widget-content {
    border: 0 !important;
    background: none !important;
    color:#333333 !important;
}
.ui-widget-content a {
    color: #333333 !important;
}
ul.ui-menu.ui-widget-content {
    border: 1px solid #aaaaaa !important;
    background: #ffffff !important;
    color: #222222 !important;
}
ul.ui-menu.ui-widget-content a {
    color: #222222 !important;
    text-decoration: none !important;
    border: 0 !important;
    padding: 0 !important;
}
ul.ui-menu .ui-menu-item {
    padding: 3px 1em 3px 0.4em;
}

/* DataTables overrides */
table.dataTable tbody th,
table.dataTable tbody td {
    padding: 6px 10px !important;
}
.dataTables_wrapper .ui-toolbar {
    padding: 6px !important;
}
table.dataTable tbody tr img { vertical-align:middle; }
table.clickable tbody tr.even:hover td, table.clickable tbody tr.odd:hover td {
    cursor: pointer;
    background-color: #FFE97F;
}

/* =========================================================
   Ayna.ORG MagIRC custom fixes
   Normal görünüm + WordPress embed görünümü
   ========================================================= */

/* Logo normal görünüm */
img#logo {
    max-height: 55px !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    position: relative !important;
    top: -20px !important;
}

/* Embed mode ana reset */
html.ayna-embed-html,
html.ayna-embed-html body,
body.ayna-embed-mode {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #ffffff !important;
    overflow-x: hidden !important;
}

/* Embed mode: header/footer/logo gizle */
body.ayna-embed-mode div#header,
body.ayna-embed-mode div#footer,
body.ayna-embed-mode img#logo,
body.ayna-embed-mode #header,
body.ayna-embed-mode #footer,
body.ayna-embed-mode #logo,
body.ayna-embed-mode header,
body.ayna-embed-mode footer,
body.ayna-embed-mode .header,
body.ayna-embed-mode .footer,
body.ayna-embed-mode .logo,
body.ayna-embed-mode .powered,
body.ayna-embed-mode .powered-by,
body.ayna-embed-mode #powered {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

/* Embed mode: MagIRC ana kutu */
body.ayna-embed-mode div#main {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: #ffffff !important;
    overflow: hidden !important;
}

/* Embed üst menü */
body.ayna-embed-mode #aynaEmbedBackbar {
    position: sticky !important;
    top: 0 !important;
    z-index: 99999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 9px 10px !important;
    box-sizing: border-box !important;
    background: linear-gradient(135deg, #0f172a, #1e293b) !important;
    border-bottom: 1px solid rgba(255,255,255,.12) !important;
    box-shadow: 0 4px 14px rgba(15, 23, 42, .18) !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
}

body.ayna-embed-mode #aynaEmbedBackbar a {
    flex: 0 0 auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 30px !important;
    padding: 7px 14px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(255,255,255,.18) !important;
    background: rgba(255,255,255,.10) !important;
    color: #fff !important;
    font-size: 12px !important;
    line-height: 1 !important;
    text-decoration: none !important;
    cursor: pointer !important;
    font-family: inherit !important;
    white-space: nowrap !important;
}

body.ayna-embed-mode #aynaEmbedBackbar a:hover {
    background: rgba(255,255,255,.20) !important;
}

body.ayna-embed-mode #aynaEmbedBackbar .aynaEmbedActive,
body.ayna-embed-mode #aynaEmbedHomeBtn.aynaEmbedActive,
body.ayna-embed-mode #aynaEmbedChannelsBtn.aynaEmbedActive,
body.ayna-embed-mode #aynaEmbedUsersBtn.aynaEmbedActive {
    background: rgba(34,197,94,.22) !important;
    border-color: rgba(34,197,94,.42) !important;
}

/* Embed: jQuery UI alanları */
body.ayna-embed-mode div.ui-tabs,
body.ayna-embed-mode .ui-tabs,
body.ayna-embed-mode .ui-widget,
body.ayna-embed-mode .ui-widget-content {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    background: #ffffff !important;
    overflow: hidden !important;
}

body.ayna-embed-mode .ui-tabs-panel {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 4px !important;
    box-sizing: border-box !important;
    background: #ffffff !important;
    overflow: hidden !important;
}

body.ayna-embed-mode .ui-tabs-nav {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    white-space: nowrap !important;
}

/* Embed: DataTables masaüstü */
body.ayna-embed-mode .dataTables_wrapper {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch !important;
}

body.ayna-embed-mode table.dataTable {
    max-width: 100% !important;
    margin-bottom: 0 !important;
    box-sizing: border-box !important;
}

/* Footer kaynaklı kalan boşlukları kes */
body.ayna-embed-mode .clear {
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* Ayna embed mobil nihai düzeltme */
@media (max-width: 768px) {
    html.ayna-embed-html,
    html.ayna-embed-html body,
    body.ayna-embed-mode {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow-x: hidden !important;
        background: #ffffff !important;
    }

    body.ayna-embed-mode div#main {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: hidden !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }

    body.ayna-embed-mode .ui-tabs,
    body.ayna-embed-mode .ui-tabs-panel,
    body.ayna-embed-mode .ui-widget,
    body.ayna-embed-mode .ui-widget-content {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        overflow: hidden !important;
    }

    body.ayna-embed-mode .ui-tabs-panel {
        padding: 2px !important;
    }

    body.ayna-embed-mode #aynaEmbedBackbar {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        justify-content: flex-start !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        padding: 7px 6px !important;
        gap: 6px !important;
    }

    body.ayna-embed-mode #aynaEmbedBackbar a {
        flex: 0 0 auto !important;
        font-size: 11px !important;
        padding: 6px 9px !important;
        white-space: nowrap !important;
    }

    body.ayna-embed-mode .ui-tabs-nav {
        max-width: 100% !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        white-space: nowrap !important;
        box-sizing: border-box !important;
    }

    body.ayna-embed-mode .dataTables_wrapper {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
    }

    body.ayna-embed-mode table.dataTable {
        width: 100% !important;
        min-width: 560px !important;
        table-layout: auto !important;
        font-size: 11px !important;
        margin: 0 !important;
    }

    body.ayna-embed-mode table.dataTable thead th,
    body.ayna-embed-mode table.dataTable thead td,
    body.ayna-embed-mode table.dataTable tbody th,
    body.ayna-embed-mode table.dataTable tbody td {
        padding: 4px 6px !important;
        white-space: nowrap !important;
        word-break: normal !important;
        overflow-wrap: normal !important;
        vertical-align: middle !important;
    }

    body.ayna-embed-mode .dataTables_length,
    body.ayna-embed-mode .dataTables_filter,
    body.ayna-embed-mode .dataTables_info,
    body.ayna-embed-mode .dataTables_paginate {
        float: none !important;
        clear: both !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
        font-size: 10px !important;
        text-align: left !important;
        margin: 4px 0 !important;
        overflow-x: auto !important;
    }

    body.ayna-embed-mode .dataTables_filter input {
        max-width: 160px !important;
    }
}

@media (max-width: 420px) {
    body.ayna-embed-mode table.dataTable {
        min-width: 520px !important;
        font-size: 10px !important;
    }

    body.ayna-embed-mode table.dataTable thead th,
    body.ayna-embed-mode table.dataTable thead td,
    body.ayna-embed-mode table.dataTable tbody th,
    body.ayna-embed-mode table.dataTable tbody td {
        padding: 3px 5px !important;
    }
}