/*
Theme Name: Mudos Theme
Theme URI: https://mudosdigital.com/
Author: Mudos Digital
Author URI: https://mudosdigital.com/
Description: A custom theme for Mudos Digital, featuring a hardcoded header, custom project portfolio, modernized blog layout, Brevo API integration for form submissions, and brand/client showcase with SVG support. Includes Gutenberg compatibility fix for WordPress 6.3+ and multilingual post management for WordPress Multisite. Fixed language switcher to use permanent WPLANG settings instead of temporary query parameters. Removed legacy locale filters that were causing WPLANG to change automatically in multisite. Fixed language URLs to use network_home_url() preventing nested language paths. Language switcher now defaults to homepage URLs to prevent 404 errors and URL loops. Added admin language dropdown for easy site language management in multisite. Custom vanilla JavaScript slider for case studies on service pages with responsive design and smooth transitions. Added language dropdown on single blog posts for seamless translation switching.
Version: 2.5.6
Requires at least: 5.8
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mudos-theme
*/

body:not(.wf-active) { visibility: hidden; }
body.wf-active { visibility: visible; }

@keyframes fadeIn {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

.animate-fade-in { animation: fadeIn 1s ease-out; }

/* Enhanced Header Styles */
.site-header {
    transition: all 0.3s ease;
    will-change: transform, box-shadow;
}

.header-scrolled {
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

/* Enhanced Desktop Menu */
#primary-nav-desktop {
    transition: all 0.3s ease;
}

#primary-nav-desktop ul {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

#primary-nav-desktop li {
    position: relative;
}

#primary-nav-desktop li a {
    display: block;
    padding: 0.5rem 0.75rem;
    border-radius: 6px;
    transition: all 0.2s;
    font-weight: 500;
}

#primary-nav-desktop li a:hover,
#primary-nav-desktop li:hover > a {
    background-color: rgba(59, 130, 246, 0.1);
    color: #3b82f6;
}

/* Enhanced Mobile Menu */
#mobile-nav {
    max-height: calc(100vh - 70px);
    overflow-y: auto;
    border-radius: 0 0 10px 10px;
    box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
    display: none;
}

#mobile-nav li {
    border-bottom: 1px solid rgba(229, 231, 235, 0.5);
    position: relative;
}

#mobile-nav li:last-child {
    border-bottom: none;
}

#mobile-nav li a {
    display: block;
    padding: 12px 0;
    font-weight: 500;
}

#mobile-nav .sub-menu {
    background-color: rgba(243, 244, 246, 0.5);
    border-radius: 8px;
    margin: 8px 0;
    padding: 8px 16px;
    display: none;
}

#mobile-nav .sub-menu li {
    padding: 0;
    border-bottom: 1px solid rgba(229, 231, 235, 0.3);
}

#mobile-nav .sub-menu li:last-child {
    border-bottom: none;
}

#mobile-nav .sub-menu a {
    padding: 8px 0;
    display: block;
    font-size: 0.9rem;
}

#mobile-nav .menu-item-has-children {
    position: relative;
}

#mobile-nav .menu-item-has-children > a {
    position: relative;
    padding-right: 30px;
}

#mobile-nav .menu-item-has-children > a:after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6l-6-6z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
}

#mobile-nav .menu-item-has-children.submenu-open > a:after {
    transform: translateY(-50%) rotate(180deg);
}

/* Enhanced Search Form */
#search-form {
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    transition: all 0.2s ease;
    display: none;
}

#search-form input {
    width: 250px;
    padding: 10px 15px;
    border-radius: 6px;
    transition: all 0.2s;
}

#search-form input:focus {
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2);
    outline: none;
}

/* Mobile Search */
#mobile-search-container {
    display: none;
}

/* Dropdown Menus */
#primary-nav-desktop .sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 220px;
    background: white;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    z-index: 50;
    visibility: hidden;
    opacity: 0;
    transform: translateY(10px);
    transition: all 0.3s ease;
    padding: 0.75rem;
    display: block;
    list-style: none;
}

#primary-nav-desktop li:hover > .sub-menu {
    visibility: visible;
    opacity: 1;
    transform: translateY(0);
}

#primary-nav-desktop .sub-menu li {
    margin: 8px 0;
    display: block;
}

#primary-nav-desktop .sub-menu a {
    display: block;
    padding: 8px 16px;
    border-radius: 4px;
    transition: all 0.2s;
}

#primary-nav-desktop .sub-menu a:hover {
    background-color: rgba(59, 130, 246, 0.1);
    color: #3b82f6;
}

/* Multi-level dropdown adjustments */
#primary-nav-desktop .sub-menu .menu-item-has-children > a:after {
    content: '';
    width: 0.4rem;
    height: 0.4rem;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    display: inline-block;
    margin-left: 0.5rem;
    transform: rotate(-45deg);
}

#primary-nav-desktop .sub-menu .sub-menu {
    top: 0;
    left: 100%;
    margin-top: 0;
    margin-left: 1px;
}

    /* Submenu İkonları için CSS Ekleme */
#primary-nav-desktop .menu-item-has-children > a {
    position: relative;
    padding-right: 1.5rem;
}

#primary-nav-desktop .menu-item-has-children > a:after {
    content: '';
    position: absolute;
    right: 0.5rem;
    top: 50%;
    transform: translateY(-50%);
    width: 0.5rem;
    height: 0.5rem;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    display: inline-block;
    transform: translateY(-50%) rotate(45deg);
    transition: transform 0.2s;
}

