
/* Viec365 v2.5.6.1
   IMPORTANT: do NOT scale cards/text smaller.
   Only widen the real public container from 1180px to 1280px
   and arrange listing media/footer cleanly. */

:root{--v365-public-max:1280px}

/* The actual theme wrapper was .container { width:min(1180px,92%) }.
   Override the real wrapper globally on public pages. */
body > main.container,
main.container,
.container{
    width:calc(100% - 8px) !important;
    max-width:1280px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:0 !important;
    padding-right:0 !important;
    box-sizing:border-box !important;
}

/* Keep original vertical margin from theme. */
main.container{margin-top:30px !important;margin-bottom:30px !important}

/* Footer follows same desktop width. */
body > footer,
.site-footer,
footer{
    width:calc(100% - 8px) !important;
    max-width:1280px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    box-sizing:border-box !important;
}

/* DO NOT shrink listing cards. Restore original theme dimensions. */
.home-list-card{
    padding:18px !important;
}
.icon-listing{
    min-height:205px !important;
    padding:18px !important;
}
.home-card-grid,
.listing-grid{
    gap:18px !important;
}

/* 1280px gives each 3-column card more real width, rather than scaling it. */
@media (min-width:901px){
    .home-card-grid.listing-grid{
        grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    }
}

/* Candidate portrait / employer logo at top-right.
   Text only reserves the media corner; its normal font/size stays unchanged. */
.home-list-card.icon-listing{
    position:relative;
    overflow:hidden;
}
.home-list-card.icon-listing .listing-main-link{padding-right:0 !important;}
.home-list-card.icon-listing .listing-main-link .icon-row:nth-child(-n+3){padding-right:82px !important;}
.listing-thumb{
    position:absolute;
    right:14px;
    top:54px;
    z-index:2;
    width:66px;
    height:66px;
    border-radius:14px;
    background:#fff;
    border:1px solid #dce8f1;
    box-shadow:0 7px 19px rgba(30,69,103,.10);
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center;
    pointer-events:none;
}
.listing-thumb img{
    width:100%;
    height:100%;
    display:block;
}
.listing-thumb.candidate-thumb img{object-fit:cover}
.listing-thumb.company-thumb{padding:6px}
.listing-thumb.company-thumb img{object-fit:contain}

/* Bottom status row:
   expiry/time LEFT; views + heart tightly grouped RIGHT. */
.listing-card-bottom{
    display:flex !important;
    align-items:center !important;
    flex-wrap:nowrap !important;
    gap:7px !important;
    width:100%;
}
.listing-card-bottom .expiry-pill{
    order:1 !important;
    margin-left:0 !important;
    margin-right:auto !important;
    white-space:nowrap !important;
    flex:0 1 auto;
}
.listing-card-bottom .view-count{
    order:2 !important;
    margin-left:0 !important;
    margin-right:0 !important;
    white-space:nowrap !important;
    flex:0 0 auto;
}
.listing-card-bottom .favorite-form,
.listing-card-bottom .heart-static{
    order:3 !important;
    margin-left:0 !important;
    margin-right:0 !important;
    white-space:nowrap !important;
    flex:0 0 auto;
}
.listing-card-bottom .heart-btn{margin:0 !important}

/* Mobile: keep NORMAL typography/card size.
   Only rearrange the footer and slightly reduce thumbnail, never scale content. */
@media (max-width:900px){
    body > main.container,
    main.container,
    .container{
        width:calc(100% - 16px) !important;
        max-width:none !important;
    }
    .home-card-grid,
    .home-card-grid.listing-grid,
    .listing-grid{
        grid-template-columns:1fr !important;
    }
    .home-list-card,
    .home-list-card.icon-listing,
    .icon-listing{
        padding:18px !important;
        min-height:auto !important;
    }
}

@media (max-width:600px){
    .home-list-card.icon-listing .listing-main-link{padding-right:0 !important;}
    .home-list-card.icon-listing .listing-main-link .icon-row:nth-child(-n+3){padding-right:72px !important;}
    .listing-thumb{
        width:58px;
        height:58px;
        right:12px;
        top:52px;
        border-radius:12px;
    }

    /* Keep the original readable font sizes from app.css. */
    .listing-card-bottom{
        gap:6px !important;
    }
    .listing-card-bottom .expiry-pill{
        font-size:13px !important;
        min-width:0;
    }
    .listing-card-bottom .view-count{
        font-size:13px !important;
    }
    .listing-card-bottom .heart-static{
        font-size:21px !important;
    }
    .listing-card-bottom .heart-btn{
        font-size:25px !important;
        padding:4px 5px !important;
    }
    .listing-card-bottom .heart-btn small{
        font-size:11px !important;
    }
}

