| @@ -42,11 +42,11 @@ | ||
| 42 | 42 | align-items: center; /* Default value, overridden by Elementor control */ |
| 43 | 43 | flex-wrap: wrap; |
| 44 | 44 | } |
| 45 | 45 | |
| 46 | -.king-addons-logo-position-center .king-addons-center-logo-placeholder { | |
| 46 | +/* .king-addons-logo-position-center .king-addons-center-logo-placeholder { | |
| 47 | 47 | display: none; |
| 48 | -} | |
| 48 | +} */ | |
| 49 | 49 | |
| 50 | 50 | .king-addons-center-logo-inserted { |
| 51 | 51 | display: flex; |
| 52 | 52 | align-items: center; |
| @@ -744,24 +744,13 @@ | ||
| 744 | 744 | .king-addons-menu-items > li > .king-addons-submenu { |
| 745 | 745 | transform: none !important; |
| 746 | 746 | } |
| 747 | 747 | |
| 748 | - /* Responsive Logo Positioning - Mobile */ | |
| 749 | 748 | |
| 750 | - /* Left position on mobile */ | |
| 751 | - .king-addons-logo-position-mobile-left .king-addons-center-logo-placeholder { | |
| 752 | - display: none; | |
| 753 | - } | |
| 754 | - | |
| 755 | 749 | .king-addons-logo-position-mobile-left .king-addons-mega-menu-logo { |
| 756 | 750 | order: -2; /* Before mobile toggle */ |
| 757 | 751 | } |
| 758 | 752 | |
| 759 | - /* Right position on mobile */ | |
| 760 | - .king-addons-logo-position-mobile-right .king-addons-center-logo-placeholder { | |
| 761 | - display: none; | |
| 762 | - } | |
| 763 | - | |
| 764 | 753 | .king-addons-logo-position-mobile-right .king-addons-mega-menu-logo { |
| 765 | 754 | order: 2; /* After mobile toggle */ |
| 766 | 755 | margin-left: auto; |
| 767 | 756 | } |
| @@ -766,28 +755,82 @@ | ||
| 766 | 755 | margin-left: auto; |
| 767 | 756 | } |
| 768 | 757 | |
| 769 | 758 | /* Center position on mobile */ |
| 759 | + .king-addons-mega-menu .king-addons-center-logo-placeholder { | |
| 760 | + display: flex; /* default hidden on mobile */ | |
| 761 | + order: 1; /* place between left area and the toggle */ | |
| 762 | + flex: 1 1 auto; /* fill all available space up to the toggle */ | |
| 763 | + align-items: center; | |
| 764 | + margin: 0; /* remove extra spacing that pushed it to a new line */ | |
| 765 | + min-width: 0; /* allow contents to shrink within the row */ | |
| 766 | + } | |
| 767 | + | |
| 768 | + /* Show placeholder only when mobile center is selected and align it */ | |
| 770 | 769 | .king-addons-logo-position-mobile-center .king-addons-center-logo-placeholder { |
| 771 | - display: block; | |
| 772 | - order: -3; /* Top of mobile layout */ | |
| 773 | - text-align: center; | |
| 774 | - margin-bottom: 10px; | |
| 770 | + display: flex; | |
| 775 | 771 | } |
| 772 | + .king-addons-logo-position-mobile-left .king-addons-center-logo-placeholder { | |
| 773 | + justify-content: flex-start; | |
| 774 | + } | |
| 775 | + .king-addons-logo-position-mobile-center .king-addons-center-logo-placeholder { | |
| 776 | + justify-content: center; | |
| 777 | + } | |
| 778 | + .king-addons-logo-position-mobile-right .king-addons-center-logo-placeholder { | |
| 779 | + justify-content: flex-end; | |
| 780 | + } | |
| 776 | 781 | |
| 777 | 782 | .king-addons-center-logo-inserted { |
| 778 | 783 | display: none; /* Hide JavaScript-inserted logo on mobile when center */ |
| 779 | 784 | } |
| 780 | 785 | |
| 786 | + .king-addons-logo-position-mobile-left { | |
| 787 | + justify-content: flex-start; | |
| 788 | + } | |
| 789 | + | |
| 790 | + .king-addons-logo-position-mobile-center { | |
| 791 | + justify-content: center; | |
| 792 | + } | |
| 793 | + | |
| 794 | + .king-addons-logo-position-mobile-right { | |
| 795 | + justify-content: flex-end; | |
| 796 | + } | |
| 797 | + | |
| 781 | 798 | } |
| 782 | 799 | |
| 800 | +@media (min-width: 1025px) { | |
| 801 | + .king-addons-logo-position-mobile-center .king-addons-center-logo-placeholder, | |
| 802 | + .king-addons-logo-position-tablet-center .king-addons-center-logo-placeholder, | |
| 803 | + .king-addons-logo-position-center .king-addons-center-logo-placeholder, | |
| 804 | + .king-addons-logo-position-tablet-left .king-addons-center-logo-placeholder, | |
| 805 | + .king-addons-logo-position-tablet-right .king-addons-center-logo-placeholder, | |
| 806 | + .king-addons-logo-position-mobile-left .king-addons-center-logo-placeholder, | |
| 807 | + .king-addons-logo-position-mobile-right .king-addons-center-logo-placeholder { | |
| 808 | + display: none; | |
| 809 | + } | |
| 810 | +} | |
| 811 | + | |
| 783 | 812 | /* Responsive Logo Positioning - Tablet */ |
| 784 | 813 | @media (min-width: 768px) and (max-width: 1024px) { |
| 785 | 814 | |
| 815 | + | |
| 816 | + .king-addons-logo-position-tablet-left { | |
| 817 | + justify-content: flex-start; | |
| 818 | + } | |
| 819 | + | |
| 820 | + .king-addons-logo-position-tablet-center { | |
| 821 | + justify-content: center; | |
| 822 | + } | |
| 823 | + | |
| 824 | + .king-addons-logo-position-tablet-right { | |
| 825 | + justify-content: flex-end; | |
| 826 | + } | |
| 827 | + | |
| 828 | + | |
| 786 | 829 | /* Left position on tablet */ |
| 787 | - .king-addons-logo-position-tablet-left .king-addons-center-logo-placeholder { | |
| 830 | + /* .king-addons-logo-position-tablet-left .king-addons-center-logo-placeholder { | |
| 788 | 831 | display: none; |
| 789 | - } | |
| 832 | + } */ | |
| 790 | 833 | |
| 791 | 834 | .king-addons-logo-position-tablet-left .king-addons-mega-menu-logo { |
| 792 | 835 | order: -1; |
| 793 | 836 | margin-right: auto; |
| @@ -793,11 +836,11 @@ | ||
| 793 | 836 | margin-right: auto; |
| 794 | 837 | } |
| 795 | 838 | |
| 796 | 839 | /* Right position on tablet */ |
| 797 | - .king-addons-logo-position-tablet-right .king-addons-center-logo-placeholder { | |
| 840 | + /* .king-addons-logo-position-tablet-right .king-addons-center-logo-placeholder { | |
| 798 | 841 | display: none; |
| 799 | - } | |
| 842 | + } */ | |
| 800 | 843 | |
| 801 | 844 | .king-addons-logo-position-tablet-right .king-addons-mega-menu-logo { |
| 802 | 845 | order: 1; |
| 803 | 846 | margin-left: auto; |
| @@ -803,18 +846,41 @@ | ||
| 803 | 846 | margin-left: auto; |
| 804 | 847 | } |
| 805 | 848 | |
| 806 | 849 | /* Center position on tablet - center within bar (not between items) */ |
| 807 | - .king-addons-logo-position-tablet-center .king-addons-center-logo-placeholder { | |
| 850 | + /* .king-addons-logo-position-tablet-center .king-addons-center-logo-placeholder { | |
| 808 | 851 | display: block; |
| 809 | 852 | position: absolute; |
| 810 | 853 | left: 50%; |
| 811 | 854 | transform: translateX(-50%); |
| 812 | 855 | margin: 0; |
| 813 | - } | |
| 856 | + } */ | |
| 814 | 857 | .king-addons-logo-position-tablet-center .king-addons-center-logo-inserted { |
| 815 | 858 | display: none !important; |
| 816 | 859 | } |
| 860 | + | |
| 861 | + /* Default hide placeholder on tablet */ | |
| 862 | + /* .king-addons-center-logo-placeholder { | |
| 863 | + display: none; | |
| 864 | + } */ | |
| 865 | + | |
| 866 | + /* On tablet, when using center layout, place the placeholder in the bar and align by control */ | |
| 867 | + .king-addons-logo-position-tablet-center .king-addons-center-logo-placeholder { | |
| 868 | + display: flex; | |
| 869 | + order: 1; | |
| 870 | + flex: 1 1 auto; | |
| 871 | + align-items: center; | |
| 872 | + min-width: 0; | |
| 873 | + } | |
| 874 | + .king-addons-logo-position-tablet-left .king-addons-center-logo-placeholder { | |
| 875 | + justify-content: flex-start; | |
| 876 | + } | |
| 877 | + .king-addons-logo-position-tablet-center .king-addons-center-logo-placeholder { | |
| 878 | + justify-content: center; | |
| 879 | + } | |
| 880 | + .king-addons-logo-position-tablet-right .king-addons-center-logo-placeholder { | |
| 881 | + justify-content: flex-end; | |
| 882 | + } | |
| 817 | 883 | } |
| 818 | 884 | |
| 819 | 885 | /* Additional Styles for Customization */ |
| 820 | 886 | .king-addons-mega-menu-horizontal .king-addons-menu-items > li.current-menu-item > a, |
| @@ -1069,9 +1135,9 @@ | ||
| 1069 | 1135 | width: 100%; |
| 1070 | 1136 | } |
| 1071 | 1137 | |
| 1072 | 1138 | /* Styles for logo alignment on mobile devices */ |
| 1073 | -.king-addons-logo-mobile-alignment-left { | |
| 1139 | +/* .king-addons-logo-mobile-alignment-left { | |
| 1074 | 1140 | justify-content: flex-start; |
| 1075 | 1141 | } |
| 1076 | 1142 | |
| 1077 | 1143 | .king-addons-logo-mobile-alignment-center { |
| @@ -1079,9 +1145,9 @@ | ||
| 1079 | 1145 | } |
| 1080 | 1146 | |
| 1081 | 1147 | .king-addons-logo-mobile-alignment-right { |
| 1082 | 1148 | justify-content: flex-end; |
| 1083 | -} | |
| 1149 | +} */ | |
| 1084 | 1150 | |
| 1085 | 1151 | /* Styles for hover effects */ |
| 1086 | 1152 | .king-addons-menu-items > li > a { |
| 1087 | 1153 | position: relative; |
| @@ -1612,9 +1678,9 @@ | ||
| 1612 | 1678 | box-sizing: border-box; |
| 1613 | 1679 | } |
| 1614 | 1680 | |
| 1615 | 1681 | /* Center logo in the bar on tablet/mobile (not between items) */ |
| 1616 | - .king-addons-logo-position-tablet-center .king-addons-center-logo-placeholder, | |
| 1682 | + /* .king-addons-logo-position-tablet-center .king-addons-center-logo-placeholder, | |
| 1617 | 1683 | .king-addons-logo-position-mobile-center .king-addons-center-logo-placeholder { |
| 1618 | 1684 | display: block; |
| 1619 | 1685 | position: absolute; |
| 1620 | 1686 | left: 50%; |
| @@ -1619,9 +1685,9 @@ | ||
| 1619 | 1685 | position: absolute; |
| 1620 | 1686 | left: 50%; |
| 1621 | 1687 | transform: translateX(-50%); |
| 1622 | 1688 | margin: 0; |
| 1623 | - } | |
| 1689 | + } */ | |
| 1624 | 1690 | |
| 1625 | 1691 | /* Hide JS-inserted center logo on tablet/mobile to avoid duplicates */ |
| 1626 | 1692 | .king-addons-logo-position-tablet-center .king-addons-center-logo-inserted, |
| 1627 | 1693 | .king-addons-logo-position-mobile-center .king-addons-center-logo-inserted { |
