/* ================================
   ГЛОБАЛНА МОБИЛНА ОПТИМИЗАЦИЯ
   ================================ */

/* Основни настройки за всички устройства */
* {
    -webkit-tap-highlight-color: rgba(56, 189, 248, 0.3);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Touch-friendly минимални размери */
button, a, input[type="submit"], .btn {
    min-height: 44px;
    min-width: 44px;
}

/* Таблици - хоризонтален scroll на mobile */
@media (max-width: 768px) {
    .table-responsive {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        display: block;
        width: 100%;
    }
    
    table {
        width: 100%;
        min-width: 600px;
    }
}

/* Форми - по-големи полета на mobile */
@media (max-width: 576px) {
    .form-control, .form-select {
        font-size: 16px !important; /* Предотвратява zoom на iOS */
        min-height: 48px;
        padding: 0.75rem 1rem;
    }
    
    input[type="text"],
    input[type="email"],
    input[type="password"],
    input[type="number"],
    input[type="tel"],
    input[type="date"],
    input[type="datetime-local"],
    textarea,
    select {
        font-size: 16px !important;
    }
}

/* Бутони - по-големи и по-лесни за натискане */
@media (max-width: 576px) {
    .btn {
        padding: 0.75rem 1.25rem;
        font-size: 1rem;
        min-height: 48px;
    }
    
    .btn-sm {
        min-height: 40px;
        padding: 0.5rem 0.85rem;
    }
}

/* Карти - компактни на mobile */
@media (max-width: 768px) {
    .card {
        margin-bottom: 1rem;
        border-radius: 16px;
    }
    
    .card-body {
        padding: 1rem;
    }
    
    .card-header, .card-footer {
        padding: 0.75rem 1rem;
    }
}

/* Навигация - компактна на mobile */
@media (max-width: 992px) {
    .navbar {
        padding: 0.5rem 1rem;
    }
    
    .navbar-brand {
        font-size: 1.1rem;
    }
    
    .navbar-nav {
        margin-top: 0.5rem;
    }
    
    .navbar-nav .nav-link {
        padding: 0.75rem 1rem;
    }
}

/* Container - full width на много малки екрани */
@media (max-width: 576px) {
    .container, .container-fluid {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

/* Modal - full screen на mobile */
@media (max-width: 576px) {
    .modal-dialog {
        margin: 0.5rem;
        max-width: calc(100% - 1rem);
    }
    
    .modal-fullscreen-sm-down {
        width: 100%;
        max-width: none;
        height: 100%;
        margin: 0;
    }
}

/* Badge и alert - компактни на mobile */
@media (max-width: 576px) {
    .badge {
        font-size: 0.75rem;
        padding: 0.35rem 0.65rem;
    }
    
    .alert {
        padding: 0.75rem 1rem;
        font-size: 0.9rem;
    }
}

/* Pagination - по-компактна на mobile */
@media (max-width: 576px) {
    .pagination {
        font-size: 0.9rem;
    }
    
    .page-link {
        padding: 0.5rem 0.75rem;
    }
}

/* Grid система - stack на mobile */
@media (max-width: 768px) {
    .row.g-3 {
        gap: 1rem !important;
    }
    
    [class*="col-"] {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
}

/* Typography - компресиран на mobile */
@media (max-width: 576px) {
    h1, .h1 {
        font-size: 1.75rem;
    }
    
    h2, .h2 {
        font-size: 1.5rem;
    }
    
    h3, .h3 {
        font-size: 1.25rem;
    }
    
    h4, .h4 {
        font-size: 1.1rem;
    }
    
    h5, .h5, h6, .h6 {
        font-size: 1rem;
    }
    
    .display-1 {
        font-size: 3rem;
    }
    
    .display-2 {
        font-size: 2.5rem;
    }
    
    .display-3 {
        font-size: 2rem;
    }
    
    .display-4 {
        font-size: 1.75rem;
    }
    
    .display-5 {
        font-size: 1.5rem;
    }
}

/* Dropdowns - full width на mobile */
@media (max-width: 576px) {
    .dropdown-menu {
        width: 100%;
        max-width: none;
    }
}

/* Button groups - stack на mobile */
@media (max-width: 576px) {
    .btn-group:not(.btn-group-vertical) {
        display: flex;
        flex-direction: column;
        width: 100%;
    }
    
    .btn-group > .btn {
        width: 100%;
    }
}

/* Списъци - компактни на mobile */
@media (max-width: 576px) {
    .list-group-item {
        padding: 0.75rem 1rem;
    }
}

/* Breadcrumb - по-малък на mobile */
@media (max-width: 576px) {
    .breadcrumb {
        font-size: 0.85rem;
        padding: 0.5rem 0.75rem;
    }
}

/* Sticky footer buttons на mobile */
@media (max-width: 768px) {
    .mobile-sticky-footer {
        position: sticky;
        bottom: 0;
        left: 0;
        right: 0;
        background: rgba(255, 255, 255, 0.95);
        backdrop-filter: blur(10px);
        padding: 1rem;
        box-shadow: 0 -4px 12px rgba(0, 0, 0, 0.1);
        z-index: 1000;
        border-top: 1px solid rgba(0, 0, 0, 0.1);
    }
    
    .mobile-sticky-footer .btn {
        width: 100%;
        margin-bottom: 0.5rem;
    }
    
    .mobile-sticky-footer .btn:last-child {
        margin-bottom: 0;
    }
}

/* Скрий на mobile */
@media (max-width: 768px) {
    .hide-on-mobile {
        display: none !important;
    }
}

/* Покажи само на mobile */
.show-on-mobile {
    display: none !important;
}

@media (max-width: 768px) {
    .show-on-mobile {
        display: block !important;
    }
}

/* Компактни статистики на mobile */
@media (max-width: 576px) {
    .stats-card {
        text-align: center;
        padding: 1rem;
    }
    
    .stats-card h2, .stats-card .h2 {
        font-size: 1.5rem;
    }
    
    .stats-card h3, .stats-card .h3 {
        font-size: 1.25rem;
    }
}

/* Icons - правилен размер на mobile */
@media (max-width: 576px) {
    .bi {
        vertical-align: -0.125em;
    }
}

/* Offcanvas - full width на mobile */
@media (max-width: 576px) {
    .offcanvas {
        width: 100% !important;
        max-width: none !important;
    }
}

/* Toast notifications - по-компактни */
@media (max-width: 576px) {
    .toast {
        font-size: 0.9rem;
        width: calc(100% - 1rem);
        margin: 0.5rem;
    }
}

/* Подобрен scroll за mobile */
body {
    -webkit-overflow-scrolling: touch;
    overflow-x: hidden;
}

/* Премахни outline на focus за touch devices */
@media (hover: none) and (pointer: coarse) {
    button:focus,
    a:focus,
    input:focus,
    select:focus,
    textarea:focus {
        outline: none;
    }
    
    /* Но добави визуален feedback */
    button:active,
    .btn:active {
        transform: scale(0.98);
        opacity: 0.9;
    }
}

/* Progress bars - по-тънки на mobile */
@media (max-width: 576px) {
    .progress {
        height: 1rem;
    }
}

/* Spinners - правилен размер */
@media (max-width: 576px) {
    .spinner-border,
    .spinner-grow {
        width: 2rem;
        height: 2rem;
    }
    
    .spinner-border-sm,
    .spinner-grow-sm {
        width: 1rem;
        height: 1rem;
    }
}