/* ==========================================================
   Akbar Change - 25-Sep-2026
   WeMatri Phase 1: Mobile / Tablet frontend foundation
   IMPORTANT: Desktop (1200px+) is intentionally untouched.
   This stylesheet is loaded by FRONTEND headers only.
   ========================================================== */

.wm-app-bottom-nav { display:none; }

@media (max-width:1199px) {
  html,body{max-width:100%;overflow-x:hidden;}
  body{ -webkit-text-size-adjust:100%; }
  img{max-width:100%;height:auto;}
  .container{max-width:100%;}
  input,select,textarea,button,.btn{max-width:100%;}
  .table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch;}
  .modal-dialog{max-width:calc(100% - 24px);margin:12px auto;}
}

@media (min-width:768px) and (max-width:1199px) {
  body.wm-has-app-nav{padding-bottom:76px;}
  .wm-app-bottom-nav{display:flex;position:fixed;left:50%;bottom:14px;transform:translateX(-50%);z-index:9998;width:min(680px,calc(100% - 32px));height:64px;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:18px;box-shadow:0 8px 28px rgba(0,0,0,.14);align-items:center;justify-content:space-around;padding:5px 10px;}
}

@media (max-width:767px) {
  body.wm-has-app-nav{padding-bottom:72px;}
  .container{width:100%;padding-left:12px;padding-right:12px;}
  .row{margin-left:-6px;margin-right:-6px;}
  .row>[class*=col-]{padding-left:6px;padding-right:6px;}
  input.form-control,select.form-control,textarea.form-control{font-size:16px;}
  .btn{min-height:42px;}
  .wm-app-bottom-nav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:9998;height:64px;background:#fff;border-top:1px solid rgba(0,0,0,.10);box-shadow:0 -4px 18px rgba(0,0,0,.08);align-items:stretch;justify-content:space-around;padding:3px max(4px,env(safe-area-inset-right)) calc(3px + env(safe-area-inset-bottom)) max(4px,env(safe-area-inset-left));}
}

