/* EN ÜST BEYAZ ŞERİDİ KALDIR - NAZIK YÖNTEMİ */
html {
   margin-top: 0 !important;
   padding-top: 0 !important;
}

body {
   margin-top: 0 !important;
   padding-top: 0 !important;
}

/* MINIMAL & ŞIK YAYINEVI BRANDING */

/* Reset & Base - GÜÇLÜ OVERRIDE */
body, html {
   margin: 0 !important;
   padding: 0 !important;
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
   background-color: #ffffff !important;
   background: #ffffff !important;
   line-height: 1.6;
   position: relative !important;
   top: 0 !important;
}

/* Tüm OJS container'ları için beyaz zemin */
.pkp_structure_page,
.pkp_page_wrapper,
body.pkp_page,
.page-wrapper,
#main,
.site-wrapper {
   background-color: #ffffff !important;
   background: #ffffff !important;
}

/* TÜM ÜST BOŞLUKLARI KALDIR */
html {
   margin-top: 0 !important;
   padding-top: 0 !important;
}

body {
   margin-top: 0 !important;
   padding-top: 0 !important;
}

/* Beyazlık problemi için ek reset */
* {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
}

/* TÜM HEADER ELEMENTLERİNİ RESET ET */
body,
body > *,
body > div,
body > header,
body > section,
body > main,
#app,
#root,
.App,
.pkp_structure_page,
.pkp_structure_head,
.pkp_structure_header,
.site-header,
#headerNavigationContainer,
.header-wrapper,
.navbar-wrapper {
   margin-top: 0 !important;
   padding-top: 0 !important;
   position: relative !important;
   top: 0 !important;
}

/* Üst boşluk problemini çöz */
body::before,
html::before,
*::before {
   display: none !important;
   content: none !important;
   margin: 0 !important;
   padding: 0 !important;
   height: 0 !important;
}

/* OJS Header Reset */
.pkp_head_wrapper,
.navbar-static-top,
.navbar-header,
.site-branding {
   margin-top: 0 !important;
   padding-top: 0 !important;
}

/* Clean Header - COOL GRAY */
.header {
   max-width: 1200px;
   margin: 0 auto;
   padding: 4px 32px;
   background: #f1f3f4;
   border-radius: 0 0 12px 12px;
   box-shadow: 0 2px 12px rgba(0,0,0,0.04);
   position: relative !important;
   top: 0 !important;
   z-index: 100;
   border-bottom: 1px solid #e9ecef;
}

.header-content {
   display: flex;
   flex-direction: column;
   gap: 2px;
}

/* Elegant Navigation */
.pkp_navigation_primary,
#navigationPrimary,
.navbar-nav,
nav.navbar,
header nav,
#navigationUser + nav,
.main-navigation {
   margin-top: 4px;
   padding: 4px 0;
   border-top: 1px solid #f0f0f0;
}

.pkp_structure_header,
.site-header,
#headerNavigationContainer,
body > header {
   margin-bottom: 8px;
   margin-top: 0;
   padding-top: 0;
}

body > header + * {
   margin-top: 8px;
}

/* Sophisticated Slogan */
.slogan-container {
   width: 100%;
   text-align: center;
   padding: 6px 0 10px;
   background: transparent;
   position: relative;
   margin-top: 0;
}

.slogan {
   font-family: 'Playfair Display', 'Georgia', serif;
   font-weight: 600;
   font-style: italic;
   font-size: clamp(24px, 4vw, 32px);
   color: #5B3483;
   margin: 0;
   letter-spacing: 0.5px;
   transition: color 0.3s ease;
}

.slogan:hover {
   color: #4a2a6b;
}

/* Minimal Accent Line */
.slogan-container::after {
   content: '';
   position: absolute;
   bottom: 0;
   left: 50%;
   transform: translateX(-50%);
   width: 60px;
   height: 2px;
   background: #EE7656;
   border-radius: 1px;
}

