/*
 * Global responsive sync layer
 * Desktop görünümünü korur, yalnızca tablet/mobilde düzenlemeler uygular.
 */

html,
body {
    max-width: 100%;
}

img,
svg,
video,
canvas,
iframe {
    max-width: 100%;
    height: auto;
}

/* Logo images keep their explicit height */
.logo img {
    max-width: none;
}

:where(.table-wrap, .table-container, .table-responsive, .data-table-wrap, .admin-table-wrap) {
    max-width: 100%;
}

@media (max-width: 1024px) {
    html,
    body {
        overflow-x: hidden;
        -webkit-text-size-adjust: 100%;
        text-size-adjust: 100%;
    }

    :where(
        .container,
        .main-container,
        .content-container,
        .page-container,
        .dashboard-container,
        .section-container,
        .wrapper,
        .content-wrapper
    ) {
        width: min(100%, calc(100% - 48px));
        margin-left: auto;
        margin-right: auto;
    }

    :where(
        .grid,
        .cards,
        .card-grid,
        .pricing-grid,
        .plans-grid,
        .stats-grid,
        .feature-grid,
        .features-grid,
        .integrations-grid,
        .blog-grid
    ) {
        grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
        gap: 16px;
    }

    :where(.sidebar, .left-panel, .right-panel) {
        width: 100%;
    }

    :where(.main-content, .content-area, .dashboard-main) {
        width: 100%;
        margin-left: 0;
    }

    :where(.card, .plan-card, .pricing-card, .feature-card, .stat-card) {
        padding: 18px;
    }
}

