/* Cabinet Responsive — top-intim23.ru v6 */

/* ===== ALL SCREENS ===== */

/* Tariff: dropdown + pay ALWAYS horizontal */
.td_group {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 6px;
  margin: 4px 0;
  padding: 4px 0;
  height: auto !important;
  width: 100% !important;
}
.td_group form {
  display: flex !important;
  flex-direction: row !important;
  gap: 6px !important;
  align-items: center !important;
  width: 100% !important;
  flex-wrap: nowrap !important;
}
/* Native select */
.td_group select {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  border: 2px solid #f28a72 !important;
  border-radius: 6px !important;
  padding: 5px 6px !important;
  font-size: 13px;
  background: #fff;
  height: 34px !important;
  box-shadow: none !important;
  float: none !important;
  width: 0 !important;
}
/* Nice-select replacement */
.td_group .nice-select {
  margin: 0 !important;
  vertical-align: middle !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  border: 2px solid #f28a72 !important;
  border-radius: 6px !important;
  padding: 5px 28px 5px 8px !important;
  font-size: 13px !important;
  background: #fff;
  height: 34px !important;
  line-height: 22px !important;
  box-shadow: none !important;
  float: none !important;
  width: 0 !important;
  display: flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
}
.td_group .nice-select .list {
  max-height: 200px;
  overflow-y: auto;
}
.td_group .tablePayBtn {
  margin: 0 !important;
  vertical-align: middle !important;
  line-height: 20px !important;
  background: linear-gradient(135deg, #f28a72, #e06050) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 6px !important;
  padding: 6px 14px !important;
  font-size: 13px !important;
  font-weight: bold;
  white-space: nowrap !important;
  height: 34px !important;
  box-shadow: 0 2px 4px rgba(242,138,114,0.3);
  float: none !important;
  width: auto !important;
  max-width: 120px !important;
  flex: 0 0 auto !important;
  box-sizing: border-box !important;
}
.td_group .tablePayBtn:hover {
  background: linear-gradient(135deg, #e06050, #d04535) !important;
}


/* Tariff blocks */
.tarif-block { margin-bottom: 6px; padding: 6px 8px; border: 1px solid #e0e0e0; border-radius: 6px; }
.tarif-top { border-color: #f28a72; }

/* Поднять — green, no arrow */
.tableUpBtn {
  background: linear-gradient(135deg, #66BB6A, #4CAF50) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 8px 16px !important;
  font-size: 14px !important;
  box-shadow: 0 2px 6px rgba(76,175,80,0.4) !important;
}
.tableUpBtn:hover { background: linear-gradient(135deg, #4CAF50, #388E3C) !important; }

/* Save button — highlighted + centered text */
#saveSetingsBtn {
  background: linear-gradient(135deg, #f28a72, #e06050) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 12px 30px !important;
  font-size: 18px !important;
  font-weight: bold !important;
  box-shadow: 0 3px 8px rgba(242,138,114,0.4) !important;
  display: block !important;
  margin: 20px auto !important;
  min-width: 200px;
  text-align: center !important;
  cursor: pointer;
}

/* Moderator button */
button[onclick*="moymoderator"], a[href*="moymoderator"] {
  background: linear-gradient(135deg, #f28a72, #e06050) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 12px 24px !important;
  font-size: 16px !important;
  font-weight: bold !important;
  box-shadow: 0 3px 8px rgba(242,138,114,0.4) !important;
  text-decoration: none !important;
  display: inline-block !important;
}

/* Card name/position */
.card-name { font-weight: bold; font-size: 15px; margin: 5px 0 2px; }
.card-position { font-size: 12px; color: #999; margin: 0; }

/* Status block */
.status-block {
  margin: 8px 0;
  padding: 6px 10px;
  background: #f9f9f9;
  border-radius: 6px;
  border-left: 3px solid #23af27;
}
.tariff-dates { font-size: 13px; margin-top: 5px; }
.tariff-dates div { margin: 2px 0; }

/* Balance block at top */
.cabinet-balance-top { display: none; }

/* ===== EDIT FORM — ALL SCREENS ===== */
/* Ensure 2-column layout on desktop for edit form */
.setings_form .row,
.setings_form .form-group-row {
  display: flex;
  flex-wrap: wrap;
}
.setings_group {
  margin-bottom: 10px;
}
.setings_group label {
  font-weight: 600;
  margin-bottom: 4px;
  display: block;
  font-size: 14px;
}
.setings_form input[type="text"],
.setings_form input[type="number"],
.setings_form textarea,
.setings_form select {
  border: 1px solid #ccc;
  border-radius: 6px;
  padding: 6px 10px;
  font-size: 14px;
  transition: border-color 0.2s;
}
.setings_form input:focus,
.setings_form select:focus,
.setings_form textarea:focus {
  border-color: #f28a72;
  outline: none;
  box-shadow: 0 0 0 2px rgba(242,138,114,0.2);
}
/* Required field label asterisk */
.setings_group label:has(+ input[required])::after,
.setings_group label:has(+ input[name="name"])::after {
  color: #e06050;
}

/* ===== DESKTOP: CARD GRID ===== */
@media (min-width: 768px) {
  .col-md-3.col-xs-3 { position: sticky; top: 10px; align-self: flex-start; }

  .cabinettable thead { display: none !important; }
  .cabinettable, .cabinettable tbody {
    display: flex !important; flex-wrap: wrap !important; gap: 12px !important; width: 100% !important;
    border: none !important;
  }
  .anketa-card {
    display: flex !important;
    flex-direction: column !important;
    width: calc(50% - 6px) !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 12px !important;
    padding: 12px !important;
    background: #fff !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06) !important;
    border-bottom: 3px solid #f28a72 !important;
    box-sizing: border-box !important;
  }
  .anketa-card td {
    display: block !important;
    width: 100% !important;
    border: none !important;
    padding: 3px 4px !important;
    text-align: center !important;
  }
  .anketa-card .card-id {
    text-align: left !important;
    font-weight: bold; color: #f28a72; font-size: 13px;
    background: #fff5f3; border-radius: 4px; padding: 2px 8px !important;
    display: inline-block !important; width: auto !important;
  }
  .anketa-card .card-photo { text-align: center !important; }
  .table_img { max-width: 130px !important; max-height: 200px !important; margin: 4px auto !important; border-radius: 6px; }
  .anketa-card .card-actions .btn {
    width: 90% !important; max-width: 200px !important;
    margin: 3px auto !important; display: block !important;
    font-size: 12px !important; padding: 5px 8px !important;
  }
  .anketa-card .tableUpBtn { width: 90% !important; max-width: 200px !important; display: block !important; margin: 4px auto !important; }

  /* Edit form — ensure 2 cols on desktop */
  .setings_form .col-sm-6 {
    width: 50% !important;
    float: left !important;
    padding: 0 10px !important;
    box-sizing: border-box !important;
  }
  .setings_form input[type="text"],
  .setings_form input[type="number"],
  .setings_form textarea,
  .setings_form select,
  .setings_form .nice-select {
    width: 100% !important;
    box-sizing: border-box !important;
  }
}
@media (min-width: 1200px) {
  .anketa-card { width: calc(33.333% - 8px) !important; }
}

/* ===== MOBILE ===== */
@media (max-width: 767px) {
  body { min-width: 0 !important; }
  html, body { overflow-x: hidden !important; max-width: 100vw !important; }
  .col-md-9.col-xs-9, .col-md-3.col-xs-3 {
    width: 100% !important; float: none !important; padding: 0 8px !important;
  }
  /* Hide sidebar on mobile (balance shown at top) */
  .col-md-3.col-xs-3 { display: none !important; }
  .cabinet-balance-top { display: block !important; text-align: center; }
  .filter_img_box { display: none; }
  .table-responsive { overflow-x: visible !important; }
  
  /* Ankety cards */
  .cabinettable, .cabinettable thead, .cabinettable tbody,
  .cabinettable th, .cabinettable td, .cabinettable tr {
    display: block !important; width: 100% !important; box-sizing: border-box !important;
  }
  .cabinettable thead { display: none !important; }
  .anketa-card {
    border: 1px solid #e0e0e0 !important; border-radius: 10px !important;
    margin-bottom: 12px !important; padding: 10px !important;
    background: #fff !important; box-shadow: 0 2px 6px rgba(0,0,0,0.08) !important;
    border-bottom: 3px solid #f28a72 !important;
  }
  .anketa-card td {
    border: none !important; padding: 4px 8px !important; text-align: center !important; width: 100% !important;
  }
  .anketa-card .card-id {
    text-align: left !important; font-weight: bold; font-size: 14px; color: #f28a72;
    display: inline-block !important; width: auto !important;
    padding: 2px 8px !important; background: #fff5f3; border-radius: 4px;
  }
  .table_img { max-width: 140px !important; max-height: 200px !important; margin: 5px auto !important; border-radius: 6px; }
  .anketa-card .card-actions .btn {
    width: 100% !important; max-width: 280px !important; margin: 4px auto !important;
    display: block !important; font-size: 14px !important; padding: 8px 12px !important;
  }
  .anketa-card .tableUpBtn {
    width: 100% !important; max-width: 280px !important; display: block !important; margin: 5px auto !important;
  }
  
  /* Edit form — full width single column */
  .col-sm-6.col-xs-12, .col-sm-6 {
    width: 100% !important; float: none !important; padding: 0 5px !important;
  }
  .setings_group { margin-bottom: 10px; }
  .setings_group label { display: block; margin-bottom: 3px; font-size: 13px; }
  .setings_form input[type="text"],
  .setings_form input[type="number"],
  .setings_form textarea,
  .setings_form select,
  .setings_form .nice-select {
    width: 100% !important; box-sizing: border-box !important;
  }
  .sexual_list_col, .sexual_preferences .col-md-4, .sexual_preferences .col-sm-4 {
    width: 100% !important; float: none !important;
  }
  .chose_file_box { text-align: center; margin: 10px 0; }
  
  /* Edit page — fix shifted fields */
  .personal_block.shadow .col-sm-4,
  .personal_block.shadow .col-sm-offset-1,
  .personal_block.shadow .col-xs-6,
  .personal_block .col-sm-4,
  .personal_block .col-sm-offset-1,
  .personal_block .col-xs-6,
  .personal_block .col-sm-9,
  .personal_block .col-md-12,
  .personal_block .col-sm-12 {
    width: 100% !important; margin-left: 0 !important; float: none !important; padding: 0 5px !important;
  }
  
  /* General buttons */
  .send_message .btn, .personal_block > .btn, form .btn[type="submit"]:not(.tablePayBtn), a .btn {
    width: 100% !important; max-width: 300px !important; margin: 5px auto !important; display: block !important;
  }
  .personal_block.shadow { padding: 10px !important; margin: 5px 0 !important; }
  .personal_block .title, .personal_block h1.title { font-size: 18px; }
  .breadcrumbs { font-size: 12px; word-break: break-word; }
  
  /* Balance page */
  .personal_block img { max-width: 100% !important; height: auto !important; }
  
  /* History table → cards */
  #pdopage .table, #pdopage .table thead, #pdopage .table tbody,
  #pdopage .table th, #pdopage .table td, #pdopage .table tr {
    display: block !important; width: 100% !important; box-sizing: border-box !important;
  }
  #pdopage .table thead { display: none !important; }
  #pdopage .table tr {
    border: 1px solid #e0e0e0 !important; border-radius: 8px !important;
    margin-bottom: 10px !important; padding: 10px !important;
    background: #fff !important; box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
  }
  #pdopage .table td {
    border: none !important; padding: 3px 8px !important; text-align: left !important;
  }
  #pdopage .table td:nth-child(1)::before { content: "Время: "; font-weight: bold; color: #999; }
  #pdopage .table td:nth-child(2)::before { content: "Тип: "; font-weight: bold; color: #999; }
  #pdopage .table td:nth-child(3)::before { content: "Сумма: "; font-weight: bold; color: #f28a72; }
  #pdopage .table td:nth-child(4)::before { content: "Описание: "; font-weight: bold; color: #999; }
  
  /* Other columns */
  .personal_block .col-md-6, .personal_block .col-md-4,
  .personal_block .col-sm-6, .personal_block .col-sm-4, .personal_block .col-md-3 {
    width: 100% !important; float: none !important; padding: 0 5px !important;
  }
  .modal-dialog { margin: 10px; width: auto !important; }
  .container { max-width: 100% !important; overflow-x: hidden !important; padding: 0 8px !important; }
  .personal_block p, .personal_block li, .personal_block div {
    word-wrap: break-word !important; overflow-wrap: break-word !important;
  }
  
  /* Photo list table on edit page */
  .personal_block table:not(.cabinettable) td {
    word-break: break-all;
    font-size: 13px;
  }
}

/* Tablet */
@media (min-width: 768px) and (max-width: 1199px) {
  body { min-width: 0 !important; }
  .anketa-card { width: calc(50% - 6px) !important; }
}