@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap');

* {
    padding: 0;
    margin: 0;
}

body{
    font-family: 'DM Sans', sans-serif;
    background-image: url('../img/background-home-freelanclick.png');
    background-position: top;
    background-repeat: no-repeat;
    position: relative;
    width: 100%;
    background-size: cover;
}

body::-webkit-scrollbar{
    width: 6px;
}

body::-webkit-scrollbar-track{
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}
 
body::-webkit-scrollbar-thumb{
  	background-color: #6482F8;
}

ol, ul {
    padding-left: 0rem !important;
}
dl, ol, ul {
    margin-top: 0;
    margin-bottom: 0rem !important;
}

nav ul{margin:0 !important; padding:0 !important;}
ul, li{list-style: none;}

/* Generic */
a{text-decoration:none!important;color:#333333;}
.m_4{margin-top: 4rem !important;margin-bottom: 4rem !important;}
.mt_1 {margin-top: 1.5rem!important;}
.mt_2 {margin-top: 2.5rem!important;}
.mt_4 {margin-top: 4rem!important;}
.ml_2 {margin-left: 2.5rem!important;}
.vh100{height: 100vh;}
.vh88{height: 88vh;}
.vh90{height: 90vh;}
.no_padding{padding:0 !important;}
.no_gutter > [class*='col-']{padding-right:0; padding-left:0;}
.col-centered{float: none;margin: 0 auto;display: table;}
.container{padding:0 15px;}
p{margin-top: 0;margin-bottom: 0;color:#333333;}
.d-none{display: none !important;}
.fs-12{font-size: 12px;}
.fs-13{font-size: 13px;}
.fs-9{font-size: 9px;}
.fs-10{font-size: 10px;}
.bg_blue{background:rgba(100,130,248,0.3);}

/* Titulos */
.header_section h1{font-size:30px}
.header_section h2{font-size:26px}
.header_section h3{font-size:18px}
.header_section h4{font-size:16px}
.header_section h5{font-size:14px}
.header_section h6{font-size:10px}

/* Parrafos */
.entry_content{padding: 20px;}
.entry_content.pull_right p{text-align: right !important;}
.entry_content.pull_left p{text-align: left !important;}
.entry_content.pull_center p{text-align: center !important;}

/* Formulario */
form{width: 90%;}
.form-control {padding: 0.75rem 0.75rem;}
.form-select {padding: 0.75rem 0.75rem; border-radius: 20px 0 0;box-shadow: inset 0 0 7px rgba(86, 86, 86, 0.4);border: none;margin-left: 3px;padding-left: 20px;}
select.form-control:not([size]):not([multiple]) {height: 50px;}
label {font-weight: 500;margin-bottom: 0.5rem;}
.password-addon{height: 100%;}
.invalid-feedback {display: block;font-size: .9em;}

/* Buscador */
.search-box {position: relative;}
.search-box .form-control {padding-left: 40px;border-radius: 20px 0 0;box-shadow: inset 0 0 7px rgba(86, 86, 86, 0.4);border: none;}
.search-box .search-icon {font-size: 14px;position: absolute;left: 13px;top: 0;height: 100%;display: -webkit-box;display: -ms-flexbox;display: flex;-webkit-box-align: center;-ms-flex-align: center;align-items: center;color: #333333;}

/* btn */
.btn_freelanclick{position: relative;background:#FFF;border-radius: 0 0 20px 0;box-shadow: inset 0 0 7px rgba(86, 86, 86, 0.4);padding: 10px;margin: 0 auto;outline: 0;border: none;transition: all 300ms ease-out;}
.btn_freelanclick span{color:rgba(51,51,51,0.5);font-weight: 400;padding: 5px 10px;}
.btn_freelanclick.orange{background:#FF7B00;}
.btn_freelanclick.orange span{color:#FFF;}
.btn_freelanclick.white{background:transparent;border: solid 2px #FFF;}
.btn_freelanclick.white:hover{border: solid 2px transparent;}
.btn_freelanclick.white span{color:#FFF;}
.anchor_center {text-align: center;padding: 10px 0;}
.btn_freelanclick.orange.hvr-sweep-to-right:before {border-radius: 0 0 20px 0;background: #6482F8;transition: all 300ms ease-out;}
.btn_freelanclick.white.hvr-sweep-to-right:before {border-radius: 0 0 20px 0;background: #FF7B00;transition: all 300ms ease-out;}
.btn_freelanclick.bluef{background:#6482F8;border: solid 2px #6482F8;}
.btn_freelanclick.bluef span{color:#FFF;}
.btn_freelanclick.bluef:hover{border: solid 2px #fff;}
.btn_freelanclick.bluef.hvr-sweep-to-right:before {border-radius: 0 0 20px 0;background: #FF7B00;transition: all 300ms ease-out;}
.btn_freelanclick.white span.black{color:#343434;}
/* Nav */
.navbar-expand-lg .navbar-nav .nav-link {margin: 0 8px;}
.navbar-nav .nav-link{font-size: 20px;color:#333333 !important;font-weight: bold;transition: all 400ms ease-out;}
.navbar-nav .nav-link:hover{color:#6482F8 !important;transition: all 400ms ease-out;}
.btn_register{background:#FFF;border-radius: 0 0 20px 0;box-shadow: inset 0 0 7px rgba(86, 86, 86, 0.4);}
.btn_register span{color:rgba(51,51,51,0.5);font-weight: 400;padding: 10px;transition: all 400ms ease-out;}
.btn_register:hover span{color:#6482F8;transition: all 400ms ease-out;}

.btn_search{position: relative;background:#FFF;border-radius: 0 0 20px 0;box-shadow: inset 0 0 7px rgba(86, 86, 86, 0.4);padding: 10px 20px;margin: 0 12px;outline: 0;border: none;transition: all 300ms ease-out;}
.btn_search.hvr-sweep-to-right:before {border-radius: 0 0 20px 0;background: #6482F8;transition: all 300ms ease-out;}

.nav-link .badge {
  font-size: 0.65rem;
  padding: 4px 6px;
}

/* Header */
.navbar-nav{align-items: center;}

.header_section{margin-top: 20px;text-transform: uppercase;letter-spacing: 3px;position: relative;}
.header_center {text-align: center;}
.header_left {text-align: left;}
.header_right {text-align: right;}
.header_section.orange {color: #FF7B00;}
.header_section.white {color: #FFF;}
.header_section.blue {color: #6482F8;}
.header_section.dark {color: #333333;}
.header_section span {position: relative;margin: auto;display: block;font-weight: bold;}
.header_section span::before {content: '';position: absolute;left: 50%;bottom: 0;top: -15px;background: #6482F8;width: 4%;height: 3px;transform: translateX(-50%);}
.header_section.header_left span::before{left: 10%;}
.header_section.white span::before {background: #FF7B00;}

/* Menú user */
.header-profile-user {height: 32px;width: 32px;}

/* Social media */
#social_networks{position: relative;margin-top: 20px;}
#social_networks ul{list-style: none;}
#social_networks li{display: inline-block; vertical-align: middle; margin:0 10px;}
#social_networks a{display: block; text-align: center;transition: all 400ms ease-out;}
#social_networks a span i{background:transparent ;font: normal normal normal 12px/1 FontAwesome;content: "\f415";color: #333333;width: 40px;height: 40px;display: block;line-height: 30px;font-size: 25px;;transition: all 400ms ease-out;}
#social_networks a:hover span i{transition: all 400ms ease-out;color: #6482F8;transition: all 400ms ease-out;}

/* Avatars */
.avatar-xl {height: 7.5rem;width: 7.5rem;}
.avatar-xs {height: 2rem;width: 2rem;}
.avatar-title {-webkit-box-align: center;-ms-flex-align: center;align-items: center;background-color: #405189;color: #fff;display: -webkit-box;display: -ms-flexbox;display: flex;font-weight: 500;height: 100%;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center;width: 100%;}

/* Navbar */
.nav-tabs-custom.card-header-tabs {margin-top: -0.5rem;}
.nav-tabs-custom .nav-item {position: relative;}
.nav-tabs-custom .nav-item .nav-link.active {color: #405189;}
.nav-tabs-custom.card-header-tabs .nav-link {padding: 1rem 1rem;}
.nav-tabs-custom .nav-item .nav-link {border: none;font-weight: 500;}
.nav-tabs-custom .nav-item .nav-link.active:after {-webkit-transform: scale(1);transform: scale(1);}
.nav-tabs-custom .nav-item .nav-link::after {content: "";background: #405189;height: 1px;position: absolute;width: 100%;left: 0;bottom: 0;-webkit-transition: all 250ms ease 0s;transition: all 250ms ease 0s;-webkit-transform: scale(0);transform: scale(0);}
/* Secciones home*/

/* Banner */
#banner.section_home {position:relative;max-width:100%;overflow:hidden;height: 100%;}
.title_banner{width: 55%;padding-left: 50px;padding-top: 30px;display: flex;}
.title_banner h1{font-size: 40px;line-height: 50px;font-weight: 400;}
.title_banner h1 span{font-weight: 700;font-size: 42px;}
.content_image_banner figure{text-align: center;}
#banner.section_home #circle{background: #FF7B00;width: 15%;height: 5%;border-radius: 57%;margin-right: 15px;}
#banner.section_home #form_home{width: 60%;display: flex;justify-content: flex-start;position: absolute;bottom: 100px;}
#banner.section_home #form_home input{background-color: #FFF;box-shadow: inset 0 0 7px rgba(86, 86, 86, 0.3);padding: 16px 25px;width: 35%;border:none;appearance: none;-webkit-appearance: none;-moz-appearance: none;outline: none;}
#banner.section_home #form_home input.br_2{border-radius: 20px 0 0 0;}
#banner.section_home #form_home .btn_search{border-radius: 0 0 20px 0;border: none;margin-left: 10px;}
#banner.section_home #form_home input:focus {box-shadow: 0 0 10px #6482F8;}

/* About */
#about_us.section_home{position:relative;max-width:100%;overflow:hidden;height: 100%;}
#about_us.section_home .video_container{display: flex;justify-content: center;align-items: center;padding: 20px 0;margin: 20px 0;}
#about_us.section_home .bg_video{width: 637px;height: 377px;border-radius: 0 80px 0 80px;background-color: #6482F8;position: absolute;bottom: 7px;right: 167px;z-index: -1;}

/* Category */
#category.section_home{position:relative;max-width:100%;overflow:hidden;height: 100%;}
#category.section_home .card{position:relative;transition-duration: 350ms;transition-timing-function: ease;}
#category.section_home .card-body{position:absolute;bottom: 0;display: flex;justify-content: start;align-items: center;padding:0 10px 0 0 !important;color:#fff;font-size: 25px;}
.card-body h5, .card-body h6{margin-bottom: 0 !important;}
#category.section_home .card-body h5{background: rgba(100,130,248,0.6);padding: 5px;}
#category.section_home .card-body:hover h5{background: transparent;}
#category.section_home .card-body h6{margin-left: 8px;}
#category.section_home .card-body {background: transparent;padding: 5px;-webkit-transition: background-color 0.3s ease-in-out;-o-transition: background-color 0.3s ease-in-out;-moz-transition: background-color 0.3s ease-in-out;-ms-transition: background-color 0.3s ease-in-out;transition: background-color 0.3s ease-in-out;overflow: hidden;}
#category.section_home .card:hover .card-body {background: rgba(100, 130, 248, 0.6);padding: 5px 15px;width: 100%;}
#category.section_home .card:is(:hover, :focus) {box-shadow: 0px 8px 10px 1px rgba(0, 0, 0, 0.2);transform: translateY(-8px);}
#line_more {background: #333333;width: 100%;height: 3px;position: relative;}
#line_more span::before{content: '';position:absolute;background: #6482F8;width: 25%;height: 7px;left: 0;top: -2px;}
#category.section_home #content_btn_category{margin:4rem 0;display: flex;justify-content: center;align-items: center;}

/* Destacados */
#destacados.section_home{position:relative;max-width:100%;overflow:hidden;height: 100%;}

/* Documents */
#document_footer{position:relative;max-width:100%;overflow:hidden;}
#document_footer ul{background: #333333;padding: 15px 10px;display: flex; justify-content: space-evenly;align-items: center;}
#document_footer ul li p,#document_footer ul li a{color:#fff;cursor: pointer;}
#document_footer ul li p:hover,#document_footer ul li a:hover{color:#6482F8;}

.avatar-sm {height: 3rem;width: 3rem;}

/* Footer */
footer#content_footer{position:relative;max-width:100%;overflow:hidden;}
footer#content_footer .anchor_center{color:#333333;}
footer#content_footer .anchor_center p {margin-top: 1rem;}


/* Login */
#content_signup{background-image: url('../img/background-login-freelanclick.png');background-position: center;background-repeat: no-repeat;background-size: cover;}
#content_signup .entry_content {padding: 50px 80px 20px;}
#content_signup .entry_content p{color:#FFF;}

.g-recaptcha{width: 100%;height: 75px;display: flex;justify-content: center;margin: 30px 0px;}

#content_login form{width: 50%;}

/* Contact */

#form_contact.section_contact{position:relative;max-width:100%;overflow:hidden;padding-left: 10px;}
#form_contact.section_contact #data_contact{background-image: url('../img/background-contact-freelanclick.png');background-position: center;background-repeat: no-repeat;background-size: cover;}
#form_contact.section_contact form{width: 95%;}
#form_contact.section_contact .icon_contact{width: 100%;margin: 20px 0;display: flex;align-items: center;justify-content: start;}
#form_contact.section_contact .icon_contact span{color:#FF7B00;margin: 0 10px;}
#form_contact.section_contact .icon_contact span i{font-size: 35px;}
#form_contact.section_contact .icon_contact p, #form_contact.section_contact .icon_contact a{color:#FFF;}


/* Category */
#category.section_home{position:relative;max-width:100%;overflow:hidden;}
#category.section_home form{width: 100%;}
#category.section_home form .search-box {width: 40%;}

/* Detail category */
#category_profiles.section_home{position:relative;max-width:100%;overflow:hidden;}
.content_data{padding:5px 10px; margin: 5px 5px 10px;border-radius: 20px 0 0 0;}
.content_data p{font-size: 12px;margin-left: 3px;margin-top: 2px;color:#333333;}
.content_data.bg_blue{background:rgba(100,130,248,0.3);}
.content_data.bg_orange{background:rgba(255,123,0,0.3);}
#category_profiles.section_home .card .card-body p{margin-top: 12px;}
#category_profiles.section_home .card .card-body{margin-top: -15px;}
#category_profiles.section_home .card .card-body h5{font-size: 16px;}
#category_profiles.section_home .card .card-body h6{font-size: 13px;}
#category_profiles.section_home .card figure{width: 303px; height:185px;overflow: hidden;}
#category_profiles.section_home .card figure img{width: 100%;height:  100%;display: block;object-fit:cover;}
#category_profiles.section_home .search-box input{width: auto;}
#category_profiles.section_home form h6{margin: 5px 10px 0 0;}
.star_category,
.membership,
.school_career{background: rgba(51, 51, 51, 0.25);border-radius: 50%;padding: 0; /* padding no necesario con tamaño fijo */width: 28px;height: 28px;display: inline-flex;align-items: center;justify-content: center;margin-right: 5px;}

.star_category i,
.membership i,
.school_career i{
    color: #6482F8;
    font-size: 12px;
}

.report_user {background: transparent;border-radius: 50%;padding: 0; /* padding no necesario con tamaño fijo */width: 28px;height: 28px;display: inline-flex;align-items: center;justify-content: center;margin-right: 5px;}

.report_user i {
  color: #6482F8;
  font-size: 18px;
}

/* Settings */
#settings.section_account{position:relative;max-width:100%;overflow:hidden;}
#settings.section_account .card {margin-bottom: 1.5rem;-webkit-box-shadow: 0 1px 2px rgba(56,65,74,.15);box-shadow: 0 1px 2px rgba(56,65,74,.15);}
.profile-user .profile-photo-edit {position: absolute;right: 0;left: auto;bottom: 0;cursor: pointer;}
.profile-user .user-profile-image {-o-object-fit: cover;object-fit: cover;}
#settings form{width: 100%;}


/* Detail profile */
.description_profile{margin-top: 20px;}
#container_profile{border:solid 2px #6480f4;padding: 20px;}
#container_profile .star_category {height: 26px;}
div.hr{background-color: rgba(51,51,51, .5);height: 1px;width: 100%;margin: 20px 0;}
.parh_profile{font-size: 15px;width: 80%;margin-left: 10px;}
.container-icon{width:100%;}
.container-icon figure{width:8%;margin-top: 10px;}
.bg_avatar{background-color: #6480f4;border-radius: 35px 0;height: 100%;width: 55%;position: absolute;z-index: -9;left: -17px;top: 12px;}
.badge_freelanclick{background-color: #fff;border-radius:20px 0 0 0;padding: 8px 20px;margin: 3px;box-shadow: inset 0 0 10px 10px rgba(86, 86, 86, 0.1);font-size: 13px;}
.arrow_images i{color:#FF7B00; font-size: 30px;font-weight: bold;}
#showModalAdd form, #showModalEdit form, #showModalDelete form {width: 100% !important;}
#showModalAdd .modal-body, #showModalEdit .modal-body, #showModalDelete .modal-body {padding: 4rem;}
#showModalAdd .form-control, #showModalEdit .form-control, #showModalDelete .form-control {box-shadow: inset 0 0 7px rgba(86, 86, 86, 0.4);border: none;margin: 10px 0;}
#showModalAdd .modal-content, #showModalEdit .modal-content, #showModalDelete .modal-content {background-image: url(../img/background_modal_freelanclick.png);background-position: top;background-size: cover;}
.btn_close{padding: 0 !important;}
.btn_close i{color: #6482F8;border-radius: 50%;font-size: 30px;}


/* Experience */
.content_experience{background-color: #FFF;box-shadow: inset 0 0 20px 10px rgba(86, 86, 86, 0.1);border-radius:20px 0 0 0;border-right: solid 4px #6480f4;padding: 40px;margin: 10px 0;}
.content_experience span{display: flex; justify-content: start;align-items: center;cursor: pointer;}
.content_experience span h5{margin-bottom: 0 !important;margin-right: 5px;}
.content_experience span p{margin-left: 5px;}
.content_experience p{margin: 10px 0;}
.row[id^="gallery_"] {display: none;}
/* Gallery */
.image-upload-container {position: relative;width: 100px;height: 100px;overflow: hidden;}
.image-upload-hidden {display: none;}
.input-file {display: none;}
.image-upload-label {display: block;cursor: pointer;}
.image-preview {width: 100%;height: 100px;background-color: #333333;display: flex;align-items: center;justify-content: center;position: relative;}
.plus-icon {font-size: 22px;color: #FFF;font-weight: bold;padding: 0px 7px;background-color: #6480f4;}
.hidden {display: none !important;}

/* Qualify */
.form-check-input {border: 2px solid #6480f4 !important;}
#modal_qualify form{width: 100% !important;}

/* Scroll politicas */
.scroll-box {
    max-height: 300px;  /* o la altura que necesites */
    overflow-y: auto;
    padding-right: 10px;  /* opcional, mejora la vista cuando aparece el scroll */
    border: 0px solid #ddd;
    margin-top: 10px;
}
.scroll-box::-webkit-scrollbar {width: 5px;}
.scroll-box::-webkit-scrollbar-thumb {background-color: #6480f4;border-radius: 4px;}
.scroll-box::-webkit-scrollbar-thumb:hover {background-color: #6480f4;}

/* Report */
form#form_report{width: 100%;}

/* Politicas */

#policy-content ul,
#policy-content ol {
    padding-left: 3rem !important;
    margin-bottom: 1rem;
    list-style-type: disc; /* o 'decimal' para <ol> */
}

#policy-content ul li,
#policy-content ol li {
    list-style: inside;
}


/* Membresia */
  .plan>.card-body {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }
  
  .plan {
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  }
  
  /* Bordes personalizados por plan */
  .silver {
      border: 30px solid transparent; /* grosor del borde */
      border-image-source: url('../img/border-silver.png');
      border-image-slice: 100 fill; /* clave */
      border-image-repeat: stretch; /* o round si quieres repetir */
  }

    
  .gold {
      border: 30px solid transparent;
      border-image-source: url('../img/border-gold.png');
      border-image-slice: 100 fill;
      border-image-repeat: stretch;
  }


  .silver, .gold {
      min-height: 520px;
  }

  .platinum {
    border: 3px solid #3c4cff; /* celeste */
  }
  
  .diamond {
    border: 3px solid #00bcd4; /* azul oscuro */
  }
  
  .short-desc {
    font-style: italic;
    color: #555;
    margin-top: 10px;
  }

/* COLORES BASE */
.bg-dark-2 {
  background: #1e1e1e;
}

.fc-title {
  color: #ff7a00;
  font-size: 32px;
  font-weight: 700;
  letter-spacing: 1px;
}


.fc-description {
  color: #adadad;
  font-size: 15px;
  line-height: 1.5;
}

.fc-subtitle {
  color: #ff7a00;
  font-size: 20px;
  margin-bottom: 12px;
  text-align: center;
}

/* FEATURE LIST */
.fc-feature-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.fc-feature-item {
  padding: 10px 15px;
  background: #fff;
  border-radius: 12px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
  transition: background 0.2s ease;
}

.fc-feature-item:hover {
  box-shadow: 0 2px 5px rgba(0,0,0,0.35);
}

.fc-tag {
  padding: 4px 10px;
  font-size: 10px;
  border-radius: 8px;
  font-weight: 600;
  text-transform: uppercase;
}

.fc-tag.include {
  background: #007d18;
  color: #fff;
}

.fc-tag.exclude {
  background: #b40000;
  color: #fff;
}

/* PRICE CARDS */
.fc-price-card {
  text-decoration: none;
  display: block;
  margin-bottom: 16px;
  border-radius: 14px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 2px 5px rgba(0,0,0,0.35);
  transition: transform .25s ease, box-shadow .25s ease;
}

.fc-price-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(0,0,0,0.35);
}

.fc-price-card-body {
  padding: 20px;
}

.fc-price-card .title {
  color: #222;
  font-size: 16px;
  font-weight: 600;
}

.fc-price-card .desc {
  color: #9c9c9c;
  font-size: 12px;
  margin: 8px 0 12px;
}

.fc-price-card .price {
  color: #ff7a00;
  font-size: 22px;
  font-weight: 700;
}

/* Contactos */
.clickable-row {
  cursor: pointer;
}

.clickable-row:hover {
  background-color: #f5f5f5; /* o el color que uses */
}

/* === Chat === */
.chat-box {max-height: 450px;overflow-y: auto;padding: 15px;background: #f5f7fa;border-radius: 12px;}

/* Contenedor de cada mensaje */
.chat-message {display: flex;margin-bottom: 15px;align-items: flex-end;}

/* Izquierda (otro usuario) */
.chat-left {justify-content: flex-start;}

/* Derecha (usuario actual) */
.chat-right {justify-content: flex-end;}

/* Avatar */
.chat-avatar img {width: 40px;height: 40px;border-radius: 50%;object-fit: cover;margin: 0 10px;}

/* Burbuja */
.chat-bubble {width: 45%;padding: 10px 14px;border-radius: 14px;position: relative;font-size: 14px;}

/* Colores */
.chat-left .chat-bubble {background: #ffffff;border: 1px solid #e4e6eb;}

.chat-right .chat-bubble {background: #0d6efd;color: white;}

/* Header */
.chat-header {display: flex;justify-content: space-between;font-size: 12px;margin-bottom: 4px;opacity: 0.8;}

.chat-right .chat-header {color: #e9ecef;}


/* Notifications */
/* NOTIFICATIONS */
.notification-item {
  position: relative;
  padding: 16px 20px;
  transition: background 0.2s ease;
}

.notification-item:hover {
  background-color: #f8f9fa;
}

.notification-avatar {
  width: 48px;
  height: 48px;
  object-fit: cover;
}

.notification-dot {
  width: 10px;
  height: 10px;
  background-color: #dc3545;
  border-radius: 50%;
  position: absolute;
  right: 18px;
  top: 24px;
}

.notification-item.unread h6 {
  color: #212529;
}

.notification-item.unread p {
  font-weight: 500;
}

.achievement {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle at top, #ffd700, #ff7b00);
  box-shadow: 0 4px 10px rgba(255, 123, 0, .6);
  transition: transform .3s ease;
}

.achievement:hover {
  transform: scale(1.15) rotate(5deg);
}

/* ⭐ Satisfacción */
.ach-gold {
  background: radial-gradient(circle at top, #ffd700, #ff7b00);
  box-shadow: 0 4px 10px rgba(255, 123, 0, .6);
}

/* ⚡ Rapidez */
.ach-blue {
  background: radial-gradient(circle at top, #82b1ff, #2962ff);
  box-shadow: 0 4px 10px rgba(41, 98, 255, .55);
}

/* ⏱️ Puntualidad */
.ach-orange {
  background: radial-gradient(circle at top, #ffe082, #ff9800);
  box-shadow: 0 4px 10px rgba(255, 152, 0, .55);
}

/* 💬 Comunicación */
.ach-teal {
  background: radial-gradient(circle at top, #80deea, #0097a7);
  box-shadow: 0 4px 10px rgba(0, 151, 167, .55);
}

/* ✔️ Verificado */
.ach-dark {
  background: radial-gradient(circle at top, #616161, #212121);
  box-shadow: 0 4px 10px rgba(0, 0, 0, .6);
}

  /* === Tablet === */
@media (max-width: 991.98px) {
  .title_banner h1 {
    font-size: 28px;
    line-height: 36px;
  }

  #banner.section_home #form_home {
    position: relative;  /* Se vuelve normal, no absoluto */
    bottom: auto;
    margin: 2rem auto 0 auto;
    width: 100%;
    flex-direction: column; /* Inputs en columna */
    align-items: center;
  }

  #banner.section_home #form_home input {
    width: 90%;
    margin-bottom: 1rem;
  }

  #banner.section_home #form_home .btn_search {
    width: 90%;
    margin-left: 0;
    border-radius: 10px;
  }

  /* Reglas para .search-box (usada en otras vistas como la de categorías) */
  #category.section_home form .search-box,
  #membership.section_home form .search-box {width: 100%;max-width: 900px;}

  #category.section_home form .search-box .form-control,
  #membership.section_home form .search-box .form-control {padding-left: 40px; box-shadow: inset 0 0 7px rgba(86,86,86,0.4);}

  #category.section_home form .search-box .search-icon,
  #membership.section_home form .search-box .search-icon {left: 12px;font-size: 14px;}

  /* Si usas d-flex contenedor para el form en otras vistas, forzamos apilado */
  .d-flex.justify-content-center {
    flex-direction: column;
    align-items: center;
  }

  .vh100 {
    height: auto !important; /* Que no quede forzado */
  }

  #content_signup,
  #content_login {
    flex: 0 0 100%;
    max-width: 100%;
    padding: 1rem;
    text-align: center;
  }

  #content_signup .vh88,
  #content_login .vh88 {
    height: auto !important;
    margin: 1rem 0;
  }

  /* Formularios más cómodos */
  form .form-group {
    margin-bottom: 1rem;
  }

  form .form-group select,
  form .form-group input {
    width: 100% !important;
  }

  /* Botones */
  .btn_freelanclick {
    width: 100%;
    border-radius: 10px;
  }

  /* Redes sociales centradas */
  #social_networks {
    margin: 1rem auto;
    text-align: center;
  }

  #social_networks ul {
    justify-content: center;
    padding: 0;
  }

}

/* === Mobile === */
@media (max-width: 575.98px) {
  .title_banner {
    width: 100%;
    padding: 10px;
    text-align: center;
    flex-direction: column;
    align-items: center;
  }

  .title_banner h1 {
    font-size: 20px;
    line-height: 30px;
  }

  #banner.section_home #form_home {
    width: 100%;
    margin-top: 1rem;
    flex-direction: column;
    padding: 0 1rem;
  }

  #banner.section_home #form_home input,
  #banner.section_home #form_home .btn_search {
    width: 100%;
    margin-bottom: 0.8rem;
  }

  /* Ajustes específicos del search-box para vistas que lo usan */
  #category.section_home form .search-box,
  #membership.section_home form .search-box {width: 100%;}

  #category.section_home form .search-box .form-control,
  #membership.section_home form .search-box .form-control {
    padding-left: 40px;
  }

  #category.section_home form .search-box .search-icon {
    left: 12px;
  }

  .vh100 {
    height: auto !important;
    flex-direction: column;
  }
  #category.section_home .no_padding{padding: 20px !important;}

  #content_signup,
  #content_login {
    padding: 1rem;
    max-width: 100%;
    flex: 0 0 100%;
  }

  header.header_section h1,
  header.header_section h2 {
    font-size: 22px;
    line-height: 30px;
  }

  /* Inputs y selects en una sola columna */
  form .form-group {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  /* Excepto el checkbox */
  form .form-group.checkbox-group {
    flex: 0 0 auto !important;
    max-width: 100% !important;
    display: flex;
    align-items: center;
    justify-content: flex-start; /* o center si lo quieres centrado */
  }

  /* Espaciado entre campos */
  form .form-group + .form-group {
    margin-top: 0.8rem;
  }

  /* Botón centrado */
  .btn_freelanclick {
    width: 100%;
    margin-top: 1rem;
  }

  /* Modal scroll en móvil */
  .modal-body .scroll-box {
    max-height: 300px;
    overflow-y: auto;
  }
}