@media (max-width: 768px) {
    :where(
        .container,
        .main-container,
        .content-container,
        .page-container,
        .dashboard-container,
        .section-container,
        .wrapper,
        .content-wrapper
    ) {
        width: min(100%, calc(100% - 28px));
    }

    :where(.nav-links, .navbar-links, .menu-links, .top-nav, .navbar-menu) {
        flex-wrap: wrap;
        gap: 8px;
    }

    :where(.btn, button, .button, .package-card-button, .nav-btn) {
        min-height: 42px;
    }

    :where(input, select, textarea) {
        max-width: 100%;
    }

    :where(.table-wrap, .table-container, .table-responsive, .data-table-wrap, .admin-table-wrap) {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    :where(.table-wrap, .table-container, .table-responsive, .data-table-wrap, .admin-table-wrap) table {
        min-width: 640px;
    }

    :where(
        .icon,
        .menu-icon,
        .nav-icon,
        .feature-icon,
        .stat-icon,
        .card-icon,
        .plan-icon,
        .integration-icon,
        .dashboard-icon
    ) {
        font-size: 0.92em;
    }

    :where(
        .icon svg,
        .menu-icon svg,
        .nav-icon svg,
        .feature-icon svg,
        .stat-icon svg,
        .card-icon svg,
        .plan-icon svg,
        .integration-icon svg,
        .dashboard-icon svg
    ) {
        width: min(100%, 22px);
        height: min(100%, 22px);
    }
}

@media (max-width: 480px) {
    :where(
        h1,
        .hero-title,
        .page-title,
        .section-title,
        .dashboard-title
    ) {
        line-height: 1.2;
        overflow-wrap: anywhere;
    }

    :where(
        .icon,
        .menu-icon,
        .nav-icon,
        .feature-icon,
        .stat-icon,
        .card-icon,
        .plan-icon,
        .integration-icon,
        .dashboard-icon
    ) {
        font-size: 0.86em;
    }

    :where(
        .icon svg,
        .menu-icon svg,
        .nav-icon svg,
        .feature-icon svg,
        .stat-icon svg,
        .card-icon svg,
        .plan-icon svg,
        .integration-icon svg,
        .dashboard-icon svg
    ) {
        width: min(100%, 20px);
        height: min(100%, 20px);
    }
}

/* Page-specific production responsive hardening */
@media (max-width: 1100px) {
    /* index.html */
    .page-index .navbar .container {
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px 14px;
    }

    .page-index .nav-lang-center {
        order: 2;
        flex: 0 0 auto;
        transform: none;
    }

    .page-index .nav-links {
        order: 3;
        width: 100%;
        margin-left: 0;
        justify-content: center;
        flex-wrap: wrap;
        gap: 12px;
    }

    .page-index .pricing-ai-showcase {
        max-width: min(100%, 620px);
    }

    .page-index .comparison-table-wrapper {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .page-index .comparison-table {
        min-width: 680px;
    }

    /* user-dashboard.html */
    .page-user-dashboard .dashboard-container {
        display: block;
    }

    .page-user-dashboard .dashboard-container > .sidebar {
        position: relative;
        inset: auto;
        width: 100%;
        height: auto;
        max-height: none;
        border-right: 0;
        border-bottom: 1px solid rgba(255, 255, 255, 0.12);
        padding: 1rem 0;
    }

    .page-user-dashboard .dashboard-container > .sidebar .logo {
        margin-bottom: 1rem;
        padding-bottom: 1rem;
    }

    .page-user-dashboard .dashboard-container > .sidebar .nav-menu {
        display: flex;
        flex-wrap: wrap;
        gap: 0.45rem;
        padding: 0 0.75rem;
    }

    .page-user-dashboard .dashboard-container > .sidebar .nav-item {
        margin: 0;
    }

    .page-user-dashboard .dashboard-container > .sidebar .nav-link {
        padding: 0.7rem 0.9rem;
        min-height: 44px;
    }

    .page-user-dashboard .dashboard-container > .main-content {
        margin-left: 0 !important;
        padding: 1.25rem;
    }

    .page-user-dashboard .header {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.85rem;
        padding: 1.1rem 1rem;
    }

    .page-user-dashboard .header-title {
        font-size: clamp(1.4rem, 3.4vw, 1.9rem);
    }

    .page-user-dashboard .user-info-box {
        width: 100%;
        flex-wrap: wrap;
    }

    .page-user-dashboard .cards-grid,
    .page-user-dashboard .analytics-grid {
        grid-template-columns: 1fr !important;
    }

    .page-user-dashboard .tab-content,
    .page-user-dashboard .card,
    .page-user-dashboard .analytics-card {
        min-width: 0;
    }

    /* admin-panel.html */
    .page-admin-panel #orb-canvas + .container {
        display: block;
        width: 100%;
        margin: 0;
    }

    .page-admin-panel #orb-canvas + .container > .sidebar {
        position: relative;
        inset: auto;
        width: 100%;
        height: auto;
        max-height: none;
        border-right: 0;
        border-bottom: 1px solid rgba(0, 210, 255, 0.2);
        padding: 1rem 0;
    }

    .page-admin-panel #orb-canvas + .container > .sidebar .logo {
        margin-bottom: 1rem;
        padding: 0 1rem 1rem;
    }

    .page-admin-panel #orb-canvas + .container > .sidebar .nav {
        display: flex;
        flex-wrap: wrap;
        gap: 0.4rem;
        padding: 0 0.75rem;
    }

    .page-admin-panel #orb-canvas + .container > .sidebar .nav-item {
        margin: 0;
    }

    .page-admin-panel #orb-canvas + .container > .sidebar .nav-link {
        padding: 0.7rem 0.85rem;
        border-radius: 10px;
    }

    .page-admin-panel #orb-canvas + .container > .main {
        margin-left: 0 !important;
        padding: 1.25rem;
        width: 100%;
    }

    .page-admin-panel #orb-canvas + .container > .main .title {
        font-size: clamp(1.6rem, 4.5vw, 2.1rem);
    }

    .page-admin-panel #orb-canvas + .container > .main .stats,
    .page-admin-panel #orb-canvas + .container > .main .filters-grid,
    .page-admin-panel #orb-canvas + .container > .main .form-grid,
    .page-admin-panel #orb-canvas + .container > .main div[style*="grid-template-columns"] {
        grid-template-columns: 1fr !important;
    }

    .page-admin-panel #orb-canvas + .container > .main .filter-actions {
        flex-wrap: wrap;
    }

    .page-admin-panel #orb-canvas + .container > .main .table-wrap {
        padding: 1rem;
    }

    .page-admin-panel #orb-canvas + .container > .main .table-wrap table,
    .page-admin-panel #orb-canvas + .container > .main div[style*="overflow:auto"] table {
        min-width: 760px;
    }

    /* bot-setup-wizard.html */
    .page-bot-wizard {
        padding: 1.15rem;
    }

    .page-bot-wizard .container {
        max-width: 100%;
    }

    .page-bot-wizard .header {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0.85rem;
        margin-bottom: 1.8rem;
    }

    .page-bot-wizard .back-btn {
        position: static;
        display: inline-flex;
        align-self: flex-start;
    }

    .page-bot-wizard .header-title {
        font-size: clamp(1.55rem, 4.5vw, 2.1rem);
        text-align: center;
    }

    .page-bot-wizard .header-subtitle {
        text-align: center;
    }

    .page-bot-wizard .progress-container,
    .page-bot-wizard .main-panel {
        padding: 1.35rem;
        border-radius: 18px;
    }

    .page-bot-wizard .progress-steps {
        gap: 0.5rem;
    }

    .page-bot-wizard .step-circle {
        width: 42px;
        height: 42px;
        margin-bottom: 0.5rem;
        font-size: 1rem;
    }

    .page-bot-wizard .step-label {
        font-size: 0.78rem;
    }

    .page-bot-wizard .widget-preview-chat-window {
        width: min(100%, 260px);
    }
}