#primary-nav-desktop .menu-item-has-children:hover > a:after {
    transform: translateY(-30%) rotate(45deg);
}

/* Mobile menu submenu ikonları düzeltme */
#mobile-nav .menu-item-has-children > a:after {
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    width: 20px;
    height: 20px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M7.41 8.59L12 13.17l4.59-4.58L18 10l-6 6l-6-6z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    transform: translateY(-50%);
    transition: transform 0.3s;
}

#mobile-nav .menu-item-has-children.submenu-open > a:after {
    transform: translateY(-50%) rotate(180deg);
}

/* Custom class for flex menu items */
.menu-link-flex {
    display: inline-flex !important;
    align-items: center;
    gap: 0.25rem; /* 4px */
}

.single-blog-post p {
    margin-bottom: 1.25rem; /* 20px */
}
.single-blog-post h2 {
    font-size: 1.875rem; /* 30px */
    font-weight: 700;
    margin-top: 2.5rem; /* 40px */
    margin-bottom: 1.25rem; /* 20px */
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 0.5rem;
}
.single-blog-post h3 {
    font-size: 1.5rem; /* 24px */
    font-weight: 600;
    margin-top: 2rem; /* 32px */
    margin-bottom: 1rem; /* 16px */
}
.single-blog-post h4 {
    font-size: 1.25rem; /* 20px */
    font-weight: 600;
    margin-top: 1.5rem; /* 24px */
    margin-bottom: 0.75rem; /* 12px */
}
.single-blog-post ul,
.single-blog-post ol {
    margin-left: 1.5rem;
    margin-bottom: 1.25rem;
}
.single-blog-post ul {
    list-style-type: disc;
}
.single-blog-post ol {
    list-style-type: decimal;
}
.single-blog-post li {
    margin-bottom: 0.5rem;
}
.single-blog-post a {
    color: #2563eb;
    text-decoration: underline;
}
.single-blog-post a:hover {
    color: #1d4ed8;
}
.single-blog-post table {
    width: 100%;
    margin-bottom: 1.5rem;
    border-collapse: collapse;
}
.single-blog-post th,
.single-blog-post td {
    border: 1px solid #e5e7eb;
    padding: 0.75rem 1rem;
}
.single-blog-post th {
    background-color: #f9fafb;
    font-weight: 600;
    text-align: left;
}
.single-blog-post blockquote {
    border-left: 4px solid #d1d5db;
    padding-left: 1rem;
    margin-left: 0;
    margin-bottom: 1.5rem;
    font-style: italic;
    color: #4b5563;
}
.single-blog-post code {
    background-color: #f3f4f6;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    font-family: monospace;
}
.single-blog-post pre {
    background-color: #f3f4f6;
    padding: 1rem;
    border-radius: 0.5rem;
    margin-bottom: 1.5rem;
    overflow-x: auto;
}
.single-blog-post pre code {
    padding: 0;
    background-color: transparent;
}
.toc ul {
    list-style-type: none;
    padding-left: 0;
    border-left: 1px solid #e5e7eb; /* gray-200 */
    margin-left: 0.25rem;
}
.toc li {
    padding-left: 1rem;
    margin-bottom: 0.25rem;
}
.toc a {
    display: block;
    padding: 0.5rem;
    border-radius: 0.375rem; /* rounded-md */
    transition: all 0.2s ease-in-out;
    color: #4b5563; /* gray-600 */
}
.toc a:hover {
    background-color: #f3f4f6; /* gray-100 */
    color: #111827; /* gray-900 */
    transform: translateX(4px);
}
.toc a.active {
    background-color: #e0e7ff; /* indigo-100 */
    color: #3730a3; /* indigo-800 */
    font-weight: 600;
    box-shadow: -2px 0 0 0 #4f46e5; /* indigo-600 */
}
.toc.collapsed {
    width: 2.5rem;
    padding: 0.5rem;
}
.toc.collapsed #toc-inner {
    display: none;
}
.toc.collapsed #toc-toggle-desktop .iconify {
    transform: rotate(180deg);
}
.toc-toggle-transition {
    transition: transform 0.3s ease;
}
.toc {
    width: 100%;
}

.active-tab {
    background-color: white;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
}

@keyframes heroBgFade {
    0% { opacity: 0.15; }
    50% { opacity: 0.25; }
    100% { opacity: 0.15; }
}

.animate-fade-in-delay {
    animation: fadeIn 1s ease-out 0.5s backwards;
}

.animate-hero-bg {
    animation: heroBgFade 10s ease-in-out infinite;
}

/* Custom Form Styles */
#custom-request-form-container {
    background-color: #f0f4f8;
    position: relative;
    overflow: hidden;
}
#custom-request-form-container::before {
    content: '';
    position: absolute;
    top: -10%;
    left: -10%;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(79, 70, 229, 0.1), transparent 70%);
    z-index: 0;
}
#custom-request-form-container::after {
    content: '';
    position: absolute;
    bottom: -15%;
    right: -15%;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(30, 64, 175, 0.1), transparent 70%);
    z-index: 0;
}
#custom-request-form-container > .container {
    position: relative;
    z-index: 1;
}
#custom-request-form .form-input {
    transition: all 0.3s ease;
    border: 1px solid #d1d5db;
}
#custom-request-form .form-input:focus {
    border-color: #4f46e5;
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.2);
}
#custom-request-form button[type="submit"] {
    background: linear-gradient(to right, #4f46e5, #6366f1);
    box-shadow: 0 4px 15px 0 rgba(79, 70, 229, 0.4);
}
/* Test comment - Sat Nov  8 13:28:07 +03 2025 */