@media (min-width: 992px){
    .typo-line{
        padding-left: 140px;
        margin-bottom: 40px;
        position: relative;
    }

    .typo-line .category{
        transform: translateY(-50%);
        top: 50%;
        left: 0px;
        position: absolute;
    }
}

.icon-section {
	margin: 0 0 3em;
	clear: both;
	overflow: hidden;
}
.icon-container {
	width: 240px;
	padding: .7em 0;
	float: left;
	position: relative;
	text-align: left;
}
.icon-container [class^="ti-"],
.icon-container [class*=" ti-"] {
	color: #000;
	position: absolute;
	margin-top: 3px;
	transition: .3s;
}
.icon-container:hover [class^="ti-"],
.icon-container:hover [class*=" ti-"] {
	font-size: 2.2em;
	margin-top: -5px;
}
.icon-container:hover .icon-name {
	color: #000;
}
.icon-name {
	color: #aaa;
	margin-left: 35px;
	font-size: .8em;
	transition: .3s;
}
.icon-container:hover .icon-name {
	margin-left: 45px;
}

.places-buttons .btn{
    margin-bottom: 30px
}
.sidebar .nav > li.active-pro{
    position: absolute;
    width: 100%;
    bottom: 10px;
}
.sidebar .nav > li.active-pro a{
    background: rgba(255, 255, 255, 0.14);
    opacity: 1;
    color: #FFFFFF;
}

.table-upgrade td:nth-child(2),
.table-upgrade td:nth-child(3){
    text-align: center;
}
body.nude{
    background-color: #f4f3ef;
}

/* ============================================================
   Ficha Personal — Left Vertical Tabs Overhaul
   ============================================================ */

.left-vertical-tabs {
    width: 200px;
    float: left;
    background: #f8f7f4;
    border-right: 1px solid #e2ddd8;
    border-radius: 4px 0 0 4px;
    min-height: 360px;
}

.right-text-tabs {
    width: calc(100% - 200px);
    float: left;
    padding: 10px 20px 16px;
}

.nav-stacked {
    border-right: none !important;
    padding: 10px 0;
    margin-bottom: 0;
}

.nav-stacked > li > a {
    color: #7c7268;
    padding: 11px 16px;
    text-align: left;
    font-size: 13px;
    font-weight: 500;
    border-left: 3px solid transparent;
    border-radius: 0;
    display: flex;
    align-items: center;
    gap: 9px;
    transition: background 0.15s, color 0.15s, border-color 0.15s;
    position: relative;
}

.nav-stacked > li > a i {
    font-size: 14px;
    width: 16px;
    text-align: center;
    flex-shrink: 0;
    opacity: 0.75;
}

.nav-stacked > li > a:hover {
    background: #eceae6;
    color: #2f4858;
    border-left-color: #9ab3c0;
    text-decoration: none;
}

.nav-stacked > li > a:hover i {
    opacity: 1;
}

.nav-stacked > li.active > a {
    background: #2f4858;
    color: #ffffff !important;
    border-left-color: #6db8d8;
    font-weight: 600;
}

.nav-stacked > li.active > a i {
    opacity: 1;
    color: #fff;
}

/* Remove old arrow pseudo-elements */
.nav-stacked > li.active > a:after,
.nav-stacked > li.active > a:before {
    display: none !important;
}

.nav-stacked > li.active:after,
.nav-stacked > li.active:before {
    display: none !important;
}

/* ============================================================
   Ficha Personal — Profile Header
   ============================================================ */

.ficha-header {
    padding: 28px 32px 24px;
    border-bottom: 1px solid #ece8e2;
    border-left: 6px solid #2f4858;
    background: linear-gradient(135deg, #f9f8f5 0%, #ffffff 100%);
    margin-bottom: 4px;
}

.ficha-header .ficha-nombre {
    margin: 0 0 4px 0;
    font-size: 22px;
    font-weight: 700;
    color: #1e2d3a;
    line-height: 1.3;
    letter-spacing: -0.2px;
}

.ficha-header .ficha-meta {
    margin: 0;
    font-size: 12px;
    color: #8a9aaa;
    font-weight: 500;
    letter-spacing: 0.02em;
}

/* ============================================================
   Ficha Personal — Display Fields (antecedentes)
   ============================================================ */

.campo-ficha label {
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.07em !important;
    color: #a09488 !important;
    margin-bottom: 3px !important;
    display: block;
}

.campo-ficha .form-control {
    background: transparent !important;
    border: none !important;
    border-bottom: 1px solid #dedad5 !important;
    border-radius: 0 !important;
    padding: 5px 0 4px 0 !important;
    font-size: 13.5px !important;
    color: #2c3e50 !important;
    font-weight: 500 !important;
    box-shadow: none !important;
    height: auto !important;
}

.campo-ficha .form-control:focus {
    border-bottom-color: #2f4858 !important;
    box-shadow: none !important;
}

.campo-valor-texto {
    display: block;
    padding: 5px 0 4px 0;
    font-size: 13.5px;
    color: #2c3e50;
    font-weight: 600;
    border-bottom: 1px solid #dedad5;
    line-height: 1.4;
}

/* ============================================================
   Ficha Personal — Section Title Inside Tabs
   ============================================================ */

.seccion-titulo {
    font-size: 12px;
    font-weight: 700;
    color: #2f4858;
    text-transform: uppercase;
    letter-spacing: 0.07em;
    border-left: 4px solid #2f4858;
    padding-left: 12px;
    margin: 0 0 20px 0;
    line-height: 1.4;
}

/* ============================================================
   Admin — Action Buttons (tables)
   ============================================================ */

.admin-action-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 6px;
    font-size: 14px;
    text-decoration: none !important;
    margin: 0 3px;
    transition: background 0.15s, color 0.15s;
    border: none;
    cursor: pointer;
}

.admin-action-edit {
    color: #4a7fa5;
    background: #e4eff7;
}

.admin-action-edit:hover {
    background: #4a7fa5;
    color: #fff !important;
}

.admin-action-delete {
    color: #c0392b;
    background: #fbeae8;
}

.admin-action-delete:hover {
    background: #c0392b;
    color: #fff !important;
}

.admin-action-view {
    color: #2f7a5c;
    background: #e4f5ee;
}

.admin-action-view:hover {
    background: #2f7a5c;
    color: #fff !important;
}