@media (max-width: 768px) {
    /* index.html */
    .page-index .navbar .container {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto auto;
        align-items: center;
        gap: 8px 10px;
    }

    .page-index .logo-badge {
        display: none;
    }

    .page-index .nav-mobile-toggle {
        display: inline-flex;
        justify-self: end;
    }

    .page-index .nav-links {
        display: none;
        grid-column: 1 / -1;
        margin-top: 4px;
        padding: 10px;
        border-radius: 12px;
        background: rgba(15, 23, 42, 0.05);
        border: 1px solid rgba(148, 163, 184, 0.2);
        flex-direction: column;
        align-items: stretch;
    }

    .page-index .navbar.mobile-nav-open .nav-links {
        display: flex;
    }

    .page-index .nav-links {
        gap: 10px;
        align-items: stretch;
    }

    .page-index .nav-links li {
        width: 100%;
        text-align: center;
    }

    .page-index .hero-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 18px;
    }

    .page-index .pricing-ai-core {
        min-height: 205px;
    }

    /* user-dashboard.html */
    .page-user-dashboard .dashboard-container > .main-content {
        padding: 1rem 0.75rem;
    }

    .page-user-dashboard .header-title {
        font-size: 1.45rem;
    }

    .page-user-dashboard .card,
    .page-user-dashboard .analytics-card {
        padding: 1rem;
    }

    .page-user-dashboard .analytics-chart {
        gap: 0.3rem;
    }

    .page-user-dashboard .analytics-bar {
        width: min(100%, 24px);
    }

    .page-user-dashboard #2faModal {
        padding: 1rem !important;
    }

    .page-user-dashboard .request-actions {
        flex-wrap: wrap;
    }

    .page-user-dashboard .request-actions button,
    .page-user-dashboard .request-actions .btn {
        width: 100%;
    }

    /* admin-panel.html */
    .page-admin-panel #orb-canvas + .container > .main {
        padding: 0.95rem 0.75rem;
    }

    .page-admin-panel #orb-canvas + .container > .main .header {
        margin-bottom: 1.2rem;
        padding-bottom: 0.85rem;
    }

    .page-admin-panel #orb-canvas + .container > .main .btn-filter,
    .page-admin-panel #orb-canvas + .container > .main .btn-filter-reset {
        width: 100%;
    }

    .page-admin-panel #orb-canvas + .container > .main th,
    .page-admin-panel #orb-canvas + .container > .main td {
        padding: 0.7rem 0.6rem;
        font-size: 0.82rem;
    }

    .page-admin-panel .guardrail-toast {
        min-width: 0;
        width: min(calc(100vw - 32px), 380px);
    }

    /* bot-setup-wizard.html */
    .page-bot-wizard {
        padding: 0.75rem;
    }

    .page-bot-wizard .progress-line,
    .page-bot-wizard .progress-line-fill {
        display: none;
    }

    .page-bot-wizard .progress-steps {
        justify-content: space-between;
    }

    .page-bot-wizard .step {
        flex: 0 0 calc(33.333% - 0.35rem);
    }

    .page-bot-wizard .step-circle {
        width: 36px;
        height: 36px;
        font-size: 0.9rem;
    }

    .page-bot-wizard .step-label {
        font-size: 0.72rem;
    }

    .page-bot-wizard .main-panel {
        padding: 1rem;
        min-height: auto;
    }

    .page-bot-wizard .panel-title {
        font-size: 1.35rem;
    }

    .page-bot-wizard .panel-subtitle {
        margin-bottom: 1.25rem;
    }

    .page-bot-wizard .form-input,
    .page-bot-wizard .form-select,
    .page-bot-wizard .form-textarea {
        padding: 0.82rem 0.95rem;
        font-size: 0.95rem;
    }
}

