.btnLogin {
display:inline-flex;
align-items:center;
justify-content:center;
gap:0.5rem;
background-color:var(--mainColorA);
color:white;
font-weight:600;
text-decoration:none;
border-radius:var(--radius-md);
transition:background-color 0.3s ease;
padding:0.75rem 1.5rem
}
.btnLogin:hover { background-color:var(--subColorA) }

#modalLogin .modal {
width:450px;
border-radius:var(--radius-md);
overflow:hidden
}

.login-header {
text-align:center;
margin-bottom:1.5rem
}

.login-header h2 {
color:var(--mainColorA);
margin-bottom:0.5rem
}

.login-header p { margin:0 }

#loginForm,
#loginForm * { z-index:9999 }

#loginForm .formRow { margin-bottom:1.5rem }

#loginForm label {
display:block;
color:var(--mainColorA);
margin-bottom:0.5rem
}

#loginForm input {
width:100%;
border:1px solid #e0e0e0;
border-radius:var(--radius-sm);
transition:border-color 0.3s ease;
padding:0.75rem 1rem
}

#loginForm input:focus {
border-color:var(--subColorA);
outline:none
}

.login-actions {
display:flex;
justify-content:center;
margin:1.5rem 0
}

#submitLogin {
min-width:150px;
background-color:var(--subColorA)
}

#submitLogin:hover { background-color:var(--mainColorA) }

.login-links {
display:flex;
flex-direction:column;
align-items:center;
gap:1rem;
border-top:1px solid rgba(0, 0, 0, 0.1);
margin-top:1.5rem;
padding-top:1.5rem
}

.login-forgot {
color:#666;
font-size:0.9rem;
text-decoration:none;
transition:color 0.3s ease;
}

.login-forgot:hover {
color:var(--mainColorA);
}

.login-request {
position:relative;
text-decoration:none;
transition:color 0.3s ease;
color:var(--mainColorA)
}

.login-request::after {
position:absolute;
content:'';
width:100%;
height:2px;
background-color:var(--subColorA);
transform:scaleX(0);
transform-origin:right;
transition:transform 0.3s ease;
bottom:-3px;
left:0
}

.login-request:hover { color:var(--mainColorA) }

.login-request:hover::after {
transform:scaleX(1);
transform-origin:left;
background-color:var(--mainColorA)
}

.error-input {
border-color:#dc3545 !important;
box-shadow:0 0 0 0.2rem rgba(220, 53, 69, 0.25) !important;
}

.accesPro-container {
display:grid;
grid-template-areas:"header header" "sidebar main";
grid-template-rows:auto 1fr;
grid-template-columns:320px 1fr;
min-height:100vh;
gap:0
}

.accesPro-header {
position:sticky;
grid-area:header;
background:white;
box-shadow:var(--shadow);
z-index:100;
top:0;
padding:1.5rem 2rem
}

.accesPro-header-content {
display:flex;
justify-content:space-between;
align-items:center;
max-width:1400px;
margin:0 auto
}

.accesPro-title {
display:flex;
align-items:center;
gap:1rem
}

.accesPro-title i {
font-size:2rem;
color:var(--mainColorA)
}

.accesPro-title h1 {
font-size:1.8rem;
font-weight:700;
color:var(--black);
line-height:1;
margin:0
}

.accesPro-search-container {
position:relative;
max-width:400px;
flex:1;
margin:0 2rem
}

.accesPro-search {
width:100%;
border:2px solid #e9ecef;
border-radius:var(--radius);
font-size:1rem;
transition:var(--transition);
padding:0.75rem 1rem 0.75rem 3rem
}

.accesPro-search:focus {
outline:none;
border-color:var(--mainColorA);
box-shadow:0 0 0 3px rgba(139, 197, 64, 0.1)
}

.accesPro-search-icon {
position:absolute;
transform:translateY(-50%);
color:var(--subColorB);
font-size:1.1rem;
left:1rem;
top:50%
}

.accesPro-stats {
display:flex;
align-items:center;
gap:1.5rem;
font-size:0.9rem;
color:var(--subColorB)
}

.accesPro-stats strong {
color:var(--mainColorA);
font-weight:600
}

.accesPro-sidebar {
position:sticky;
grid-area:sidebar;
background:white;
box-shadow:var(--shadow);
overflow-y:auto;
height:calc(100vh - 90px);
top:90px;
padding:2rem
}

