/* Base navigation styles for desktop */
.ecadmcad-page-navigation {width: 100%; padding: 25px 0; background-color: #f8f9fa; border-top: 1px solid #e9ecef; margin-top: 30px; position: relative;}
.ecadmcad-nav-container { max-width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; padding: 0 20px;}
.ecadmcad-nav-item {display: flex; align-items: center; text-decoration: none; color: #212529; padding: 12px 16px; border-radius: 6px; transition: all 0.3s ease; position: relative; overflow: hidden;}
.ecadmcad-nav-item::after {content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 3px; background-color: #54c2c0; transform: translateY(3px); opacity: 0; transition: transform 0.3s ease, opacity 0.3s ease;}
.ecadmcad-nav-item:hover {background-color: rgba(84, 194, 192, 0.08); color: #102542;}
.ecadmcad-nav-item:hover::after { transform: translateY(0); opacity: 1;} 
.ecadmcad-nav-prev {justify-content: flex-start;}
.ecadmcad-nav-up {flex-direction: column; justify-content: center;}
.ecadmcad-nav-next {justify-content: flex-end;}
.ecadmcad-nav-icon {display: flex; align-items: center; justify-content: center; color: #3A5E8C; transition: transform 0.3s ease;}
.ecadmcad-nav-prev:hover .ecadmcad-nav-icon {transform: translateX(-5px);}
.ecadmcad-nav-next:hover .ecadmcad-nav-icon {transform: translateX(5px);}
.ecadmcad-nav-up:hover .ecadmcad-nav-icon {transform: translateY(-5px);}
.ecadmcad-nav-content {display: flex; flex-direction: column; margin: 0 10px;}
.ecadmcad-nav-label {font-size: 12px; color: #6c757d; margin-bottom: 3px; font-weight: 400;}
.ecadmcad-nav-title {font-weight: 500; font-size: 16px; color: #102542;}
.ecadmcad-nav-up .ecadmcad-nav-content {text-align: center; margin: 5px 0;}
.ecadmcad-pill-nav {display: none; position: relative; width: 100%; max-width: 300px; margin: 0 auto; }
.ecadmcad-pill-wrapper {display: flex; background-color: #fff; border-radius: 28px; padding: 4px; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); position: relative; z-index: 2;}
.ecadmcad-pill-btn {display: flex; align-items: center; justify-content: center; text-decoration: none; color: #3A5E8C; padding: 8px 12px; border-radius: 24px; transition: all 0.2s ease; flex: 1;}
.ecadmcad-pill-btn:hover, .ecadmcad-pill-btn:active {background-color: rgba(84, 194, 192, 0.1); color: #102542;}
.ecadmcad-pill-section {margin: 0 4px; background-color: #f8f9fa; color: #102542; flex: 2;}
.ecadmcad-pill-section span {margin-left: 6px; font-weight: 500; font-size: 14px;}
.ecadmcad-pill-tooltip {visibility: hidden; opacity: 0; position: absolute; top: -50px; left: 50%; transform: translateX(-50%); background-color: #fff; border-radius: 8px; padding: 8px 16px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15); transition: opacity 0.3s, visibility 0.3s, top 0.3s; z-index: 1; text-align: center; min-width: 200px; }
.ecadmcad-pill-tooltip::after {content: ''; position: absolute; top: 100%; left: 50%; margin-left: -8px; border-width: 8px; border-style: solid; border-color: #fff transparent transparent transparent;}
.ecadmcad-pill-tooltip-content {display: flex; flex-direction: column;}
.ecadmcad-pill-page-title {font-weight: 500; font-size: 14px; color: #102542;}
.ecadmcad-pill-section-title {font-size: 12px; color: #6c757d; margin-top: 2px;}
.ecadmcad-pill-section:hover + .ecadmcad-pill-tooltip, .ecadmcad-pill-section:focus + .ecadmcad-pill-tooltip, .ecadmcad-pill-tooltip:hover {visibility: visible; opacity: 1; top: -62px;}
.ecadmcad-nav-disabled, .ecadmcad-pill-btn.disabled {opacity: 0.4; cursor: not-allowed; pointer-events: none;}
.ecadmcad-nav-disabled:hover {background-color: transparent;}
.ecadmcad-nav-disabled::after {display: none;}
@media (max-width: 992px) {.ecadmcad-nav-container { padding: 0 15px; } .ecadmcad-nav-item {padding: 10px 14px; } .ecadmcad-nav-title {font-size: 15px;} }
@media (max-width: 768px) {.ecadmcad-page-navigation { padding: 15px 0; }
.ecadmcad-nav-container { display: none; }
.ecadmcad-pill-nav { display: block; } }
@media (max-width: 576px) { .ecadmcad-page-navigation { padding: 12px 0; } .ecadmcad-pill-wrapper { max-width: 250px; } .ecadmcad-pill-btn { padding: 6px 10px; } .ecadmcad-pill-section span { font-size: 13px; } .ecadmcad-pill-tooltip { min-width: 180px; } }
@media (max-width: 359px) { .ecadmcad-page-navigation { padding: 10px 0; } .ecadmcad-pill-wrapper { max-width: 200px; } .ecadmcad-pill-section span { display: none; } .ecadmcad-pill-btn { padding: 8px; } }