@media (max-width: 480px) {
    .page-index .hero-stats {
        grid-template-columns: 1fr;
    }

    .page-user-dashboard .dashboard-container > .sidebar .nav-link {
        padding: 0.62rem 0.75rem;
        font-size: 0.9rem;
    }

    .page-user-dashboard .header {
        padding: 0.9rem;
    }

    .page-user-dashboard .user-avatar {
        width: 34px;
        height: 34px;
        font-size: 0.95rem;
    }

    .page-admin-panel #orb-canvas + .container > .sidebar .nav-link {
        font-size: 0.9rem;
        padding: 0.62rem 0.72rem;
    }

    .page-bot-wizard {
        padding: 0.5rem;
    }

    .page-bot-wizard .header-title {
        font-size: 1.25rem;
    }

    .page-bot-wizard .header-subtitle {
        font-size: 0.9rem;
    }

    .page-bot-wizard .step-label {
        font-size: 0.68rem;
        line-height: 1.2;
    }
}

/* Login & Register pages */
@media (max-width: 768px) {
    .auth-container, .login-container, .register-container, .reset-container {
        padding: 1rem !important;
        max-width: 100% !important;
    }
    .auth-card, .login-card, .register-card {
        padding: 1.5rem !important;
        margin: 1rem auto !important;
        max-width: 100% !important;
    }
}

/* Subscribe page */
@media (max-width: 768px) {
    .cards {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
    }
    .billing-toggle {
        flex-wrap: wrap;
    }
}

/* Legal pages */
@media (max-width: 768px) {
    .legal-card, .legal-wrap .container {
        padding: 1rem !important;
    }
    .legal-nav {
        flex-direction: column;
        gap: 8px !important;
    }
    .contact-grid {
        grid-template-columns: 1fr !important;
    }
}

/* Settings page */
@media (max-width: 768px) {
    .settings-container, .settings-card {
        padding: 1rem !important;
        max-width: 100% !important;
    }
}

/* Security, About, Blog, API docs */
@media (max-width: 768px) {
    .corporate-hero, .hero-section {
        padding: 2rem 1rem !important;
    }
    .corporate-hero h1, .hero-title {
        font-size: clamp(1.5rem, 5vw, 2.5rem) !important;
    }
    .section-grid, .tech-grid, .team-values {
        grid-template-columns: 1fr !important;
    }
    .footer-grid {
        grid-template-columns: 1fr !important;
        gap: 1.5rem !important;
    }
}