.accesPro-filters h3 {
display:flex;
align-items:center;
font-size:1.1rem;
font-weight:600;
color:var(--black);
gap:0.5rem;
margin-bottom:1rem
}

.accesPro-category-list { list-style:none }

.accesPro-category-item { margin-bottom:0.5rem }

.accesPro-category-btn {
display:flex;
align-items:center;
justify-content:space-between;
width:100%;
background:transparent;
border:1px solid #e9ecef;
border-radius:8px;
cursor:pointer;
transition:var(--transition);
text-align:left;
font-size:0.9rem;
padding:0.75rem 1rem
}

.accesPro-category-btn:hover {
background:var(--subColorA);
border-color:white
}

.accesPro-category-btn.active {
background:var(--mainColorA);
color:white;
border-color:var(--mainColorA)
}

.accesPro-category-info {
display:flex;
align-items:center;
gap:0.5rem
}

.accesPro-category-count {
background:rgba(139, 197, 64, 0.1);
color:var(--mainColorA);
border-radius:12px;
font-size:0.75rem;
font-weight:600;
padding:0.2rem 0.5rem
}

.accesPro-category-btn.active .accesPro-category-count {
background:rgba(255, 255, 255, 0.2);
color:white
}

.accesPro-divider {
height:1px;
background:#e9ecef;
margin:1.5rem 0
}

.accesPro-sort-section h4 {
font-size:1rem;
font-weight:600;
color:var(--black);
margin-bottom:0.75rem
}

.accesPro-sort-select {
width:100%;
border:1px solid #e9ecef;
border-radius:6px;
font-size:0.9rem;
background:white;
cursor:pointer;
padding:0.5rem
}

.accesPro-sort-select:focus {
outline:none;
border-color:var(--mainColorA)
}

.accesPro-main {
grid-area:main;
padding:3rem
}

.accesPro-toolbar {
display:flex;
justify-content:space-between;
align-items:center;
background:white;
border-radius:var(--radius);
box-shadow:var(--shadow);
margin-bottom:2rem;
padding:1rem
}

.accesPro-toolbar-left {
display:flex;
align-items:center;
gap:1rem
}

.accesPro-view-toggle {
display:flex;
background:var(--mainColorB);
border-radius:6px;
padding:0.25rem
}

.accesPro-view-btn {
background:transparent;
border:none;
border-radius:4px;
cursor:pointer;
transition:var(--transition);
padding:0.5rem 0.75rem
}

.accesPro-view-btn.active {
background:white;
color:var(--mainColorA);
box-shadow:0 1px 3px rgba(0,0,0,0.1)
}

.accesPro-results-info {
color:var(--subColorB);
font-size:0.9rem
}

.accesPro-files-grid {
display:grid;
grid-template-columns:repeat(auto-fill, minmax(320px, 1fr));
gap:2.5rem;
margin-bottom:2rem
}

.accesPro-file-card {
position:relative;
display:flex;
flex-direction:column;
background:white;
border-radius:var(--radius);
box-shadow:var(--shadow);
transition:var(--transition);
overflow:hidden;
height:100%
}

.accesPro-file-card:hover {
transform:translateY(-2px);
box-shadow:var(--shadow-hover)
}

.accesPro-file-header {
border-bottom:1px solid #f1f3f4;
flex:1;
padding:1.5rem
}

.accesPro-file-icon-title {
display:flex;
align-items:flex-start;
gap:1rem;
margin-bottom:1rem
}

.accesPro-file-icon {
display:flex;
align-items:center;
justify-content:center;
flex-shrink:0;
width:48px;
height:48px;
background:var(--extraColorA);
border-radius:8px
}

.accesPro-file-icon i {
color:white;
font-size:1.5rem
}

.accesPro-file-info h4 {
display:-webkit-box;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
overflow:hidden;
font-size:1.1rem;
font-weight:600;
color:var(--black);
line-height:1.3;
min-height:2.6rem;
margin-bottom:0.5rem
}

.accesPro-file-category {
display:inline-block;
background:rgba(139, 197, 64, 0.1);
color:var(--mainColorA);
border-radius:12px;
font-size:0.75rem;
font-weight:500;
padding:0.25rem 0.75rem
}

.accesPro-file-description {
display:-webkit-box;
color:var(--subColorB);
font-size:0.9rem;
line-height:1.4;
min-height:3.2rem;
-webkit-line-clamp:2;
-webkit-box-orient:vertical;
overflow:hidden;
margin:1rem 0
}

