/* PressFly professional flat UI layer
 * A low-risk final visual pass shared by public, member, auth and admin layouts.
 * It deliberately avoids business-specific component geometry and theme colors.
 */
:root{
    --pf-ui-radius-xs:6px;
    --pf-ui-radius-sm:9px;
    --pf-ui-radius:12px;
    --pf-ui-radius-lg:16px;
    --pf-ui-border:#e5e9f0;
    --pf-ui-border-strong:#d8dee8;
    --pf-ui-surface:#fff;
    --pf-ui-surface-soft:#f7f9fc;
    --pf-ui-text:#172033;
    --pf-ui-muted:#667085;
    --pf-ui-focus:rgba(59,130,246,.22);
    --pf-ui-shadow:0 1px 2px rgba(16,24,40,.04),0 7px 22px rgba(16,24,40,.055);
    --pf-ui-shadow-hover:0 2px 4px rgba(16,24,40,.05),0 10px 28px rgba(16,24,40,.075);
    --pf-ui-fast:160ms ease;
}

html{scroll-behavior:smooth;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
body{color:var(--pf-ui-text)}
img,video,iframe{max-width:100%}
button,input,select,textarea{font:inherit}

/* Accessible keyboard focus without changing mouse interactions. */
a:focus-visible,button:focus-visible,[role="button"]:focus-visible,summary:focus-visible,
input:focus-visible,select:focus-visible,textarea:focus-visible,.form-control:focus,.form-select:focus{
    outline:0!important;
    box-shadow:0 0 0 3px var(--pf-ui-focus)!important;
}

/* Consistent flat controls. */
.form-control,.form-select,.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple{
    border-color:var(--pf-ui-border-strong);
    border-radius:var(--pf-ui-radius-sm);
    min-height:42px;
    transition:border-color var(--pf-ui-fast),box-shadow var(--pf-ui-fast),background-color var(--pf-ui-fast);
}
textarea.form-control{min-height:110px}
.form-control::placeholder{color:#98a2b3;opacity:1}
.form-control:disabled,.form-select:disabled{cursor:not-allowed;opacity:.7}

.btn,.pf-btn{
    border-radius:var(--pf-ui-radius-sm)!important;
    font-weight:650;
    letter-spacing:0;
    box-shadow:none!important;
    transition:transform var(--pf-ui-fast),background-color var(--pf-ui-fast),border-color var(--pf-ui-fast),opacity var(--pf-ui-fast)!important;
}
.btn:hover,.pf-btn:hover{transform:translateY(-1px)}
.btn:active,.pf-btn:active{transform:none}

/* Common surfaces: flatter, cleaner, and more predictable. */
.card,.widget,.pf-form-card,.pf-admin-card,.pf-soft-box,.auth-content,
.pf-member-content .card,.pf-member-menu .list-group-item{
    border-color:var(--pf-ui-border)!important;
}
.card,.pf-form-card,.pf-admin-card,.auth-content{
    border-radius:var(--pf-ui-radius-lg)!important;
    box-shadow:var(--pf-ui-shadow)!important;
}
.card-header,.card-footer,.pf-card-header{
    border-color:var(--pf-ui-border)!important;
}
.table{--bs-table-border-color:var(--pf-ui-border)}
.table>thead>tr>th{font-weight:700;color:#475467;vertical-align:middle}
.table>tbody>tr>td{vertical-align:middle}
.table-responsive{border-radius:var(--pf-ui-radius);overflow-x:auto;-webkit-overflow-scrolling:touch}

/* Admin: remove legacy heavy visual weight while retaining hierarchy. */
body.pf-admin-flat .content-wrapper{background:#f6f8fb}
body.pf-admin-flat .main-header{border-bottom:1px solid var(--pf-ui-border)!important;box-shadow:none!important}
body.pf-admin-flat .main-sidebar{box-shadow:none!important;border-right:1px solid rgba(148,163,184,.16)}
body.pf-admin-flat .card,body.pf-admin-flat .pf-form-card,body.pf-admin-flat .pf-admin-card{
    overflow:clip;
}
body.pf-admin-flat .content-header h1,body.pf-admin-flat .pf-admin-page-head h1,
body.pf-admin-flat .pf-admin-page-head h2{letter-spacing:-.025em;font-weight:750}
body.pf-admin-flat .nav-sidebar .nav-link{border-radius:9px;margin:2px 8px;width:auto}

/* Member area. */
body[class*="member-"] .pf-member-content{min-width:0}
body[class*="member-"] .pf-member-menu .list-group-item{transition:background-color var(--pf-ui-fast),border-color var(--pf-ui-fast),transform var(--pf-ui-fast)}
body[class*="member-"] .pf-member-menu .list-group-item:hover{transform:translateY(-1px)}

/* Auth pages are deliberately compact and distraction-free. */
body .auth{max-width:420px;padding:0 14px}
body .auth-content{padding:clamp(20px,4vw,30px)}
body .auth-title{font-size:clamp(27px,6vw,36px);font-weight:750;letter-spacing:-.035em}

/* Public cards and article widgets get only a restrained elevation. */
body:not(.pf-admin-flat) .widget,
body.homepage .pf-news-card,
body.homepage .pf-latest-news-item,
body.article-show .article-content-column>.col-inner{
    border-color:var(--pf-ui-border)!important;
}
body.homepage .pf-news-card,body.homepage .pf-latest-news-item{
    transition:transform var(--pf-ui-fast),box-shadow var(--pf-ui-fast),border-color var(--pf-ui-fast);
}
@media (hover:hover){
    body.homepage .pf-news-card:hover,body.homepage .pf-latest-news-item:hover{
        transform:translateY(-2px);
        box-shadow:var(--pf-ui-shadow-hover);
    }
}

/* Empty states and muted helper copy stay readable. */
.text-muted,.form-text,.help-block,small.text-muted{color:var(--pf-ui-muted)!important}
.alert{border-radius:var(--pf-ui-radius);border-width:1px}
.badge,.pf-pill{letter-spacing:0}

/* Prevent long content from breaking cards/tables on mobile. */
.card,.card-body,.widget,.pf-form-card,.pf-admin-card,.pf-member-content,
.table td,.table th{min-width:0}
.card-body,.widget,.pf-form-card{overflow-wrap:anywhere}

/* Dark mode values are intentionally neutral and compatible with existing theme rules. */
html.dark-mode-site,html[data-theme="dark"]{
    --pf-ui-border:#273244;
    --pf-ui-border-strong:#344054;
    --pf-ui-surface:#111827;
    --pf-ui-surface-soft:#0f172a;
    --pf-ui-text:#e5e7eb;
    --pf-ui-muted:#9ca3af;
    --pf-ui-focus:rgba(96,165,250,.3);
    --pf-ui-shadow:0 1px 2px rgba(0,0,0,.16),0 8px 24px rgba(0,0,0,.16);
    --pf-ui-shadow-hover:0 2px 5px rgba(0,0,0,.2),0 12px 30px rgba(0,0,0,.2);
}
html.dark-mode-site body.pf-admin-flat .content-wrapper,html[data-theme="dark"] body.pf-admin-flat .content-wrapper{background:#0b1220}
html.dark-mode-site .table>thead>tr>th,html[data-theme="dark"] .table>thead>tr>th{color:#cbd5e1}
html.dark-mode-site .form-control::placeholder,html[data-theme="dark"] .form-control::placeholder{color:#64748b}

/* Motion accessibility. */
@media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

@media (max-width:767.98px){
    .btn,.pf-btn{min-height:40px}
    .card,.pf-form-card,.pf-admin-card,.auth-content{border-radius:var(--pf-ui-radius)!important}
    .table-responsive{margin-bottom:0}
}