@media (max-width:1199px) {
  .wm-app-bottom-nav a{flex:1;min-width:0;text-decoration:none!important;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:#6b7280;font-size:11px;font-weight:600;line-height:1.15;touch-action:manipulation;}
  .wm-app-bottom-nav a i{font-size:20px;line-height:22px;}
  .wm-app-bottom-nav a.active{color:#198754;}
  .wm-app-bottom-nav a:focus,.wm-app-bottom-nav a:hover{color:#198754;text-decoration:none;}
}

/* =========================================================
   Akbar Change - 25-Sep-2026
   Phase 2 - WeMatri frontend mobile/tablet screen refinement
   Scope: Home, Dashboard/My Profile, View Profile and Matches.
   Desktop (1200px+) and admin are intentionally unaffected.
   ========================================================= */
@media (max-width: 1199px) {
    /* Shared app-like surface */
    .main-new-profile-bg,
    .container-fluid.width-95 {
        max-width: 100%;
    }
    .main-new-profile-bg .profile-main-bg-1,
    .main-new-profile-bg .my-profile-details,
    .container-fluid.width-95 .profile-main-bg-1,
    .container-fluid.width-95 .photo-request,
    .container-fluid.width-95 .design-process-content,
    .container-fluid.width-95 .box-view-profile {
        border-radius: 14px;
        overflow: hidden;
    }
    .main-new-profile-bg .nav-tabs,
    .container-fluid.width-95 .nav-tabs {
        display: flex;
        overflow-x: auto;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
    }
    .main-new-profile-bg .nav-tabs > li,
    .container-fluid.width-95 .nav-tabs > li { flex: 0 0 auto; }

    /* Match/search forms */
    #matchForm .form-control,
    #matchForm select,
    #matchForm input,
    #matchForm textarea,
    #search_form .form-control,
    #search_form select,
    #search_form input {
        min-height: 44px;
        font-size: 16px;
    }
    #collapse-tab { min-height: 48px; border-radius: 12px; }
    .new-saved-search .saved-search-i { line-height: 24px; }

    /* Member/profile action controls */
    .profile-main-bg-1 .vie-c-btn-new,
    .profile-main-bg-1 .pdf-c-btn-new,
    .profile-main-bg-1 .btn-msg-pro,
    .profile-main-bg-1 .icn-bg-for-action,
    .upgrade-plan-btn-pro {
        min-height: 42px;
        touch-action: manipulation;
    }

    /* Homepage: keep imagery responsive without changing desktop */
    .banner-new img { width: 100%; height: auto; }
    .banner-new .indian-matri { max-width: 100%; }
    .finder-block, .finder-form-transparent { max-width: 100%; }
}

@media (max-width: 767px) {
    /* Page spacing above fixed bottom app navigation */
    .main-new-profile-bg,
    .container-fluid.width-95 {
        padding-left: 12px !important;
        padding-right: 12px !important;
        margin-top: 18px !important;
    }
    .row-cstm { margin-left: 0 !important; margin-right: 0 !important; }
    .container-fluid.width-95 > .col-md-9,
    .container-fluid.width-95 .row-cstm > .col-md-9,
    .main-new-profile-bg .col-md-9 {
        padding-left: 0 !important;
        padding-right: 0 !important;
        width: 100%;
    }

    /* Home - app-like stacked search and readable hero */
    .banner-new .cust_padding { padding-left: 12px !important; padding-right: 12px !important; }
    .banner-new .indian-matri { padding-left: 0 !important; padding-right: 0 !important; }
    .banner-new .indian-matri h1 { font-size: 26px !important; line-height: 1.25 !important; }
    .banner-new .indian-matri p { font-size: 16px !important; line-height: 1.5 !important; }
    .finder-block { padding-left: 0 !important; padding-right: 0 !important; }
    .finder-form-transparent .search-section { display: block; width: 100%; }
    .finder-form-transparent .form-group,
    .finder-form-transparent .land-lookingfor,
    .finder-form-transparent .land-religion,
    .finder-form-transparent .land-agefrom,
    .finder-form-transparent .land-ageto {
        width: 100% !important;
        float: none !important;
        padding: 0 !important;
        margin: 0 0 10px !important;
    }
    .finder-form-transparent .agetolabel { display: none !important; }
    .finder-form-transparent select,
    .finder-form-transparent .custom-select-trigger,
    .finder-form-transparent button,
    .finder-form-transparent input { min-height: 46px; width: 100%; }

    /* Dashboard / My Profile - card layout */
    .profile-main-bg-1 { padding: 14px !important; margin-bottom: 14px; }
    .profile-main-bg-1 .profile-pic-main {
        margin: 0 auto 12px !important;
        max-width: 220px;
    }
    .profile-main-bg-1 .profile-user-name { text-align: center; }
    .my-profile-details { margin-top: 12px; }
    .my-profile-details .nav-tabs { margin-bottom: 12px; }
    .my-profile-details .nav-tabs > li > a {
        padding: 11px 14px !important;
        font-size: 14px;
    }
    .my-profile-details .panel,
    .my-profile-details .for-detail-gray,
    .my-profile-details .for-detail-white,
    .my-profile-details .for-detail-gray-1 {
        border-radius: 10px;
    }
    .photo-request { padding: 12px !important; margin-bottom: 14px; }
    .photo-request h2 { font-size: 20px !important; margin-top: 4px; }

    /* View Profile - prioritize photo, identity and actions */
    .main-new-profile-bg .profile-main-bg-1 > .col-md-3,
    .main-new-profile-bg .profile-main-bg-1 > .col-md-7,
    .main-new-profile-bg .profile-main-bg-1 > .col-md-2 {
        width: 100% !important;
        float: none !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .main-new-profile-bg .profile-main-bg-1 .row { margin-left: 0; margin-right: 0; }
    .main-new-profile-bg .profile-main-bg-1 .vie-c-btn-new,
    .main-new-profile-bg .profile-main-bg-1 .pdf-c-btn-new,
    .main-new-profile-bg .profile-main-bg-1 .btn-msg-pro {
        margin-top: 8px;
    }
    .main-new-profile-bg .partner-pre-bg { margin-top: 12px; }

    /* Matches - criteria becomes a clean mobile card */
    #collapse-tab { padding: 11px 12px !important; }
    #collapse-tab .col-xs-6 { padding-left: 4px; padding-right: 4px; }
    #matchForm .box-view-profile { padding: 12px !important; }
    #matchForm .col-xs-12 { padding-left: 0; padding-right: 0; }
    #matchForm .form-group { margin-bottom: 12px; }

    /* Avoid accidental horizontal page scrolling */
    .main-new-profile-bg,
    .container-fluid.width-95,
    #matchForm,
    .photo-request { overflow-x: hidden; }
}

@media (min-width: 768px) and (max-width: 1199px) {
    /* Tablet: preserve information density while feeling like an app */
    .container-fluid.width-95,
    .main-new-profile-bg .container-fluid.width-95 {
        width: 96% !important;
        padding-left: 12px !important;
        padding-right: 12px !important;
    }
    .profile-main-bg-1 { padding: 16px !important; }
    .photo-request { padding: 16px !important; }
    .finder-form-transparent .form-group { margin-bottom: 10px; }
}


/* =========================================================
   Akbar Change - 25-Sep-2026
   Phase 3 - Registration + Profile Editing mobile/tablet UX
   Scope: frontend only. Desktop (1200px+) and admin untouched.
   ========================================================= */
@media (max-width:1199px) {
  /* Registration shell */
  .reg-login-box,
  .reg-login-box .reg-box { max-width:100% !important; }
  .reg-login-box { margin-left:auto !important; margin-right:auto !important; }
  .reg-box { box-sizing:border-box; }
  .reg-input .form-control,
  .profile-edit-reg .form-control,
  .info-main-box .form-control,
  .info-main-box .select2-container,
  .info-main-box .select2-selection,
  .new-partner .form-control { max-width:100% !important; }
  .profile-edit-reg .info-main-box,
  .info-bg-main .info-main-box,
  .new-partner .info-main-box { border-radius:14px; overflow:visible; }
  .info-tab-nav { display:flex; overflow-x:auto; white-space:nowrap; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  .info-tab-nav::-webkit-scrollbar { display:none; }
  .info-tab-nav > li { flex:0 0 auto; }
  .sidebar-btn,.edit-save-btn,.edit-back-btn,.next-step1,.prev-step { min-height:44px; touch-action:manipulation; }
  .select2-container { max-width:100% !important; }
  .select2-container .select2-selection--single { min-height:44px; }
  .select2-container--default .select2-selection--single .select2-selection__rendered { line-height:42px; }
  .select2-container--default .select2-selection--single .select2-selection__arrow { height:42px; }
  .cstm-textarea, textarea.form-control { min-height:110px; }
  .register_photo-upload,.upload-profiled,.container_photo,.imageBox { max-width:100% !important; }
}

@media (min-width:768px) and (max-width:1199px) {
  .reg-login-box { width:min(680px,calc(100% - 32px)) !important; }
  .reg-login-box .reg-box { width:100% !important; padding:20px !important; border-radius:16px; }
  .profile-edit-reg,.info-bg-main { max-width:920px; margin-left:auto; margin-right:auto; }
  .profile-edit-reg .info-main-box,.info-bg-main .info-main-box { padding:22px !important; }
  .reg-sidebar { border-radius:14px; }
}

@media (max-width:767px) {
  /* First registration page: remove fixed desktop widths */
  .reg-login-box { width:100% !important; margin:10px auto 24px !important; }
  .reg-login-box .reg-box { width:100% !important; padding:16px 14px !important; border-radius:16px; box-sizing:border-box; }
  .reg-login-box h1 { margin-top:6px; }
  .reg-login-box .f-22 { font-size:21px !important; line-height:1.3; }
  .reg-login-box .row-cstm { display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; }
  .reg-login-box .lable-cstm { width:100%; text-align:left; margin-bottom:2px; }
  .reg-login-box .md-radio { margin-right:8px; }
  .reg-login-box .reg-input { margin-bottom:10px; }
  .reg-login-box .reg_input,
  .reg-login-box select.form-control { width:100% !important; min-height:46px; font-size:16px !important; border-radius:10px; }
  .reg-login-box .col-md-6,.reg-login-box .col-md-4,.reg-login-box .col-md-8 { width:100%; float:none; }
  .reg-login-box .checkbox { text-align:left; line-height:1.45; }

  /* Multi-step registration: app card and progress strip */
  .container-fluid.new-width.width-95 { padding-left:12px !important; padding-right:12px !important; }
  .profile-edit-reg,.info-bg-main { width:100%; margin:0 auto 18px; }
  .profile-edit-reg .info-main-box,
  .info-bg-main .info-main-box,
  .new-partner .info-main-box { padding:16px 14px !important; border-radius:16px; box-shadow:0 4px 18px rgba(0,0,0,.06); }
  .prf_l1 { display:block; font-size:19px !important; line-height:1.35; margin:4px 0 12px; }
  .info-tab-nav { position:relative; margin:0 0 14px !important; padding:4px 0 8px; gap:6px; }
  .info-tab-nav > li > a { min-height:40px; padding:9px 12px !important; border-radius:20px !important; }
  .reg-sidebar { display:none !important; }
  .hidden-lg.hidden-md.col-sm-12.col-xs-12 { padding-left:0; padding-right:0; }

  /* Form fields: one clear touch-friendly column */
  .info-main-box .col-md-6,
  .info-main-box .col-sm-6,
  .info-main-box .col-md-4,
  .info-main-box .col-sm-4,
  .profile-edit-reg .col-md-6,
  .profile-edit-reg .col-sm-6 { width:100% !important; float:none !important; }
  .info-main-box .form-control,
  .profile-edit-reg .form-control,
  .new-partner .form-control { width:100% !important; min-height:46px; font-size:16px !important; border-radius:10px; }
  .info-main-box .select2-container,
  .profile-edit-reg .select2-container { width:100% !important; }
  .select2-container .select2-selection--multiple { min-height:46px; border-radius:10px; }
  .select2-dropdown { font-size:16px; }
  .select2-search__field { font-size:16px !important; }
  .info-main-box h5,.info-main-box label,.profile-edit-reg label { line-height:1.35; }
  ._hr-edit-profile { margin:12px 0 !important; }

  /* Next/back/save controls */
  .next-step,.show_btn,.pull-right.float-none { width:100%; float:none !important; }
  .sidebar-btn,.edit-save-btn,.edit-back-btn,.next-step1,.prev-step { width:100% !important; display:block; margin:8px 0 !important; border-radius:10px; min-height:46px; font-size:16px !important; }
  .edit-save-btn + .edit-back-btn { margin-top:8px !important; }

  /* Photo step */
  .register_photo-upload,.upload-profiled,.container_photo { width:100% !important; }
  .reg-img-box { margin-top:14px !important; }
  .fileUploadbtn { min-height:44px; display:inline-flex; align-items:center; justify-content:center; }
  .imageBox { margin-left:auto; margin-right:auto; }
  .tools { display:flex; flex-wrap:wrap; gap:8px; justify-content:center; }
  .tools .btn,.tools button { min-width:42px; min-height:42px; }

  /* Profile edit sections */
  .profile-edit-reg .w-75,
  .info-main-box .w-75 { width:100% !important; }
  .profile-edit-reg .pl0 { padding-left:0 !important; padding-right:0 !important; }
  .profile-edit-reg .col-lg-8 { padding-left:0 !important; padding-right:0 !important; }
}

/* =========================================================
   Akbar Change - 25-Sep-2026
   Phase 4 - Search, Messages, Interests, Shortlist, Blocklist,
   Photo Requests - Mobile/Tablet frontend only.
   Desktop (1200px+) and Admin are intentionally unaffected.
   ========================================================= */
@media (max-width:1199px) {
  /* Search/filter surfaces */
  .container.new-width, .container-fluid.new-width { max-width:100%; }
  .contact-tab-nav2, .contact-tab { overflow-x:auto; white-space:nowrap; -webkit-overflow-scrolling:touch; }
  .contact-tab-nav2>li, .contact-tab>li { float:none; display:inline-block; }
  .filter-btn, .b-m-mobile { min-height:44px; touch-action:manipulation; }
  .pannel-new, .panel1-cstm { border-radius:12px; overflow:hidden; }
  .panel-cstm { min-height:46px; display:flex; align-items:center; }

  /* Messages - app-like split/chat surfaces */
  .wm-left, .wm-right, .wm-content, .wm-thread { min-width:0; }
  .wm-search input, .wm-compose textarea, .wm-compose input { font-size:16px; }
  .wm-item, .wm-folder { min-height:62px; touch-action:manipulation; }
  .wm-compose-btn, .wm-send, .wm-new-btn { min-height:42px; }
  .wm-avatar { flex:0 0 auto; }
  .wm-preview, .wm-name, .wm-msg { overflow-wrap:anywhere; }

  /* Interest / shortlist / block / photo request common cards */
  .dshbrd_overlay, .dshbrd_color_overlay, .new-saved-search { border-radius:14px; overflow:hidden; }
  .list-group-item.visitor { border-radius:10px; margin-bottom:8px; }
  .new-msg-btn, .yes-no { min-height:42px; touch-action:manipulation; }
}

@media (max-width:767px) {
  /* Search */
  .container.new-width, .container-fluid.new-width {
    width:100% !important; padding-left:12px !important; padding-right:12px !important;
  }
  .padding-right-zero-search { padding-right:0 !important; }
  .search-section, .tab-content-margin-top { width:100%; }
  .fr-main { padding-left:0 !important; padding-right:0 !important; }
  .fr-main .row { margin-left:0; margin-right:0; }
  .fr-main [class*=col-] { padding-left:6px; padding-right:6px; }
  .panel-cstm { padding:10px 12px !important; }
  .panel-body.bg-color { padding:12px !important; }
  .range-slider, .js-range-slider, .js-range-slider-2 { max-width:100%; }
  .filter-btn, .b-m-mobile { width:100%; border-radius:10px; }

  /* Messages: one-pane phone experience */
  .wm-content { display:block !important; width:100% !important; }
  .wm-left, .wm-right { width:100% !important; max-width:none !important; }
  .wm-left { border-right:0 !important; }
  .wm-left-head, .wm-chat-head { position:sticky; top:0; z-index:5; background:#fff; }
  .wm-item { padding:10px !important; }
  .wm-bubble { max-width:88% !important; }
  .wm-thread { padding:12px 8px !important; }
  .wm-compose { position:sticky; bottom:64px; z-index:6; background:#fff; padding:8px !important; }
  .wm-compose-row { gap:6px; }
  .wm-compose textarea { min-height:44px; max-height:120px; resize:vertical; }
  .wm-mobile-back { display:inline-flex !important; align-items:center; min-height:40px; }
  .wm-folder-detail-actions { display:flex; flex-wrap:wrap; gap:6px; }
  .wm-folder-detail-actions>* { margin:0 !important; }

  /* Legacy inbox screen */
  .ne_inbox_right_pan, .ne_inbox_msg, .ne_inbox_msg_content { width:100% !important; }
  .ne_msg_tp_strip { margin-bottom:6px; min-height:40px; }
  .btn-compose-new-msg { width:100%; min-height:44px; }

  /* Interests, shortlist, blocked profiles, photo-password requests */
  .width-95.mt-60-pro, .width-95.mt-40-pro {
    width:100% !important; padding-left:12px !important; padding-right:12px !important;
    margin-top:18px !important;
  }
  .row-cstm.pad-lr15 { padding-left:0 !important; padding-right:0 !important; }
  .dshbrd_overlay, .dshbrd_color_overlay { padding:12px !important; }
  .saved-search-i { display:flex; align-items:center; gap:8px; line-height:1.35; }
  .list-group-item.visitor { padding:12px !important; }
  .list-group-item.visitor .row { margin-left:-5px; margin-right:-5px; }
  .list-group-item.visitor [class*=col-] { padding-left:5px; padding-right:5px; }
  .new-msg-btn, .yes-no { width:100%; margin:5px 0 !important; }

  /* Modals */
  .modal-dialog-vendor, .modal-dialog { width:auto !important; margin:12px !important; }
  .modal-content { border-radius:14px; overflow:hidden; }
  .modal-body { max-height:calc(100vh - 150px); overflow-y:auto; -webkit-overflow-scrolling:touch; }

  /* Global protection for these screens */
  .container.new-width, .container-fluid.new-width, .wm-content, .wm-thread, .fr-main { overflow-x:hidden; }
}

@media (min-width:768px) and (max-width:1199px) {
  .container.new-width, .container-fluid.new-width { width:96% !important; }
  .wm-content { min-height:560px; }
  .wm-left { width:34%; }
  .wm-right { width:66%; }
  .wm-bubble { max-width:78%; }
  .dshbrd_overlay, .dshbrd_color_overlay { padding:16px; }
}


/* =========================================================
   Akbar Change - 25-Sep-2026 - Phase 5 final mobile/tablet audit + PWA
   Desktop (>=1200px) intentionally remains unchanged.
   ========================================================= */
.wm-pwa-install { display:none; }
@media (max-width:1199px) {
  html, body { max-width:100%; }
  body { -webkit-text-size-adjust:100%; text-size-adjust:100%; }
  input, select, textarea, button { font-size:16px; }
  img, video, iframe { max-width:100%; }
  .wm-pwa-install {
    display:flex; align-items:center; gap:7px; position:fixed; right:14px; bottom:88px; z-index:9997;
    min-height:42px; padding:9px 13px; border:0; border-radius:999px; background:#198754; color:#fff;
    font-size:13px; font-weight:700; box-shadow:0 6px 20px rgba(0,0,0,.18); cursor:pointer;
  }
  .wm-standalone .wm-pwa-install { display:none !important; }
  @supports (padding: max(0px)) {
    body.wm-has-app-nav { padding-bottom:max(76px, calc(68px + env(safe-area-inset-bottom))); }
  }
}
@media (max-width:767px) {
  body { min-width:0 !important; }
  .container, .container-fluid { max-width:100%; }
  table { max-width:100%; }
  .wm-pwa-install { right:12px; bottom:calc(76px + env(safe-area-inset-bottom)); }
  input[type=text], input[type=email], input[type=tel], input[type=password], input[type=number], select, textarea { max-width:100%; }
}