.accesPro-file-meta {
display:grid;
grid-template-columns:1fr 1fr;
gap:1rem;
margin-bottom:1rem
}

.accesPro-meta-item {
display:flex;
align-items:center;
gap:0.5rem;
font-size:0.8rem;
color:var(--subColorB)
}

.accesPro-meta-item i {
color:var(--mainColorA);
width:14px
}

.accesPro-file-actions {
padding:1rem 1.5rem;
background:var(--mainColorA);
display:flex;
gap:0.75rem;
margin-top:auto
}

.accesPro-btn {
display:inline-flex;
align-items:center;
justify-content:center;
border-radius:6px;
font-size:0.85rem;
font-weight:500;
text-decoration:none;
transition:var(--transition);
cursor:pointer;
border:none;
gap:0.5rem;
flex:1;
padding:0.5rem 1rem
}

.accesPro-btn-primary {
background:var(--mainColorB);
color:white;
border:1px solid var(--mainColorB)
}

.accesPro-btn-primary:hover {
background:var(--extraColorB);
border:1px solid white;
color:white
}

.accesPro-btn-secondary {
background:white;
color:var(--extraColorA);
border:1px solid white
}

.accesPro-btn-secondary:hover {
background:var(--extraColorB);
border:1px solid white;
color:white
}

.accesPro-files-list {
display:none;
background:white;
overflow:hidden;
border-radius:var(--radius);
box-shadow:var(--shadow)
}

.accesPro-files-list.active { display:block }

.accesPro-list-header {
display:grid;
grid-template-columns:3fr 1fr 1fr 1fr 150px;
gap:1rem;
background:var(--mainColorA);
font-weight:600;
font-size:0.9rem;
color:var(--black);
padding:1rem 1.5rem
}

.accesPro-list-item {
display:grid;
grid-template-columns:3fr 1fr 1fr 1fr 150px;
gap:1rem;
border-bottom:1px solid #f1f3f4;
align-items:center;
transition:var(--transition);
padding:1rem 1.5rem
}

.accesPro-list-item > div {
font-size:0.9rem;
color:var(--black);
line-height:1.4
}

.accesPro-list-item > div:nth-child(2),
.accesPro-list-item > div:nth-child(3),
.accesPro-list-item > div:nth-child(4) {
font-size:0.85rem;
color:var(--subColorB);
}

.accesPro-list-item:hover { background:#ddd }

.accesPro-list-file-info {
display:flex;
align-items:center;
gap:1rem
}

.accesPro-list-file-info h4 {
font-size:1rem;
font-weight:600;
color:var(--black);
margin:0
}

.accesPro-list-file-info small {
display:block;
font-size:0.8rem;
color:var(--subColorB);
margin-top:0.2rem
}

.accesPro-list-icon {
display:flex;
align-items:center;
justify-content:center;
width:32px;
height:32px;
background:var(--mainColorA);
border-radius:6px;
color:white;
font-size:1rem;
flex-shrink:0
}

.accesPro-list-actions {
display:flex;
gap:0.5rem
}

.accesPro-list-actions .accesPro-btn {
font-size:0.75rem;
flex:none;
padding:0.25rem 0.5rem
}

.accesPro-empty-state {
text-align:center;
color:var(--subColorB);
padding:4rem 2rem
}

.accesPro-empty-state i {
font-size:4rem;
color:#e9ecef;
margin-bottom:1rem
}

.accesPro-empty-state h3 {
font-size:1.2rem;
color:var(--black);
margin-bottom:0.5rem
}

@keyframes fadeIn {
	from { opacity:0; transform:translateY(10px) }
	to { opacity:1; transform:translateY(0) }
}

.accesPro-file-card { animation:fadeIn 0.3s ease-out }

.accesPro-sr-only {
position:absolute;
width:1px;
height:1px;
overflow:hidden;
clip:rect(0, 0, 0, 0);
white-space:nowrap;
border:0;
margin:-1px;
padding:0
}

.accesPro-btn:focus-visible,
.accesPro-category-btn:focus-visible,
.accesPro-search:focus-visible {
outline:2px solid var(--mainColorA);
outline-offset:2px
}

.accesPro-loading {
text-align:center;
color:var(--subColorB);
padding:2rem
}

.accesPro-loading i {
font-size:2rem;
animation:spin 1s linear infinite
}

@keyframes spin {
	from { transform:rotate(0deg) }
	to { transform:rotate(360deg) }
}