/* Clean Footer - GÜÇLÜ OVERRIDE */
.footer,
.footer *,
.footer .container,
.footer .column,
.footer .bottom,
.footer div,
.social-icons {
   background: #e8eaed !important;
   background-color: #e8eaed !important;
}

.footer {
   padding: 40px 0 20px;
   margin-top: 60px;
   border-top: 1px solid #e9ecef;
   position: relative;
}

/* Footer Container */
.footer .container {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
   gap: 32px;
   max-width: 1200px;
   margin: 0 auto;
   padding: 0 32px;
}

/* Footer Bottom - EXTRA GÜÇLÜ */
.footer .bottom {
   text-align: center !important;
   font-size: 13px !important;
   color: #6c757d !important;
   padding: 24px 0 0 !important;
   margin: 24px 0 0 !important;
   border-top: 1px solid #e9ecef !important;
}

.footer .container {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
   gap: 32px;
   max-width: 1200px;
   margin: 0 auto;
   padding: 0 32px;
}

.footer .column {
   margin: 0;
}

/* Elegant Follow Button */
.footer .follow-us {
   position: absolute;
   top: -12px;
   left: 50%;
   transform: translateX(-50%);
   background: #EE7656;
   color: white;
   padding: 8px 20px;
   font-weight: 500;
   font-size: 14px;
   border-radius: 20px;
   box-shadow: 0 2px 8px rgba(238, 118, 86, 0.3);
   letter-spacing: 0.3px;
}

.footer h4 {
   margin: 0 0 12px 0;
   font-size: 16px;
   font-weight: 600;
   color: #2c3e50;
}

.footer ul {
   padding: 0;
   margin: 0;
   list-style: none;
}

.footer ul li {
   margin-bottom: 6px;
   font-size: 14px;
   color: #6c757d;
}

.footer a {
   color: inherit;
   text-decoration: none;
   transition: color 0.2s ease;
}

.footer a:hover {
   color: #2C5F7B;
}

/* Minimal Bottom */
.footer .bottom {
   text-align: center;
   font-size: 13px;
   color: #6c757d;
   padding: 24px 0 0;
   margin: 24px 0 0;
   border-top: 1px solid #e9ecef;
}

/* OJS Link Badge - Görünür Hale Getirildi */
.footer::after {
   content: '';
   position: absolute;
   bottom: -1px;
   right: 32px;
   width: 80px;
   height: 20px;
   z-index: 5;
}

.footer .ojs-link {
   position: absolute;
   bottom: -1px;
   right: 32px;
   background: #2C5F7B;
   color: white !important;
   font-size: 9px;
   padding: 4px 10px;
   border-radius: 2px 2px 0 0;
   font-weight: 500;
   letter-spacing: 0.8px;
   text-decoration: none !important;
   transition: opacity 0.3s ease;
   opacity: 0.9;
   z-index: 10;
   display: inline-block;
}

.footer .ojs-link:hover {
   opacity: 1;
   color: white !important;
   text-decoration: none !important;
}

/* Responsive Design */
@media (max-width: 768px) {
   .header {
       margin: 0 16px;
       padding: 4px 24px;
       border-radius: 0 0 8px 8px;
   }
   
   .footer .container {
       grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
       gap: 24px;
       padding: 0 24px;
   }
   
   .footer .ojs-link {
       right: 24px;
       font-size: 8px;
       padding: 3px 8px;
   }
}

@media (max-width: 480px) {
   .header {
       margin: 0 12px;
       padding: 4px 20px;
   }
   
   .footer .container {
       grid-template-columns: 1fr;
       padding: 0 20px;
   }
   
   .slogan-container {
       padding: 4px 0 8px;
   }
   
   .footer .ojs-link {
       right: 20px;
       font-size: 8px;
       padding: 3px 8px;
   }
}

/* Smooth Interactions */
* {
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
}

/* Hide OJS Branding */
.pkp_brand_footer,
.ojsLogo,
.ojs-logo,
.footer .ojs-hosting {
   display: none;
}