/* Urbiax Jobs v7 — photo shortcut tile fix.
   Fixes mobile screenshot: category photo tiles were too shallow and text overlapped.
   Jobs only. No database changes. */

body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut{
  overflow:hidden !important;
  isolation:isolate !important;
}

body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut .ubx-job-shortcut-photo{
  background-size:cover !important;
  background-repeat:no-repeat !important;
  transform:scale(1.01) !important;
}

/* Remove the glass block that made the text look cramped on the photos. */
body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut::after{
  display:none !important;
  content:none !important;
}

/* Stronger clean bottom gradient for readable text. */
body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut::before{
  background:
    linear-gradient(180deg,
      rgba(15,23,42,.02) 0%,
      rgba(15,23,42,.10) 34%,
      rgba(15,23,42,.55) 72%,
      rgba(15,23,42,.86) 100%) !important;
}

/* Place copy as a proper bottom caption instead of letting it float beside the icon. */
body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut .ubx-job-shortcut-copy{
  position:absolute !important;
  z-index:4 !important;
  left:12px !important;
  right:10px !important;
  bottom:10px !important;
  display:block !important;
  width:auto !important;
  margin:0 !important;
  padding:0 !important;
  min-width:0 !important;
  pointer-events:none !important;
}

body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut .ubx-job-shortcut-copy strong,
body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut .ubx-job-shortcut-copy small{
  display:block !important;
  max-width:100% !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut .ubx-job-shortcut-copy strong{
  color:#fff !important;
  font-weight:1000 !important;
  text-shadow:0 3px 14px rgba(0,0,0,.48) !important;
}

body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut .ubx-job-shortcut-copy small{
  color:rgba(255,255,255,.90) !important;
  text-shadow:0 2px 10px rgba(0,0,0,.45) !important;
}

/* Icon is now a small clean badge, not competing with the title. */
body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut .ubx-mini-icon{
  position:absolute !important;
  z-index:5 !important;
  top:10px !important;
  left:10px !important;
}

/* Mobile tile dimensions and crop corrections */
@media (max-width:700px){
  body.ubx-jobs-page .ubx-starter-row{
    gap:10px !important;
    padding:0 2px 5px !important;
  }

  body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut{
    flex:0 0 150px !important;
    width:150px !important;
    min-height:126px !important;
    height:126px !important;
    border-radius:18px !important;
    box-shadow:0 14px 28px rgba(15,23,42,.16), inset 0 1px 0 rgba(255,255,255,.18) !important;
  }

  body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut .ubx-job-shortcut-photo{
    inset:0 !important;
    width:100% !important;
    height:100% !important;
  }

  body.ubx-jobs-page .ubx-job-photo-cleaning .ubx-job-shortcut-photo{background-position:center 42% !important;}
  body.ubx-jobs-page .ubx-job-photo-electrician .ubx-job-shortcut-photo{background-position:center 45% !important;}
  body.ubx-jobs-page .ubx-job-photo-plumber .ubx-job-shortcut-photo{background-position:center 47% !important;}
  body.ubx-jobs-page .ubx-job-photo-handyman .ubx-job-shortcut-photo{background-position:center 47% !important;}
  body.ubx-jobs-page .ubx-job-photo-gardening .ubx-job-shortcut-photo{background-position:center 44% !important;}
  body.ubx-jobs-page .ubx-job-photo-van .ubx-job-shortcut-photo{background-position:center 48% !important;}

  body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut .ubx-mini-icon{
    width:30px !important;
    height:30px !important;
    min-width:30px !important;
    border-radius:12px !important;
    top:9px !important;
    left:9px !important;
    background:rgba(255,255,255,.94) !important;
    box-shadow:0 9px 18px rgba(15,23,42,.22) !important;
  }

  body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut .ubx-mini-icon svg{
    width:16px !important;
    height:16px !important;
  }

  body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut .ubx-job-shortcut-copy{
    left:11px !important;
    right:9px !important;
    bottom:10px !important;
  }

  body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut .ubx-job-shortcut-copy strong{
    font-size:14.4px !important;
    line-height:1.04 !important;
    letter-spacing:-.035em !important;
  }

  body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut .ubx-job-shortcut-copy small{
    margin-top:3px !important;
    font-size:11px !important;
    line-height:1.08 !important;
    font-weight:900 !important;
  }

  /* Slightly shorten the two big choice cards so the taller photos do not push feed too far down. */
  body.ubx-jobs-page .ubx-intent-tile{
    min-height:76px !important;
  }

  body.ubx-jobs-page .ubx-jobs-glance{
    margin-top:-1px !important;
  }

  /* Hero text no longer clips awkwardly. */
  body.ubx-jobs-page .ubx-hero h1{
    font-size:24px !important;
  }
  body.ubx-jobs-page .ubx-hero p{
    font-size:11.6px !important;
  }
}

@media (max-width:390px){
  body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut{
    flex-basis:140px !important;
    width:140px !important;
    min-height:120px !important;
    height:120px !important;
  }
  body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut .ubx-job-shortcut-copy strong{
    font-size:13.6px !important;
  }
  body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut .ubx-job-shortcut-copy small{
    font-size:10.5px !important;
  }
}

/* Desktop/tablet: make the images feel more premium too. */
@media (min-width:701px){
  body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut{
    min-height:150px !important;
  }
  body.ubx-jobs-page .ubx-start-pill.ubx-job-photo-shortcut .ubx-job-shortcut-copy{
    left:14px !important;
    right:12px !important;
    bottom:13px !important;
  }
}
