/* Leaf Arcade presentation for the original Freeciv client. */
:root { color-scheme: light; --leaf-ink: #162d25; --leaf-muted: #52665d; --leaf-accent: #146348; --leaf-line: #c9d6cf; --leaf-paper: #f5f8f6; }
html, body { margin: 0; font-family: system-ui, -apple-system, sans-serif; color: var(--leaf-ink); background: #07100d; }
.ui-widget, .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: inherit !important; font-size: 14px; }
.ui-widget-content, .ui-dialog, .ui-tabs, .ui-state-default, .ui-widget-header { background-image: none !important; }
.ui-widget-content { background-color: var(--leaf-paper) !important; color: var(--leaf-ink) !important; border-color: var(--leaf-line) !important; }
.ui-dialog { border: 1px solid var(--leaf-line) !important; border-radius: 12px !important; padding: 0 !important; box-shadow: 0 16px 48px #00190b55; }
.ui-dialog-titlebar { background: #e5eee9 !important; color: var(--leaf-ink) !important; border: 0 !important; border-bottom: 1px solid var(--leaf-line) !important; border-radius: 12px 12px 0 0 !important; padding: 12px 16px !important; }
.ui-dialog-title { font-size: 16px !important; font-weight: 650; }
.ui-dialog-titlebar-close { min-width: 44px; min-height: 44px; right: 6px !important; top: 50% !important; margin-top: -22px !important; }
.ui-dialog-content { padding: 16px !important; line-height: 1.5; }
.ui-dialog-buttonpane { background: #edf3ef !important; border-top: 1px solid var(--leaf-line) !important; padding: 10px 14px !important; margin: 0 !important; }
.ui-widget-overlay { background: #05170e !important; opacity: .55 !important; }
button, .ui-button, .button { box-sizing: border-box; min-height: 44px; border: 1px solid var(--leaf-line) !important; border-radius: 7px !important; background: #fff !important; color: var(--leaf-ink) !important; font-weight: 550; padding: 8px 12px; cursor: pointer; }
button:hover, .ui-button:hover { background: #e2eee7 !important; border-color: var(--leaf-accent) !important; }
button:disabled { cursor: default; opacity: .5; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible { outline: 3px solid #57b591 !important; outline-offset: 2px; }
input:not([type=checkbox]), select, textarea { box-sizing: border-box; min-height: 40px; border: 1px solid var(--leaf-line); border-radius: 5px; padding: 8px; background: #fff; color: var(--leaf-ink); max-width: 100%; }
#tabs { border: 0 !important; border-radius: 0 !important; padding: 0 !important; background: #07100d !important; }
#tabs_menu { background: #163c2d !important; border: 0 !important; border-radius: 0 !important; padding: 3px !important; }
#tabs_menu .ui-state-default { border: 0 !important; background: transparent !important; margin: 0 2px !important; }
#tabs_menu .ui-tabs-anchor { color: #e5f2e9 !important; font-size: 14px; padding: 10px 12px !important; }
#tabs_menu .ui-tabs-active { background: #eaf4ed !important; border-radius: 6px !important; }
#tabs_menu .ui-tabs-active .ui-tabs-anchor { color: var(--leaf-ink) !important; }
#freeciv_logo { background: none !important; width: 115px !important; }
#freeciv_logo::after { content: "Freeciv"; font-size: 23px; font-weight: 700; color: #fff; line-height: 40px; padding-left: 12px; }
#turn_done_button { background: #d4edda !important; border-color: #9fc8aa !important; color: #103523 !important; }
#tabs-map { padding: 0 !important; background: #000 !important; }
#game_status_panel_bottom { color: #e6f2e8 !important; text-shadow: 0 1px 2px #000; }
#game_text_input, #pregame_text_input { min-height: 36px; background: #fff !important; color: var(--leaf-ink) !important; }
#game_chatbox_panel, #game_unit_panel, #game_overview_panel { background: #10241c !important; color: #eaf3ed !important; }
#game_unit_panel .ui-widget-content { background: #10241c !important; color: #eaf3ed !important; }
#unit_text_details { background: #10241c !important; color: #eaf3ed !important; padding: 6px; }
#tabs-opt { overflow: auto; background: var(--leaf-paper) !important; color: var(--leaf-ink) !important; }
#tabs-opt h2 { margin: 20px 0; font-size: 24px; }
#tabs-opt table { border-collapse: collapse; max-width: 100%; }
.main_menu_buttons { margin: 12px; }
.setting_button { width: auto !important; max-width: 100%; min-width: 180px; }
#city_tabs { border: 0 !important; background: var(--leaf-paper) !important; }
#city_viewport, .city_panel, .citydlg_tabs { background-image: none !important; background-color: transparent !important; color: var(--leaf-ink) !important; }
#city_tabs > ul { background: #e5eee9 !important; border-color: var(--leaf-line) !important; }
#city_tabs .ui-tabs-anchor { color: var(--leaf-ink) !important; }
#city_dialog_info { background: #edf3ef !important; border-radius: 8px; padding: 12px; }
#city_improvements, #city_present_units, #city_supported_units { background: #e8f0eb !important; border: 1px solid var(--leaf-line) !important; }
#city_improvements_title, #city_present_units_title, #city_supported_units_title { background: #d6e6dc !important; color: var(--leaf-ink) !important; padding: 6px 8px; font-size: 13px; }
#city_improvements_list, #city_improvements_list *, #city_present_units_list, #city_supported_units_list { color: var(--leaf-ink) !important; }
.context-menu-list { max-width: calc(100vw - 24px) !important; max-height: 70vh; overflow: auto; background: #f5f8f6 !important; border: 1px solid var(--leaf-line) !important; border-radius: 8px; }
.context-menu-item { font-size: 16px !important; min-height: 44px; box-sizing: border-box; padding: 10px 16px !important; color: var(--leaf-ink) !important; }
.context-menu-item:hover { background: #d6e6dc !important; }
#leaf_save_status, #leaf_load_status { padding: 10px 0; color: var(--leaf-muted); }
#leaf_save_dialog button, #leaf_load_dialog button { margin: 4px 4px 4px 0; }
#tabs-hel { background: var(--leaf-paper) !important; background-image: none !important; color: var(--leaf-ink) !important; overflow: auto; padding: 16px !important; }
#help_menu { float: none !important; display: inline-block; vertical-align: top; width: 220px; max-width: 100%; background: #e5eee9 !important; background-image: none !important; color: var(--leaf-ink) !important; }
#help_menu .ui-menu-item-wrapper { min-height: 44px; box-sizing: border-box; padding: 10px 12px; }
#help_info_page { float: none !important; display: inline-block; vertical-align: top; width: calc(100% - 260px); max-width: none !important; box-sizing: border-box; padding: 0 20px !important; line-height: 1.6; }
#help_info_page img { max-width: 100%; }
.help_submenu { min-width: 220px; max-width: calc(100vw - 40px); background: var(--leaf-paper) !important; background-image: none !important; }
#help_info_page a { color: var(--leaf-accent); }
#leaf_manual_picker { display: none; }
@media (max-width: 700px) {
  .ui-widget, .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-size: 15px; }
  #tabs_menu { display: flex; align-items: center; flex-wrap: nowrap; gap: 0; overflow-x: auto; scrollbar-width: thin; }
  #tabs_menu .ui-state-default { flex: 0 0 44px; margin: 0 !important; min-width: 44px; }
  #tabs_menu .ui-tabs-anchor { min-height: 44px; width: 100%; box-sizing: border-box; padding: 10px 6px !important; text-align: center; }
  #turn_done_button_div { position: static !important; float: none !important; flex: 0 0 100px; margin: 0 0 0 auto !important; }
  #turn_done_button { width: 100px; min-width: 100px; padding: 8px 6px; }
  .ui-dialog-content { padding: 14px !important; }
  #tabs-opt center > table, #tabs-opt .main_menu_buttons > table { width: 100%; }
  #tabs-opt table > tbody > tr { display: flex; flex-wrap: wrap; }
  #tabs-opt table > tbody > tr > td { display: block; flex: 1 1 100%; }
  .main_menu_buttons { margin: 10px 12px; }
  .setting_button { width: 100% !important; }
  #city_viewport { overflow: auto; }
  #city_tabs > ul { display: flex; flex-wrap: wrap; gap: 2px; }
  #city_tabs > ul li { float: none !important; margin: 0 !important; }
  #city_tabs .ui-tabs-anchor { min-height: 44px; padding: 9px 10px !important; box-sizing: border-box; }
  #help_menu { display: none; }
  #leaf_manual_picker { display: block; font-weight: 600; }
  #leaf_manual_picker select { display: block; width: 100%; min-height: 44px; margin-top: 8px; }
  #help_info_page { display: block; width: 100%; padding: 16px 0 !important; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; } }