/* Global logo responsive */
@media (max-width: 1024px) {
    .logo img {
        height: 120px !important;
        max-height: 120px !important;
    }
}
@media (max-width: 768px) {
    .logo img {
        height: 90px !important;
        max-height: 90px !important;
    }
    /* Mobile navbar - logo on top, links below */
    .page-index .navbar .container {
        display: flex !important;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        padding: 0.5rem 1rem;
        gap: 0.5rem;
    }
    .page-index .logo {
        flex: 0 0 100%;
        justify-content: center;
        order: 1;
    }
    .page-index .logo img {
        height: 80px !important;
        max-height: 80px !important;
    }
    .page-index .nav-lang-center {
        order: 2;
        transform: none !important;
        position: static !important;
    }
    .page-index .nav-links {
        order: 3;
        width: 100%;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        gap: 0.4rem;
        padding: 0.4rem 0;
        border-top: 1px solid rgba(148,163,184,0.15);
    }
    .page-index .nav-links li a {
        font-size: 0.82rem;
        padding: 0.35rem 0.6rem;
    }
    .page-index .nav-right {
        order: 4;
    }
    /* Dashboard mobile sidebar -> bottom nav */
    .page-user-dashboard .logo img {
        height: 50px !important;
        max-height: 50px !important;
    }
    .page-admin-panel .logo img {
        height: 46px !important;
        max-height: 46px !important;
    }
    .page-user-dashboard .dashboard-container {
        display: flex !important;
        flex-direction: column !important;
    }
    .page-user-dashboard .sidebar {
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        top: auto !important;
        width: 100% !important;
        height: auto !important;
        max-height: none !important;
        z-index: 9990;
        border-right: none !important;
        border-top: 1px solid rgba(255,255,255,0.12);
        padding: 0 !important;
        background: rgba(15,23,42,0.98) !important;
        backdrop-filter: blur(12px);
    }
    .page-user-dashboard .sidebar .logo {
        display: none !important;
    }
    .page-user-dashboard .sidebar .nav-menu {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-around;
        padding: 0.4rem 0.2rem !important;
        gap: 0 !important;
    }
    .page-user-dashboard .sidebar .nav-item {
        margin: 0 !important;
    }
    .page-user-dashboard .sidebar .nav-link {
        flex-direction: column !important;
        align-items: center !important;
        padding: 0.3rem 0.4rem !important;
        font-size: 0.65rem !important;
        gap: 0.15rem !important;
        min-height: auto !important;
        border-radius: 8px !important;
    }
    .page-user-dashboard .sidebar .nav-icon {
        font-size: 1.1rem !important;
        width: auto !important;
    }
    .page-user-dashboard .main-content {
        margin-left: 0 !important;
        padding-bottom: 70px !important;
    }
    /* Admin mobile sidebar -> bottom nav */
    .page-admin-panel .sidebar {
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        top: auto !important;
        width: 100% !important;
        height: auto !important;
        z-index: 9990;
        border-right: none !important;
        border-top: 1px solid rgba(0,210,255,0.2);
        padding: 0 !important;
        background: rgba(15,23,42,0.98) !important;
    }
    .page-admin-panel .sidebar .logo {
        display: none !important;
    }
    .page-admin-panel .sidebar .nav {
        display: flex !important;
        flex-direction: row !important;
        justify-content: space-around;
        padding: 0.4rem 0.2rem !important;
        flex-wrap: nowrap;
        overflow-x: auto;
    }
    .page-admin-panel .sidebar .nav-item {
        margin: 0 !important;
    }
    .page-admin-panel .sidebar .nav-link {
        flex-direction: column !important;
        align-items: center !important;
        padding: 0.3rem 0.3rem !important;
        font-size: 0.6rem !important;
        gap: 0.1rem !important;
        white-space: nowrap;
    }
    .page-admin-panel .main {
        margin-left: 0 !important;
        padding-bottom: 70px !important;
    }
}
@media (max-width: 480px) {
    .logo img {
        height: 70px !important;
        max-height: 70px !important;
    }
    .page-index .nav-links li a {
        font-size: 0.78rem;
        padding: 0.35rem 0.5rem;
    }
}

/* Login/Register mobile */
@media (max-width: 600px) {
    .auth-page, .page-login, .page-register {
        padding: 1rem !important;
    }
    .auth-page .auth-card,
    .auth-page .login-card,
    .auth-page .register-card,
    .auth-page form,
    .page-login form,
    .page-register form {
        max-width: 100% !important;
        padding: 1.2rem !important;
        margin: 0.5rem auto !important;
    }
    .auth-page h1, .page-login h1, .page-register h1 {
        font-size: 1.5rem !important;
    }
    .auth-page input, .page-login input, .page-register input {
        font-size: 16px !important; /* Prevents iOS zoom */
    }
}

/* Dashboard & Admin logo sizes (desktop) */
.page-user-dashboard .logo img {
    height: 150px;
    max-height: 150px;
}
.page-admin-panel .logo img {
    height: 56px;
    max-height: 56px;
}

/* ============================================
   GLOBAL LIGHT MODE OVERRIDES
   ============================================ */
body.light-mode {
    background: #f1f5f9 !important;
    color: #1e293b !important;
}
body.light-mode .topbar,
body.light-mode .legal-card,
body.light-mode .card,
body.light-mode .content,
body.light-mode article {
    background: #ffffff !important;
    color: #1e293b !important;
}
body.light-mode a { color: #2563eb; }
body.light-mode h1, body.light-mode h2, body.light-mode h3 { color: #0f172a !important; }
body.light-mode p, body.light-mode li { color: #334155 !important; }
body.light-mode input, body.light-mode textarea, body.light-mode select {
    background: #f8fafc !important;
    color: #1e293b !important;
    border-color: #cbd5e1 !important;
}
body.light-mode .sidebar {
    background: #ffffff !important;
}
body.light-mode .confirm-modal-content,
body.light-mode .guide-modal-content {
    background: #ffffff !important;
    color: #1e293b !important;
}