/* Mobile Responsive CSS for nrobot_v2 Project */
/* 移动端响应式设计优化 */

/* 基础移动端优化 */
@media (max-width: 767.98px) {
    /* 基础布局优化 */
    body {
        font-size: 14px;
        overflow-x: hidden;
    }
    
    .container {
        padding-left: 10px;
        padding-right: 10px;
    }
    
    /* 导航栏优化 */
    .navbar {
        padding: 0.5rem 0;
    }
    
    .navbar-brand {
        font-size: 1.1rem !important;
    }
    
    .navbar-nav .nav-link {
        padding: 0.5rem 1rem !important;
        font-size: 0.9rem;
    }
    
    .navbar-toggler {
        padding: 0.25rem 0.5rem;
        font-size: 1rem;
    }
    
    /* 下拉菜单优化 */
    .dropdown-menu {
        min-width: 200px;
        font-size: 0.9rem;
    }
    
    .dropdown-item {
        padding: 0.5rem 1rem;
    }
    
    /* 按钮优化 */
    .btn {
        padding: 0.6rem 1.2rem;
        font-size: 0.9rem;
        min-height: 44px; /* 触摸友好的最小高度 */
    }
    
    .btn-sm {
        padding: 0.4rem 0.8rem;
        font-size: 0.8rem;
        min-height: 36px;
    }
    
    .btn-lg {
        padding: 0.8rem 1.6rem;
        font-size: 1rem;
        min-height: 48px;
    }
    
    /* 表单优化 */
    .form-control,
    .form-select {
        padding: 0.6rem 0.8rem;
        font-size: 0.9rem;
        min-height: 44px;
    }
    
    .input-group {
        flex-wrap: nowrap;
    }
    
    /* 卡片优化 */
    .card {
        margin-bottom: 1rem;
        border-radius: 8px;
    }
    
    .card-header {
        padding: 0.8rem;
        font-size: 0.95rem;
    }
    
    .card-body {
        padding: 1rem;
    }
    
    /* 企业卡片特殊优化 */
    .company-card .card-body {
        display: flex !important;
        flex-direction: column !important;
        min-height: 180px !important;
    }
    
    .company-description {
        overflow: hidden !important;
        display: -webkit-box !important;
        -webkit-box-orient: vertical !important;
        -webkit-line-clamp: 2 !important;
        line-clamp: 2 !important;
        flex-grow: 1 !important;
        margin-bottom: 0.8rem !important;
    }
    
    /* 搜索表单容器 */
    .search-container {
        border-radius: 8px !important;
        padding: 1.2rem !important;
        margin-bottom: 1.5rem !important;
    }
    
    /* 表格优化 */
    .table-responsive {
        font-size: 0.85rem;
    }
    
    .table th,
    .table td {
        padding: 0.5rem;
        vertical-align: middle;
    }
    
    /* 面包屑导航优化 */
    .breadcrumb {
        font-size: 0.8rem;
        padding: 0.5rem 0;
        margin-bottom: 1rem;
    }
    
    .breadcrumb-item {
        max-width: 150px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    
    /* 分页优化 */
    .pagination {
        justify-content: center;
        flex-wrap: wrap;
    }
    
    .page-link {
        padding: 0.4rem 0.6rem;
        font-size: 0.85rem;
        min-width: 40px;
        text-align: center;
    }
    
    /* 警告框优化 */
    .alert {
        padding: 0.75rem;
        margin-bottom: 1rem;
        font-size: 0.9rem;
        border-radius: 6px;
    }
    
    /* 模态框优化 */
    .modal-dialog {
        margin: 0.5rem;
        max-width: calc(100vw - 1rem);
    }
    
    .modal-header {
        padding: 1rem;
    }
    
    .modal-body {
        padding: 1rem;
        max-height: 60vh;
        overflow-y: auto;
    }
    
    .modal-footer {
        padding: 0.75rem 1rem;
        flex-wrap: wrap;
        gap: 0.5rem;
    }
    
    .modal-footer .btn {
        flex: 1;
        min-width: 120px;
    }
}

/* 聊天界面移动端优化 */
@media (max-width: 767.98px) {
    /* 聊天页面 */
    .chat-page {
        height: calc(100vh - 56px); /* 调整导航栏高度 */
    }
    
    .chat-messages {
        padding: 0;
    }
    
    .message-group {
        padding: 10px;
    }
    
    .message {
        margin-bottom: 10px;
    }
    
    /* 用户消息 */
    .message-user {
        max-width: 85%; /* 增加最大宽度 */
    }
    
    .message-user .message-content {
        padding: 8px 12px;
        font-size: 0.9rem;
        border-radius: 16px 16px 4px 16px;
    }
    
    /* 机器人消息 */
    .message-bot {
        max-width: 100%;
    }
    
    .message-bot .message-content {
        max-width: 85%; /* 增加最大宽度 */
        padding: 8px 12px;
        font-size: 0.9rem;
        border-radius: 16px 16px 16px 4px;
        overflow-x: auto;
    }
    
    /* 欢迎消息 */
    .welcome-message {
        padding: 15px;
    }
    
    .welcome-message h2 {
        font-size: 1.8rem;
        margin-bottom: 15px;
    }
    
    .welcome-message p {
        font-size: 0.95rem;
    }
    
    /* 聊天表单 */
    .chat-form {
        padding: 10px 15px;
    }
    
    .chat-input-container {
        max-width: 100%;
    }
    
    .input-group {
        border-radius: 25px;
    }
    
    .chat-input {
        padding: 10px 50px 10px 15px;
        font-size: 0.9rem;
        min-height: 44px;
        height: auto;
    }
    
    .send-btn,
    .attach-btn {
        width: 36px;
        height: 36px;
    }
    
    .send-btn {
        right: 4px;
        bottom: 4px;
    }
    
    .attach-btn {
        right: 44px;
        bottom: 4px;
    }
    
    /* 附件预览 */
    .attachments-preview {
        margin: 8px 0;
        max-height: 100px;
        gap: 6px;
    }
    
    .attachment-item {
        width: 60px;
        height: 60px;
    }
    
    .attachment-item .file-name {
        font-size: 9px;
        padding: 2px 3px;
    }
    
    /* 消息时间 */
    .message-time {
        font-size: 0.7rem;
        margin-top: 3px;
    }
    
    /* 输入动画 */
    .message-thinking {
        padding: 8px 15px;
        max-width: 80%;
        font-size: 0.85rem;
    }
    
    .typing-dot {
        width: 6px;
        height: 6px;
    }
}

/* 商店页面移动端优化 */
@media (max-width: 767.98px) {
    /* 商品卡片 */
    .product-card {
        margin-bottom: 1rem;
    }
    
    .product-card .card-img-top {
        height: 150px;
    }
    
    .product-card .card-body {
        padding: 0.8rem;
    }
    
    .product-card .card-title {
        font-size: 0.95rem;
        margin-bottom: 0.5rem;
        line-height: 1.3;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    
    .product-card .card-text {
        font-size: 0.8rem;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    
    .product-price {
        font-size: 1.1rem;
        font-weight: 700;
    }
    
    /* 商店卡片 */
    .store-card {
        margin-bottom: 1rem;
    }
    
    .store-card .card-header {
        padding: 1rem;
        font-size: 1rem;
    }
    
    .store-card .store-description {
        min-height: 60px;
        padding: 0.8rem;
    }
    
    .store-card .store-description p {
        font-size: 0.85rem;
        -webkit-line-clamp: 2;
        line-clamp: 2;
    }
    
    .store-card .store-stats {
        padding: 0.8rem;
    }
    
    .store-card .stat-item {
        padding: 0.5rem;
        text-align: center;
    }
    
    .store-card .stat-number {
        font-size: 1.1rem;
    }
    
    .store-card .stat-label {
        font-size: 0.75rem;
    }
    
    /* 分类侧边栏 */
    .category-sidebar {
        position: static !important;
        margin-bottom: 1rem;
        padding: 1rem;
    }
    
    .category-sidebar .list-group-item {
        padding: 0.6rem 0.8rem;
        font-size: 0.9rem;
    }
    
    /* 购物车表格 */
    .cart-table {
        font-size: 0.8rem;
    }
    
    .cart-table thead {
        display: none;
    }
    
    .cart-table tbody tr {
        display: block;
        border: 1px solid #dee2e6;
        margin-bottom: 0.5rem;
        border-radius: 8px;
        padding: 0.5rem;
    }
    
    .cart-table tbody td {
        display: block;
        border: none;
        padding: 0.25rem 0;
        text-align: left !important;
    }
    
    .cart-table tbody td:before {
        content: attr(data-label) ": ";
        font-weight: bold;
        width: 100px;
        display: inline-block;
    }
    
    /* 购物车摘要 */
    .cart-summary {
        padding: 1rem;
        margin-top: 1rem;
    }
    
    /* 订单表单 */
    .order-form {
        padding: 1rem;
    }
    
    .order-summary {
        padding: 1rem;
        margin-top: 1rem;
    }
}

/* 仪表板页面移动端优化 */
@media (max-width: 767.98px) {
    /* 机器人列表 */
    .robot-list .card {
        margin-bottom: 1rem;
    }
    
    .robot-card .d-flex {
        flex-direction: column !important;
        text-align: center;
    }
    
    .robot-avatar {
        margin-bottom: 0.5rem;
        margin-right: 0 !important;
        align-self: center;
    }
    
    /* 产品管理 */
    .product-grid {
        grid-template-columns: 1fr !important;
        gap: 1rem;
    }
    
    .product-item {
        padding: 1rem;
    }
    
    /* 文件知识库 */
    .file-knowledge-item {
        padding: 0.8rem;
        margin-bottom: 0.8rem;
    }
    
    .file-knowledge-item .file-info {
        flex-direction: column;
        text-align: center;
    }
    
    .file-knowledge-item .file-actions {
        margin-top: 0.5rem;
        justify-content: center;
        flex-wrap: wrap;
        gap: 0.5rem;
    }
    
    /* Dashboard 店铺管理页面优化 */
    /* 页面容器优化 */
    .page-container {
        padding: 1rem !important;
        min-height: auto;
    }
    
    /* 面包屑导航移动端优化 */
    .breadcrumb-modern {
        padding: 0.75rem 1rem !important;
        font-size: 0.875rem;
        flex-wrap: wrap;
        gap: 0.25rem;
    }
    
    .breadcrumb-modern .breadcrumb-item {
        font-size: 0.875rem;
    }
    
    .breadcrumb-modern .breadcrumb-item a,
    .breadcrumb-modern .breadcrumb-item.active {
        padding: 0.375rem 0.75rem !important;
    }
    
    /* 操作工具栏移动端优化 */
    .action-toolbar {
        padding: 1rem !important;
    }
    
    .action-toolbar .d-flex {
        flex-direction: column !important;
        gap: 1rem;
    }
    
    .toolbar-left,
    .toolbar-right {
        width: 100%;
    }
    
    .toolbar-right .btn-group {
        flex-direction: column !important;
        width: 100%;
    }
    
    .toolbar-right .btn-group .btn-nav-action,
    .toolbar-right .btn-group .btn-nav-primary {
        border-radius: 8px !important;
        margin-bottom: 0.5rem;
        border: none !important;
        width: 100%;
        justify-content: center;
    }
    
    .btn-nav-back,
    .btn-nav-action,
    .btn-nav-primary {
        padding: 0.875rem 1rem !important;
        width: 100%;
        justify-content: center;
        font-size: 0.9rem !important;
        min-height: 44px;
    }
    
    /* 管理头部移动端优化 */
    .management-header {
        padding: 1.5rem 1rem !important;
        text-align: center;
    }
    
    .management-header .d-flex {
        flex-direction: column !important;
        gap: 1rem;
    }
    
    .management-header h1 {
        font-size: 1.75rem !important;
    }
    
    /* 表单卡片移动端优化 */
    .store-form-card {
        border-radius: 12px !important;
        margin-bottom: 1.5rem !important;
    }
    
    .form-header {
        padding: 1.5rem 1rem !important;
    }
    
    .form-body {
        padding: 1.5rem 1rem !important;
    }
    
    .form-header h3 {
        font-size: 1.25rem !important;
    }
    
    /* 表单控件移动端优化 */
    .form-control,
    .form-select,
    textarea {
        font-size: 16px !important; /* 防止iOS自动缩放 */
        padding: 0.875rem 1rem !important;
        border-radius: 8px !important;
    }
    
    .form-label {
        font-size: 0.9rem !important;
        margin-bottom: 0.5rem !important;
    }
    
    .form-group {
        margin-bottom: 1.5rem !important;
    }
    
    /* 按钮移动端优化 */
    .btn-store-primary,
    .btn-store-secondary {
        width: 100% !important;
        padding: 1rem !important;
        font-size: 1rem !important;
        border-radius: 12px !important;
        margin-bottom: 0.75rem;
    }
    
    .btn-management {
        width: 100% !important;
        padding: 1rem !important;
        font-size: 1rem !important;
        border-radius: 12px !important;
        margin-bottom: 0.75rem;
        min-height: 44px;
    }
    
    /* 管理项目网格移动端优化 */
    .management-grid {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
        margin-top: 1.5rem !important;
    }
    
    .management-item {
        padding: 1.5rem 1rem !important;
        text-align: center;
    }
    
    .management-item .icon {
        width: 50px !important;
        height: 50px !important;
        font-size: 1.25rem !important;
    }
    
    .management-item h5 {
        font-size: 1.1rem !important;
    }
    
    /* 商品管理页面优化 */
    .product-grid {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
    }
    
    .product-card {
        border-radius: 12px !important;
    }
    
    .product-card .card-body {
        padding: 1rem !important;
    }
    
    .product-card .d-flex {
        flex-direction: column !important;
        gap: 1rem;
    }
    
    .product-image,
    .product-placeholder {
        width: 100% !important;
        height: 200px !important;
        margin-bottom: 1rem;
        object-fit: cover;
        border-radius: 8px;
    }
    
    .product-card .row {
        flex-direction: column !important;
    }
    
    .product-card .col-md-6 {
        width: 100% !important;
        margin-bottom: 0.5rem;
    }
    
    .action-buttons {
        flex-direction: column !important;
        gap: 0.5rem !important;
        width: 100%;
    }
    
    .btn-action {
        width: 100% !important;
        justify-content: center;
        padding: 0.75rem !important;
        min-height: 44px;
    }
    
    /* 店铺管理卡片优化 */
    .store-management-card {
        border-radius: 12px !important;
        margin-bottom: 1.5rem !important;
    }
    
    .store-management-card .card-header {
        padding: 1.25rem 1rem !important;
    }
    
    .store-management-card .card-body {
        padding: 1.25rem 1rem !important;
    }
    
    /* 分类和订单管理页面优化 */
    .table-responsive {
        font-size: 0.875rem;
    }
    
    .table-responsive .table td,
    .table-responsive .table th {
        padding: 0.5rem !important;
        vertical-align: middle;
    }
    
    /* 隐藏移动端不必要的列 */
    .table-responsive .d-none-mobile {
        display: none !important;
    }
    
    /* 页面标题区域移动端优化 */
    .d-flex.justify-content-between.align-items-center {
        flex-direction: column !important;
        gap: 1rem;
        text-align: center;
    }
    
    .d-flex.justify-content-between.align-items-center .display-6 {
        font-size: 1.5rem !important;
    }
    
    /* 空状态页面移动端优化 */
    .empty-state {
        padding: 2rem 1rem !important;
        text-align: center;
    }
    
    .empty-state i {
        font-size: 3rem !important;
    }
    
    .empty-state h3 {
        font-size: 1.25rem !important;
    }
    
        /* 操作按钮组移动端优化 */
    .d-flex.flex-wrap.gap-3 {
        flex-direction: column !important;
        gap: 0.75rem !important;
    }
    
    .file-knowledge-item .btn {
        flex: 1;
        min-width: 100px;
    }
    
    /* 订单管理 */
    .order-card .card-header .row {
        flex-direction: column;
        text-align: center;
    }
    
    .order-card .card-header .col-md-6:first-child {
        margin-bottom: 0.5rem;
    }
    
    .order-actions {
        text-align: center;
        margin-top: 1rem;
        flex-wrap: wrap;
        gap: 0.5rem;
    }
    
    .order-actions .btn {
        flex: 1;
        min-width: 120px;
    }
    
    /* 消息留言板 */
    .message-board-container {
        padding: 1rem;
    }
    
    .tree-messages-container {
        max-height: 300px;
    }
    
    .message-item {
        margin: 0.5rem 0;
        padding: 0.8rem;
    }
    
    .message-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .message-meta {
        width: 100%;
        justify-content: space-between;
    }
    
    .message-form {
        padding: 1rem;
    }
    
    .message-form .row {
        flex-direction: column;
    }
    
    .message-form .col-md-4 {
        margin-top: 0.5rem;
    }
}

/* 工作平台移动端优化 */
@media (max-width: 767.98px) {
    /* 工作卡片 */
    .job-card {
        margin-bottom: 1rem;
    }
    
    .job-card .card-header {
        padding: 0.8rem;
        font-size: 0.95rem;
    }
    
    .job-card .card-body {
        padding: 1rem;
    }
    
    .job-info {
        margin-bottom: 0.8rem;
    }
    
    .job-info .row {
        flex-direction: column;
        gap: 0.3rem;
    }
    
    .job-info .col-md-6 {
        margin-bottom: 0.3rem;
    }
    
    /* 简历表单 */
    .resume-form {
        padding: 1rem;
    }
    
    .resume-form .form-group {
        margin-bottom: 1rem;
    }
    
    .resume-form .form-row {
        flex-direction: column;
    }
    
    .resume-form .col-md-6 {
        margin-bottom: 0.8rem;
    }
    
    /* 雇主面板 */
    .employer-panel .card {
        margin-bottom: 1rem;
    }
    
    .employer-stats {
        flex-direction: column;
        text-align: center;
    }
    
    .employer-stats .stat-item {
        margin-bottom: 1rem;
        padding: 1rem;
        border: 1px solid #dee2e6;
        border-radius: 8px;
    }
}

/* 超小屏幕优化 (iPhone SE等) */
@media (max-width: 374px) {
    body {
        font-size: 13px;
    }
    
    .container {
        padding-left: 8px;
        padding-right: 8px;
    }
    
    .navbar-brand {
        font-size: 1rem !important;
    }
    
    .btn {
        padding: 0.5rem 1rem;
        font-size: 0.8rem;
    }
    
    .card-body {
        padding: 0.8rem;
    }
    
    .chat-input {
        padding: 8px 45px 8px 12px;
        font-size: 0.85rem;
    }
    
    .send-btn,
    .attach-btn {
        width: 32px;
        height: 32px;
    }
    
    .message-user .message-content,
    .message-bot .message-content {
        padding: 6px 10px;
        font-size: 0.85rem;
    }
    
    .product-card .card-img-top {
        height: 120px;
    }
    
    .store-card .card-header {
        padding: 0.8rem;
        font-size: 0.9rem;
    }
    
    /* Dashboard 超小屏优化 */
    .page-container {
        padding: 0.75rem !important;
    }
    
    .breadcrumb-modern {
        padding: 0.5rem !important;
        font-size: 0.8rem;
    }
    
    .action-toolbar {
        padding: 0.75rem !important;
    }
    
    .management-header {
        padding: 1rem 0.75rem !important;
    }
    
    .form-header,
    .form-body {
        padding: 1rem 0.75rem !important;
    }
    
    .management-item {
        padding: 1rem 0.75rem !important;
    }
    
    .product-card .card-body {
        padding: 0.75rem !important;
    }
    
    .btn-nav-back,
    .btn-nav-action,
    .btn-nav-primary,
    .btn-store-primary,
    .btn-store-secondary,
    .btn-management {
        padding: 0.75rem !important;
        font-size: 0.875rem !important;
    }
    
    .management-item .icon {
        width: 40px !important;
        height: 40px !important;
        font-size: 1rem !important;
    }
    
    .form-header h3 {
        font-size: 1.1rem !important;
    }
    
    .management-header h1 {
        font-size: 1.5rem !important;
    }
}

/* 中型设备优化 (平板) */
@media (min-width: 768px) and (max-width: 991.98px) {
    .message-user {
        max-width: 50%;
    }
    
    .message-bot .message-content {
        max-width: 70%;
    }
    
    .product-card .card-img-top {
        height: 180px;
    }
    
    .chat-input {
        padding: 11px 55px 11px 18px;
    }
    
    /* Dashboard 平板设备优化 */
    .management-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 1.5rem !important;
    }
    
    .product-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 1.5rem !important;
    }
    
    .toolbar-right .btn-group {
        flex-direction: row !important;
    }
    
    .toolbar-right .btn-group .btn-nav-action,
    .toolbar-right .btn-group .btn-nav-primary {
        width: auto !important;
        margin-bottom: 0 !important;
    }
    
    .action-toolbar .d-flex {
        flex-direction: row !important;
    }
    
    .btn-store-primary,
    .btn-store-secondary,
    .btn-management {
        width: auto !important;
        display: inline-flex !important;
        margin-right: 0.75rem;
    }
}

/* 大屏设备优化 */
@media (min-width: 1200px) {
    .message-user {
        max-width: 45%;
    }
    
    .message-bot .message-content {
        max-width: 65%;
    }
}

/* 横屏优化 */
@media (max-height: 500px) and (orientation: landscape) {
    .chat-page {
        height: calc(100vh - 50px);
    }
    
    .chat-form {
        padding: 8px 15px;
    }
    
    .modal-body {
        max-height: 40vh;
    }
    
    .welcome-message h2 {
        font-size: 1.5rem;
        margin-bottom: 10px;
    }
    
    .welcome-message p {
        font-size: 0.9rem;
    }
}

/* 触摸优化 */
@media (hover: none) and (pointer: coarse) {
    .btn,
    .form-control,
    .form-select {
        min-height: 44px; /* iOS建议的最小触摸目标 */
    }
    
    .nav-link {
        min-height: 44px;
        display: flex;
        align-items: center;
    }
    
    .dropdown-item {
        min-height: 44px;
        display: flex;
        align-items: center;
    }
    
    .page-link {
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
}

/* 高对比度和无障碍优化 */
@media (prefers-contrast: high) {
    .card {
        border: 2px solid #333;
    }
    
    .btn {
        border: 2px solid currentColor;
    }
    
    .form-control {
        border: 2px solid #666;
    }
}

/* 减少动画效果 */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* Print样式 */
@media print {
    .navbar,
    .chat-form,
    .btn,
    .modal,
    .dropdown-menu {
        display: none !important;
    }
    
    .chat-messages {
        height: auto !important;
        overflow: visible !important;
    }
    
    .message {
        page-break-inside: avoid;
    }
} 