/* On very narrow phones, never reduce the whole theme/card.
   Only allow the expiry label to contract if absolutely required. */
@media (max-width:360px){
    .listing-card-bottom{gap:4px !important}
    .listing-card-bottom .expiry-pill{font-size:12px !important}
}

/* v2.5.7: footer 2 tầng trở lại full chiều ngang như trước. */
footer.site-footer-pro,
.site-footer-pro{
    width:100% !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
}

/* Media slot luôn tồn tại: có ảnh thì hiện ảnh, chưa có thì hiện khung chờ ảnh/logo. */
.listing-thumb.is-placeholder{
    flex-direction:column;
    gap:3px;
    background:linear-gradient(145deg,#f8fbff,#eef5fb);
    border:1px dashed #a9bfd1;
    color:#7d94a7;
}
.listing-thumb.is-placeholder .media-placeholder-icon{
    font-size:24px;
    line-height:1;
    opacity:.72;
}
.listing-thumb.is-placeholder small{
    font-size:10px;
    font-weight:800;
    white-space:nowrap;
}
/* Các dòng dưới khung ảnh được dùng lại toàn bộ chiều ngang card. */
.home-list-card.icon-listing .listing-main-link .icon-row:nth-child(n+4){
    padding-right:0 !important;
}


/* Viec365 v2.5.8 — Home filter tabs + horizontal selector + infinite loading */
.home-filter-title-row{align-items:flex-end!important;gap:14px}
.home-filter-heading-line{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.home-filter-heading-line h2{margin:0}
.home-filter-tabs{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.home-filter-tab{
    border:1px solid #cfe0ee;background:#fff;color:#17476a;border-radius:999px;
    padding:8px 13px;font:inherit;font-size:13px;font-weight:800;cursor:pointer;
    transition:.18s ease;white-space:nowrap
}
.home-filter-tab:hover,.home-filter-tab.active{background:#113dee;color:#fff;border-color:#113dee;box-shadow:0 7px 18px rgba(17,61,238,.16)}
.home-filter-strip{
    display:grid;grid-template-columns:36px minmax(0,1fr) 36px;align-items:center;gap:7px;
    margin:10px 0 15px;padding:7px;border:1px solid #d9e7f2;border-radius:15px;background:#f8fbfe
}
.home-filter-strip[hidden]{display:none!important}
.home-filter-scroll{display:flex;align-items:center;gap:7px;overflow-x:auto;scrollbar-width:none;scroll-behavior:smooth;padding:2px}
.home-filter-scroll::-webkit-scrollbar{display:none}
.home-filter-arrow{
    width:34px;height:34px;border-radius:50%;border:1px solid #c8daea;background:#fff;color:#113dee;
    font-size:24px;line-height:1;cursor:pointer;display:grid;place-items:center;box-shadow:0 4px 12px rgba(26,63,92,.08)
}
.home-filter-arrow:hover{background:#113dee;color:#fff}
.home-filter-chip{
    flex:0 0 auto;border:1px solid #d7e4ee;background:#fff;color:#264e68;border-radius:999px;
    padding:8px 13px;font-size:13px;font-weight:700;white-space:nowrap;cursor:pointer
}
.home-filter-chip:hover,.home-filter-chip.active{background:#e9efff;color:#113dee;border-color:#9fb4ff}
.home-filter-summary{margin:-4px 0 14px;color:#113dee;font-size:13px;font-weight:800}
.home-filter-summary[hidden]{display:none!important}
.home-load-sentinel{height:38px;display:flex;align-items:center;justify-content:center}
.home-load-sentinel[hidden]{display:none!important}
.home-load-sentinel.loading span{
    width:22px;height:22px;border:3px solid #dbe4ff;border-top-color:#113dee;border-radius:50%;
    animation:v365FilterSpin .7s linear infinite
}
.home-filter-empty{grid-column:1/-1;padding:24px;border:1px dashed #c9d9e5;border-radius:15px;text-align:center;color:#73899a;background:#fbfdff}
@keyframes v365FilterSpin{to{transform:rotate(360deg)}}
@media(max-width:700px){
    .home-filter-heading-line{align-items:flex-start;gap:8px}
    .home-filter-tabs{width:100%;gap:6px}
    .home-filter-tab{font-size:12px;padding:7px 10px}
    .home-filter-strip{grid-template-columns:30px minmax(0,1fr) 30px;margin-top:8px;padding:5px}
    .home-filter-arrow{width:29px;height:29px;font-size:20px}
    .home-filter-chip{font-size:12px;padding:7px 10px}
}

/* v2.5.9: arrows perfectly centered vertically inside selector bar */
.home-filter-strip{position:relative;align-items:center!important}
.home-filter-arrow{
    align-self:center!important;
    justify-self:center!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    line-height:1!important;
    transform:none!important;
}

/* v2.5.10: verified-employer fallback cards use the same card layout. */
.employer-fallback-card .icon-row.industry strong{color:#ff174f}

/* Viec365 v2.5.11 — lighter company cards and ethical rating discussion */
.home-list-card{
    border-color:rgba(91,137,170,.20)!important;
    box-shadow:0 8px 22px rgba(36,74,102,.055)!important;
}
.home-list-card:hover{
    border-color:rgba(17,61,238,.24)!important;
    box-shadow:0 12px 28px rgba(36,74,102,.09)!important;
}
.employer-fallback-card .company-name-row strong{
    color:#10263b!important;
    font-size:15px;
    line-height:1.38;
    overflow-wrap:anywhere;
}
.employer-fallback-card .company-name-row .info-icon{color:#113dee}
.employer-fallback-card .representative-row{
    color:#42586c!important;
}
.employer-fallback-card .company-card-label{
    font-weight:800;color:#25394a;
}
.employer-fallback-card .listing-main-link .icon-row{
    align-items:flex-start;
}
.employer-fallback-card .listing-main-link .icon-row:nth-child(-n+3){
    padding-right:76px!important;
}
.quick-connect-btn,.save-listing-btn,.home-filter-tab,.home-filter-chip,.home-filter-arrow,
.rating-form button,.rating-reply-form button{
    border-width:1px!important;
    box-shadow:0 4px 12px rgba(17,61,238,.09)!important;
}
.quick-connect-btn{background:#113dee!important}
.save-listing-btn{
    border-color:rgba(177,126,0,.32)!important;
    box-shadow:0 4px 12px rgba(149,105,0,.08)!important;
}
.listing-thumb{
    border-color:rgba(91,137,170,.23)!important;
    box-shadow:0 5px 14px rgba(30,69,103,.07)!important;
}

/* Verified star review = score. Community discussion = questions/replies beneath it. */
.rating-item{
    border:1px solid rgba(91,137,170,.16)!important;
    border-radius:14px;
    box-shadow:none!important;
}
.rating-discussion{
    margin-top:12px;padding-top:10px;border-top:1px solid rgba(91,137,170,.14);
}
.rating-thread{margin:8px 0}
.rating-reply{
    padding:9px 11px;border-radius:11px;background:#f7fafc;border:1px solid rgba(91,137,170,.12);
}
.rating-reply.level-2{
    margin:6px 0 6px 28px;background:#fbfcff;border-left:2px solid rgba(17,61,238,.25);
}
.rating-reply p{margin:4px 0 3px;line-height:1.55}
.rating-reply time{font-size:11px;color:#8493a0}
.rating-reply-form{
    display:flex;gap:7px;align-items:center;margin-top:7px;
}
.rating-reply-form.level-2{margin-left:28px}
.rating-reply-form input{
    flex:1;min-width:0;border:1px solid rgba(91,137,170,.24);border-radius:10px;padding:9px 11px;background:#fff;
}
.rating-reply-form button{
    flex:0 0 auto;border-radius:10px;padding:9px 12px;background:#113dee;color:#fff;border:1px solid rgba(17,61,238,.35);
}
.rating-question-form{margin-top:10px}
.rating-login-note{display:inline-block;margin-top:8px;font-size:12px;color:#113dee}
@media(max-width:600px){
    .rating-reply-form{align-items:stretch;flex-direction:column}
    .rating-reply-form.level-2,.rating-reply.level-2{margin-left:16px}
    .rating-reply-form button{align-self:flex-start}
}


/* ============================================================
   Viec365 v2.5.12 — GLOBAL SOFT BORDER SYSTEM
   Apply a consistent maximum 2px soft border across the site.
   ============================================================ */
:root{
  --v365-border-soft: rgba(95, 132, 164, .20);
  --v365-border-blue-soft: rgba(17, 61, 238, .22);
  --v365-border-focus: rgba(17, 61, 238, .38);
}

/* Cards, panels, boxes, admin/public containers */
:is(
  .card,.panel,.box,.widget,.modal,.dialog,.dropdown-menu,
  .home-list-card,.listing-card,.profile-card,.company-card,
  .candidate-card,.job-card,.news-card,.smart-preview,
  .smart-preview-panel,.preview-card,.rating-item,.rating-reply,
  .home-filter-strip,.home-filter-bar,.filter-panel,
  .admin-card,.admin-panel,.settings-card,.form-card,
  .table-wrap,.table-responsive
){
  border-width: 2px !important;
  border-style: solid !important;
  border-color: var(--v365-border-soft) !important;
}

/* Inputs/editor/search/select areas */
:is(
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  textarea,select,
  .form-control,.input,.search-box,.editor-shell,.editor-area,
  .tox-tinymce,.ck-editor__editable,.ql-container
){
  border-width: 2px !important;
  border-style: solid !important;
  border-color: var(--v365-border-soft) !important;
}

/* Buttons and chips: 2px but visually soft */
:is(
  button,.btn,.button,
  .quick-connect-btn,.save-listing-btn,.card-share-btn,
  .home-filter-tab,.home-filter-chip,.home-filter-arrow,
  .preview-open,.rating-form button,.rating-reply-form button
){
  border-width: 2px !important;
  border-style: solid !important;
  border-color: var(--v365-border-blue-soft) !important;
}

/* Images / avatars / logos */
:is(
  .listing-thumb,.avatar,.profile-avatar,.company-logo,
  .candidate-photo,.media-placeholder
){
  border-width: 2px !important;
  border-style: solid !important;
  border-color: var(--v365-border-soft) !important;
}

/* Tables: avoid heavy double lines */
table,thead,tbody,tr,th,td{
  border-color: var(--v365-border-soft) !important;
}
th,td{
  border-width: 0 0 2px 0 !important;
}

/* Focus / hover stays visible but not heavy */
:is(
  input,textarea,select,.form-control,
  button,.btn,.button,
  .home-list-card,.listing-card,.profile-card,.company-card
):focus,
:is(
  input,textarea,select,.form-control,
  button,.btn,.button,
  .home-list-card,.listing-card,.profile-card,.company-card
):focus-visible{
  border-color: var(--v365-border-focus) !important;
  outline: none !important;
}

.home-list-card:hover,
.listing-card:hover,
.profile-card:hover,
.company-card:hover{
  border-color: var(--v365-border-blue-soft) !important;
}

/* Never allow decorative components to become visually heavy */
fieldset,hr{
  border-color: var(--v365-border-soft) !important;
}


/* ============================================================
   Viec365 v2.5.13 — GLOBAL 2PX CORNER RADIUS
   User requirement: all bordered UI boxes use only 2px rounding.
   Border line itself stays light (1px), not heavy 2px.
   ============================================================ */
:root{
  --v365-radius:2px;
  --v365-line:rgba(83,117,145,.20);
  --v365-line-blue:rgba(17,61,238,.24);
}
:is(
  .card,.panel,.box,.widget,.modal,.dialog,.dropdown-menu,
  .home-list-card,.listing-card,.profile-card,.company-card,.candidate-card,.job-card,.news-card,
  .smart-preview,.smart-preview-panel,.preview-card,.rating-item,.rating-reply,
  .home-filter-strip,.home-filter-bar,.filter-panel,.home-filter-tab,.home-filter-chip,.home-filter-arrow,
  .admin-card,.admin-panel,.settings-card,.form-card,.table-wrap,.table-responsive,
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  textarea,select,.form-control,.input,.search-box,.editor-shell,.editor-area,
  button,.btn,.button,.quick-connect-btn,.save-listing-btn,.card-share-btn,.preview-open,
  .listing-thumb,.avatar,.profile-avatar,.company-logo,.candidate-photo,.media-placeholder,
  .badge,.hot-pill,.expiry-pill,.seo-pagination a,.article-tool-btn,.picker-trigger
){
  border-radius:2px !important;
}

/* Undo v2.5.12 heavy border-width override. */
:is(
  .card,.panel,.box,.widget,.modal,.dialog,.dropdown-menu,
  .home-list-card,.listing-card,.profile-card,.company-card,.candidate-card,.job-card,.news-card,
  .smart-preview,.smart-preview-panel,.preview-card,.rating-item,.rating-reply,
  .home-filter-strip,.home-filter-bar,.filter-panel,
  .admin-card,.admin-panel,.settings-card,.form-card,.table-wrap,.table-responsive,
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),textarea,select,.form-control,.input,.search-box,
  button,.btn,.button,.quick-connect-btn,.save-listing-btn,.card-share-btn,.home-filter-tab,.home-filter-chip,.home-filter-arrow,
  .listing-thumb,.avatar,.profile-avatar,.company-logo,.candidate-photo,.media-placeholder
){
  border-width:1px !important;
  border-style:solid !important;
  border-color:var(--v365-line) !important;
}
:is(button,.btn,.button,.quick-connect-btn,.save-listing-btn,.home-filter-tab,.home-filter-chip,.home-filter-arrow):hover{
  border-color:var(--v365-line-blue)!important;
}


/* ============================================================
   Viec365 v2.5.14 — Smart Profile Fill (Mic + Long Text Parser)
   ============================================================ */
.smart-profile-fill{
  margin:14px 0 20px;
  padding:16px;
  border:1px solid rgba(17,61,238,.18);
  border-radius:2px!important;
  background:linear-gradient(180deg,#f9fbff 0%,#fff 100%);
  box-shadow:0 6px 18px rgba(17,61,238,.045);
}
.smart-fill-head h3{margin:0 0 5px;color:#123b5d}
.smart-fill-head p{margin:0 0 12px;color:#63798b;line-height:1.55}
.smart-fill-source{
  width:100%;
  min-height:128px;
  resize:vertical;
  border-radius:2px!important;
  line-height:1.55;
  box-sizing:border-box;
}
.smart-fill-controls{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px}
.smart-fill-controls button{
  border-radius:2px!important;
  min-height:38px;
  padding:8px 12px;
}
.smart-fill-analyze{background:#113dee!important;color:#fff!important;border-color:#113dee!important}
.smart-fill-mic.is-listening{background:#fff1f1!important;color:#bd1e1e!important;border-color:rgba(189,30,30,.28)!important}
.smart-fill-overwrite{
  display:inline-flex!important;align-items:center;gap:7px;margin:0 0 0 auto!important;
  font-size:12px;font-weight:700;color:#526a7b
}
.smart-fill-overwrite input{width:auto!important}
.smart-fill-status{min-height:20px;margin-top:10px;font-size:13px;font-weight:800;color:#31536c}
.smart-fill-results{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.smart-result-chip{
  display:inline-flex;align-items:center;gap:4px;padding:6px 8px;border:1px solid rgba(90,120,145,.18);
  border-radius:2px;background:#fff;font-size:12px;color:#40586b;max-width:100%;overflow-wrap:anywhere
}
.smart-result-chip[data-level="high"]{border-left:2px solid #168449}
.smart-result-chip[data-level="medium"]{border-left:2px solid #a66b00}
.smart-result-chip[data-level="low"]{border-left:2px solid #a34949}
.smart-result-chip small{opacity:.65}
.smart-fill-privacy{font-size:11px;color:#7a8c99;margin:9px 0 0;line-height:1.5}
.smart-auto-filled{
  position:relative;
}
.smart-auto-filled::after{
  content:attr(data-smart-confidence);
  display:inline-block;
  margin:4px 0 0;
  padding:2px 5px;
  font-size:10px;
  font-weight:800;
  color:var(--smart-conf,#168449);
  background:#fff;
  border-left:2px solid var(--smart-conf,#168449);
}
.smart-auto-filled input,
.smart-auto-filled textarea,
.smart-auto-filled select{
  box-shadow:inset 2px 0 0 var(--smart-conf,#168449)!important;
}
@media(max-width:700px){
 .smart-profile-fill{padding:12px}
 .smart-fill-controls{align-items:stretch}
 .smart-fill-controls button{flex:1 1 calc(50% - 5px)}
 .smart-fill-overwrite{width:100%;margin-left:0!important}
}

/* v2.5.16: Smart Fill must always be visible on candidate/employer forms. */
.smart-profile-fill-visible{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  width:100%!important;
  box-sizing:border-box!important;
}
.smart-profile-fill-visible .smart-fill-source{
  display:block!important;
  width:100%!important;
}
.smart-profile-fill-visible .smart-fill-controls{
  display:flex!important;
}

/* v2.5.17 microphone state */
.smart-fill-mic.is-listening{
  position:relative;
  padding-left:30px!important;
}
.smart-fill-mic.is-listening::before{
  content:"";
  position:absolute;
  left:10px;
  top:50%;
  width:9px;height:9px;
  margin-top:-4.5px;
  border-radius:50%!important;
  background:#d32323;
  animation:v365MicPulse 1s ease-in-out infinite;
}
@keyframes v365MicPulse{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1.25)}}
